@vitrosoftware/common-ui-ts 1.1.121 → 1.1.123

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

@@ -0,0 +1,194 @@
+#root {
+    position: unset;
+}
+
+.sidebar-note-wrap.active .sidebar-note-btn-delete {
+    background: url(img/delete-active.svg) 2px 0 no-repeat;
+}
+
+.sidebar-note-btn-delete {
+    background: url('img/delete.svg') 2px 0 no-repeat;
+}
+
+.toolbar {
+    height: 48px;
+    background-color: #fff;
+    background-image: none;
+    box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.1), 0 0 2px 0 rgba(0, 0, 0, 0.12);
+    padding: 4px 12px;
+    display: flex;
+    z-index: 299;
+}
+
+#toolbarViewerMiddle {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    position: absolute;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+}
+
+.toolbarButton {
+    margin: 0 4px 0 0 !important;
+    width: 40px;
+    height: 40px;
+    position: relative;
+    float: left;
+}
+
+#toolbarViewerMiddle .toolbarButton {
+    width: 24px;
+    height: 24px;
+    padding: 0;
+    margin: 0 !important;
+}
+
+.toolbarButton.toggled {
+    background-color: #DCEEFF;
+    border-radius: 8px;
+    border: none;
+    box-shadow: none;
+    background-image: none;
+}
+
+.toolbarButton::before {
+    height: 24px;
+    width: 24px;
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+    content: '' !important;
+    background: #222D44;
+    mask-size: cover;
+    mask-repeat: no-repeat;
+}
+
+.toolbarButton.toggled::before {
+    background: #326AD6;
+}
+
+.toolbarButton:hover::before {
+    background: #326AD6;
+}
+
+.toolbarButton#btnCreateNotes::before {
+    mask-image: url('img/draw-annotation.svg');
+}
+
+.toolbarButton#btnToggleNotes::before {
+    mask-image: url('img/show-annotation.svg');
+}
+
+.toolbarButton#btnToggleSidebarNotes::before {
+    mask-image: url('img/sidebar-notes-toggle.svg');
+}
+
+.toolbarButton#btnToggleSidebarSheets::before {
+    mask-image: url('img/sidebar-toggle.svg');
+}
+
+.toolbarButton#btnToggleSidebarLayers::before {
+    mask-image: url('img/sidebar-layers-toggle.svg');
+}
+
+.toolbarButton#btnToggleSidebarTreeView::before {
+    content: none;
+}
+
+.toolbarButton#zoomOut::before {
+    mask-image: url('img/zoom-out.svg');
+}
+
+.toolbarButton#zoomIn::before {
+    mask-image: url('img/zoom-in.svg');
+}
+
+#fileVersionSelect {
+    height: 100%;
+    display: flex;
+    align-items: center;
+}
+
+.vitro-sidebar-notes-expanded #canvasContainer {
+    width: calc(100% - 410px);
+}
+
+.vitro-sidebar-sheets-expanded #canvasContainer {
+    width: calc(100% - 240px);
+    inset-inline-start: 240px;
+}
+
+.vitro-sidebar-layers-expanded #canvasContainer {
+    width: calc(100% - 240px);
+    inset-inline-start: 240px;
+}
+
+.vitro-sidebar-notes-expanded.vitro-sidebar-sheets-expanded #canvasContainer,
+.vitro-sidebar-notes-expanded.vitro-sidebar-layers-expanded #canvasContainer {
+    width: calc(100% - 650px);
+}
+
+.sidebar {
+    width: 410px;
+    min-width: 350px;
+    background-color: #fff;
+    padding: 32px 0 16px 0;
+    top: 48px;
+    height: calc(100% - 48px);
+    z-index: 100;
+    border-left: 1px solid #C0CAD5;
+    box-shadow: 0 0 2.89px 0 rgba(0, 0, 0, 0.1), 0 0 7.22px 0 rgba(0, 0, 0, 0.08);
+}
+
+.sidebar-close, 
+.sidebar-close:hover {
+    height: 24px;
+    width: 24px;
+    padding: 0px;
+    color: transparent;
+    background-size: 100%;
+    display: block;
+    transform: none;
+    user-select: none;
+    background-image: url(img/cancel-dark-grey.svg);
+}
+
+.sidebar-content {
+    height: 100%;
+}
+
+.vitro-issue-detail {
+    width: 410px;
+    right: 0;
+    position: absolute;
+    top: 48px;
+    background-color: #fff;
+    height: calc(100% - 48px);
+    border-left: 2px solid #eeeff0;
+    display: none;
+    z-index: 10;
+    border-left: 1px solid #C0CAD5;
+    box-shadow: 0 0 2.89px 0 rgba(0, 0, 0, 0.1), 0 0 7.22px 0 rgba(0, 0, 0, 0.08);
+}
+
+:focus-visible {
+    outline: none;
+}
+
+.tooltip.show {
+    z-index: 99000006 !important;
+}
+
+.vitro-marker-label {
+    background-color: #2d9cdb;
+    color: #fff;
+    font-weight: bold;
+    line-height: 20px;
+    font-size: 14px;
+    border-radius: 10px;
+    height: 20px;
+    padding-left: 8px;
+    padding-right: 8px;
+}

