@vitrosoftware/common-ui-ts 1.1.208 → 1.1.210

package/css/std/controls/alert/alert.css

@@ -1,17 +1,27 @@
 .vitro-alert {
     border: 0;
+    box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
+    border-radius: 4px;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+    gap: 12px;
+}
+
+.vitro-position-absolute {
     z-index: 1000;
     position: absolute;
     right: 0;
     width: 450px;
-    box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
-    border-radius: 4px;
 }
 
 .vitro-alert :global(.alert) {
     margin-bottom: 0;
     padding: 12px;
     border-radius: 4px;
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
 }
 
 :global(#Timesheets) .vitro-alert {
@@ -48,7 +58,6 @@
     background-position: center;
     background-size: 100%;
     background-repeat: no-repeat;
-    align-self: center;
 }
 
 .vitro-text {
@@ -59,6 +68,7 @@
     color: #4A556C;
     flex-direction: column;
     overflow: hidden;
+    white-space: pre-wrap;
 }
 
 .vitro-text > strong {

package/css/std/controls/bim-viewer/bim-viewer-index.css

@@ -13178,7 +13178,10 @@ body {
 .uk-tab > * {
     padding-left: 10px !important;
 }
-
+
+[class*="_lookup-picker-value-list"] {
+    z-index: 89000005 !important;
+}
 .toolbar {
     height: 50px;
     background-color: #474747;

package/css/std/controls/bim-viewer/style.css

@@ -54,3 +54,7 @@ body {
 .uk-tab > * {
     padding-left: 10px !important;
 }
+
+[class*="_lookup-picker-value-list"] {
+    z-index: 89000005 !important;
+}

package/css/std/controls/button/button.css

@@ -1,11 +1,5 @@
 .vitro-button {
-    font-family: 'InterMedium';
-    font-size: 14px;
     outline: none;
-    height: 32px;
-    min-width: 85px;
-    color: #fff;
-    background: #347FDE;
     border: none;
     border-radius: 4px;
     cursor: pointer;
@@ -13,8 +7,11 @@
     display: flex;
     align-items: center;
     justify-content: center;
+    font-size: 14px;
     line-height: 16px;
-    padding: 4px 8px;
+    padding: 4px 16px;
+    height: 32px;
+    min-width: 85px;
 }
 
 .vitro-button > div {
@@ -23,28 +20,18 @@
     justify-content: center;
     flex: 1 1;
     overflow: hidden;
+    gap: 4px;
 }
 
 .vitro-button > div > div {
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
-}
-
-.vitro-button:hover, 
-.vitro-button:active,
-.vitro-button:focus {
-    background: #3274E0;
-}
-
-.vitro-button:disabled {
-    background: #E4E6EC;
 }
 
 .vitro-button :global(.vitro-image-default),
 .vitro-button :global(.vitro-image-hover),
 .vitro-button :global(.vitro-image) {
-    margin-right: 4px;
     height: 24px;
     width: 24px;
 }
@@ -73,4 +60,68 @@
 
 :global(.vitro-display-none) {
     display: none;
+}
+
+.vitro-button:global(.vitro-primary) {
+    font-family: 'InterMedium';
+    color: #fff;
+    background: #347FDE;
+}
+
+.vitro-button:global(.vitro-primary):hover,
+.vitro-button:global(.vitro-primary):active,
+.vitro-button:global(.vitro-primary):focus {
+    background: #3274E0;
+}
+
+.vitro-button:global(.vitro-primary):disabled {
+    background: #E4E6EC;
+}
+
+.vitro-button:global(.vitro-outline-primary) {
+    background: #fff;
+    border: 1px solid #0060D9;
+    color: #0060D9;
+    font-family: 'InterRegular';
+}
+
+.vitro-button:global(.vitro-outline-primary):hover,
+.vitro-button:global(.vitro-outline-primary):active,
+.vitro-button:global(.vitro-outline-primary):focus {
+    background: #3274E0;
+    border: 1px solid #3274E0;
+    color: #fff;
+}
+
+.vitro-button:global(.vitro-outline-primary):disabled {
+    background: #fff;
+    border: 1px solid #8E98A3;
+    color: #8E98A3;
+}
+
+.vitro-button:global(.vitro-outline-light) {
+    background: #fff;
+    color: #222D44;
+    border: 1px solid #E4E6EC;
+    font-family: 'InterRegular';
+}
+
+.vitro-button:global(.vitro-outline-light):hover,
+.vitro-button:global(.vitro-outline-light):active,
+.vitro-button:global(.vitro-outline-light):focus {
+    background: #F3F8FF;
+}
+
+.vitro-button:global(.vitro-light) {
+    background: #fff;
+    border: none;
+    color: #222D44;
+    font-family: 'InterRegular';
+    padding: 4px 8px;
+}
+
+.vitro-button:global(.vitro-light):hover,
+.vitro-button:global(.vitro-light):active,
+.vitro-button:global(.vitro-light):focus {
+    background: #F3F8FF;
 }

package/css/std/controls/command-menu/command-menu-button.css

@@ -1,25 +1,3 @@
-.vitro-command-menu-button {
-    font-family: 'InterRegular' !important;
-    border: none !important;
-    color: #222D44 !important;
-    background: #fff !important;
-    padding: 4px 8px !important;
-}
-
-.vitro-command-menu-button:hover,
-.vitro-command-menu-button:active {
-    background: #F3F8FF !important;
-}
-
-.vitro-command-menu-button > div {
-    gap: 4px;
-}
-
-.vitro-image {
-    width: 24px;
-    height: 24px;
-}
-
 @media (max-width: 800px) {
     .vitro-command-menu-button .vitro-image + div {
         display: none;

package/css/std/controls/command-menu/command-menu-dropdown-button.css

@@ -148,30 +148,30 @@
     margin-left: -8px;
 }
 
-:global(.vitro-button-active) {
+:global(.vitro-addon-button) {
     border: 1px solid #4292F7 !important;
 }
 
-:global(.vitro-button-active:hover),
-:global(.vitro-button-active:active) {
+:global(.vitro-addon-button:hover),
+:global(.vitro-addon-button:active) {
     border-color: #3274E0 !important;
     background: #3274E0;
     color: #fff;
 }
 
-:global(.vitro-button-context) {
+:global(.vitro-context-button) {
     padding: 0 !important;
     width: 24px;
     background-color: #fff !important;
 }
 
-:global(.vitro-button-context > div),
-:global(.vitro-button-context img) {
+:global(.vitro-context-button > div),
+:global(.vitro-context-button img) {
     margin: 0 !important;
 }
 
-:global(.vitro-button-context:hover),
-:global(.vitro-button-context:active) {
+:global(.vitro-context-button:hover),
+:global(.vitro-context-button:active) {
     border-color: #fff !important;
 }
 
@@ -179,6 +179,28 @@
     max-height: 288px;
 }
 
+.vitro-dropdown-button-container :global(.vitro-primary) {
+    font-family: 'InterMedium';
+    color: #fff;
+    background: #347FDE;
+}
+
+.vitro-dropdown-button-container :global(.vitro-primary) {
+    font-family: 'InterMedium';
+    color: #fff;
+    background: #347FDE;
+}
+
+.vitro-dropdown-button-container :global(.vitro-primary):hover,
+.vitro-dropdown-button-container :global(.vitro-primary):active,
+.vitro-dropdown-button-container :global(.vitro-primary):focus {
+    background: #3274E0;
+}
+
+.vitro-dropdown-button-container :global(.vitro-primary):disabled {
+    background: #E4E6EC;
+}
+
 @media (max-width: 800px) {
     .vitro-command-menu-dropdown-button .vitro-image + div {
         display: none;
@@ -192,7 +214,7 @@
         display: block;
     }
 
-    :global(.vitro-button-context) {
+    :global(.vitro-context-button) {
         min-width: 32px !important;
         width: 32px;
     }

package/css/std/controls/command-menu/command-menu-item.css

@@ -1,14 +1,4 @@
 .vitro-item {
     display: flex;
     align-items: center;
-}
-
-li:first-child .vitro-item {
-    background: #347FDE;
-    font-family: 'InterMedium';
-    color: #fff;
-}
-
-li:first-child .vitro-item:hover {
-    background: #3274E0;
 }

package/css/std/controls/filter/filter.css

@@ -0,0 +1,85 @@
+:global(.vitro-views-dialog) .vitro-content-inner {
+    height: 100%;
+}
+
+:global(.vitro-views-dialog) .vitro-content-filtering-sorting .vitro-scrollbar-content {
+    padding: 20px 24px;
+}
+
+:global(.vitro-views-dialog) .vitro-content-inner :global(.vitro-label) {
+    justify-content: center;
+}
+
+:global(.vitro-views-dialog .vitro-filter-container.vitro-no-padding) [class^='_criterion_vitro-operator-select-container'] {
+    display: none;
+}
+
+:global(.vitro-views-dialog .vitro-filter-container) [class^='_search_vitro-add-field'] {
+    margin-left: 74px !important;
+    margin-top: 7px !important;
+}
+
+:global(.vitro-views-dialog .vitro-filter-container.vitro-no-padding) [class^='_search_vitro-add-field'] {
+    margin-left: 8px !important;
+}
+
+:global(.vitro-views-dialog .vitro-filter-container) [class^='_checkbox_vitro-control'] {
+    margin-top: 6px;
+}
+
+:global(.vitro-views-dialog .vitro-sort-container .vitro-add-field) {
+    margin: 7px 0 16px 8px;
+}
+
+:global(.vitro-views-dialog .vitro-filter-container + .vitro-label-grey) {
+    margin-top: 19px;
+}
+
+:global(.vitro-views-dialog .vitro-sort-container .vitro-add-field-button),
+:global(.vitro-views-dialog .vitro-sort-container .vitro-add-field-button:hover),
+:global(.vitro-views-dialog .vitro-sort-container .vitro-add-field-button:active) {
+    font-family: 'InterRegular' !important;
+    background: #fff !important;
+    color: #326AD6 !important;
+    padding: 0 !important;
+    min-width: unset !important;
+    height: 16px !important;
+    font-size: 12px;
+    line-height: 16px;
+}
+
+:global(.vitro-views-dialog) .vitro-content-inner :global(.vitro-block) {
+    width: 100%;
+}
+
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-content-filtering-sorting) .vitro-scrollbar-content {
+    padding: 1px 16px 0 16px !important;
+}
+
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-filter-container),
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-sort-container) {
+    padding-top: 6px !important;
+    grid-gap: 16px 16px !important;
+}
+
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-filter-container) [class^='_search_vitro-add-field'], 
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-sort-container .vitro-add-field) {
+    margin-left: 0 !important;
+    margin-top: 20px !important;
+    margin-bottom: 20px !important;
+}
+
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-filter-container) [class^='_search_vitro-add-field'] :global(.vitro-image), 
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-sort-container .vitro-add-field .vitro-image) {
+    margin-right: 8px !important;
+}
+
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-filter-container) [class^='_search_vitro-add-field'] button, 
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-filter-container) [class^='_search_vitro-add-field'] button:hover, 
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-filter-container) [class^='_search_vitro-add-field'] button:active, 
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-sort-container .vitro-add-field-button), 
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-sort-container .vitro-add-field-button:hover), 
+:global(.vitro-views-dialog.vitro-views-dialog-mobile .vitro-sort-container .vitro-add-field-button:active) {
+    font-size: 14px !important;
+    color: #222D44 !important;
+}

