@vitrosoftware/common-ui-ts 1.1.70 → 1.1.72

package/css/common.css

@@ -13,6 +13,14 @@ html, body {
     overscroll-behavior-x: none;
 }
 
+:global(#root) {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+}
+
 :global(.vitro-opacity-low) {
     opacity: .3;
 }

package/css/std/controls/action-handler/action-handler.css

@@ -114,8 +114,8 @@
 }
 
 .vitro-action-handler-dialog-confirm {
-    height: 100vh;
-    width: 100vw;
+    height: 100%;
+    width: 100%;
     background: rgba(34, 45, 68, 0.2);
 }
 

package/css/std/controls/avatar/avatar.css

@@ -2,7 +2,6 @@
     position: relative;
     border-radius: 50%;
     border: 0;
-    background: #76AFF8;
     color: #fff !important;
     width: 24px;
     height: 24px;
@@ -19,4 +18,5 @@
 .vitro-avatar img {
     width: 100%;
     height: 100%;
+    object-fit: cover;
 }

package/css/std/controls/breadcrumbs/breadcrumbs.css

@@ -16,13 +16,20 @@
 .vitro-breadcrumbs li > div {
     display: inline-flex;
     align-items: center;
+    white-space: nowrap;
+    overflow: hidden;
 }
 
 .vitro-breadcrumbs li > div:first-child {
     cursor: pointer;
 }
 
-.vitro-breadcrumbs-list-wrap {
+.vitro-breadcrumbs li > div > span {
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.vitro-breadcrumbs-list-container {
     display: flex;
     position: relative;
     justify-content: space-between;
@@ -36,6 +43,9 @@
     margin: 0;
     padding: 0;
     display: flex;
+    overflow: hidden;
+    max-width: 80%;
+    flex: 1 1;
 }
 
 .vitro-breadcrumbs-list > li {
@@ -44,6 +54,7 @@
     line-height: 16px;
     display: flex;
     align-items: center;
+    overflow: hidden;
 }
 
 .vitro-separator,
@@ -65,7 +76,7 @@
     height: 20px;
 }
 
-.vitro-breadcrumbs-list > li:last-child{
+.vitro-breadcrumbs-list > li:last-child {
     color: #222D44;
     font-family: 'InterMedium';
     pointer-events: none;
@@ -150,5 +161,10 @@
 @media (max-width: 800px) {
     .vitro-breadcrumbs {
         margin-bottom: 12px;
+        margin-right: 12px;
     }
-}
+
+    .vitro-breadcrumbs-list {
+        max-width: 100%;
+    }
+}

package/css/std/controls/date-picker/date-picker.css

@@ -4,6 +4,10 @@
     position: relative;
 }
 
+.vitro-display-none {
+    display: none;
+}
+
 .vitro-button-copy {
     height: 20px;
     width: 20px;
@@ -129,6 +133,14 @@
     min-width: 240px;
 }
 
+.vitro-control-container :global(.k-animation-container) {
+    position: initial !important;
+}
+
+.vitro-control .vitro-control-container :global(.k-animation-container) {
+    position: absolute !important;
+}
+
 :global(.k-popup) {
     box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.16), 0px 0px 4px 0px rgba(0, 0, 0, 0.12) !important;
     background-color: #fff;

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

@@ -7,7 +7,7 @@
     flex-shrink: 1;
 }
 