package/css/std/controls/dxf-viewer/img/cancel-dark-grey.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="iconoir:cancel">
+<path id="Vector" d="M6.75781 17.2438L12.0008 12.0008L17.2438 17.2438M17.2438 6.75781L11.9998 12.0008L6.75781 6.75781" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/css/std/controls/dxf-viewer/img/collapse-bottom.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Chevron-dropdown-Big">
+<path id="Vector 9" d="M19.5 9L12 16.5L4.5 9" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/css/std/controls/dxf-viewer/img/collapse-up-blue.svg

@@ -0,0 +1,5 @@
+<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Chevron-dropdown-Big">
+<path id="Vector 9" d="M4.5 16.5L12 9L19.5 16.5" stroke="#3274E0" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</svg>

package/css/std/controls/dxf-viewer/img/delete-active.svg

@@ -0,0 +1,11 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.5 3.5H11.5V13.5H2.5V3.5Z" stroke="white"/>
+<path d="M1 1.5H13" stroke="white"/>
+<path d="M5.54102 5L5.54102 12" stroke="white"/>
+<path d="M8.5 5V11.9974" stroke="white"/>
+<mask id="path-5-inside-1_3179_133053" fill="white">
+<path d="M5 0H9V1H5L5 0Z"/>
+</mask>
+<path d="M5 0H9V1H5L5 0Z" fill="white"/>
+<path d="M5 0V-1H4L4 0L5 0ZM9 0H10V-1H9V0ZM9 1V2H10V1H9ZM5 1L4 1L4 2H5V1ZM5 1H9V-1H5V1ZM8 0V1H10V0H8ZM9 0H5V2H9V0ZM6 1L6 0L4 0L4 1L6 1Z" fill="white" mask="url(#path-5-inside-1_3179_133053)"/>
+</svg>

package/css/std/controls/dxf-viewer/img/delete.svg

@@ -0,0 +1,11 @@
+<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.5 3.5H11.5V13.5H2.5V3.5Z" stroke="#4D4D4D"/>
+<path d="M1 1.5H13" stroke="#4D4D4D"/>
+<path d="M5.54102 5L5.54102 12" stroke="#4D4D4D"/>
+<path d="M8.5 5V11.9974" stroke="#4D4D4D"/>
+<mask id="path-5-inside-1_3179_133127" fill="white">
+<path d="M5 0H9V1H5L5 0Z"/>
+</mask>
+<path d="M5 0H9V1H5L5 0Z" fill="#4D4D4D"/>
+<path d="M5 0V-1H4L4 0L5 0ZM9 0H10V-1H9V0ZM9 1V2H10V1H9ZM5 1L4 1L4 2H5V1ZM5 1H9V-1H5V1ZM8 0V1H10V0H8ZM9 0H5V2H9V0ZM6 1L6 0L4 0L4 1L6 1Z" fill="#4D4D4D" mask="url(#path-5-inside-1_3179_133127)"/>
+</svg>

