Merge branch 'master' into advanced-trails

1 files changed, 189 insertions, 65 deletions

diff --git a/src/client/util/SharingManager.scss b/src/client/util/SharingManager.scss
index 932e94664..c9f86f0e1 100644
--- a/src/client/util/SharingManager.scss
+++ b/src/client/util/SharingManager.scss
@@ -2,39 +2,61 @@
     width: 600px;
     // height: 360px;
 
-    .overlay {
-        transform: translate(-20px, -20px);
-    }
-
-    select {
+    .select {
         text-align: justify;
         text-align-last: end
     }
 
     .sharing-contents {
+        padding: 10px;
         display: flex;
         flex-direction: column;
 
         .close-button {
             position: absolute;
-            right: 1em;
-            top: 1em;
-            cursor: pointer;
-            z-index: 999;
+            right: 2px;
+            top: 2px;
+        }
+
+        .share-title {
+            display: inline-flex;
+            gap: 5px;
+
+            .share-info {
+                align-self: center;
+                cursor: pointer;
+            }
+        }
+
+        .share-copy-link {
+            border-radius: 4px;
+            margin-top: -15px;
+            margin-bottom: 15px;
+            width: fit-content;
         }
 
         .share-container {
+
             .share-setup {
                 display: flex;
                 margin-bottom: 20px;
                 align-items: center;
-                height: 36;
+                max-height: 28;
 
                 .user-search {
+                    max-height: 30;
                     width: 90%;
+                    display: inline-flex;
+                    flex-direction: row;
+                    border: 2px solid;
+                    border-radius: 4px;
+                    border-color: inherit;
+                    background: white;
+                    color: black;
 
                     input {
-                        height: 30;
+                        height: 20px;
+                        width: 100px;
                     }
                 }
 
@@ -44,12 +66,14 @@
                     outline: none;
                     text-align: justify; // for Edge
                     text-align-last: end;
+                    font-size: 13px;
+                    min-width: 90px;
+                    height: 28;
+                    margin-left: 2px;
                 }
 
                 .share-button {
-                    height: 105%;
-                    margin-left: 2%;
-                    background-color: black;
+                    margin-left: 3%;
                 }
             }
 
@@ -76,15 +100,16 @@
                 float: right;
                 align-items: baseline;
                 margin-top: -12;
+                margin-bottom: 10;
 
                 .layoutDoc-acls,
                 .myDocs-acls {
                     flex-direction: column;
-                    margin-right: 12;
 
                     label {
                         font-weight: normal;
                         font-style: italic;
+                        padding-right: 12;
                     }
 
                     input {
@@ -102,7 +127,9 @@
             .group-container {
                 width: 50%;
                 display: flex;
+                top:0;
                 flex-direction: column;
+                border-radius: 4px;
 
                 .user-sort {
                     text-align: left;
@@ -119,10 +146,12 @@
                 .groups-list,
                 .users-list {
                     font-style: italic;
-                    background: #e8e8e8;
+                    border: 2px solid;
                     padding-left: 10px;
                     padding-right: 10px;
-                    width: 100%;
+                    width: 97%;
+                    border-bottom-left-radius: 4px;
+                    border-bottom-right-radius: 4px;
                     overflow-y: scroll;
                     overflow-x: hidden;
                     text-align: left;
@@ -131,7 +160,6 @@
                     align-items: center;
                     text-align: center;
                     justify-content: center;
-                    color: black;
                     height: 250px;
                     margin: 0 2;
 
@@ -146,7 +174,6 @@
             outline: none;
             border-radius: 5px;
             border: 0px;
-            color: #fcfbf7;
             text-transform: none;
             letter-spacing: 2px;
             font-size: 75%;
@@ -165,11 +192,10 @@
         font-size: 20px;
         text-align: left;
         margin: 0 0 20px 0;
-        color: black;
     }
 
     .hr-substitute {
-        border: solid black 0.5px;
+        border: solid 0.5px;
         margin-top: 20px;
     }
 
@@ -190,88 +216,186 @@
         }
     }
 
+    .title-individual{
+        height: 25px;
+        padding-left: 2;
+        width: 97%;
+        border-radius: 4px;
+        margin-top: 10px;
+        margin-left: -8px;
+        font-size: 14;
+        margin-bottom: -4;
+        border: 2px solid;
+        border-bottom: none;
+        align-items: center;
+        display: flex;
+    }
+
+    .title-group{
+        height: 25px;
+        padding-left: 2;
+        width: 97%;
+        border-radius: 4px;
+        margin-top: 10px;
+        margin-left: -8px;
+        font-size: 14;
+        margin-bottom: -4;
+        border: 2px solid;
+        border-bottom: none;
+        align-items: center;
+        display: flex;
+    }
+
     .container {
         display: flex;
         position: relative;
         margin-top: 5px;
-        margin-bottom: 10px;
+        margin-left: -5px;
         font-size: 22px;
         -webkit-user-select: none;
         -moz-user-select: none;
         -ms-user-select: none;
         user-select: none;
-        width: 100%;
+        width: 97%;
         text-align: left;
         font-style: normal;
-        font-size: 14;
+        font-size: 12.5;
         font-weight: normal;
-        padding: 0;
-        align-items: center;
+
+        padding: 3px;
+        border-bottom: 0.5px solid;
 
         .group-info {
             cursor: pointer;
         }
 
         &:hover .padding {
+            overflow-x: unset;
             white-space: unset;
+            overflow-wrap: break-word;
         }
 
         .padding {
-            padding: 0 10px 0 0;
-            color: black;
+            max-width: 150px;
+            overflow-x: hidden;
+            display: inline-block;
             text-overflow: ellipsis;
-            overflow: hidden;
             white-space: nowrap;
-            max-width: 40%;
         }
 
         .permissions-dropdown {
-            border: none;
-            height: 25;
-            background-color: #e8e8e8;
+            display: flex;
+            align-items: flex-end;
+            text-align: right;
+            margin-left: auto;
+            margin-right: -12px;
+
         }
 
         .edit-actions {
             display: flex;
             position: absolute;
-            right: -10;
+            align-items: flex-end;
+            right: -10;            
         }
+    }
+
+    .permissions-dropdown-None{
+        height: 100%;
+        min-width: 85px;
+        text-align: right;
+        margin-right: -12px;
+        padding: 0px;
+        padding-left: 3px;
+        background: grey;
+        color: rgb(71, 71, 71);
+        border-radius: 6px;
+        border: 1px solid rgb(71, 71, 71);
+    }
+    .permissions-dropdown-Edit,
+    .permissions-dropdown-Admin {
+        height: 100%;
+        min-width: 85px;
+        text-align: right;
+        margin-right: -12px;
+        padding: 0px;
+        padding-left: 3px;
+        background: rgb(254, 254, 199);
+        color: rgb(75, 75, 5);
+        border-radius: 6px;
+        border: 1px solid rgb(75, 75, 5);
+    }
+    .permissions-dropdown-Augment{
+        height: 100%;
+        min-width: 85px;
+        text-align: right;
+        margin-right: -12px;
+        padding: 0px;
+        padding-left: 3px;
+        background: rgb(208, 255, 208);
+        color:rgb(19, 80, 19);
+        border-radius: 6px;
+        border: 1px solid rgb(19, 80, 19);
 
     }
+    .permissions-dropdown-View{
+        height: 100%;
+        min-width: 85px;
+        text-align: right;
+        margin-right: -12px;
+        padding: 0px;
+        padding-left: 3px;
+        background: rgb(213, 213, 255);
+        color: rgb(25, 25, 101);
+        border-radius: 6px;
+        border: 1px solid rgb(25, 25, 101);
+    }
+    .permissions-dropdown-Not-Shared{
+        height: 100%;
+        min-width: 85px;
+        text-align: right;
+        margin-right: -12px;
+        padding: 0px;
+        padding-left: 3px;
+        background: rgb(255, 207, 207);
+        color: rgb(138, 47, 47);
+        border-radius: 6px;
+        border: 1px solid rgb(138, 47, 47);
+    }
 
     .no-users {
         margin-top: 20px;
     }
 
-    .link-container {
-        display: flex;
-        flex-direction: row;
-        margin-bottom: 10px;
-        margin-left: auto;
-        margin-right: auto;
-
-        .link-box,
-        .copy {
-            padding: 10px;
-            border-radius: 10px;
-            padding: 10px;
-            border: solid black 1px;
-        }
-
-        .link-box {
-            background: white;
-            color: blue;
-            text-decoration: underline;
-        }
-
-        .copy {
-            margin-left: 20px;
-            cursor: alias;
-            border-radius: 50%;
-            width: 42px;
-            height: 42px;
-            transition: 1.5s all ease;
-            padding-top: 12px;
-        }
-    }
+    // .link-container {
+    //     display: flex;
+    //     flex-direction: row;
+    //     margin-bottom: 10px;
+    //     margin-left: auto;
+    //     margin-right: auto;
+
+    //     .link-box,
+    //     .copy {
+    //         padding: 10px;
+    //         border-radius: 10px;
+    //         padding: 10px;
+    //         border: solid black 1px;
+    //     }
+
+    //     .link-box {
+    //         background: white;
+    //         color: blue;
+    //         text-decoration: underline;
+    //     }
+
+    //     .copy {
+    //         margin-left: 20px;
+    //         cursor: alias;
+    //         border-radius: 50%;
+    //         width: 42px;
+    //         height: 42px;
+    //         transition: 1.5s all ease;
+    //         padding-top: 12px;
+    //     }
+    // }
 }
\ No newline at end of file