synapse-react-client 3.0.28 → 3.0.31

package/dist/style/components/_global-alert.scss

@@ -20,7 +20,7 @@
   }
   padding: 14px;
   z-index: 500;
-  
+
   // Set up default FullWidthAlert styles for all portals
   color: #323131;
   @include border-radius(0px);
@@ -32,37 +32,39 @@
   }
   &.alert-info {
     background: #d9ebf2;
-    border-left: 10px solid #017FA5;
+    border-left: 10px solid map.get(SRC.$colors, 'info');
     .iconBackground {
-      color: #017FA5;
+      color: map.get(SRC.$colors, 'info');
     }
   }
   &.alert-danger {
     background: #f7e0dc;
-    border-left: 10px solid #C13415;
+    border-left: 10px solid map.get(SRC.$colors, 'error');
     .iconBackground {
-      color: #C13415;
+      color: map.get(SRC.$colors, 'error');
     }
   }
   &.alert-warning {
     background: #f8f1d9;
-    border-left: 10px solid #CC9F00;
+    border-left: 10px solid map.get(SRC.$colors, 'warning');
     .iconBackground {
-      color: #CC9F00;
+      color: map.get(SRC.$colors, 'warning');
     }
   }
   &.alert-success {
     background: #e0f1e0;
-    border-left: 10px solid #32A330;
+    border-left: 10px solid map.get(SRC.$colors, 'success');
     .iconBackground {
-      color: #32A330;
+      color: map.get(SRC.$colors, 'success');
     }
   }