package/css/std/controls/dxf-viewer/img/draw-annotation.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 9H16M8 13H14M12 21L9 18H6C5.20435 18 4.44129 17.6839 3.87868 17.1213C3.31607 16.5587 3 15.7956 3 15V7C3 6.20435 3.31607 5.44129 3.87868 4.87868C4.44129 4.31607 5.20435 4 6 4H18C18.7956 4 19.5587 4.31607 20.1213 4.87868C20.6839 5.44129 21 6.20435 21 7V12M19.001 19V15.5M19.001 19V22.5M19.001 19H22.5M19.001 19H15.5" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/dxf-viewer/img/invisible-eye.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M15.2713 6.60733C14.2426 6.23315 13.1431 6 12 6C7.69951 6 4.01559 9.3 2.39712 10.995C2.1415 11.2706 2 11.6287 2 12C2 12.3713 2.1415 12.7294 2.39712 13.005C3.161 13.805 4.385 14.9625 5.91677 15.9619L8.31653 13.5622C8.11274 13.0822 8 12.5543 8 12C8 9.79086 9.79086 8 12 8C12.5543 8 13.0822 8.11274 13.5622 8.31653L15.2713 6.60733ZM10.4379 15.6835C10.9178 15.8873 11.4457 16 12 16C14.2091 16 16 14.2091 16 12C16 11.4457 15.8873 10.9178 15.6835 10.4379L18.0832 8.03809C19.615 9.03745 20.839 10.195 21.6029 10.995C21.8585 11.2706 22 11.6287 22 12C22 12.3713 21.8585 12.7294 21.6029 13.005C19.9844 14.7 16.3005 18 12 18C10.8569 18 9.7574 17.7669 8.72865 17.3927L10.4379 15.6835Z" fill="#4A556C"/>
+<path d="M3 21L21 3" stroke="#4A556C" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/dxf-viewer/img/show-annotation.svg

@@ -0,0 +1,3 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.99835 9.00122H15.9984M7.99835 13.0012H13.9984M11.9984 21.0012L8.99835 18.0012H5.99835C5.2027 18.0012 4.43964 17.6852 3.87703 17.1225C3.31442 16.5599 2.99835 15.7969 2.99835 15.0012V7.00122C2.99835 6.20557 3.31442 5.44251 3.87703 4.8799C4.43964 4.31729 5.2027 4.00122 5.99835 4.00122H17.9984C18.794 4.00122 19.5571 4.31729 20.1197 4.8799C20.6823 5.44251 20.9984 6.20557 20.9984 7.00122V12.0012M18.9994 21.0012C18.4689 21.0012 17.9602 20.7905 17.5851 20.4154C17.2101 20.0404 16.9994 19.5317 16.9994 19.0012C16.9994 18.4708 17.2101 17.9621 17.5851 17.587C17.9602 17.2119 18.4689 17.0012 18.9994 17.0012M18.9994 21.0012C19.5298 21.0012 20.0385 20.7905 20.4136 20.4154C20.7886 20.0404 20.9994 19.5317 20.9994 19.0012C20.9994 18.4708 20.7886 17.9621 20.4136 17.587C20.0385 17.2119 19.5298 17.0012 18.9994 17.0012M18.9994 21.0012V22.5012M18.9994 17.0012V15.5012M22.0304 17.2512L20.7314 18.0012M17.2684 20.0012L15.9684 20.7512M15.9684 17.2512L17.2684 18.0012M20.7314 20.0012L22.0314 20.7512" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/dxf-viewer/img/sidebar-layers-toggle.svg

@@ -0,0 +1,6 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2 5.95715L12 9.5L22 5.95715L12 2.5L2 5.95715Z" stroke="#222D44" stroke-linejoin="round"/>
+<path d="M2 10L12 13.5L22 10" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M2 14L12 17.5L22 14" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M2 18L12 21.5L22 18" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/dxf-viewer/img/sidebar-notes-toggle.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M7.99945 9.00122H15.9995M7.99945 13.0012H13.9995M11.9995 21.0012L8.99945 18.0012H5.99945C5.2038 18.0012 4.44074 17.6852 3.87813 17.1225C3.31552 16.5599 2.99945 15.7969 2.99945 15.0012V7.00122C2.99945 6.20557 3.31552 5.44251 3.87813 4.8799C4.44074 4.31729 5.2038 4.00122 5.99945 4.00122H17.9995C18.7951 4.00122 19.5582 4.31729 20.1208 4.8799C20.6834 5.44251 20.9995 6.20557 20.9995 7.00122V12.0012" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+<rect x="15.4995" y="15.5" width="6" height="6" rx="0.5" stroke="#222D44"/>
+<path d="M19.5005 15.5H21.0005C21.2767 15.5 21.5005 15.7239 21.5005 16V21C21.5005 21.2761 21.2767 21.5 21.0005 21.5H19.5005V15.5Z" fill="#222D44" stroke="#222D44"/>
+</svg>

