@alfresco/adf-core 8.4.0-19063861366 → 8.4.0-19066231420

package/lib/pagination/pagination.component.scss

@@ -9,6 +9,7 @@ $adf-pagination-line-height: 20px;
     border-top: $adf-pagination-border;
     height: $adf-pagination-height;
     line-height: $adf-pagination-line-height;
+    color: var(--adf-theme-foreground-text-color);
 
     &__block {
         display: flex;
@@ -55,6 +56,11 @@ $adf-pagination-line-height: 20px;
     &__current-page {
         margin-right: 5px;
 
+        &,
+        & + button {
+            color: var(--adf-theme-foreground-text-color);
+        }
+
         & + button {
             margin-left: -10px;
         }

package/lib/search-text/search-text-input.component.scss

@@ -18,9 +18,14 @@
         &-search-fixed-text {
             line-height: normal;
         }
+
+        &-clear-search-button {
+            font-size: var(--theme-button-font-size);
+            cursor: pointer;
+        }
     }
 
     .adf-highlight {
-        color: var(--mat-sys-primary);
+        color: var(--adf-theme-primary-900);
     }
 }

package/lib/styles/_globals.scss

@@ -6,7 +6,30 @@
         & #{ms.$mat-expansion-panel-header}.cdk-program-focused,
         &:not(#{ms.$mat-expanded}) #{ms.$mat-expansion-panel-header}:hover {
             &:not([aria-disabled='true']) {
-                background-color: var(--mat-sys-surface-container);
+                background-color: var(--adf-theme-background-hover-color);
+            }
+        }
+    }
+
+    #{ms.$mat-calendar} {
+        #{ms.$mat-calendar-header} {
+            button {
+                color: var(--adf-theme-foreground-text-color-087);
+
+                &:disabled {
+                    color: var(--adf-theme-foreground-text-color-054);
+                }
+            }
+        }
+
+        #{ms.$mat-calendar-content} {
+            #{ms.$mat-calendar-table-header} th {
+                color: var(--adf-theme-foreground-text-color-054);
+            }
+
+            #{ms.$mat-calendar-body-disabled} > div {
+                /* stylelint-disable-next-line declaration-no-important */
+                color: var(--adf-theme-foreground-text-color-054) !important;
             }
         }
     }
@@ -28,11 +51,11 @@
 
         #{ms.$mat-datetimepicker-calendar-content} {
             #{ms.$mat-datetimepicker-calendar-table-header} th {
-                color: var(--mat-sys-on-surface);
+                color: var(--adf-theme-foreground-text-color-054);
             }
 
             #{ms.$mat-datetimepicker-calendar-body-disabled} > div {
-                color: var(--mat-sys-on-surface);
+                color: var(--adf-theme-foreground-text-color-054);
             }
         }
     }
@@ -47,6 +70,12 @@
         }
     }
 
+    #{ms.$mat-input-element} {
+        &:focus::placeholder {
+            color: var(--theme-primary-color);
+        }
+    }
+
     #{ms.$mat-datetimepicker-dialog} {
         #{ms.$mat-dialog-container} {
             #{ms.$mat-dialog-surface} {

package/lib/styles/_mixins.scss

@@ -14,7 +14,7 @@
     font-family: 'Material Icons';
     font-weight: normal;
     font-style: normal;
-    font-size: var(--mat-sys-headline-small-size);
+    font-size: var(--theme-headline-font-size);
     line-height: 1;
     letter-spacing: normal;
     text-transform: none;

package/lib/templates/empty-content/empty-content.component.scss

@@ -1,4 +1,5 @@
 .adf-empty-content {
+    color: var(--adf-theme-foreground-text-color-054);
     display: flex;
     flex-direction: column;
     align-items: center;
@@ -7,13 +8,13 @@
     width: 100%;
 
     &__icon > *:first-child {
-        font-size: var(--mat-sys-display-medium-size);
-        height: var(--mat-sys-display-medium-size);
-        width: var(--mat-sys-display-medium-size);
+        font-size: var(--theme-display-3-font-size);
+        height: var(--theme-display-3-font-size);
+        width: var(--theme-display-3-font-size);
     }
 
     &__title {
-        font-size: var(--mat-sys-title-large-size);
+        font-size: var(--theme-adf-task-title-font-size);
         font-weight: 600;
         line-height: 0;
         white-space: normal;
@@ -23,6 +24,7 @@
 
     &__subtitle,
     &__text {
+        font-size: var(--theme-body-1-font-size);
         font-weight: 300;
         line-height: inherit;
         white-space: normal;

package/lib/templates/error-content/error-content.component.scss

@@ -1,6 +1,7 @@
 @use '../../styles/flex' as flex;
 
 .adf-error-content {
+    color: var(--adf-theme-foreground-text-color-054);
     display: flex;
     flex-direction: column;
     align-items: center;
@@ -48,11 +49,11 @@
         }
 
         &-title {
-            font-size: var(--mat-sys-headline-small-size);
+            font-size: var(--theme-headline-font-size);
         }
 
         &-description {
-            font-size: var(--mat-sys-title-small-size);
+            font-size: var(--theme-subheading-2-font-size);
         }
     }
 }

package/lib/toolbar/toolbar.component.scss

@@ -10,7 +10,10 @@
     }
 
     .adf-toolbar-container.adf-toolbar-container-row {
+        border: 1px solid var(--adf-theme-foreground-text-color-007);
+        color: var(--adf-theme-foreground-text-color-054);
         height: 64px;
+        font-size: var(--theme-body-1-font-size);
         white-space: normal;
         padding: 0 16px;
     }