-  
+
   .gridContainer {
     display: grid;
-    grid-template-columns: 50px auto 120px 170px;
-    column-gap: 10px;
+    grid-template-columns: 50px auto;
+    &.hasCloseButton {
+      grid-template-columns: 50px auto 50px;
+    }
     align-items: center;
     justify-items: start;
     .iconArea {
@@ -70,11 +72,33 @@
       grid-column: 1 / span 1;
       grid-row: 1 / span 1;
       min-width: 50px;
+      margin-right: 10px;
     }
-    .messageArea {
+    .mainContent {
       grid-row: 1 / span 1;
+      grid-column: 2 / span 1;
+      display: flex;
+      flex-wrap: nowrap;
+      align-items: center;
+      flex-direction: row;
+      width: 100%;
+    }
+    .buttonArea {
+      display: flex;
+      flex-wrap: nowrap;
+      align-items: center;
+      flex-direction: row;
+      button {
+        white-space: nowrap;
+        margin-right: 15px;
+      }
+    }
+    .messageArea {
+      width: 100%;
+      flex-grow: 1;
       p {
         margin-bottom: 0px;
+        margin-right: 15px;
       }
     }
     .iconForeground {
@@ -82,62 +106,28 @@
     }
     .closeAlert {
       font-size: 29px;
-      grid-column: 4 / span 1;
+      grid-column: 3 / span 1;
       grid-row: 1 / span 1;
       justify-self: end;
       padding-bottom: 6px;
       color: map.get(SRC.$colors, 'gray-700');
     }
-    @media (min-width: 992px) {
-      grid-template-rows: auto;
-      .messageArea {
-        grid-column: 2 / span 1;
-      }
-      .secondaryButton {
-        grid-column: 3 / span 1;
-        grid-row: 1 / span 1;
-        justify-self: end;
-      }
-      .primaryButton {
-        grid-column: 4 / span 1;
-        grid-row: 1 / span 1;
-        justify-self: end;
-      }
-    }
-    @media (max-width: 992px) {
-      grid-template-rows: auto 75px;
-      .messageArea {
-        grid-column: 2 / span 3;
-      }
-      .secondaryButton {
-        grid-column: 4 / span 1;
-        grid-row: 2 / span 1;
-      }
-      .primaryButton {
-        grid-column: 2 / span 2;
-        grid-row: 2 / span 1;
-      }
-    }
-  }
 
-  .gridContainer.hasCloseButton {
-    @media (min-width: 992px) {
-      grid-template-columns: 50px auto 150px 200px 50px;
-      .closeAlert {
-        grid-column: 5 / span 1;
+    @media (max-width: map.get(SRC.$breakpoints, 'medium')) {
+      .mainContent {
+        flex-direction: column;
+      }
+      .buttonArea {
+        margin-top: 20px;
+        justify-content: space-between;
+        width: 100%;
+        .primaryButton {
+          order: 1;
+        }
+        .secondaryButton {
+          order: 2;
+        }
       }
-    }
-  }
-
-  .gridContainer.noActions {
-    grid-template-rows: auto;
-    grid-template-columns: 50px auto 50px;
-    .closeAlert {
-      grid-column: 3 / span 1;
-    }
-    .messageArea {
-      grid-column: 2 / span 1;
-      max-width: unset;
     }
   }
 }

package/dist/style/components/_governance-dashboard.scss

@@ -14,7 +14,6 @@
     justify-content: flex-start;
     box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.05);
     .Tab {
-      @include SrcMixins.ignoreLink();
       flex-grow: 0;
       height: 45px;
       padding-left: 30px;
@@ -22,6 +21,7 @@
 
       display: flex;
       align-items: center;
+      text-decoration: none !important;
     }
   }
   .TabContentContainer {
@@ -67,9 +67,11 @@
 .AccessSubmissionDashboard,
 .UserHistoryDashboard {
   .InputPanel {
-    display: grid;
-    grid-template-columns: auto 265px auto;
-    gap: 25px;
+    display: flex;
+    justify-content: space-between;
+    > * {
+      flex: 0 0 32%;
+    }
 
     input {
       margin-bottom: 0;
@@ -84,13 +86,15 @@
       position: absolute;
       right: 5px;
       z-index: 5;
-      height: 100%;
-      display: flex;
-      align-items: center;
+      margin-top: -2px;
     }
   }
+}
 
-  .SubmissionGrid {
-    grid-template-columns: auto auto auto;
+.UserHistoryDashboard {
+  .InputPanel {
+    // UserHistoryDashboard only has two inputs, so use flex-start instead of space-between
+    justify-content: flex-start;
+    gap: 10px;
   }
 }

package/dist/style/components/entity_finder/_details-view.scss

@@ -76,6 +76,8 @@ $row-hovered-background-color: unset;
 
   .EntityFinderTableCellContainerLink {
     @include SrcMixins.normalLink();
+    // Add cursor: pointer in case the link is in a disabled (unselectable) row
+    cursor: pointer;
   }
 
   .EntityFinderTableCellEntityIcon svg {

package/dist/style/components/entity_finder/_tree-view.scss

@@ -42,7 +42,9 @@
         text-overflow: ellipsis;
       }
     }
-
+    .Node[aria-disabled='false'][aria-selected='false'] {
+      cursor: pointer;
+    }
     .Node[aria-disabled='true'] {
       opacity: 0.5;
       > .NodeContent {

package/dist/style/main.css

@@ -9941,13 +9941,16 @@ a.bootstrap-4-backport .badge-dark:focus, a.bootstrap-4-backport .badge-dark.foc
 .bootstrap-4-backport .btn-tertiary {
   color: rgb(64, 123, 160);
   border-color: rgb(64, 123, 160);
-  color: rgb(64, 123, 160);
-  text-decoration: none;
-  font-weight: 700;
-  letter-spacing: 0.5px;
   border: none;
   font-weight: 900;
   white-space: normal;
+  color: rgb(64, 123, 160);
+  font-weight: 700;
+  letter-spacing: 0.5px;
+  text-decoration: underline;
+  text-underline-offset: 4px;
+  text-decoration-thickness: 1px;
+  text-decoration-color: #d6d6d6;
 }
 .bootstrap-4-backport .btn-tertiary:hover {
   color: #357197;
@@ -9969,6 +9972,9 @@ a.bootstrap-4-backport .badge-dark:focus, a.bootstrap-4-backport .badge-dark.foc
 .bootstrap-4-backport .btn-tertiary:not(:disabled):not(.disabled):active:focus, .bootstrap-4-backport .btn-tertiary:not(:disabled):not(.disabled).active:focus, .show > .bootstrap-4-backport .btn-tertiary.dropdown-toggle:focus {
   box-shadow: 0 0 0 0.2rem rgba(64, 123, 160, 0.5);
 }
+.bootstrap-4-backport .btn-tertiary:hover {
+  box-shadow: none;
+}
 .bootstrap-4-backport .btn-tertiary:hover {
   text-decoration: underline;
   text-underline-offset: 4px;
@@ -9985,8 +9991,30 @@ a.bootstrap-4-backport .badge-dark:focus, a.bootstrap-4-backport .badge-dark.foc
   text-decoration-color: #d6d6d6;
   cursor: default;
 }
-.bootstrap-4-backport .btn-tertiary:hover {
-  box-shadow: none;
+.bootstrap-4-backport .btn-tertiary:visited, .bootstrap-4-backport .btn-tertiary:active, .bootstrap-4-backport .btn-tertiary:link {
+  color: rgb(64, 123, 160);
+  font-weight: 700;
+  letter-spacing: 0.5px;
+  text-decoration: underline;
+  text-underline-offset: 4px;
+  text-decoration-thickness: 1px;
+  text-decoration-color: #d6d6d6;
+}
+.bootstrap-4-backport .btn-tertiary:visited:hover, .bootstrap-4-backport .btn-tertiary:active:hover, .bootstrap-4-backport .btn-tertiary:link:hover {
+  text-decoration: underline;
+  text-underline-offset: 4px;
+  text-decoration-thickness: 2px;
+  text-decoration-color: #2a678d;
+}
+.bootstrap-4-backport .btn-tertiary:visited.disabled, .bootstrap-4-backport .btn-tertiary:active.disabled, .bootstrap-4-backport .btn-tertiary:link.disabled {
+  color: #aeb5bc;
+}
+.bootstrap-4-backport .btn-tertiary:visited.disabled:hover, .bootstrap-4-backport .btn-tertiary:active.disabled:hover, .bootstrap-4-backport .btn-tertiary:link.disabled:hover {
+  text-decoration: underline;
+  text-underline-offset: 4px;
+  text-decoration-thickness: 1px;
+  text-decoration-color: #d6d6d6;
+  cursor: default;
 }
 
 .bootstrap-4-backport .alert > p, .bootstrap-4-backport .alert > ul {
@@ -21743,6 +21771,7 @@ input[type=radio] + span {
   text-decoration: none;
   font-weight: 700;
   letter-spacing: 0.5px;
+  cursor: pointer;
 }
 .EntityFinderDetailsViewRow .EntityFinderTableCellContainerLink:hover {
   text-decoration: underline;
@@ -21917,6 +21946,9 @@ input[type=radio] + span {
   overflow-x: clip;
   text-overflow: ellipsis;
 }
+.TreeView .Tree .Node[aria-disabled=false][aria-selected=false] {
+  cursor: pointer;
+}
 .TreeView .Tree .Node[aria-disabled=true] {
   opacity: 0.5;
 }
@@ -23029,115 +23061,102 @@ table.DownloadListTableV2 td {
 }
 .FullWidthAlert[role=alert].alert-info {
   background: #d9ebf2;
-  border-left: 10px solid #017FA5;
+  border-left: 10px solid #017fa5;
 }
 .FullWidthAlert[role=alert].alert-info .iconBackground {
-  color: #017FA5;
+  color: #017fa5;
 }
 .FullWidthAlert[role=alert].alert-danger {
   background: #f7e0dc;
-  border-left: 10px solid #C13415;
+  border-left: 10px solid #c13415;
 }
 .FullWidthAlert[role=alert].alert-danger .iconBackground {
-  color: #C13415;
+  color: #c13415;
 }
 .FullWidthAlert[role=alert].alert-warning {
   background: #f8f1d9;
-  border-left: 10px solid #CC9F00;
+  border-left: 10px solid #cc9f00;
 }
 .FullWidthAlert[role=alert].alert-warning .iconBackground {
-  color: #CC9F00;
+  color: #cc9f00;
 }
 .FullWidthAlert[role=alert].alert-success {
   background: #e0f1e0;
-  border-left: 10px solid #32A330;
+  border-left: 10px solid #32a330;
 }
 .FullWidthAlert[role=alert].alert-success .iconBackground {
-  color: #32A330;
+  color: #32a330;
 }
 .FullWidthAlert[role=alert] .gridContainer {
   display: grid;
-  grid-template-columns: 50px auto 120px 170px;
-  column-gap: 10px;
+  grid-template-columns: 50px auto;
   align-items: center;
   justify-items: start;
 }
+.FullWidthAlert[role=alert] .gridContainer.hasCloseButton {
+  grid-template-columns: 50px auto 50px;
+}
 .FullWidthAlert[role=alert] .gridContainer .iconArea {
   font-size: 20px;
   grid-column: 1/span 1;
   grid-row: 1/span 1;
   min-width: 50px;
+  margin-right: 10px;
 }
-.FullWidthAlert[role=alert] .gridContainer .messageArea {
+.FullWidthAlert[role=alert] .gridContainer .mainContent {
   grid-row: 1/span 1;
+  grid-column: 2/span 1;
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
+  flex-direction: row;
+  width: 100%;
+}
+.FullWidthAlert[role=alert] .gridContainer .buttonArea {
+  display: flex;
+  flex-wrap: nowrap;
+  align-items: center;
+  flex-direction: row;
+}
+.FullWidthAlert[role=alert] .gridContainer .buttonArea button {
+  white-space: nowrap;
+  margin-right: 15px;
+}
+.FullWidthAlert[role=alert] .gridContainer .messageArea {
+  width: 100%;
+  flex-grow: 1;
 }
 .FullWidthAlert[role=alert] .gridContainer .messageArea p {
   margin-bottom: 0px;
+  margin-right: 15px;
 }
 .FullWidthAlert[role=alert] .gridContainer .iconForeground {
   color: white;
 }
 .FullWidthAlert[role=alert] .gridContainer .closeAlert {
   font-size: 29px;
-  grid-column: 4/span 1;
+  grid-column: 3/span 1;
   grid-row: 1/span 1;
   justify-self: end;
   padding-bottom: 6px;
   color: #878e95;
 }
-@media (min-width: 992px) {
-  .FullWidthAlert[role=alert] .gridContainer {
-    grid-template-rows: auto;
-  }
-  .FullWidthAlert[role=alert] .gridContainer .messageArea {
-    grid-column: 2/span 1;
-  }
-  .FullWidthAlert[role=alert] .gridContainer .secondaryButton {
-    grid-column: 3/span 1;
-    grid-row: 1/span 1;
-    justify-self: end;
-  }
-  .FullWidthAlert[role=alert] .gridContainer .primaryButton {
-    grid-column: 4/span 1;
-    grid-row: 1/span 1;
-    justify-self: end;
-  }
-}
-@media (max-width: 992px) {
-  .FullWidthAlert[role=alert] .gridContainer {
-    grid-template-rows: auto 75px;
-  }
-  .FullWidthAlert[role=alert] .gridContainer .messageArea {
-    grid-column: 2/span 3;
-  }
-  .FullWidthAlert[role=alert] .gridContainer .secondaryButton {
-    grid-column: 4/span 1;
-    grid-row: 2/span 1;
+@media (max-width: 768px) {
+  .FullWidthAlert[role=alert] .gridContainer .mainContent {
+    flex-direction: column;
   }
-  .FullWidthAlert[role=alert] .gridContainer .primaryButton {
-    grid-column: 2/span 2;
-    grid-row: 2/span 1;
+  .FullWidthAlert[role=alert] .gridContainer .buttonArea {
+    margin-top: 20px;
+    justify-content: space-between;
+    width: 100%;
   }
-}
-@media (min-width: 992px) {
-  .FullWidthAlert[role=alert] .gridContainer.hasCloseButton {
-    grid-template-columns: 50px auto 150px 200px 50px;
+  .FullWidthAlert[role=alert] .gridContainer .buttonArea .primaryButton {
+    order: 1;
   }
-  .FullWidthAlert[role=alert] .gridContainer.hasCloseButton .closeAlert {
-    grid-column: 5/span 1;
+  .FullWidthAlert[role=alert] .gridContainer .buttonArea .secondaryButton {
+    order: 2;
   }
 }
-.FullWidthAlert[role=alert] .gridContainer.noActions {
-  grid-template-rows: auto;
-  grid-template-columns: 50px auto 50px;
-}
-.FullWidthAlert[role=alert] .gridContainer.noActions .closeAlert {
-  grid-column: 3/span 1;
-}
-.FullWidthAlert[role=alert] .gridContainer.noActions .messageArea {
-  grid-column: 2/span 1;
-  max-width: unset;
-}
 
 .SynapseNavDrawerIsShowing .FullWidthAlert[role=alert].global {
   left: 56px;
@@ -24512,27 +24531,13 @@ input[type=radio] + span {
   color: #469285;
 }
 .ReviewerDashboard .Tabs .Tab {
-  color: unset;
-  text-decoration: unset;
-  font-weight: unset;
-  text-decoration: unset;
-  letter-spacing: unset;
   flex-grow: 0;
   height: 45px;
   padding-left: 30px;
   padding-right: 30px;
   display: flex;
   align-items: center;
-}
-.ReviewerDashboard .Tabs .Tab:hover {
-  text-decoration: unset;
-  margin-bottom: unset;
-}
-.ReviewerDashboard .Tabs .Tab.disabled {
-  color: #aeb5bc;
-}
-.ReviewerDashboard .Tabs .Tab.disabled:hover {
-  cursor: default;
+  text-decoration: none !important;
 }
 .ReviewerDashboard .TabContentContainer {
   margin: 20px 30px;
@@ -24591,9 +24596,13 @@ input[type=radio] + span {
 .AccessRequirementDashboard .InputPanel,
 .AccessSubmissionDashboard .InputPanel,
 .UserHistoryDashboard .InputPanel {
-  display: grid;
-  grid-template-columns: auto 265px auto;
-  gap: 25px;
+  display: flex;
+  justify-content: space-between;
+}
+.AccessRequirementDashboard .InputPanel > *,
+.AccessSubmissionDashboard .InputPanel > *,
+.UserHistoryDashboard .InputPanel > * {
+  flex: 0 0 32%;
 }
 .AccessRequirementDashboard .InputPanel input,
 .AccessSubmissionDashboard .InputPanel input,
@@ -24612,14 +24621,12 @@ input[type=radio] + span {
   position: absolute;
   right: 5px;
   z-index: 5;
-  height: 100%;
-  display: flex;
-  align-items: center;
+  margin-top: -2px;
 }
-.AccessRequirementDashboard .SubmissionGrid,
-.AccessSubmissionDashboard .SubmissionGrid,
-.UserHistoryDashboard .SubmissionGrid {
-  grid-template-columns: auto auto auto;
+
+.UserHistoryDashboard .InputPanel {
+  justify-content: flex-start;
+  gap: 10px;
 }
 
 /*# sourceMappingURL=main.css.map */