package/css/std/controls/dxf-viewer/img/sidebar-resizer.svg

@@ -0,0 +1,6 @@
+<svg viewBox="0 0 6 30" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Spliter">
+<path id="Rectangle 4359" d="M0 0H4.5C5.32843 0 6 0.671573 6 1.5V28.5C6 29.3284 5.32843 30 4.5 30H0V0Z" fill="#326AD6"/>
+<path id="Polygon 3" d="M1.5 12.911C1.5 12.6251 1.80945 12.4464 2.05701 12.5894L5.12058 14.3581C5.36814 14.501 5.36814 14.8584 5.12058 15.0013L2.05701 16.7701C1.80945 16.913 1.5 16.7343 1.5 16.4485L1.5 12.911Z" fill="white"/>
+</g>
+</svg>

package/css/std/controls/dxf-viewer/img/sidebar-toggle.svg

@@ -0,0 +1,7 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="3.5" y="4.5" width="17" height="15" rx="1.5" stroke="#222D44"/>
+<path d="M12 20V4" stroke="#222D44"/>
+<path d="M6 9H9.5" stroke="#222D44" stroke-linecap="round"/>
+<path d="M6 12H9.5" stroke="#222D44" stroke-linecap="round"/>
+<path d="M6 15H9.5" stroke="#222D44" stroke-linecap="round"/>
+</svg>

package/css/std/controls/dxf-viewer/img/visible-eye.svg

@@ -0,0 +1,4 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M22 12C22 11.6287 21.8585 11.2706 21.6029 10.995C19.9844 9.3 16.3005 6 12 6C7.69951 6 4.01559 9.3 2.39712 10.995C2.1415 11.2706 2 11.6287 2 12C2 12.3713 2.1415 12.7294 2.39712 13.005C4.01559 14.7 7.69951 18 12 18C16.3005 18 19.9844 14.7 21.6029 13.005C21.8585 12.7294 22 12.3713 22 12ZM16 12C16 14.2091 14.2091 16 12 16C9.79086 16 8 14.2091 8 12C8 9.79086 9.79086 8 12 8C14.2091 8 16 9.79086 16 12Z" fill="#4A556C"/>
+<circle cx="12" cy="12" r="2" fill="#4A556C"/>
+</svg>

package/css/std/controls/dxf-viewer/img/zoom-in.svg

@@ -0,0 +1,6 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.0742 19.5742C15.7686 19.5742 19.5742 15.7686 19.5742 11.0742C19.5742 6.37982 15.7686 2.57422 11.0742 2.57422C6.37982 2.57422 2.57422 6.37982 2.57422 11.0742C2.57422 15.7686 6.37982 19.5742 11.0742 19.5742Z" stroke="#222D44" stroke-linejoin="round"/>
+<path d="M11.0742 8.07422V14.0742" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M8.08203 11.082L14.0742 11.0742" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M17.1836 17.1836L21.4262 21.4262" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/dxf-viewer/img/zoom-out.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.0742 19.5742C15.7686 19.5742 19.5742 15.7686 19.5742 11.0742C19.5742 6.37982 15.7686 2.57422 11.0742 2.57422C6.37982 2.57422 2.57422 6.37982 2.57422 11.0742C2.57422 15.7686 6.37982 19.5742 11.0742 19.5742Z" stroke="#222D44" stroke-linejoin="round"/>
+<path d="M8.07422 11.0742H14.0742" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M17.1836 17.1836L21.4262 21.4262" stroke="#222D44" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/css/std/controls/dxf-viewer/layer-list.css

