implemented sharing UI in permissions

1 files changed, 79 insertions, 0 deletions

diff --git a/src/client/views/collections/collectionFreeForm/PropertiesView.scss b/src/client/views/collections/collectionFreeForm/PropertiesView.scss
index f64ef2211..e025c7e87 100644
--- a/src/client/views/collections/collectionFreeForm/PropertiesView.scss
+++ b/src/client/views/collections/collectionFreeForm/PropertiesView.scss
@@ -41,6 +41,85 @@
 
     }
 
+    .propertiesView-sharing {
+        border-bottom: 1px solid black;
+        padding: 8.5px;
+
+        .propertiesView-sharing-title {
+            font-size: 12.5px;
+            font-weight: bold;
+            padding-bottom: 7px;
+        }
+
+        .propertiesView-sharing-content {
+            font-size: 10px;
+            margin-left: 5px;
+        }
+    }
+
+    .notify-button {
+        padding: 2px;
+        width: 12px;
+        height: 12px;
+        background-color: black;
+        border-radius: 10px;
+        padding-left: 2px;
+        padding-right: 2px;
+        margin-top: 2px;
+        margin-right: 3px;
+
+        .notify-button-icon {
+            width: 6px;
+            height: 6.5px;
+            margin-left: .5px;
+        }
+
+        &:hover {
+            background-color: rgb(158, 158, 158);
+        }
+    }
+
+    .propertiesView-sharingTable {
+
+        border: 1px solid black;
+        padding: 5px;
+        border-radius: 6px;
+        width: 170px;
+        background-color: #ececec;
+
+        .propertiesView-sharingTable-item {
+
+            display: flex;
+            padding: 3px;
+
+            border-bottom: 0.5px solid grey;
+
+            .propertiesView-sharingTable-item-name {
+                font-weight: bold;
+                width: 80px;
+                overflow-x: hidden;
+                display: inline-block;
+            }
+
+            .propertiesView-sharingTable-item-permission {
+
+                .permissions-select {
+                    z-index: 1;
+                    //border: 0.5px solid grey;
+                    //border-radius: 4px;
+                    //outline: none;
+                    border: none;
+                    background-color: inherit;
+                    width: 75px;
+                }
+            }
+
+            &:last-child {
+                border-bottom: none;
+            }
+        }
+    }
+
     .propertiesView-fields {
         border-bottom: 1px solid black;
         padding: 8.5px;