package/css/std/controls/pdf-viewer/custom.css

@@ -84,7 +84,6 @@ a.ui-button:active,
 .body__sidebar {
     width: 278px;
     background: #f8f8f8;
-    /*padding: 20px;*/
     padding: 32px 10px 10px 10px;
     height: calc(100% - 32px);
     border-left: 1px solid silver;
@@ -96,12 +95,9 @@ a.ui-button:active,
 }
 
 .body__sidebar-content {
-    /*background: #ffffff;*/
     height: 100%;
-    /*margin-bottom: 20px;*/
-    /*padding: 5px;*/
     font-size: 14px;
-    overflow-y: auto;
+    overflow-y: hidden;
     overflow-x: hidden;
 }
 

package/css/std/controls/pdf-viewer/pdf-viewer-index.css

@@ -6334,7 +6334,6 @@ a.ui-button:active,
 .body__sidebar {
     width: 278px;
     background: #f8f8f8;
-    /*padding: 20px;*/
     padding: 32px 10px 10px 10px;
     height: calc(100% - 32px);
     border-left: 1px solid silver;
@@ -6346,12 +6345,9 @@ a.ui-button:active,
 }
 
 .body__sidebar-content {
-    /*background: #ffffff;*/
     height: 100%;
-    /*margin-bottom: 20px;*/
-    /*padding: 5px;*/
     font-size: 14px;
-    overflow-y: auto;
+    overflow-y: hidden;
     overflow-x: hidden;
 }
 