@@ -0,0 +1,104 @@
+#layersContainer {
+    height: calc(100% - 48px);
+    width: 240px;
+    min-width: 240px;
+    position: absolute;
+    left: 0;
+    top: 48px;
+    background-color: #fff;
+    z-index: 100;
+    display: none;
+    border-right: 1px solid #C0CAD5;
+    box-shadow: 0 0 2.89px 0 rgba(0, 0, 0, 0.1), 0 0 7.22px 0 rgba(0, 0, 0, 0.08);
+}
+
+#layersContent {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+}
+
+#layersContent .ps {
+    max-height: calc(100% - 120px);
+}
+
+.vitro-layer-list-title {
+    padding: 16px 12px;
+}
+
+/*.vitro-all-layers-ckeckbox {
+    margin: 0 12px 12px 12px;
+}*/
+
+.vitro-file-name-container {
+    gap: 4px;
+    padding: 4px 12px;
+}
+
+.vitro-file-name-container .vitro-image {
+    width: 24px;
+    height: 24px;
+}
+
+.vitro-color {
+    width: 12px;
+    height: 12px;
+    border-radius: 2px;
+    flex-shrink: 0;
+    margin: 6px;
+}
+
+.vitro-all-layers-checkbox {
+    padding: 4px 16px 4px 12px;
+}
+
+.vitro-layer {
+    gap: 4px;
+    padding: 4px 16px 4px 12px;
+    opacity: 0.5;
+}
+
+.vitro-layer.vitro-active {
+    opacity: 1;
+}
+ 
+/*.vitro-layer > div {
+    margin-bottom: 0;
+}*/
+
+/*.vitro-checkbox-content input::before,
+.vitro-checkbox-content input:checked::before {
+    content: '';
+    display: block;
+    width: 100%;
+    height: 100%;
+    background: transparent;
+    background-size: 100%;
+    background-position: center;
+    background-repeat: no-repeat;
+}*/
+
+.vitro-checkbox-eye {
+    margin: 0;
+    overflow: hidden;
+}
+
+.vitro-checkbox-eye input::before {
+    background-image: url('img/invisible-eye.svg');
+}
+
+.vitro-checkbox-eye input:checked::before {
+    background-image: url('img/visible-eye.svg');
+}
+
+.vitro-checkbox-eye input {
+    margin: 0;
+}
+
+.vitro-checkbox-eye > div:first-child {
+    flex: 1 1;
+}
+
+.vitro-checkbox-eye > div:last-child {
+    width: unset;
+}

package/css/std/controls/dxf-viewer/panel.css

@@ -0,0 +1,34 @@
+.vitro-panel {
+    max-width: 40%;
+}
+
+.vitro-resizer {
+    position: absolute;
+    inset-block: 0;
+    width: 1px;
+    z-index: 200;
+    cursor: ew-resize;
+    inset-inline-end: 0;
+}
+
+.vitro-resizer.vitro-left {
+    inset-inline-start: 0;
+    inset-inline-end: unset;
+}
+
+.vitro-resizer::before {
+    content: '';
+    background-image: url(img/sidebar-resizer.svg);
+    height: 30px;
+    width: 6px;
+    position: absolute;
+    top: 50%;
+    transform: translateY(-50%);
+    left: 2px;
+}
+
+.vitro-resizer.vitro-left::before {
+    right: 2px;
+    left: unset;
+    transform: translateY(-50%) rotate(180deg);
+}

package/css/std/controls/dxf-viewer/prop-inspector.css