-.vitro-dialog-content :global(.ps) {
+.vitro-dialog-content > :global(#TreeView) > :global(.ps) {
     padding-top: 12px !important;
     padding-left: 16px;
 }

package/css/std/controls/dialog/dialog.css

@@ -5,7 +5,7 @@
     right: 0;
     top: 0;
     bottom: 0;
-    z-index: 1000000;
+    z-index: 1001;
     display: flex;
     align-items: center;
     justify-content: center;

package/css/std/controls/login/login.css

@@ -1,6 +1,6 @@
 .vitro-login-layout {
-    width: 100vw;
-    height: 100vh;
+    width: 100%;
+    height: 100%;
     background: #347FDE;
     position: relative;
     background-size: cover;
@@ -219,16 +219,6 @@
 }
 
 @media (max-width: 800px) {
-    .vitro-logo {
-        width: 165px;
-        height: 57px;
-        margin-bottom: 28px !important;
-    }
-
-    .vitro-title {
-        margin-bottom: 36px !important;
-    }
-
     .vitro-login-checkbox div {
         font-size: 14px !important;
     }
@@ -251,14 +241,12 @@
     }
 
     .vitro-form-login {
-        margin: 0 14px;
+        margin: 0 16px;
         width: -moz-available !important;
         width: -webkit-fill-available !important;
         width: fill-available !important;
         left: 0 !important;
-        height: 573px !important;
-        top: calc(50% - 286px) !important;
-        padding: 48px 12px 24px 12px !important;
+        padding: 71px 12px 24px 12px !important;
     }
 
     .vitro-control input {

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

@@ -25,7 +25,7 @@
 
 .compare-dlg_doc-sep {
     width: 68px;
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/dlg-compare-ico.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/dlg-compare-ico.png') no-repeat center center;
 }
 
 .compare-dlg_doc-a-wrap .wrap-inner,
@@ -98,10 +98,6 @@
     box-sizing: border-box;
 }
 
-.compare-viewer-title {
-    font-family: Arial;
-}
-
 .compare-viewer-wrap {
     position: absolute;
     top: 0;
@@ -113,6 +109,7 @@
 }
 
 .compare-viewer-title {
+    font-family: Arial;
     height: 40px;
     background: #222222;
     position: relative;
@@ -120,6 +117,11 @@
     font-weight: 600;
     padding: 11px 30px 0 30px;
     color: #ffffff;
+    z-index: 500;
+}
+
+.compare-viewer-wrap:not(.side-by-side) .side-by-side-slider {
+    z-index: 0;
 }
 
 .compare-viewer-body {
@@ -150,7 +152,8 @@
 
 #compareCanvas-docB {
     z-index: 2;
-    mix-blend-mode: multiply;
+    /*mix-blend-mode: multiply;*/
+    mix-blend-mode: darken;
 }
 
 #compareCanvasResult {
@@ -207,17 +210,17 @@
 }
 
 #hideColors {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/hide-colors.png');
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/hide-colors.png');
 }
 #hideColors.active {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/hide-colors_active.png');
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/hide-colors_active.png');
 }
 
 #alignFinish {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/finish-align.png');
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/finish-align.png');
 }
 #alignFinish.active {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/finish-align_active.png');
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/finish-align_active.png');
 }
 
 .compare-panel_body {
@@ -283,13 +286,14 @@
     top: 50%;
     right: 0;
     transform: translate(0, -50%);
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/layer-unvisible.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/layer-unvisible.png') no-repeat center center;
 }
 
 .compare-layer-visibility.active {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/layer-visible.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/layer-visible.png') no-repeat center center;
 }
 
+.compare-viewer-wrap.side-by-side #compareCanvasResult,
 #compareCanvasResult.compare-layer-hide {
     display: none;
 }
@@ -324,50 +328,50 @@
 }
 
 #btnComparePan {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/pan.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/pan.png') no-repeat center center;
 }
 #btnComparePan:hover,
 #btnComparePan.active {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/pan_active.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/pan_active.png') no-repeat center center;
 }
 
 #btnCompareZoom {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/zoom.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/zoom.png') no-repeat center center;
 }
 #btnCompareZoom:hover,
 #btnCompareZoom.active {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/zoom_active.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/zoom_active.png') no-repeat center center;
 }
 
 #btnFitToView {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/fit-to-view.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/fit-to-view.png') no-repeat center center;
 }
 #btnFitToView:hover,
 #btnFitToView.active {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/fit-to-view_active.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/fit-to-view_active.png') no-repeat center center;
 }
 
 #btnCompareType.type-overlay {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/compare-overlay.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/compare-overlay.png') no-repeat center center;
 }
 #btnCompareType.type-side-by-side {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/compare-side-by-side.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/compare-side-by-side.png') no-repeat center center;
 }
 
 #btnComparePanel {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/panel-visibility.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/panel-visibility.png') no-repeat center center;
 }
 #btnComparePanel:hover,
 #btnComparePanel.active {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/panel-visibility_active.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/panel-visibility_active.png') no-repeat center center;
 }
 
 #btnCompareViewerExit {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/close-compare-viewer.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/close-compare-viewer.png') no-repeat center center;
 }
 #btnCompareViewerExit:hover,
 #btnCompareViewerExit.active {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/close-compare-viewer_active.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/close-compare-viewer_active.png') no-repeat center center;
 }
 
 /* Compare label */
@@ -390,6 +394,7 @@
 
 .compare-canvas-wrap {
     cursor: grab;
+    transform-origin: 0;
 }
 
 .compare-canvas-wrap.zoom {
@@ -419,19 +424,19 @@
 }
 
 #btnCompareTypeSideBySide {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/side-by-side.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/side-by-side.png') no-repeat center center;
 }
 
 #btnCompareTypeOverlay {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/overlay.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/overlay.png') no-repeat center center;
 }
 
 #btnCompareTypeSideBySide.active {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/side-by-side_active.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/side-by-side_active.png') no-repeat center center;
 }
 
 #btnCompareTypeOverlay.active {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/overlay_active.png') no-repeat center center;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/overlay_active.png') no-repeat center center;
 }
 
 /* Side by Side */