package/lib/viewer/components/img-viewer/img-viewer.component.scss

@@ -1,10 +1,12 @@
+@use '../../../styles/mat-selectors' as ms;
+
 .adf-image-viewer {
     width: 100%;
 
     .adf-image-container {
         &:focus {
             outline-offset: -1px;
-            outline: 1px solid var(--mat-sys-primary);
+            outline: 1px solid var(--theme-accent-color-a200);
         }
 
         display: flex;
@@ -31,6 +33,15 @@
         left: 50%;
         transform: translateX(-50%);
 
+        .adf-toolbar #{ms.$mat-toolbar} {
+            max-height: 48px;
+            background-color: var(--adf-theme-background-card-color);
+            border-width: 0;
+            border-radius: 2px;
+            /* stylelint-disable-next-line */
+            box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12);
+        }
+
         .adf-main-toolbar {
             display: inline-block;
         }
@@ -44,7 +55,8 @@
             cursor: default;
             width: 79px;
             height: 24px;
-            border: 1px solid var(--mat-sys-outline);
+            font-size: var(--theme-body-1-font-size);
+            border: 1px solid var(--adf-theme-foreground-text-color-007);
             text-align: center;
             line-height: 24px;
             margin-left: 4px;

package/lib/viewer/components/pdf-viewer/pdf-viewer.component.scss

@@ -59,6 +59,7 @@
             justify-content: flex-end;
             align-items: flex-end;
             display: flex;
+            color: var(--adf-theme-foreground-text-color-054);
         }
     }
 
@@ -99,23 +100,23 @@
 
         .adf-toolbar #{ms.$mat-toolbar} {
             max-height: 48px;
-            background-color: var(--mat-sys-surface);
+            background-color: var(--adf-theme-background-card-color);
             border-width: 0;
             border-radius: 2px;
-            box-shadow:
-                0 2px 2px 0 rgba(0, 0, 0, 20.4),
-                0 0 2px 0 rgba(0, 0, 0, 0.12);
+            box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 20.4), 0 0 2px 0 rgba(0, 0, 0, 0.12);
         }
 
         &-page-selector {
             padding-left: 10px;
             padding-right: 10px;
             white-space: nowrap;
+            font-size: var(--theme-body-1-font-size);
 
             & > input {
-                border: 1px solid var(--mat-sys-outline);
-                background-color: var(--mat-sys-surface);
+                border: 1px solid var(--adf-theme-foreground-text-color-007);
+                background-color: var(--adf-theme-background-card-color);
                 color: inherit;
+                font-size: var(--theme-body-1-font-size);
                 padding: 5px;
                 height: 24px;
                 line-height: 24px;
@@ -131,8 +132,8 @@
             cursor: default;
             width: 79px;
             height: 24px;
-            font-size: var(--mat-sys-body-medium-size);
-            border: 1px solid var(--mat-sys-outline);
+            font-size: var(--theme-body-1-font-size);
+            border: 1px solid var(--adf-theme-foreground-text-color-007);
             text-align: center;
             line-height: 24px;
             margin-left: 4px;

package/lib/viewer/components/pdf-viewer-password-dialog/pdf-viewer-password-dialog.scss

@@ -9,3 +9,7 @@
 .adf-dialog-buttons button {
     text-transform: uppercase;
 }
+
+.adf-dialog-action-button:enabled {
+    color: var(--theme-primary-color);
+}

package/lib/viewer/components/pdf-viewer-thumbnails/pdf-viewer-thumbnails.component.scss

@@ -16,15 +16,15 @@
         cursor: pointer;
         display: block;
         width: 91px;
-        background: var(--mat-sys-surface);
+        background: var(--theme-background-color);
         margin-bottom: 15px;
     }
 
     &__thumb:hover {
-        box-shadow: var(--mat-sys-level2);
+        box-shadow: 0 0 5px 0 var(--adf-theme-foreground-text-color-087);
     }
 
     &__thumb--selected {
-        border: 2px solid var(--mat-sys-primary);
+        border: 2px solid var(--theme-accent-color-a200);
     }
 }

package/lib/viewer/components/txt-viewer/txt-viewer.component.scss