@@ -7231,25 +7227,6 @@ a:focus > .thumbnail > .thumbnailSelectionRing,
     display: none;
 }
 
-.body__sidebar-content::-webkit-scrollbar {
-    width: 4px;
-    height: 4px;
-}
-
-.body__sidebar-content::-webkit-scrollbar-track {
-    background: transparent;
-    border-radius: 8px;
-}
-
-.body__sidebar-content::-webkit-scrollbar-thumb {
-    background: #E4E6EC;
-    border-radius: 4px;
-}
-
-.body__sidebar-content::-webkit-scrollbar-thumb:hover {
-    background: #E4E6EC;
-}
-
 .dlg-overlay {
     background: #222D44;
     opacity: 0.2;

package/css/std/controls/pdf-viewer/pdf-viewer.css

@@ -235,25 +235,6 @@ a:focus > .thumbnail > .thumbnailSelectionRing,
     display: none;
 }
 
-.body__sidebar-content::-webkit-scrollbar {
-    width: 4px;
-    height: 4px;
-}
-
-.body__sidebar-content::-webkit-scrollbar-track {
-    background: transparent;
-    border-radius: 8px;
-}
-
-.body__sidebar-content::-webkit-scrollbar-thumb {
-    background: #E4E6EC;
-    border-radius: 4px;
-}
-
-.body__sidebar-content::-webkit-scrollbar-thumb:hover {
-    background: #E4E6EC;
-}
-
 .dlg-overlay {
     background: #222D44;
     opacity: 0.2;

package/css/std/controls/search/search-dialog.css

@@ -0,0 +1,202 @@
+.vitro-settings-dialog {
+    border-radius: 4px;
+    margin-top: 4px;
+    background: #fff;
+    box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
+    z-index: 100;
+}
+
+.vitro-settings-dialog-mobile :global(.vitro-label-grey), 
+.vitro-settings-dialog :global(.vitro-label-grey) {
+    display: none !important;
+}
+
+.vitro-filter-container {
+    padding: 24px 0 16px 12px;
+    display: flex;
+    flex-direction: column;
+    align-self: stretch;
+    width: 502px;
+}
+
+.vitro-settings-dialog-mobile :global(.vitro-content-inner),
+.vitro-settings-dialog-mobile :global(.vitro-filter-container) {
+    height: 100%;
+}
+
+.vitro-settings-dialog-mobile :global(.vitro-filter-container) :global(.ps) {
+    max-height: calc(100% - 36px) !important;
+}
+
+.vitro-filter {
+    overflow: hidden;
+}
+
+.vitro-filter :global(.ps) {
+    max-height: 458px;
+}
+
+.vitro-filter :global(.ps.ps--active-y) {
+    padding-right: 14px;
+}
+
+.vitro-filter :global(.ps) > div:first-child {
+    padding-top: 10px;
+}
+
+.vitro-filter :global(.vitro-block:last-child) > div > div {
+    margin-bottom: 0;
+}
+
+.vitro-filter :global(.vitro-block:nth-child(2)) {
+    margin-top: 0;
+}
+
+.vitro-field-iterator {
+    grid-gap: 28px 16px;
+}
+
+.vitro-filter [class^="_criterion_vitro-control"] {
+    max-width: calc(100% - 87px);
+}
+
+.vitro-settings-dialog-mobile .vitro-filter [class^="_criterion_vitro-control"] {
+    max-width: none;
+}
+
+.vitro-add-field {
+    margin: 18px 0 16px 66px;
+}
+
+.vitro-add-field-button,
+.vitro-add-field-button:hover,
+.vitro-add-field-button:active {
+    font-family: 'InterRegular' !important;
+    background: #fff !important;
+    color: #326AD6 !important;
+    padding: 0 !important;
+    min-width: unset !important;
+    height: 16px !important;
+    font-size: 12px;
+    line-height: 16px;
+}
+
+.vitro-add-field-dialog {
+    z-index: 10001;
+    overflow: hidden;
+    border-radius: 4px;
+    box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.18), 0px 0px 4px 0px rgba(0, 0, 0, 0.14);
+}
+
+.vitro-add-field-dialog[placement='right-start'] {
+    margin-top: -4px;
+    margin-left: 14px;
+}
+
+.vitro-add-field-dialog :global(.ps) > div:first-child {
+    max-height: 204px;
+    max-width: 372px;
+}
+
+@media (max-width: 799px) {
+    .vitro-add-field-dialog :global(.ps) > div:first-child {
+        max-width: 242px !important;
+    }
+}
+
+.vitro-button-group {
+    gap: 12px;
+    padding: 0 24px;
+    margin-top: auto;
+}
+
+.vitro-button,
+.vitro-button-cancel {
+    padding: 8px 16px;
+    font-family: 'InterRegular' !important;
+}
+
+.vitro-button-cancel {
+    background: #fff !important;
+    color: #222D44 !important;
+}
+
+.vitro-button-cancel:hover,
+.vitro-button-cancel:active {
+    background: #F3F8FF !important;
+}
+
+.vitro-settings-dialog-mobile {
+    height: 100% !important;
+    width: 100% !important;
+    max-width: unset !important;
+    max-height: unset !important;
+    border: none !important;
+    border-radius: 0 !important;
+}
+
+.vitro-settings-dialog-mobile .vitro-filter-container {
+    width: 100%;
+    position: relative;
+    overflow: hidden;
+    flex: 1 1;
+    padding: 0 0 0 15px;
+}
+
+.vitro-settings-dialog-header {
+    padding: 20px 15px 15px 15px;
+}
+
+.vitro-settings-dialog-footer {
+    border: none;
+    background-color: #fff;
+    height: unset;
+    padding: 28px 15px;
+}
+
+.vitro-settings-dialog-footer button {
+    height: 32px;
+}
+
+.vitro-settings-dialog-header h1 {
+    font-size: 18px !important;
+    line-height: 150% !important;
+}
+
+.vitro-settings-dialog-mobile .vitro-add-field {
+    margin: 18px 0 0 4px;
+}
+
+.vitro-settings-dialog-mobile .vitro-filter-container :global(.ps) {
+    max-height: unset;
+    height: unset;
+    padding-right: 15px;
+}
+
+.vitro-settings-dialog-mobile .vitro-filter-container :global(.ps) > div:first-child {
+    padding-top: 0;
+}
+
+.vitro-settings-dialog-mobile .vitro-filter-container :global(.ps) > div > div {
+    gap: 12px !important;
+}
+
+.vitro-settings-dialog-mobile .vitro-scrollbar > div > div > :global(.vitro-block):first-child > div > div {
+    margin: 0;
+}
+
+.vitro-add-field-dialog[placement='bottom-start'] {
+    margin-top: 7px;
+}
+
+.vitro-add-field-dialog[placement='top-start'] {
+    margin-bottom: 7px;
+}
+
+.vitro-settings-dialog-mobile .vitro-filter {
+    gap: 12px;
+}
+
+.vitro-settings-dialog-mobile .vitro-filter-container :global(.vitro-block) > div > div {
+    margin-top: 0;
+}