@@ -480,9 +485,9 @@
     opacity: 1;
 }
 
-.compare-viewer-wrap.side-by-side .compare-canvas-wrap canvas {
+/*.compare-viewer-wrap.side-by-side .compare-canvas-wrap canvas {
     filter: grayscale(1);
-}
+}*/
 
 .compare-viewer-wrap.side-by-side .compare-ui-label:not(.compare-ui-label_side-by-side),
 .compare-ui-label_side-by-side {
@@ -501,4 +506,55 @@
 .compare-viewer-body.layer-shift #compareCanvasResult {
 /*.compare-viewer-body.align-layers #compareCanvasResult {*/
     opacity: 0;
-}
+}
+
+.compare-dlg_thumb {
+    box-sizing: border-box;
+    background-color: #fff;
+    border: 1px solid #dae1e6;
+    border-radius: 2px;
+    cursor: pointer;
+    display: flex;
+    margin-bottom: 15px;
+    width: 200px;
+    max-width: 200px;
+    max-height: 200px;
+    overflow: hidden;
+    height: 200px;
+    justify-content: center;
+    align-items: center;
+}
+
+.uk-button.disabled {
+    opacity: 0.4;
+    cursor: default;
+}
+
+.compare-dlg_warning {
+    display: none;
+    font-weight: bold;
+    color: #ff495c;
+    padding: 30px 30px 0 30px;
+    font-size: 14px;
+    font-family: Arial;
+}
+
+.compare-dlg_btn-doc-select {
+    float: right;
+    cursor: pointer;
+    color: #1E87F0;
+    font-size: 14px;
+}
+
+#compareCanvas-docA-tmp,
+#compareCanvas-docB-tmp,
+#compareCanvas-docA-full,
+#compareCanvas-docB-full {
+    opacity: 0;
+    position: absolute;
+    z-index: 0;
+    width: 1px;
+    height: 1px;
+    top:0;
+    left:0;
+}

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

@@ -26,6 +26,10 @@
     opacity: 0.95;
 }
 
+.pdf-note.transparent {
+    opacity: 0;
+}
+
 #dlgNoteTxt {
 	width: 100%;
 	max-width: 100%;
@@ -175,12 +179,12 @@ a.ui-button:active,
     height: 16px;
     right: 0;
     top: 0;
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/delete.png') 2px 0 no-repeat;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/delete.png') 2px 0 no-repeat;
     cursor: pointer;
 }
 
 .body__sidebar-note-wrap.active .body__sidebar-note-btn-delete {
-    background: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/delete-active.png') 2px 0 no-repeat;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/delete-active.png') 2px 0 no-repeat;
 }
 
 .body__sidebar-note-body {
@@ -265,28 +269,107 @@ a.ui-button:active,
     display: none !important;
 }
 
+html[dir='ltr'] .toolbarButton#btnDrawAnnotation {
+    margin-right: 0 !important;
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotation::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-toolbar.png');
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotation.rect::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-toolbar-rect.png');
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotation.ellipse::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-toolbar-ellipse.png');
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotation.polygon::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-toolbar-polygon.png');
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotation.cloud::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-toolbar-cloud.png');
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotation.line::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-toolbar-line.png');
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotation.arrow::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-toolbar-arrow.png');
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotationToolbarToggle {
+    margin-left: 0 !important;
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotationToolbarToggle:after {
+    content: "";
+    border-left: 1px solid #AEAEAF;
+    height: 18px;
+    position: absolute;
+    left: -1px;
+    top: 5px;
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotationToolbarToggle.toggled:after  {
+    display: none !important;
+}
+
+html[dir='ltr'] .toolbarButton#btnDrawAnnotationToolbarToggle::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/dropdown-arrow.png');
+    left: 0 !important;
+    top: 1px !important;
+}
+
+html[dir='ltr'] .secondaryToolbarButton#btnDrawRectangle::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-rect.png');
+    /*top: 5px;*/
+}
+
+html[dir='ltr'] .secondaryToolbarButton#btnDrawEllipse::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-ellipse.png');
+    /*top: 5px;*/
+}
+
+html[dir='ltr'] .secondaryToolbarButton#btnDrawPolygon::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-polygon.png');
+    /*top: 5px;*/
+}
+
+html[dir='ltr'] .secondaryToolbarButton#btnDrawCloud::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-cloud.png');
+    /*top: 5px;*/
+}
+
+html[dir='ltr'] .secondaryToolbarButton#btnDrawLine::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-line.png');
+    /*top: 5px;*/
+}
 