@@ -1,5 +1,5 @@
 .adf-txt-viewer {
-    background-color: var(--mat-sys-surface);
+    background-color: var(--theme-background-color);
     overflow: auto;
     height: 100%;
     width: 100%;

package/lib/viewer/components/unknown-format/unknown-format.component.scss

@@ -5,4 +5,5 @@
     flex: 1;
     flex-direction: column;
     justify-content: center;
+    color: var(--adf-theme-foreground-text-color);
 }

package/lib/viewer/components/viewer-render/viewer-render.component.scss

@@ -3,7 +3,7 @@
 .adf-full-screen {
     width: 100%;
     height: 100%;
-    background-color: var(--mat-sys-surface);
+    background-color: var(--adf-theme-background-card-color);
 }
 
 .adf-viewer-render-main-loader {
@@ -36,7 +36,7 @@
         position: relative;
         overflow: hidden;
         z-index: 1;
-        background-color: var(--mat-sys-surface);
+        background-color: var(--theme-background-color);
         display: flex;
         flex-flow: row wrap;
         flex: 1;

package/lib/viewer/components/viewer.component.scss

@@ -1,9 +1,10 @@
 /* stylelint-disable scss/at-extend-no-missing-placeholder */
+@use '../../styles/mat-selectors' as ms;
 
 .adf-full-screen {
     width: 100%;
     height: 100%;
-    background-color: var(--mat-sys-surface);
+    background-color: var(--adf-theme-background-card-color);
 }
 
 .adf-viewer {
@@ -11,8 +12,12 @@
     width: 100%;
     height: 100%;
 
-    .adf-toolbar-title {
-        width: auto;
+    #{ms.$mat-toolbar} {
+        color: var(--adf-theme-foreground-text-color-054);
+
+        .adf-toolbar-title {
+            width: auto;
+        }
     }
 
     &-main {
@@ -27,6 +32,12 @@
         margin-right: 4px;
     }
 
+    &-toolbar {
+        #{ms.$mat-toolbar} {
+            background-color: var(--adf-theme-background-card-color-087);
+        }
+    }
+
     &__file-title {
         text-align: center;
         flex: 1 1 auto;
@@ -37,16 +48,17 @@
         flex-direction: row;
         align-items: center;
 
-        @media screen and (width <=1450px) {
+        @media screen and (width <= 1450px) {
             left: 30%;
         }
     }
 
     &__title-display-name-container,
     &__display-name {
-        font-size: var(--mat-sys-title-small-size);
+        font-size: var(--theme-subheading-2-font-size);
         line-height: 1.5;
         vertical-align: middle;
+        color: var(--adf-theme-foreground-text-color);
         white-space: nowrap;
     }
 
@@ -58,7 +70,7 @@
     }
 
     &__display-name-value {
-        font-size: var(--mat-sys-body-medium-size);
+        font-size: var(--theme-body-1-font-size);
     }
 
     &-container {
@@ -68,7 +80,7 @@
             position: relative;
             overflow: hidden;
             z-index: 1;
-            background-color: var(--mat-sys-surface);
+            background-color: var(--theme-background-color);
             display: flex;
             flex-direction: row;
             /* stylelint-disable-next-line declaration-block-no-redundant-longhand-properties */
@@ -127,17 +139,17 @@
             width: 350px;
             display: block;
             padding: 0;
-            background-color: var(--mat-sys-surface);
-            box-shadow: var(--mat-sys-level2);
+            background-color: var(--theme-background-color);
+            box-shadow: 0 2px 4px 0 var(--adf-theme-foreground-text-color-027);
             overflow: auto;
 
             &__right {
-                border-left: 1px solid var(--mat-sys-outline);
+                border-left: 1px solid var(--adf-theme-foreground-text-color-007);
                 order: 4;
             }
 
             &__left {
-                border-right: 1px solid var(--mat-sys-outline);
+                border-right: 1px solid var(--adf-theme-foreground-text-color-007);
                 order: 1;
             }
         }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@alfresco/adf-core",
   "description": "Alfresco ADF core",
-  "version": "8.4.0-19063861366",
+  "version": "8.4.0-19066231420",
   "author": "Hyland Software, Inc. and its affiliates",
   "repository": {
     "type": "git",
@@ -63,8 +63,8 @@
     "@angular/router": ">=16.0.0",
     "@mat-datetimepicker/core": ">=12.0.1",
     "@ngx-translate/core": ">=16.0.0",
-    "@alfresco/js-api": ">=9.4.0-19063861366",
-    "@alfresco/adf-extensions": ">=8.4.0-19063861366",
+    "@alfresco/js-api": ">=9.4.0-19066231420",
+    "@alfresco/adf-extensions": ">=8.4.0-19066231420",
     "minimatch": ">=10.0.0",
     "pdfjs-dist": ">=3.3.122"
   },