@@ -0,0 +1,102 @@
+#propInspector {
+    width: 278px;
+    background: #f8f8f8;
+    height: calc(100% - 32px);
+    position: fixed;
+    top: 51px;
+    right: 0;
+    z-index: 89000004;
+    display: none;
+    box-sizing: border-box;
+}
+
+.prop-inspector-inner-wrap {
+    border-left: 1px solid silver;
+    border-right: 1px solid silver;
+    padding: 32px 10px 20px 10px;
+    height: calc(100% - 10px);
+}
+
+.prop-inspector-close {
+    position: absolute;
+    top: 4px;
+    left: 3px;
+    font-weight: 400;
+    padding: 2px 8px 7px 8px;
+    cursor: pointer;
+    transform: scaleX(1.2);
+    font-size: 18px;
+    font-family: Arial;
+}
+
+.prop-inspector-content {
+    height: 100%;
+    font-size: 14px;
+    overflow-y: auto;
+    overflow-x: hidden;
+}
+
+.element-attributes {
+    margin-top: 10px;
+}
+
+.xeokit-table .td1 {
+    font-weight: bold;
+}
+
+.xeokit-table td {
+    padding: 8px;
+    border-top: 1px solid #E0E0E0;
+    word-wrap: break-word;
+    vertical-align: top;
+}
+
+.xeokit-table tr:first-child td {
+    border-top: none !important;
+}
+
+.xeokit-table tr td:first-child {
+    border-right: 1px solid #E0E0E0;
+}
+
+.subtitle.xeokit-no-prop-set-warning {
+    padding: 8px;
+}
+
+.xeokit-table {
+    width: 100%;
+}
+
+.prop-inspector-title {
+    font-size: 16px;
+    font-weight: bold;
+    padding-bottom: 12px;
+    position: absolute;
+    top: 8px;
+    left: 30px;
+
+}
+
+.xeokit-accordion {
+    margin-top: 20px;
+}
+
+.ui-accordion .ui-accordion-content.xeokit-accordion-panel {
+    padding: 2px 0 2px 0 !important;
+}
+
+.prop-inspector-content .ui-accordion-header.ui-state-active {
+    border: 1px solid #474747;
+    background: #474747;
+    font-weight: normal;
+    color: hsl(0,0%,85%);
+}
+
+.prop-inspector-close {
+    color:#474747;
+}
+
+.prop-inspector-close:hover {
+    text-decoration: none;
+    color:#474747;
+}

package/css/std/controls/dxf-viewer/select.css

@@ -0,0 +1,111 @@
+.vitro-select {
+    position: relative;
+    border: 1px solid #C0CAD5;
+    border-radius: 4px;
+    background: #fff;
+    display: flex;
+    align-items: center;
+    min-width: 224px;
+    height: 32px;
+}
+
+.vitro-select > input {
+    border: none;
+    cursor: pointer;
+    box-sizing: border-box;
+    color: #222D44;
+    font-size: 14px;
+    line-height: 16px;
+    padding: 8px 16px;
+    height: 100%;
+    width: 100%;
+    background: transparent;
+}
+
+.vitro-select > input:disabled {
+    background: #fff !important;
+    user-select: none;
+}
+
+.vitro-select > span {
+    display: block;
+    background-image: url('img/collapse-bottom.svg');
+    width: 24px;
+    height: 24px;
+    position: absolute;
+    top: calc(50% - 12px);
+    right: 16px;
+    background-size: 100%;
+    background-position: center;
+    background-repeat: no-repeat;
+    cursor: pointer;
+}
+
+.vitro-select.vitro-active > span {
+    background-image: url('img/collapse-up-blue.svg');
+}
+
+.vitro-select.vitro-active {
+    border-color: #3274E0;
+}
+
+.vitro-select.vitro-active label {
+    color: #3274E0;
+}
+
+.vitro-select ul {
+    background: #fff;
+    width: 100%;
+    padding: 0;
+    margin: 0;
+    list-style: none;
+    border-radius: 4px;
+    font-size: 14px;
+    overflow-y: auto;
+}
+
+.vitro-select > div {
+    overflow: hidden;
+    display: none;
+    position: absolute;
+    background: #fff;
+    width: 100%;
+    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);
+    top: calc(100% + 4px);
+    left: 0;
+    z-index: 10000;
+}
+
+.vitro-select.vitro-active > div {
+    display: block;
+}
+
+.vitro-select ul > li {
+    line-height: 16px;
+    padding: 8px 12px;
+    cursor: pointer;
+}
+
+.vitro-select ul > li:hover {
+    background: #F3F8FF;
+}
+
+.vitro-select ul::-webkit-scrollbar {
+    width: 4px;
+}
+
+.vitro-select ul::-webkit-scrollbar-track {
+    background: #fff;
+    border-radius: 8px;
+}
+
+.vitro-select ul::-webkit-scrollbar-thumb {
+    background: #E4E6EC;
+    border-radius: 2px;
+    height: 20px;
+}
+
+.vitro-select ul::-webkit-scrollbar-thumb:hover {
+    background: #E4E6EC;
+}