-html[dir='ltr'] .toolbarButton#btnDrawRectangle::before {
-    content: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/draw-annotation.png');
+html[dir='ltr'] .secondaryToolbarButton#btnDrawArrow::before {
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/draw-annotation-arrow.png');
     /*top: 5px;*/
 }
 
 html[dir='ltr'] .toolbarButton#btnToggleNotes::before {
-    content: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/hide-annotation.png');
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/hide-annotation.png');
     /*top: 5px;*/
 }
 
 html[dir='ltr'] .toolbarButton#btnToggleNotes.show::before {
-    content: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/show-annotation.png');
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/show-annotation.png');
     /*top: 5px;*/
 }
 
 html[dir='ltr'] .toolbarButton#btnToggleSidebarNotes::before {
-    content: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/sidebar-notes-toggle.png');
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/sidebar-notes-toggle.png');
 }
 
 html[dir='ltr'] .toolbarButton#btnCompare::before {
-    content: url('@vitrosoftware/common-ui-ts/css/white/controls/pdf-viewer/img/do-compare.png');
+    content: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/do-compare.png');
 }
 
 /* 2021.10.03 - Fix: annotations visibility in fullscreen mode */
@@ -334,6 +417,59 @@ body.show-presentation-txt #viewer .page .textLayer span:empty {
 html[dir='ltr'] .toolbarButton#btnCompare::before,
 .toolbarButton#btnToggleSidebarNotes::before,
 .toolbarButton#btnToggleNotes::before,
-.toolbarButton#btnDrawRectangle::before {
+.toolbarButton#btnDrawRectangle::before,
+.toolbarButton#btnDrawEllipse::before,
+.toolbarButton#btnDrawPolygon::before,
+.toolbarButton#btnDrawCloud::before,
+.toolbarButton#btnDrawLine::before,
+.toolbarButton#btnDrawArrow::before,
+.toolbarButton#btnDrawAnnotation::before,
+.toolbarButton#btnDrawAnnotationToolbarToggle::before,
+.btn-draw-annotation::before {
     background-color: transparent !important;
 }
+
+#drawAnnotationToolbar {
+    max-width: 222px;
+}
+
+#drawAnnotationToolbar.align-l:before {
+    left: 1px !important;
+}
+
+#drawAnnotationToolbar.align-l:after {
+    left: 2px !important;
+}
+
+#drawAnnotationToolbarButtonContainer {
+    max-width: 220px;
+    min-height: 26px;
+    max-height: calc(var(--viewer-container-height) - 40px);
+    overflow-y: auto;
+    margin-bottom: -4px;
+}
+
+.toolbarButtonDropdown {
+    width: 15px !important;
+}
+
+.pdfViewer .canvasWrapper {
+    overflow: visible;
+}
+
+.page.loading > * {
+    opacity: 0 !important;
+}
+
+.page.current.loading:after {
+    content: "";
+    width: 147px;
+    height: 110px;
+    background: url('@vitrosoftware/common-ui-ts/css/std/controls/pdf-viewer/img/spinner.gif') no-repeat center center;
+    background-size: contain;
+    position: fixed;
+    z-index: 1000;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+}

package/css/std/controls/pdf-viewer/img/annotation-check.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns="http://www.w3.org/2000/svg"
+   width="40"
+   height="40"
+   viewBox="0 0 40 40">
+  <path
+     d="M 1.5006714,23.536225 6.8925879,18.994244 14.585721,26.037937 34.019683,4.5410479 38.499329,9.2235032 14.585721,35.458952 z"
+     id="path4"
+     style="fill:#ffff00;fill-opacity:1;stroke:#000000;stroke-width:1.25402856;stroke-opacity:1" />
+</svg>

package/css/std/controls/pdf-viewer/img/annotation-comment.svg

@@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns="http://www.w3.org/2000/svg"
+   height="40"
+   width="40"
+   viewBox="0 0 40 40">
+  <rect
+     style="fill:#ffff00;fill-opacity:1;fill-rule:evenodd;stroke:#000000;stroke-width:1;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
+     width="33.76017"
+     height="33.76017"
+     x="3.119915"
+     y="3.119915" />
+  <path
+     d="m 20.677967,8.54499 c -7.342801,0 -13.295293,4.954293 -13.295293,11.065751 0,2.088793 0.3647173,3.484376 1.575539,5.150563 L 6.0267418,31.45501 13.560595,29.011117 c 2.221262,1.387962 4.125932,1.665377 7.117372,1.665377 7.3428,0 13.295291,-4.954295 13.295291,-11.065753 0,-6.111458 -5.952491,-11.065751 -13.295291,-11.065751 z"
+     style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:0.93031836;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"/>
+</svg>