diff --git a/ng2-components/ng2-activiti-form/src/components/form.component.scss b/ng2-components/ng2-activiti-form/src/components/form.component.scss index 077f689477..b88ab406b6 100644 --- a/ng2-components/ng2-activiti-form/src/components/form.component.scss +++ b/ng2-components/ng2-activiti-form/src/components/form.component.scss @@ -35,4 +35,10 @@ form-field { width: 100%; + + .mat-input-element { + font-size: 14px; + padding-top: 8px; + line-height: 20px; + } } diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.scss b/ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.scss index 1aa86c51c8..ef7e8c832e 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.scss +++ b/ng2-components/ng2-activiti-form/src/components/widgets/container/container.widget.scss @@ -56,7 +56,7 @@ } .mat-input-placeholder-wrapper { - top: 0 !important; + top: 5px !important; } .mat-input-placeholder { diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/error/error.component.scss b/ng2-components/ng2-activiti-form/src/components/widgets/error/error.component.scss index 7d693d283c..27796ef41d 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/error/error.component.scss +++ b/ng2-components/ng2-activiti-form/src/components/widgets/error/error.component.scss @@ -1,11 +1,3 @@ - - -.adf-error-text-container { - position: absolute; - width: 81%; - height: 20px; - margin-top: 30px; } - .adf-error-text{ width: 85%; } diff --git a/ng2-components/ng2-activiti-tasklist/src/components/start-task.component.scss b/ng2-components/ng2-activiti-tasklist/src/components/start-task.component.scss index 8c0d91d0be..970fb4ab09 100644 --- a/ng2-components/ng2-activiti-tasklist/src/components/start-task.component.scss +++ b/ng2-components/ng2-activiti-tasklist/src/components/start-task.component.scss @@ -43,62 +43,64 @@ padding-top: 0px; } - .adf { - - &-start-task-input-container .mat-input-wrapper { - padding-top: 8px; - } - - &-error-text-container { - position: absolute; - width: 81%; - height: 20px; - margin-top: 30px; - } - - &-error-text { - padding: 1px; - height: 16px; - font-size: 12px; - line-height: 1.33; - float: left; - color: mat-color($warn); - } - - &-error-icon { - float: right; - font-size: 17px; - color: mat-color($warn); - } - - &-label { - color: rgb(186, 186, 186);; - } - - &-invalid { - - .mat-input-underline { - background-color: #f44336 !important; + adf-start-task { + .adf { + + &-start-task-input-container .mat-input-wrapper { + padding-top: 8px; } - - .adf-file { - border-color: mat-color($warn); + + &-error-text-container { + position: absolute; + width: 81%; + height: 20px; + margin-top: 30px; } - - .mat-input-prefix { + + &-error-text { + padding: 1px; + height: 16px; + font-size: 12px; + line-height: 1.33; + float: left; color: mat-color($warn); } - - .adf-input { - border-color: mat-color($warn); - } - - .adf-label { + + &-error-icon { + float: right; + font-size: 17px; color: mat-color($warn); - &:after { - background-color: mat-color($warn); + } + + &-label { + color: rgb(186, 186, 186);; + } + + &-invalid { + + .mat-input-underline { + background-color: #f44336 !important; + } + + .adf-file { + border-color: mat-color($warn); + } + + .mat-input-prefix { + color: mat-color($warn); + } + + .adf-input { + border-color: mat-color($warn); + } + + .adf-label { + color: mat-color($warn); + &:after { + background-color: mat-color($warn); + } } } - } + } } } diff --git a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-blue-orange.css b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-blue-orange.css index 57beb2be35..853407a71d 100644 --- a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-blue-orange.css +++ b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-blue-orange.css @@ -111,7 +111,7 @@ font: 400 34px/40px Muli, Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -137,14 +137,9 @@ .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -171,66 +166,6 @@ .mat-dialog-title { font: 500 20px/32px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -245,14 +180,62 @@ .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Muli, Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Muli, Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -261,7 +244,6 @@ input.mat-input-element { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -271,7 +253,6 @@ input.mat-input-element { font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -302,62 +283,33 @@ input.mat-input-element { .mat-list-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; @@ -511,7 +463,7 @@ input.mat-input-element { font: 400 34px/40px Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -537,14 +489,9 @@ input.mat-input-element { .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -571,66 +518,6 @@ input.mat-input-element { .mat-dialog-title { font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -645,14 +532,62 @@ input.mat-input-element { .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -661,7 +596,6 @@ input.mat-input-element { font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -671,7 +605,6 @@ input.mat-input-element { font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -702,62 +635,33 @@ input.mat-input-element { .mat-list-item { font-family: Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Roboto, "Helvetica Neue", sans-serif; @@ -778,9 +682,6 @@ input.mat-input-element { .mat-ripple { overflow: hidden; } - @media screen and (-ms-high-contrast: active) { - .mat-ripple { - display: none; } } .mat-ripple.mat-ripple-unbounded { overflow: visible; } @@ -827,11 +728,11 @@ input.mat-input-element { padding-right: 32px; } .mat-option-ripple { + position: absolute; top: 0; left: 0; - right: 0; bottom: 0; - position: absolute; + right: 0; pointer-events: none; } @media screen and (-ms-high-contrast: active) { .mat-option-ripple { @@ -876,6 +777,7 @@ input.mat-input-element { overflow: hidden; padding: 0; position: absolute; + text-transform: none; width: 1px; } .cdk-overlay-container, .cdk-global-overlay-wrapper { @@ -932,11 +834,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) { background: rgba(0, 0, 0, 0.04); } - .mat-primary .mat-option.mat-selected { + .mat-option.mat-selected.mat-primary, .mat-primary .mat-option.mat-selected { color: #2196f3; } - .mat-accent .mat-option.mat-selected { + .mat-option.mat-selected.mat-accent, .mat-accent .mat-option.mat-selected { color: #ff9800; } - .mat-warn .mat-option.mat-selected { + .mat-option.mat-selected.mat-warn, .mat-warn .mat-option.mat-selected { color: #f44336; } .mat-option.mat-selected:not(.mat-option-multiple) { background: rgba(0, 0, 0, 0.04); } @@ -957,22 +859,25 @@ input.mat-input-element { .mat-pseudo-checkbox::after { color: #fafafa; } -.mat-pseudo-checkbox-checked, -.mat-pseudo-checkbox-indeterminate, -.mat-accent .mat-pseudo-checkbox-checked, -.mat-accent .mat-pseudo-checkbox-indeterminate { - background: #ff9800; } - +.mat-pseudo-checkbox-checked.mat-primary, +.mat-pseudo-checkbox-indeterminate.mat-primary, .mat-primary .mat-pseudo-checkbox-checked, .mat-primary .mat-pseudo-checkbox-indeterminate { background: #2196f3; } +.mat-pseudo-checkbox-checked.mat-accent, +.mat-pseudo-checkbox-indeterminate.mat-accent, +.mat-accent .mat-pseudo-checkbox-checked, +.mat-accent .mat-pseudo-checkbox-indeterminate { + background: #ff9800; } + +.mat-pseudo-checkbox-checked.mat-warn, +.mat-pseudo-checkbox-indeterminate.mat-warn, .mat-warn .mat-pseudo-checkbox-checked, .mat-warn .mat-pseudo-checkbox-indeterminate { background: #f44336; } -.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, -.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { +.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { background: #b0b0b0; } .mat-app-background { @@ -1058,7 +963,7 @@ input.mat-input-element { .mat-button-toggle-checked { background-color: #e0e0e0; - color: rgba(0, 0, 0, 0.54); } + color: black; } .mat-button-toggle-disabled { background-color: #eeeeee; @@ -1115,38 +1020,19 @@ input.mat-input-element { .mat-chip:not(.mat-basic-chip) { background-color: #e0e0e0; color: rgba(0, 0, 0, 0.87); } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove:hover { - opacity: 0.54; } -.mat-chip.mat-chip-selected.mat-primary { - background-color: #2196f3; - color: white; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-warn { - background-color: #f44336; - color: white; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-accent { - background-color: #ff9800; +.mat-chip.mat-chip-selected:not(.mat-basic-chip) { + background-color: #808080; color: rgba(255, 255, 255, 0.87); } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove { - color: rgba(255, 255, 255, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove:hover { - opacity: 0.54; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary { + background-color: #2196f3; + color: white; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent { + background-color: #ff9800; + color: rgba(255, 255, 255, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn { + background-color: #f44336; + color: white; } .mat-table { background: white; } @@ -1212,73 +1098,24 @@ input.mat-input-element { .mat-expansion-panel { background: white; - color: rgba(0, 0, 0, 0.87); } + color: black; } .mat-action-row { border-top-color: rgba(0, 0, 0, 0.12); } -.mat-expansion-panel-header:not([aria-disabled='true']).cdk-keyboard-focused, .mat-expansion-panel-header:not([aria-disabled='true']).cdk-program-focused, .mat-expansion-panel-header:not([aria-disabled='true']):hover { +.mat-expansion-panel-header:focus, +.mat-expansion-panel-header:hover { background: rgba(0, 0, 0, 0.04); } .mat-expansion-panel-header-title { color: rgba(0, 0, 0, 0.87); } -.mat-expansion-panel-header-description, +.mat-expansion-panel-header-description { + color: rgba(0, 0, 0, 0.54); } + .mat-expansion-indicator::after { color: rgba(0, 0, 0, 0.54); } -.mat-expansion-panel-header[aria-disabled='true'] { - color: rgba(0, 0, 0, 0.38); } - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-title, - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-description { - color: inherit; } - -.mat-form-field { - width: 200px; } - -.mat-form-field-placeholder { - color: rgba(0, 0, 0, 0.54); } - -.mat-hint { - color: rgba(0, 0, 0, 0.54); } - -.mat-focused .mat-form-field-placeholder { - color: #2196f3; } - .mat-focused .mat-form-field-placeholder.mat-accent { - color: #ff9800; } - .mat-focused .mat-form-field-placeholder.mat-warn { - color: #f44336; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder .mat-form-field-required-marker, -.mat-focused .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #ff9800; } - -.mat-form-field-underline { - background-color: rgba(0, 0, 0, 0.42); } - .mat-form-field-underline.mat-disabled { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } - -.mat-form-field-ripple { - background-color: #2196f3; } - .mat-form-field-ripple.mat-accent { - background-color: #ff9800; } - .mat-form-field-ripple.mat-warn { - background-color: #f44336; } - -.mat-form-field-invalid .mat-form-field-placeholder { - color: #f44336; } - .mat-form-field-invalid .mat-form-field-placeholder.mat-accent, - .mat-form-field-invalid .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #f44336; } - -.mat-form-field-invalid .mat-form-field-ripple { - background-color: #f44336; } - -.mat-error { - color: #f44336; } - .mat-icon.mat-primary { color: #2196f3; } @@ -1288,21 +1125,51 @@ input.mat-input-element { .mat-icon.mat-warn { color: #f44336; } +.mat-input-placeholder { + color: rgba(0, 0, 0, 0.38); } + +.mat-focused .mat-input-placeholder { + color: #2196f3; } + .mat-focused .mat-input-placeholder.mat-accent { + color: #ff9800; } + .mat-focused .mat-input-placeholder.mat-warn { + color: #f44336; } + .mat-input-element:disabled { - color: rgba(0, 0, 0, 0.42); } + color: rgba(0, 0, 0, 0.38); } -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required, +.mat-focused .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #ff9800; } + +.mat-input-underline { + background-color: rgba(0, 0, 0, 0.12); } + +.mat-input-ripple { + background-color: #2196f3; } + .mat-input-ripple.mat-accent { + background-color: #ff9800; } + .mat-input-ripple.mat-warn { + background-color: #f44336; } + +.mat-input-invalid .mat-input-placeholder { + color: #f44336; } + .mat-input-invalid .mat-input-placeholder.mat-accent, + .mat-input-invalid .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #f44336; } + +.mat-input-invalid .mat-input-ripple { + background-color: #f44336; } + +.mat-input-error { + color: #f44336; } + +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { color: rgba(0, 0, 0, 0.87); } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - color: rgba(0, 0, 0, 0.87); } - -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { color: rgba(0, 0, 0, 0.54); } -.mat-list-item-disabled { - background-color: #eeeeee; } - .mat-divider { border-top-color: rgba(0, 0, 0, 0.12); } @@ -1311,12 +1178,7 @@ input.mat-input-element { .mat-nav-list .mat-list-item:hover, .mat-nav-list .mat-list-item.mat-list-item-focus { background: rgba(0, 0, 0, 0.04); } -.mat-list-option { - outline: none; } - .mat-list-option:hover, .mat-list-option.mat-list-item-focus { - background: rgba(0, 0, 0, 0.04); } - -.mat-menu-panel { +.mat-menu-content { background: white; } .mat-menu-item { @@ -1324,15 +1186,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-menu-item[disabled] { color: rgba(0, 0, 0, 0.38); } - -.mat-menu-item .mat-icon, -.mat-menu-item-submenu-trigger::after { - color: rgba(0, 0, 0, 0.54); } - -.mat-menu-item:hover:not([disabled]), -.mat-menu-item:focus:not([disabled]), -.mat-menu-item-highlighted:not([disabled]) { - background: rgba(0, 0, 0, 0.04); } + .mat-menu-item .mat-icon { + color: rgba(0, 0, 0, 0.54); + vertical-align: middle; } + .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) { + background: rgba(0, 0, 0, 0.04); } .mat-paginator { background: white; } @@ -1427,20 +1285,15 @@ input.mat-input-element { .mat-select-trigger, .mat-select-arrow { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-underline { - background-color: rgba(0, 0, 0, 0.42); } - -[aria-disabled='true'] .mat-select-underline { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } + background-color: rgba(0, 0, 0, 0.12); } .mat-select-disabled .mat-select-value, .mat-select-arrow, .mat-select-trigger { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-content, .mat-select-panel-done-animating { background: white; } @@ -1448,9 +1301,6 @@ input.mat-input-element { .mat-select-value { color: rgba(0, 0, 0, 0.87); } -.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) { - background: rgba(0, 0, 0, 0.12); } - .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-arrow { color: #2196f3; } @@ -1463,26 +1313,26 @@ input.mat-input-element { .mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-underline { background-color: #ff9800; } -.mat-select:focus:not(.mat-select-disabled).mat-select-required .mat-select-placeholder::after { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow { color: #f44336; } -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, .mat-select-invalid .mat-select-trigger, .mat-select-invalid .mat-select-arrow { - color: #f44336; } - -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, .mat-select-invalid .mat-select-underline { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline { background-color: #f44336; } -.mat-drawer-container { +.mat-sidenav-container { background-color: #fafafa; color: rgba(0, 0, 0, 0.87); } -.mat-drawer { +.mat-sidenav { background-color: white; color: rgba(0, 0, 0, 0.87); } - .mat-drawer.mat-drawer-push { + .mat-sidenav.mat-sidenav-push { background-color: white; } -.mat-drawer-backdrop.mat-drawer-shown { +.mat-sidenav-backdrop.mat-sidenav-shown { background-color: rgba(0, 0, 0, 0.6); } .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb { @@ -1580,7 +1430,7 @@ input.mat-input-element { .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label { - background-color: rgba(0, 0, 0, 0.87); } + background-color: black; } .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb-label { @@ -1615,100 +1465,17 @@ input.mat-input-element { border-top: 1px solid rgba(0, 0, 0, 0.12); border-bottom: none; } +.mat-tab-label:focus { + background-color: rgba(187, 222, 251, 0.3); } + +.mat-ink-bar { + background-color: #2196f3; } + .mat-tab-label, .mat-tab-link { color: rgba(0, 0, 0, 0.87); } .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled { color: rgba(0, 0, 0, 0.38); } -.mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.38); } - -.mat-tab-group[class*='mat-background-'] .mat-tab-header, -.mat-tab-nav-bar[class*='mat-background-'] { - border-bottom: none; - border-top: none; } - -.mat-tab-group.mat-primary .mat-tab-label:focus, .mat-tab-group.mat-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-primary .mat-tab-link:focus { - background-color: rgba(187, 222, 251, 0.3); } - -.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar { - background-color: #2196f3; } - -.mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-accent .mat-tab-label:focus, .mat-tab-group.mat-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-accent .mat-tab-link:focus { - background-color: rgba(255, 224, 178, 0.3); } - -.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar { - background-color: #ff9800; } - -.mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar { - background-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-warn .mat-tab-label:focus, .mat-tab-group.mat-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar { - background-color: #f44336; } - -.mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-label:focus, .mat-tab-group.mat-background-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-link:focus { - background-color: rgba(187, 222, 251, 0.3); } - -.mat-tab-group.mat-background-primary .mat-tab-header, .mat-tab-group.mat-background-primary .mat-tab-links, .mat-tab-nav-bar.mat-background-primary .mat-tab-header, .mat-tab-nav-bar.mat-background-primary .mat-tab-links { - background-color: #2196f3; } - -.mat-tab-group.mat-background-primary .mat-tab-label, .mat-tab-group.mat-background-primary .mat-tab-link, .mat-tab-nav-bar.mat-background-primary .mat-tab-label, .mat-tab-nav-bar.mat-background-primary .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-label:focus, .mat-tab-group.mat-background-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-link:focus { - background-color: rgba(255, 224, 178, 0.3); } - -.mat-tab-group.mat-background-accent .mat-tab-header, .mat-tab-group.mat-background-accent .mat-tab-links, .mat-tab-nav-bar.mat-background-accent .mat-tab-header, .mat-tab-nav-bar.mat-background-accent .mat-tab-links { - background-color: #ff9800; } - -.mat-tab-group.mat-background-accent .mat-tab-label, .mat-tab-group.mat-background-accent .mat-tab-link, .mat-tab-nav-bar.mat-background-accent .mat-tab-label, .mat-tab-nav-bar.mat-background-accent .mat-tab-link { - color: rgba(255, 255, 255, 0.87); } - .mat-tab-group.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-label:focus, .mat-tab-group.mat-background-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-background-warn .mat-tab-header, .mat-tab-group.mat-background-warn .mat-tab-links, .mat-tab-nav-bar.mat-background-warn .mat-tab-header, .mat-tab-nav-bar.mat-background-warn .mat-tab-links { - background-color: #f44336; } - -.mat-tab-group.mat-background-warn .mat-tab-label, .mat-tab-group.mat-background-warn .mat-tab-link, .mat-tab-nav-bar.mat-background-warn .mat-tab-label, .mat-tab-nav-bar.mat-background-warn .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - .mat-toolbar { background: whitesmoke; color: rgba(0, 0, 0, 0.87); } @@ -1725,13 +1492,6 @@ input.mat-input-element { .mat-tooltip { background: rgba(97, 97, 97, 0.9); } -.mat-snack-bar-container { - background: #323232; - color: white; } - -.mat-simple-snackbar-action { - color: #ff9800; } - .adf-panel-heading { float: left; font-size: 14px; @@ -2204,7 +1964,7 @@ container-widget md-input-container { width: 100%; } container-widget .mat-input-placeholder-wrapper { - top: 0 !important; } + top: 5px !important; } container-widget .mat-input-placeholder { top: 1.8em !important; } @@ -2366,16 +2126,16 @@ container-widget .mat-grid-tile { .adf-md-select { padding-top: 0px; } -.adf-start-task-input-container .mat-input-wrapper { +adf-start-task .adf-start-task-input-container .mat-input-wrapper { padding-top: 8px; } -.adf-error-text-container { +adf-start-task .adf-error-text-container { position: absolute; width: 81%; height: 20px; margin-top: 30px; } -.adf-error-text { +adf-start-task .adf-error-text { padding: 1px; height: 16px; font-size: 12px; @@ -2383,29 +2143,29 @@ container-widget .mat-grid-tile { float: left; color: #f44336; } -.adf-error-icon { +adf-start-task .adf-error-icon { float: right; font-size: 17px; color: #f44336; } -.adf-label { +adf-start-task .adf-label { color: #bababa; } -.adf-invalid .mat-input-underline { +adf-start-task .adf-invalid .mat-input-underline { background-color: #f44336 !important; } -.adf-invalid .adf-file { +adf-start-task .adf-invalid .adf-file { border-color: #f44336; } -.adf-invalid .mat-input-prefix { +adf-start-task .adf-invalid .mat-input-prefix { color: #f44336; } -.adf-invalid .adf-input { +adf-start-task .adf-invalid .adf-input { border-color: #f44336; } -.adf-invalid .adf-label { +adf-start-task .adf-invalid .adf-label { color: #f44336; } - .adf-invalid .adf-label:after { + adf-start-task .adf-invalid .adf-label:after { background-color: #f44336; } :host { @@ -3431,6 +3191,7 @@ adf-file-uploading-list-row:not(:first-child) { z-index: 5; } .adf-search-result { + box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); min-width: 112px; max-width: 280px; overflow: auto; @@ -3445,8 +3206,6 @@ adf-file-uploading-list-row:not(:first-child) { border-collapse: collapse; white-space: nowrap; font-size: 14px; } - .adf-search-result:not([class*='mat-elevation-z']) { - box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } .adf-search-result a { color: rgba(0, 0, 0, 0.87); text-decoration: none; } diff --git a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-blue-purple.css b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-blue-purple.css index 86361b6287..74b4eb669a 100644 --- a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-blue-purple.css +++ b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-blue-purple.css @@ -111,7 +111,7 @@ font: 400 34px/40px Muli, Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -137,14 +137,9 @@ .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -171,66 +166,6 @@ .mat-dialog-title { font: 500 20px/32px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -245,14 +180,62 @@ .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Muli, Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Muli, Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -261,7 +244,6 @@ input.mat-input-element { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -271,7 +253,6 @@ input.mat-input-element { font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -302,62 +283,33 @@ input.mat-input-element { .mat-list-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; @@ -511,7 +463,7 @@ input.mat-input-element { font: 400 34px/40px Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -537,14 +489,9 @@ input.mat-input-element { .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -571,66 +518,6 @@ input.mat-input-element { .mat-dialog-title { font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -645,14 +532,62 @@ input.mat-input-element { .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -661,7 +596,6 @@ input.mat-input-element { font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -671,7 +605,6 @@ input.mat-input-element { font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -702,62 +635,33 @@ input.mat-input-element { .mat-list-item { font-family: Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Roboto, "Helvetica Neue", sans-serif; @@ -778,9 +682,6 @@ input.mat-input-element { .mat-ripple { overflow: hidden; } - @media screen and (-ms-high-contrast: active) { - .mat-ripple { - display: none; } } .mat-ripple.mat-ripple-unbounded { overflow: visible; } @@ -827,11 +728,11 @@ input.mat-input-element { padding-right: 32px; } .mat-option-ripple { + position: absolute; top: 0; left: 0; - right: 0; bottom: 0; - position: absolute; + right: 0; pointer-events: none; } @media screen and (-ms-high-contrast: active) { .mat-option-ripple { @@ -876,6 +777,7 @@ input.mat-input-element { overflow: hidden; padding: 0; position: absolute; + text-transform: none; width: 1px; } .cdk-overlay-container, .cdk-global-overlay-wrapper { @@ -932,11 +834,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) { background: rgba(0, 0, 0, 0.04); } - .mat-primary .mat-option.mat-selected { + .mat-option.mat-selected.mat-primary, .mat-primary .mat-option.mat-selected { color: #2196f3; } - .mat-accent .mat-option.mat-selected { + .mat-option.mat-selected.mat-accent, .mat-accent .mat-option.mat-selected { color: #3f51b5; } - .mat-warn .mat-option.mat-selected { + .mat-option.mat-selected.mat-warn, .mat-warn .mat-option.mat-selected { color: #f44336; } .mat-option.mat-selected:not(.mat-option-multiple) { background: rgba(0, 0, 0, 0.04); } @@ -957,22 +859,25 @@ input.mat-input-element { .mat-pseudo-checkbox::after { color: #fafafa; } -.mat-pseudo-checkbox-checked, -.mat-pseudo-checkbox-indeterminate, -.mat-accent .mat-pseudo-checkbox-checked, -.mat-accent .mat-pseudo-checkbox-indeterminate { - background: #3f51b5; } - +.mat-pseudo-checkbox-checked.mat-primary, +.mat-pseudo-checkbox-indeterminate.mat-primary, .mat-primary .mat-pseudo-checkbox-checked, .mat-primary .mat-pseudo-checkbox-indeterminate { background: #2196f3; } +.mat-pseudo-checkbox-checked.mat-accent, +.mat-pseudo-checkbox-indeterminate.mat-accent, +.mat-accent .mat-pseudo-checkbox-checked, +.mat-accent .mat-pseudo-checkbox-indeterminate { + background: #3f51b5; } + +.mat-pseudo-checkbox-checked.mat-warn, +.mat-pseudo-checkbox-indeterminate.mat-warn, .mat-warn .mat-pseudo-checkbox-checked, .mat-warn .mat-pseudo-checkbox-indeterminate { background: #f44336; } -.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, -.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { +.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { background: #b0b0b0; } .mat-app-background { @@ -1058,7 +963,7 @@ input.mat-input-element { .mat-button-toggle-checked { background-color: #e0e0e0; - color: rgba(0, 0, 0, 0.54); } + color: black; } .mat-button-toggle-disabled { background-color: #eeeeee; @@ -1115,38 +1020,19 @@ input.mat-input-element { .mat-chip:not(.mat-basic-chip) { background-color: #e0e0e0; color: rgba(0, 0, 0, 0.87); } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove:hover { - opacity: 0.54; } -.mat-chip.mat-chip-selected.mat-primary { - background-color: #2196f3; - color: white; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-warn { - background-color: #f44336; - color: white; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-accent { - background-color: #3f51b5; +.mat-chip.mat-chip-selected:not(.mat-basic-chip) { + background-color: #808080; color: rgba(255, 255, 255, 0.87); } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove { - color: rgba(255, 255, 255, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove:hover { - opacity: 0.54; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary { + background-color: #2196f3; + color: white; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent { + background-color: #3f51b5; + color: rgba(255, 255, 255, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn { + background-color: #f44336; + color: white; } .mat-table { background: white; } @@ -1212,73 +1098,24 @@ input.mat-input-element { .mat-expansion-panel { background: white; - color: rgba(0, 0, 0, 0.87); } + color: black; } .mat-action-row { border-top-color: rgba(0, 0, 0, 0.12); } -.mat-expansion-panel-header:not([aria-disabled='true']).cdk-keyboard-focused, .mat-expansion-panel-header:not([aria-disabled='true']).cdk-program-focused, .mat-expansion-panel-header:not([aria-disabled='true']):hover { +.mat-expansion-panel-header:focus, +.mat-expansion-panel-header:hover { background: rgba(0, 0, 0, 0.04); } .mat-expansion-panel-header-title { color: rgba(0, 0, 0, 0.87); } -.mat-expansion-panel-header-description, +.mat-expansion-panel-header-description { + color: rgba(0, 0, 0, 0.54); } + .mat-expansion-indicator::after { color: rgba(0, 0, 0, 0.54); } -.mat-expansion-panel-header[aria-disabled='true'] { - color: rgba(0, 0, 0, 0.38); } - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-title, - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-description { - color: inherit; } - -.mat-form-field { - width: 200px; } - -.mat-form-field-placeholder { - color: rgba(0, 0, 0, 0.54); } - -.mat-hint { - color: rgba(0, 0, 0, 0.54); } - -.mat-focused .mat-form-field-placeholder { - color: #2196f3; } - .mat-focused .mat-form-field-placeholder.mat-accent { - color: #3f51b5; } - .mat-focused .mat-form-field-placeholder.mat-warn { - color: #f44336; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder .mat-form-field-required-marker, -.mat-focused .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #3f51b5; } - -.mat-form-field-underline { - background-color: rgba(0, 0, 0, 0.42); } - .mat-form-field-underline.mat-disabled { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } - -.mat-form-field-ripple { - background-color: #2196f3; } - .mat-form-field-ripple.mat-accent { - background-color: #3f51b5; } - .mat-form-field-ripple.mat-warn { - background-color: #f44336; } - -.mat-form-field-invalid .mat-form-field-placeholder { - color: #f44336; } - .mat-form-field-invalid .mat-form-field-placeholder.mat-accent, - .mat-form-field-invalid .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #f44336; } - -.mat-form-field-invalid .mat-form-field-ripple { - background-color: #f44336; } - -.mat-error { - color: #f44336; } - .mat-icon.mat-primary { color: #2196f3; } @@ -1288,21 +1125,51 @@ input.mat-input-element { .mat-icon.mat-warn { color: #f44336; } +.mat-input-placeholder { + color: rgba(0, 0, 0, 0.38); } + +.mat-focused .mat-input-placeholder { + color: #2196f3; } + .mat-focused .mat-input-placeholder.mat-accent { + color: #3f51b5; } + .mat-focused .mat-input-placeholder.mat-warn { + color: #f44336; } + .mat-input-element:disabled { - color: rgba(0, 0, 0, 0.42); } + color: rgba(0, 0, 0, 0.38); } -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required, +.mat-focused .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #3f51b5; } + +.mat-input-underline { + background-color: rgba(0, 0, 0, 0.12); } + +.mat-input-ripple { + background-color: #2196f3; } + .mat-input-ripple.mat-accent { + background-color: #3f51b5; } + .mat-input-ripple.mat-warn { + background-color: #f44336; } + +.mat-input-invalid .mat-input-placeholder { + color: #f44336; } + .mat-input-invalid .mat-input-placeholder.mat-accent, + .mat-input-invalid .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #f44336; } + +.mat-input-invalid .mat-input-ripple { + background-color: #f44336; } + +.mat-input-error { + color: #f44336; } + +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { color: rgba(0, 0, 0, 0.87); } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - color: rgba(0, 0, 0, 0.87); } - -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { color: rgba(0, 0, 0, 0.54); } -.mat-list-item-disabled { - background-color: #eeeeee; } - .mat-divider { border-top-color: rgba(0, 0, 0, 0.12); } @@ -1311,12 +1178,7 @@ input.mat-input-element { .mat-nav-list .mat-list-item:hover, .mat-nav-list .mat-list-item.mat-list-item-focus { background: rgba(0, 0, 0, 0.04); } -.mat-list-option { - outline: none; } - .mat-list-option:hover, .mat-list-option.mat-list-item-focus { - background: rgba(0, 0, 0, 0.04); } - -.mat-menu-panel { +.mat-menu-content { background: white; } .mat-menu-item { @@ -1324,15 +1186,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-menu-item[disabled] { color: rgba(0, 0, 0, 0.38); } - -.mat-menu-item .mat-icon, -.mat-menu-item-submenu-trigger::after { - color: rgba(0, 0, 0, 0.54); } - -.mat-menu-item:hover:not([disabled]), -.mat-menu-item:focus:not([disabled]), -.mat-menu-item-highlighted:not([disabled]) { - background: rgba(0, 0, 0, 0.04); } + .mat-menu-item .mat-icon { + color: rgba(0, 0, 0, 0.54); + vertical-align: middle; } + .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) { + background: rgba(0, 0, 0, 0.04); } .mat-paginator { background: white; } @@ -1427,20 +1285,15 @@ input.mat-input-element { .mat-select-trigger, .mat-select-arrow { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-underline { - background-color: rgba(0, 0, 0, 0.42); } - -[aria-disabled='true'] .mat-select-underline { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } + background-color: rgba(0, 0, 0, 0.12); } .mat-select-disabled .mat-select-value, .mat-select-arrow, .mat-select-trigger { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-content, .mat-select-panel-done-animating { background: white; } @@ -1448,9 +1301,6 @@ input.mat-input-element { .mat-select-value { color: rgba(0, 0, 0, 0.87); } -.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) { - background: rgba(0, 0, 0, 0.12); } - .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-arrow { color: #2196f3; } @@ -1463,26 +1313,26 @@ input.mat-input-element { .mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-underline { background-color: #3f51b5; } -.mat-select:focus:not(.mat-select-disabled).mat-select-required .mat-select-placeholder::after { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow { color: #f44336; } -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, .mat-select-invalid .mat-select-trigger, .mat-select-invalid .mat-select-arrow { - color: #f44336; } - -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, .mat-select-invalid .mat-select-underline { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline { background-color: #f44336; } -.mat-drawer-container { +.mat-sidenav-container { background-color: #fafafa; color: rgba(0, 0, 0, 0.87); } -.mat-drawer { +.mat-sidenav { background-color: white; color: rgba(0, 0, 0, 0.87); } - .mat-drawer.mat-drawer-push { + .mat-sidenav.mat-sidenav-push { background-color: white; } -.mat-drawer-backdrop.mat-drawer-shown { +.mat-sidenav-backdrop.mat-sidenav-shown { background-color: rgba(0, 0, 0, 0.6); } .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb { @@ -1580,7 +1430,7 @@ input.mat-input-element { .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label { - background-color: rgba(0, 0, 0, 0.87); } + background-color: black; } .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb-label { @@ -1615,100 +1465,17 @@ input.mat-input-element { border-top: 1px solid rgba(0, 0, 0, 0.12); border-bottom: none; } +.mat-tab-label:focus { + background-color: rgba(187, 222, 251, 0.3); } + +.mat-ink-bar { + background-color: #2196f3; } + .mat-tab-label, .mat-tab-link { color: rgba(0, 0, 0, 0.87); } .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled { color: rgba(0, 0, 0, 0.38); } -.mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.38); } - -.mat-tab-group[class*='mat-background-'] .mat-tab-header, -.mat-tab-nav-bar[class*='mat-background-'] { - border-bottom: none; - border-top: none; } - -.mat-tab-group.mat-primary .mat-tab-label:focus, .mat-tab-group.mat-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-primary .mat-tab-link:focus { - background-color: rgba(187, 222, 251, 0.3); } - -.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar { - background-color: #2196f3; } - -.mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-accent .mat-tab-label:focus, .mat-tab-group.mat-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-accent .mat-tab-link:focus { - background-color: rgba(197, 202, 233, 0.3); } - -.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar { - background-color: #3f51b5; } - -.mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar { - background-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-warn .mat-tab-label:focus, .mat-tab-group.mat-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar { - background-color: #f44336; } - -.mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-label:focus, .mat-tab-group.mat-background-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-link:focus { - background-color: rgba(187, 222, 251, 0.3); } - -.mat-tab-group.mat-background-primary .mat-tab-header, .mat-tab-group.mat-background-primary .mat-tab-links, .mat-tab-nav-bar.mat-background-primary .mat-tab-header, .mat-tab-nav-bar.mat-background-primary .mat-tab-links { - background-color: #2196f3; } - -.mat-tab-group.mat-background-primary .mat-tab-label, .mat-tab-group.mat-background-primary .mat-tab-link, .mat-tab-nav-bar.mat-background-primary .mat-tab-label, .mat-tab-nav-bar.mat-background-primary .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-label:focus, .mat-tab-group.mat-background-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-link:focus { - background-color: rgba(197, 202, 233, 0.3); } - -.mat-tab-group.mat-background-accent .mat-tab-header, .mat-tab-group.mat-background-accent .mat-tab-links, .mat-tab-nav-bar.mat-background-accent .mat-tab-header, .mat-tab-nav-bar.mat-background-accent .mat-tab-links { - background-color: #3f51b5; } - -.mat-tab-group.mat-background-accent .mat-tab-label, .mat-tab-group.mat-background-accent .mat-tab-link, .mat-tab-nav-bar.mat-background-accent .mat-tab-label, .mat-tab-nav-bar.mat-background-accent .mat-tab-link { - color: rgba(255, 255, 255, 0.87); } - .mat-tab-group.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-label:focus, .mat-tab-group.mat-background-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-background-warn .mat-tab-header, .mat-tab-group.mat-background-warn .mat-tab-links, .mat-tab-nav-bar.mat-background-warn .mat-tab-header, .mat-tab-nav-bar.mat-background-warn .mat-tab-links { - background-color: #f44336; } - -.mat-tab-group.mat-background-warn .mat-tab-label, .mat-tab-group.mat-background-warn .mat-tab-link, .mat-tab-nav-bar.mat-background-warn .mat-tab-label, .mat-tab-nav-bar.mat-background-warn .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - .mat-toolbar { background: whitesmoke; color: rgba(0, 0, 0, 0.87); } @@ -1725,13 +1492,6 @@ input.mat-input-element { .mat-tooltip { background: rgba(97, 97, 97, 0.9); } -.mat-snack-bar-container { - background: #323232; - color: white; } - -.mat-simple-snackbar-action { - color: #3f51b5; } - .adf-panel-heading { float: left; font-size: 14px; @@ -2204,7 +1964,7 @@ container-widget md-input-container { width: 100%; } container-widget .mat-input-placeholder-wrapper { - top: 0 !important; } + top: 5px !important; } container-widget .mat-input-placeholder { top: 1.8em !important; } @@ -2366,16 +2126,16 @@ container-widget .mat-grid-tile { .adf-md-select { padding-top: 0px; } -.adf-start-task-input-container .mat-input-wrapper { +adf-start-task .adf-start-task-input-container .mat-input-wrapper { padding-top: 8px; } -.adf-error-text-container { +adf-start-task .adf-error-text-container { position: absolute; width: 81%; height: 20px; margin-top: 30px; } -.adf-error-text { +adf-start-task .adf-error-text { padding: 1px; height: 16px; font-size: 12px; @@ -2383,29 +2143,29 @@ container-widget .mat-grid-tile { float: left; color: #f44336; } -.adf-error-icon { +adf-start-task .adf-error-icon { float: right; font-size: 17px; color: #f44336; } -.adf-label { +adf-start-task .adf-label { color: #bababa; } -.adf-invalid .mat-input-underline { +adf-start-task .adf-invalid .mat-input-underline { background-color: #f44336 !important; } -.adf-invalid .adf-file { +adf-start-task .adf-invalid .adf-file { border-color: #f44336; } -.adf-invalid .mat-input-prefix { +adf-start-task .adf-invalid .mat-input-prefix { color: #f44336; } -.adf-invalid .adf-input { +adf-start-task .adf-invalid .adf-input { border-color: #f44336; } -.adf-invalid .adf-label { +adf-start-task .adf-invalid .adf-label { color: #f44336; } - .adf-invalid .adf-label:after { + adf-start-task .adf-invalid .adf-label:after { background-color: #f44336; } :host { @@ -3431,6 +3191,7 @@ adf-file-uploading-list-row:not(:first-child) { z-index: 5; } .adf-search-result { + box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); min-width: 112px; max-width: 280px; overflow: auto; @@ -3445,8 +3206,6 @@ adf-file-uploading-list-row:not(:first-child) { border-collapse: collapse; white-space: nowrap; font-size: 14px; } - .adf-search-result:not([class*='mat-elevation-z']) { - box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } .adf-search-result a { color: rgba(0, 0, 0, 0.87); text-decoration: none; } diff --git a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-cyan-orange.css b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-cyan-orange.css index 4c8acca0a4..49e8cc533d 100644 --- a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-cyan-orange.css +++ b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-cyan-orange.css @@ -111,7 +111,7 @@ font: 400 34px/40px Muli, Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -137,14 +137,9 @@ .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -171,66 +166,6 @@ .mat-dialog-title { font: 500 20px/32px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -245,14 +180,62 @@ .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Muli, Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Muli, Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -261,7 +244,6 @@ input.mat-input-element { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -271,7 +253,6 @@ input.mat-input-element { font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -302,62 +283,33 @@ input.mat-input-element { .mat-list-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; @@ -511,7 +463,7 @@ input.mat-input-element { font: 400 34px/40px Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -537,14 +489,9 @@ input.mat-input-element { .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -571,66 +518,6 @@ input.mat-input-element { .mat-dialog-title { font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -645,14 +532,62 @@ input.mat-input-element { .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -661,7 +596,6 @@ input.mat-input-element { font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -671,7 +605,6 @@ input.mat-input-element { font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -702,62 +635,33 @@ input.mat-input-element { .mat-list-item { font-family: Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Roboto, "Helvetica Neue", sans-serif; @@ -778,9 +682,6 @@ input.mat-input-element { .mat-ripple { overflow: hidden; } - @media screen and (-ms-high-contrast: active) { - .mat-ripple { - display: none; } } .mat-ripple.mat-ripple-unbounded { overflow: visible; } @@ -827,11 +728,11 @@ input.mat-input-element { padding-right: 32px; } .mat-option-ripple { + position: absolute; top: 0; left: 0; - right: 0; bottom: 0; - position: absolute; + right: 0; pointer-events: none; } @media screen and (-ms-high-contrast: active) { .mat-option-ripple { @@ -876,6 +777,7 @@ input.mat-input-element { overflow: hidden; padding: 0; position: absolute; + text-transform: none; width: 1px; } .cdk-overlay-container, .cdk-global-overlay-wrapper { @@ -932,11 +834,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) { background: rgba(0, 0, 0, 0.04); } - .mat-primary .mat-option.mat-selected { + .mat-option.mat-selected.mat-primary, .mat-primary .mat-option.mat-selected { color: #00bcd4; } - .mat-accent .mat-option.mat-selected { + .mat-option.mat-selected.mat-accent, .mat-accent .mat-option.mat-selected { color: #ff9800; } - .mat-warn .mat-option.mat-selected { + .mat-option.mat-selected.mat-warn, .mat-warn .mat-option.mat-selected { color: #f44336; } .mat-option.mat-selected:not(.mat-option-multiple) { background: rgba(0, 0, 0, 0.04); } @@ -957,22 +859,25 @@ input.mat-input-element { .mat-pseudo-checkbox::after { color: #fafafa; } -.mat-pseudo-checkbox-checked, -.mat-pseudo-checkbox-indeterminate, -.mat-accent .mat-pseudo-checkbox-checked, -.mat-accent .mat-pseudo-checkbox-indeterminate { - background: #ff9800; } - +.mat-pseudo-checkbox-checked.mat-primary, +.mat-pseudo-checkbox-indeterminate.mat-primary, .mat-primary .mat-pseudo-checkbox-checked, .mat-primary .mat-pseudo-checkbox-indeterminate { background: #00bcd4; } +.mat-pseudo-checkbox-checked.mat-accent, +.mat-pseudo-checkbox-indeterminate.mat-accent, +.mat-accent .mat-pseudo-checkbox-checked, +.mat-accent .mat-pseudo-checkbox-indeterminate { + background: #ff9800; } + +.mat-pseudo-checkbox-checked.mat-warn, +.mat-pseudo-checkbox-indeterminate.mat-warn, .mat-warn .mat-pseudo-checkbox-checked, .mat-warn .mat-pseudo-checkbox-indeterminate { background: #f44336; } -.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, -.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { +.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { background: #b0b0b0; } .mat-app-background { @@ -1058,7 +963,7 @@ input.mat-input-element { .mat-button-toggle-checked { background-color: #e0e0e0; - color: rgba(0, 0, 0, 0.54); } + color: black; } .mat-button-toggle-disabled { background-color: #eeeeee; @@ -1115,38 +1020,19 @@ input.mat-input-element { .mat-chip:not(.mat-basic-chip) { background-color: #e0e0e0; color: rgba(0, 0, 0, 0.87); } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove:hover { - opacity: 0.54; } -.mat-chip.mat-chip-selected.mat-primary { - background-color: #00bcd4; - color: white; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-warn { - background-color: #f44336; - color: white; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-accent { - background-color: #ff9800; +.mat-chip.mat-chip-selected:not(.mat-basic-chip) { + background-color: #808080; color: rgba(255, 255, 255, 0.87); } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove { - color: rgba(255, 255, 255, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove:hover { - opacity: 0.54; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary { + background-color: #00bcd4; + color: white; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent { + background-color: #ff9800; + color: rgba(255, 255, 255, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn { + background-color: #f44336; + color: white; } .mat-table { background: white; } @@ -1212,73 +1098,24 @@ input.mat-input-element { .mat-expansion-panel { background: white; - color: rgba(0, 0, 0, 0.87); } + color: black; } .mat-action-row { border-top-color: rgba(0, 0, 0, 0.12); } -.mat-expansion-panel-header:not([aria-disabled='true']).cdk-keyboard-focused, .mat-expansion-panel-header:not([aria-disabled='true']).cdk-program-focused, .mat-expansion-panel-header:not([aria-disabled='true']):hover { +.mat-expansion-panel-header:focus, +.mat-expansion-panel-header:hover { background: rgba(0, 0, 0, 0.04); } .mat-expansion-panel-header-title { color: rgba(0, 0, 0, 0.87); } -.mat-expansion-panel-header-description, +.mat-expansion-panel-header-description { + color: rgba(0, 0, 0, 0.54); } + .mat-expansion-indicator::after { color: rgba(0, 0, 0, 0.54); } -.mat-expansion-panel-header[aria-disabled='true'] { - color: rgba(0, 0, 0, 0.38); } - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-title, - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-description { - color: inherit; } - -.mat-form-field { - width: 200px; } - -.mat-form-field-placeholder { - color: rgba(0, 0, 0, 0.54); } - -.mat-hint { - color: rgba(0, 0, 0, 0.54); } - -.mat-focused .mat-form-field-placeholder { - color: #00bcd4; } - .mat-focused .mat-form-field-placeholder.mat-accent { - color: #ff9800; } - .mat-focused .mat-form-field-placeholder.mat-warn { - color: #f44336; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder .mat-form-field-required-marker, -.mat-focused .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #ff9800; } - -.mat-form-field-underline { - background-color: rgba(0, 0, 0, 0.42); } - .mat-form-field-underline.mat-disabled { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } - -.mat-form-field-ripple { - background-color: #00bcd4; } - .mat-form-field-ripple.mat-accent { - background-color: #ff9800; } - .mat-form-field-ripple.mat-warn { - background-color: #f44336; } - -.mat-form-field-invalid .mat-form-field-placeholder { - color: #f44336; } - .mat-form-field-invalid .mat-form-field-placeholder.mat-accent, - .mat-form-field-invalid .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #f44336; } - -.mat-form-field-invalid .mat-form-field-ripple { - background-color: #f44336; } - -.mat-error { - color: #f44336; } - .mat-icon.mat-primary { color: #00bcd4; } @@ -1288,21 +1125,51 @@ input.mat-input-element { .mat-icon.mat-warn { color: #f44336; } +.mat-input-placeholder { + color: rgba(0, 0, 0, 0.38); } + +.mat-focused .mat-input-placeholder { + color: #00bcd4; } + .mat-focused .mat-input-placeholder.mat-accent { + color: #ff9800; } + .mat-focused .mat-input-placeholder.mat-warn { + color: #f44336; } + .mat-input-element:disabled { - color: rgba(0, 0, 0, 0.42); } + color: rgba(0, 0, 0, 0.38); } -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required, +.mat-focused .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #ff9800; } + +.mat-input-underline { + background-color: rgba(0, 0, 0, 0.12); } + +.mat-input-ripple { + background-color: #00bcd4; } + .mat-input-ripple.mat-accent { + background-color: #ff9800; } + .mat-input-ripple.mat-warn { + background-color: #f44336; } + +.mat-input-invalid .mat-input-placeholder { + color: #f44336; } + .mat-input-invalid .mat-input-placeholder.mat-accent, + .mat-input-invalid .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #f44336; } + +.mat-input-invalid .mat-input-ripple { + background-color: #f44336; } + +.mat-input-error { + color: #f44336; } + +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { color: rgba(0, 0, 0, 0.87); } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - color: rgba(0, 0, 0, 0.87); } - -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { color: rgba(0, 0, 0, 0.54); } -.mat-list-item-disabled { - background-color: #eeeeee; } - .mat-divider { border-top-color: rgba(0, 0, 0, 0.12); } @@ -1311,12 +1178,7 @@ input.mat-input-element { .mat-nav-list .mat-list-item:hover, .mat-nav-list .mat-list-item.mat-list-item-focus { background: rgba(0, 0, 0, 0.04); } -.mat-list-option { - outline: none; } - .mat-list-option:hover, .mat-list-option.mat-list-item-focus { - background: rgba(0, 0, 0, 0.04); } - -.mat-menu-panel { +.mat-menu-content { background: white; } .mat-menu-item { @@ -1324,15 +1186,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-menu-item[disabled] { color: rgba(0, 0, 0, 0.38); } - -.mat-menu-item .mat-icon, -.mat-menu-item-submenu-trigger::after { - color: rgba(0, 0, 0, 0.54); } - -.mat-menu-item:hover:not([disabled]), -.mat-menu-item:focus:not([disabled]), -.mat-menu-item-highlighted:not([disabled]) { - background: rgba(0, 0, 0, 0.04); } + .mat-menu-item .mat-icon { + color: rgba(0, 0, 0, 0.54); + vertical-align: middle; } + .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) { + background: rgba(0, 0, 0, 0.04); } .mat-paginator { background: white; } @@ -1427,20 +1285,15 @@ input.mat-input-element { .mat-select-trigger, .mat-select-arrow { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-underline { - background-color: rgba(0, 0, 0, 0.42); } - -[aria-disabled='true'] .mat-select-underline { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } + background-color: rgba(0, 0, 0, 0.12); } .mat-select-disabled .mat-select-value, .mat-select-arrow, .mat-select-trigger { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-content, .mat-select-panel-done-animating { background: white; } @@ -1448,9 +1301,6 @@ input.mat-input-element { .mat-select-value { color: rgba(0, 0, 0, 0.87); } -.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) { - background: rgba(0, 0, 0, 0.12); } - .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-arrow { color: #00bcd4; } @@ -1463,26 +1313,26 @@ input.mat-input-element { .mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-underline { background-color: #ff9800; } -.mat-select:focus:not(.mat-select-disabled).mat-select-required .mat-select-placeholder::after { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow { color: #f44336; } -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, .mat-select-invalid .mat-select-trigger, .mat-select-invalid .mat-select-arrow { - color: #f44336; } - -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, .mat-select-invalid .mat-select-underline { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline { background-color: #f44336; } -.mat-drawer-container { +.mat-sidenav-container { background-color: #fafafa; color: rgba(0, 0, 0, 0.87); } -.mat-drawer { +.mat-sidenav { background-color: white; color: rgba(0, 0, 0, 0.87); } - .mat-drawer.mat-drawer-push { + .mat-sidenav.mat-sidenav-push { background-color: white; } -.mat-drawer-backdrop.mat-drawer-shown { +.mat-sidenav-backdrop.mat-sidenav-shown { background-color: rgba(0, 0, 0, 0.6); } .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb { @@ -1580,7 +1430,7 @@ input.mat-input-element { .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label { - background-color: rgba(0, 0, 0, 0.87); } + background-color: black; } .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb-label { @@ -1615,100 +1465,17 @@ input.mat-input-element { border-top: 1px solid rgba(0, 0, 0, 0.12); border-bottom: none; } +.mat-tab-label:focus { + background-color: rgba(178, 235, 242, 0.3); } + +.mat-ink-bar { + background-color: #00bcd4; } + .mat-tab-label, .mat-tab-link { color: rgba(0, 0, 0, 0.87); } .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled { color: rgba(0, 0, 0, 0.38); } -.mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.38); } - -.mat-tab-group[class*='mat-background-'] .mat-tab-header, -.mat-tab-nav-bar[class*='mat-background-'] { - border-bottom: none; - border-top: none; } - -.mat-tab-group.mat-primary .mat-tab-label:focus, .mat-tab-group.mat-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-primary .mat-tab-link:focus { - background-color: rgba(178, 235, 242, 0.3); } - -.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar { - background-color: #00bcd4; } - -.mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-accent .mat-tab-label:focus, .mat-tab-group.mat-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-accent .mat-tab-link:focus { - background-color: rgba(255, 224, 178, 0.3); } - -.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar { - background-color: #ff9800; } - -.mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar { - background-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-warn .mat-tab-label:focus, .mat-tab-group.mat-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar { - background-color: #f44336; } - -.mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-label:focus, .mat-tab-group.mat-background-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-link:focus { - background-color: rgba(178, 235, 242, 0.3); } - -.mat-tab-group.mat-background-primary .mat-tab-header, .mat-tab-group.mat-background-primary .mat-tab-links, .mat-tab-nav-bar.mat-background-primary .mat-tab-header, .mat-tab-nav-bar.mat-background-primary .mat-tab-links { - background-color: #00bcd4; } - -.mat-tab-group.mat-background-primary .mat-tab-label, .mat-tab-group.mat-background-primary .mat-tab-link, .mat-tab-nav-bar.mat-background-primary .mat-tab-label, .mat-tab-nav-bar.mat-background-primary .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-label:focus, .mat-tab-group.mat-background-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-link:focus { - background-color: rgba(255, 224, 178, 0.3); } - -.mat-tab-group.mat-background-accent .mat-tab-header, .mat-tab-group.mat-background-accent .mat-tab-links, .mat-tab-nav-bar.mat-background-accent .mat-tab-header, .mat-tab-nav-bar.mat-background-accent .mat-tab-links { - background-color: #ff9800; } - -.mat-tab-group.mat-background-accent .mat-tab-label, .mat-tab-group.mat-background-accent .mat-tab-link, .mat-tab-nav-bar.mat-background-accent .mat-tab-label, .mat-tab-nav-bar.mat-background-accent .mat-tab-link { - color: rgba(255, 255, 255, 0.87); } - .mat-tab-group.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-label:focus, .mat-tab-group.mat-background-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-background-warn .mat-tab-header, .mat-tab-group.mat-background-warn .mat-tab-links, .mat-tab-nav-bar.mat-background-warn .mat-tab-header, .mat-tab-nav-bar.mat-background-warn .mat-tab-links { - background-color: #f44336; } - -.mat-tab-group.mat-background-warn .mat-tab-label, .mat-tab-group.mat-background-warn .mat-tab-link, .mat-tab-nav-bar.mat-background-warn .mat-tab-label, .mat-tab-nav-bar.mat-background-warn .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - .mat-toolbar { background: whitesmoke; color: rgba(0, 0, 0, 0.87); } @@ -1725,13 +1492,6 @@ input.mat-input-element { .mat-tooltip { background: rgba(97, 97, 97, 0.9); } -.mat-snack-bar-container { - background: #323232; - color: white; } - -.mat-simple-snackbar-action { - color: #ff9800; } - .adf-panel-heading { float: left; font-size: 14px; @@ -2204,7 +1964,7 @@ container-widget md-input-container { width: 100%; } container-widget .mat-input-placeholder-wrapper { - top: 0 !important; } + top: 5px !important; } container-widget .mat-input-placeholder { top: 1.8em !important; } @@ -2366,16 +2126,16 @@ container-widget .mat-grid-tile { .adf-md-select { padding-top: 0px; } -.adf-start-task-input-container .mat-input-wrapper { +adf-start-task .adf-start-task-input-container .mat-input-wrapper { padding-top: 8px; } -.adf-error-text-container { +adf-start-task .adf-error-text-container { position: absolute; width: 81%; height: 20px; margin-top: 30px; } -.adf-error-text { +adf-start-task .adf-error-text { padding: 1px; height: 16px; font-size: 12px; @@ -2383,29 +2143,29 @@ container-widget .mat-grid-tile { float: left; color: #f44336; } -.adf-error-icon { +adf-start-task .adf-error-icon { float: right; font-size: 17px; color: #f44336; } -.adf-label { +adf-start-task .adf-label { color: #bababa; } -.adf-invalid .mat-input-underline { +adf-start-task .adf-invalid .mat-input-underline { background-color: #f44336 !important; } -.adf-invalid .adf-file { +adf-start-task .adf-invalid .adf-file { border-color: #f44336; } -.adf-invalid .mat-input-prefix { +adf-start-task .adf-invalid .mat-input-prefix { color: #f44336; } -.adf-invalid .adf-input { +adf-start-task .adf-invalid .adf-input { border-color: #f44336; } -.adf-invalid .adf-label { +adf-start-task .adf-invalid .adf-label { color: #f44336; } - .adf-invalid .adf-label:after { + adf-start-task .adf-invalid .adf-label:after { background-color: #f44336; } :host { @@ -3431,6 +3191,7 @@ adf-file-uploading-list-row:not(:first-child) { z-index: 5; } .adf-search-result { + box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); min-width: 112px; max-width: 280px; overflow: auto; @@ -3445,8 +3206,6 @@ adf-file-uploading-list-row:not(:first-child) { border-collapse: collapse; white-space: nowrap; font-size: 14px; } - .adf-search-result:not([class*='mat-elevation-z']) { - box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } .adf-search-result a { color: rgba(0, 0, 0, 0.87); text-decoration: none; } diff --git a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-cyan-purple.css b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-cyan-purple.css index ff79c4ee9c..51f3098075 100644 --- a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-cyan-purple.css +++ b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-cyan-purple.css @@ -111,7 +111,7 @@ font: 400 34px/40px Muli, Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -137,14 +137,9 @@ .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -171,66 +166,6 @@ .mat-dialog-title { font: 500 20px/32px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -245,14 +180,62 @@ .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Muli, Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Muli, Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -261,7 +244,6 @@ input.mat-input-element { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -271,7 +253,6 @@ input.mat-input-element { font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -302,62 +283,33 @@ input.mat-input-element { .mat-list-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; @@ -511,7 +463,7 @@ input.mat-input-element { font: 400 34px/40px Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -537,14 +489,9 @@ input.mat-input-element { .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -571,66 +518,6 @@ input.mat-input-element { .mat-dialog-title { font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -645,14 +532,62 @@ input.mat-input-element { .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -661,7 +596,6 @@ input.mat-input-element { font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -671,7 +605,6 @@ input.mat-input-element { font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -702,62 +635,33 @@ input.mat-input-element { .mat-list-item { font-family: Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Roboto, "Helvetica Neue", sans-serif; @@ -778,9 +682,6 @@ input.mat-input-element { .mat-ripple { overflow: hidden; } - @media screen and (-ms-high-contrast: active) { - .mat-ripple { - display: none; } } .mat-ripple.mat-ripple-unbounded { overflow: visible; } @@ -827,11 +728,11 @@ input.mat-input-element { padding-right: 32px; } .mat-option-ripple { + position: absolute; top: 0; left: 0; - right: 0; bottom: 0; - position: absolute; + right: 0; pointer-events: none; } @media screen and (-ms-high-contrast: active) { .mat-option-ripple { @@ -876,6 +777,7 @@ input.mat-input-element { overflow: hidden; padding: 0; position: absolute; + text-transform: none; width: 1px; } .cdk-overlay-container, .cdk-global-overlay-wrapper { @@ -932,11 +834,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) { background: rgba(0, 0, 0, 0.04); } - .mat-primary .mat-option.mat-selected { + .mat-option.mat-selected.mat-primary, .mat-primary .mat-option.mat-selected { color: #00bcd4; } - .mat-accent .mat-option.mat-selected { + .mat-option.mat-selected.mat-accent, .mat-accent .mat-option.mat-selected { color: #3f51b5; } - .mat-warn .mat-option.mat-selected { + .mat-option.mat-selected.mat-warn, .mat-warn .mat-option.mat-selected { color: #f44336; } .mat-option.mat-selected:not(.mat-option-multiple) { background: rgba(0, 0, 0, 0.04); } @@ -957,22 +859,25 @@ input.mat-input-element { .mat-pseudo-checkbox::after { color: #fafafa; } -.mat-pseudo-checkbox-checked, -.mat-pseudo-checkbox-indeterminate, -.mat-accent .mat-pseudo-checkbox-checked, -.mat-accent .mat-pseudo-checkbox-indeterminate { - background: #3f51b5; } - +.mat-pseudo-checkbox-checked.mat-primary, +.mat-pseudo-checkbox-indeterminate.mat-primary, .mat-primary .mat-pseudo-checkbox-checked, .mat-primary .mat-pseudo-checkbox-indeterminate { background: #00bcd4; } +.mat-pseudo-checkbox-checked.mat-accent, +.mat-pseudo-checkbox-indeterminate.mat-accent, +.mat-accent .mat-pseudo-checkbox-checked, +.mat-accent .mat-pseudo-checkbox-indeterminate { + background: #3f51b5; } + +.mat-pseudo-checkbox-checked.mat-warn, +.mat-pseudo-checkbox-indeterminate.mat-warn, .mat-warn .mat-pseudo-checkbox-checked, .mat-warn .mat-pseudo-checkbox-indeterminate { background: #f44336; } -.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, -.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { +.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { background: #b0b0b0; } .mat-app-background { @@ -1058,7 +963,7 @@ input.mat-input-element { .mat-button-toggle-checked { background-color: #e0e0e0; - color: rgba(0, 0, 0, 0.54); } + color: black; } .mat-button-toggle-disabled { background-color: #eeeeee; @@ -1115,38 +1020,19 @@ input.mat-input-element { .mat-chip:not(.mat-basic-chip) { background-color: #e0e0e0; color: rgba(0, 0, 0, 0.87); } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove:hover { - opacity: 0.54; } -.mat-chip.mat-chip-selected.mat-primary { - background-color: #00bcd4; - color: white; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-warn { - background-color: #f44336; - color: white; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-accent { - background-color: #3f51b5; +.mat-chip.mat-chip-selected:not(.mat-basic-chip) { + background-color: #808080; color: rgba(255, 255, 255, 0.87); } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove { - color: rgba(255, 255, 255, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove:hover { - opacity: 0.54; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary { + background-color: #00bcd4; + color: white; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent { + background-color: #3f51b5; + color: rgba(255, 255, 255, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn { + background-color: #f44336; + color: white; } .mat-table { background: white; } @@ -1212,73 +1098,24 @@ input.mat-input-element { .mat-expansion-panel { background: white; - color: rgba(0, 0, 0, 0.87); } + color: black; } .mat-action-row { border-top-color: rgba(0, 0, 0, 0.12); } -.mat-expansion-panel-header:not([aria-disabled='true']).cdk-keyboard-focused, .mat-expansion-panel-header:not([aria-disabled='true']).cdk-program-focused, .mat-expansion-panel-header:not([aria-disabled='true']):hover { +.mat-expansion-panel-header:focus, +.mat-expansion-panel-header:hover { background: rgba(0, 0, 0, 0.04); } .mat-expansion-panel-header-title { color: rgba(0, 0, 0, 0.87); } -.mat-expansion-panel-header-description, +.mat-expansion-panel-header-description { + color: rgba(0, 0, 0, 0.54); } + .mat-expansion-indicator::after { color: rgba(0, 0, 0, 0.54); } -.mat-expansion-panel-header[aria-disabled='true'] { - color: rgba(0, 0, 0, 0.38); } - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-title, - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-description { - color: inherit; } - -.mat-form-field { - width: 200px; } - -.mat-form-field-placeholder { - color: rgba(0, 0, 0, 0.54); } - -.mat-hint { - color: rgba(0, 0, 0, 0.54); } - -.mat-focused .mat-form-field-placeholder { - color: #00bcd4; } - .mat-focused .mat-form-field-placeholder.mat-accent { - color: #3f51b5; } - .mat-focused .mat-form-field-placeholder.mat-warn { - color: #f44336; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder .mat-form-field-required-marker, -.mat-focused .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #3f51b5; } - -.mat-form-field-underline { - background-color: rgba(0, 0, 0, 0.42); } - .mat-form-field-underline.mat-disabled { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } - -.mat-form-field-ripple { - background-color: #00bcd4; } - .mat-form-field-ripple.mat-accent { - background-color: #3f51b5; } - .mat-form-field-ripple.mat-warn { - background-color: #f44336; } - -.mat-form-field-invalid .mat-form-field-placeholder { - color: #f44336; } - .mat-form-field-invalid .mat-form-field-placeholder.mat-accent, - .mat-form-field-invalid .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #f44336; } - -.mat-form-field-invalid .mat-form-field-ripple { - background-color: #f44336; } - -.mat-error { - color: #f44336; } - .mat-icon.mat-primary { color: #00bcd4; } @@ -1288,21 +1125,51 @@ input.mat-input-element { .mat-icon.mat-warn { color: #f44336; } +.mat-input-placeholder { + color: rgba(0, 0, 0, 0.38); } + +.mat-focused .mat-input-placeholder { + color: #00bcd4; } + .mat-focused .mat-input-placeholder.mat-accent { + color: #3f51b5; } + .mat-focused .mat-input-placeholder.mat-warn { + color: #f44336; } + .mat-input-element:disabled { - color: rgba(0, 0, 0, 0.42); } + color: rgba(0, 0, 0, 0.38); } -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required, +.mat-focused .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #3f51b5; } + +.mat-input-underline { + background-color: rgba(0, 0, 0, 0.12); } + +.mat-input-ripple { + background-color: #00bcd4; } + .mat-input-ripple.mat-accent { + background-color: #3f51b5; } + .mat-input-ripple.mat-warn { + background-color: #f44336; } + +.mat-input-invalid .mat-input-placeholder { + color: #f44336; } + .mat-input-invalid .mat-input-placeholder.mat-accent, + .mat-input-invalid .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #f44336; } + +.mat-input-invalid .mat-input-ripple { + background-color: #f44336; } + +.mat-input-error { + color: #f44336; } + +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { color: rgba(0, 0, 0, 0.87); } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - color: rgba(0, 0, 0, 0.87); } - -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { color: rgba(0, 0, 0, 0.54); } -.mat-list-item-disabled { - background-color: #eeeeee; } - .mat-divider { border-top-color: rgba(0, 0, 0, 0.12); } @@ -1311,12 +1178,7 @@ input.mat-input-element { .mat-nav-list .mat-list-item:hover, .mat-nav-list .mat-list-item.mat-list-item-focus { background: rgba(0, 0, 0, 0.04); } -.mat-list-option { - outline: none; } - .mat-list-option:hover, .mat-list-option.mat-list-item-focus { - background: rgba(0, 0, 0, 0.04); } - -.mat-menu-panel { +.mat-menu-content { background: white; } .mat-menu-item { @@ -1324,15 +1186,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-menu-item[disabled] { color: rgba(0, 0, 0, 0.38); } - -.mat-menu-item .mat-icon, -.mat-menu-item-submenu-trigger::after { - color: rgba(0, 0, 0, 0.54); } - -.mat-menu-item:hover:not([disabled]), -.mat-menu-item:focus:not([disabled]), -.mat-menu-item-highlighted:not([disabled]) { - background: rgba(0, 0, 0, 0.04); } + .mat-menu-item .mat-icon { + color: rgba(0, 0, 0, 0.54); + vertical-align: middle; } + .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) { + background: rgba(0, 0, 0, 0.04); } .mat-paginator { background: white; } @@ -1427,20 +1285,15 @@ input.mat-input-element { .mat-select-trigger, .mat-select-arrow { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-underline { - background-color: rgba(0, 0, 0, 0.42); } - -[aria-disabled='true'] .mat-select-underline { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } + background-color: rgba(0, 0, 0, 0.12); } .mat-select-disabled .mat-select-value, .mat-select-arrow, .mat-select-trigger { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-content, .mat-select-panel-done-animating { background: white; } @@ -1448,9 +1301,6 @@ input.mat-input-element { .mat-select-value { color: rgba(0, 0, 0, 0.87); } -.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) { - background: rgba(0, 0, 0, 0.12); } - .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-arrow { color: #00bcd4; } @@ -1463,26 +1313,26 @@ input.mat-input-element { .mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-underline { background-color: #3f51b5; } -.mat-select:focus:not(.mat-select-disabled).mat-select-required .mat-select-placeholder::after { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow { color: #f44336; } -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, .mat-select-invalid .mat-select-trigger, .mat-select-invalid .mat-select-arrow { - color: #f44336; } - -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, .mat-select-invalid .mat-select-underline { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline { background-color: #f44336; } -.mat-drawer-container { +.mat-sidenav-container { background-color: #fafafa; color: rgba(0, 0, 0, 0.87); } -.mat-drawer { +.mat-sidenav { background-color: white; color: rgba(0, 0, 0, 0.87); } - .mat-drawer.mat-drawer-push { + .mat-sidenav.mat-sidenav-push { background-color: white; } -.mat-drawer-backdrop.mat-drawer-shown { +.mat-sidenav-backdrop.mat-sidenav-shown { background-color: rgba(0, 0, 0, 0.6); } .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb { @@ -1580,7 +1430,7 @@ input.mat-input-element { .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label { - background-color: rgba(0, 0, 0, 0.87); } + background-color: black; } .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb-label { @@ -1615,100 +1465,17 @@ input.mat-input-element { border-top: 1px solid rgba(0, 0, 0, 0.12); border-bottom: none; } +.mat-tab-label:focus { + background-color: rgba(178, 235, 242, 0.3); } + +.mat-ink-bar { + background-color: #00bcd4; } + .mat-tab-label, .mat-tab-link { color: rgba(0, 0, 0, 0.87); } .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled { color: rgba(0, 0, 0, 0.38); } -.mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.38); } - -.mat-tab-group[class*='mat-background-'] .mat-tab-header, -.mat-tab-nav-bar[class*='mat-background-'] { - border-bottom: none; - border-top: none; } - -.mat-tab-group.mat-primary .mat-tab-label:focus, .mat-tab-group.mat-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-primary .mat-tab-link:focus { - background-color: rgba(178, 235, 242, 0.3); } - -.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar { - background-color: #00bcd4; } - -.mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-accent .mat-tab-label:focus, .mat-tab-group.mat-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-accent .mat-tab-link:focus { - background-color: rgba(197, 202, 233, 0.3); } - -.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar { - background-color: #3f51b5; } - -.mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar { - background-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-warn .mat-tab-label:focus, .mat-tab-group.mat-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar { - background-color: #f44336; } - -.mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-label:focus, .mat-tab-group.mat-background-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-link:focus { - background-color: rgba(178, 235, 242, 0.3); } - -.mat-tab-group.mat-background-primary .mat-tab-header, .mat-tab-group.mat-background-primary .mat-tab-links, .mat-tab-nav-bar.mat-background-primary .mat-tab-header, .mat-tab-nav-bar.mat-background-primary .mat-tab-links { - background-color: #00bcd4; } - -.mat-tab-group.mat-background-primary .mat-tab-label, .mat-tab-group.mat-background-primary .mat-tab-link, .mat-tab-nav-bar.mat-background-primary .mat-tab-label, .mat-tab-nav-bar.mat-background-primary .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-label:focus, .mat-tab-group.mat-background-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-link:focus { - background-color: rgba(197, 202, 233, 0.3); } - -.mat-tab-group.mat-background-accent .mat-tab-header, .mat-tab-group.mat-background-accent .mat-tab-links, .mat-tab-nav-bar.mat-background-accent .mat-tab-header, .mat-tab-nav-bar.mat-background-accent .mat-tab-links { - background-color: #3f51b5; } - -.mat-tab-group.mat-background-accent .mat-tab-label, .mat-tab-group.mat-background-accent .mat-tab-link, .mat-tab-nav-bar.mat-background-accent .mat-tab-label, .mat-tab-nav-bar.mat-background-accent .mat-tab-link { - color: rgba(255, 255, 255, 0.87); } - .mat-tab-group.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-label:focus, .mat-tab-group.mat-background-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-background-warn .mat-tab-header, .mat-tab-group.mat-background-warn .mat-tab-links, .mat-tab-nav-bar.mat-background-warn .mat-tab-header, .mat-tab-nav-bar.mat-background-warn .mat-tab-links { - background-color: #f44336; } - -.mat-tab-group.mat-background-warn .mat-tab-label, .mat-tab-group.mat-background-warn .mat-tab-link, .mat-tab-nav-bar.mat-background-warn .mat-tab-label, .mat-tab-nav-bar.mat-background-warn .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - .mat-toolbar { background: whitesmoke; color: rgba(0, 0, 0, 0.87); } @@ -1725,13 +1492,6 @@ input.mat-input-element { .mat-tooltip { background: rgba(97, 97, 97, 0.9); } -.mat-snack-bar-container { - background: #323232; - color: white; } - -.mat-simple-snackbar-action { - color: #3f51b5; } - .adf-panel-heading { float: left; font-size: 14px; @@ -2204,7 +1964,7 @@ container-widget md-input-container { width: 100%; } container-widget .mat-input-placeholder-wrapper { - top: 0 !important; } + top: 5px !important; } container-widget .mat-input-placeholder { top: 1.8em !important; } @@ -2366,16 +2126,16 @@ container-widget .mat-grid-tile { .adf-md-select { padding-top: 0px; } -.adf-start-task-input-container .mat-input-wrapper { +adf-start-task .adf-start-task-input-container .mat-input-wrapper { padding-top: 8px; } -.adf-error-text-container { +adf-start-task .adf-error-text-container { position: absolute; width: 81%; height: 20px; margin-top: 30px; } -.adf-error-text { +adf-start-task .adf-error-text { padding: 1px; height: 16px; font-size: 12px; @@ -2383,29 +2143,29 @@ container-widget .mat-grid-tile { float: left; color: #f44336; } -.adf-error-icon { +adf-start-task .adf-error-icon { float: right; font-size: 17px; color: #f44336; } -.adf-label { +adf-start-task .adf-label { color: #bababa; } -.adf-invalid .mat-input-underline { +adf-start-task .adf-invalid .mat-input-underline { background-color: #f44336 !important; } -.adf-invalid .adf-file { +adf-start-task .adf-invalid .adf-file { border-color: #f44336; } -.adf-invalid .mat-input-prefix { +adf-start-task .adf-invalid .mat-input-prefix { color: #f44336; } -.adf-invalid .adf-input { +adf-start-task .adf-invalid .adf-input { border-color: #f44336; } -.adf-invalid .adf-label { +adf-start-task .adf-invalid .adf-label { color: #f44336; } - .adf-invalid .adf-label:after { + adf-start-task .adf-invalid .adf-label:after { background-color: #f44336; } :host { @@ -3431,6 +3191,7 @@ adf-file-uploading-list-row:not(:first-child) { z-index: 5; } .adf-search-result { + box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); min-width: 112px; max-width: 280px; overflow: auto; @@ -3445,8 +3206,6 @@ adf-file-uploading-list-row:not(:first-child) { border-collapse: collapse; white-space: nowrap; font-size: 14px; } - .adf-search-result:not([class*='mat-elevation-z']) { - box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } .adf-search-result a { color: rgba(0, 0, 0, 0.87); text-decoration: none; } diff --git a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-green-orange.css b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-green-orange.css index 9ab7c89dfa..2c3a7a4936 100644 --- a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-green-orange.css +++ b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-green-orange.css @@ -111,7 +111,7 @@ font: 400 34px/40px Muli, Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -137,14 +137,9 @@ .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -171,66 +166,6 @@ .mat-dialog-title { font: 500 20px/32px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -245,14 +180,62 @@ .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Muli, Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Muli, Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -261,7 +244,6 @@ input.mat-input-element { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -271,7 +253,6 @@ input.mat-input-element { font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -302,62 +283,33 @@ input.mat-input-element { .mat-list-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; @@ -511,7 +463,7 @@ input.mat-input-element { font: 400 34px/40px Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -537,14 +489,9 @@ input.mat-input-element { .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -571,66 +518,6 @@ input.mat-input-element { .mat-dialog-title { font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -645,14 +532,62 @@ input.mat-input-element { .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -661,7 +596,6 @@ input.mat-input-element { font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -671,7 +605,6 @@ input.mat-input-element { font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -702,62 +635,33 @@ input.mat-input-element { .mat-list-item { font-family: Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Roboto, "Helvetica Neue", sans-serif; @@ -778,9 +682,6 @@ input.mat-input-element { .mat-ripple { overflow: hidden; } - @media screen and (-ms-high-contrast: active) { - .mat-ripple { - display: none; } } .mat-ripple.mat-ripple-unbounded { overflow: visible; } @@ -827,11 +728,11 @@ input.mat-input-element { padding-right: 32px; } .mat-option-ripple { + position: absolute; top: 0; left: 0; - right: 0; bottom: 0; - position: absolute; + right: 0; pointer-events: none; } @media screen and (-ms-high-contrast: active) { .mat-option-ripple { @@ -876,6 +777,7 @@ input.mat-input-element { overflow: hidden; padding: 0; position: absolute; + text-transform: none; width: 1px; } .cdk-overlay-container, .cdk-global-overlay-wrapper { @@ -932,11 +834,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) { background: rgba(0, 0, 0, 0.04); } - .mat-primary .mat-option.mat-selected { + .mat-option.mat-selected.mat-primary, .mat-primary .mat-option.mat-selected { color: #8bc34a; } - .mat-accent .mat-option.mat-selected { + .mat-option.mat-selected.mat-accent, .mat-accent .mat-option.mat-selected { color: #ff9800; } - .mat-warn .mat-option.mat-selected { + .mat-option.mat-selected.mat-warn, .mat-warn .mat-option.mat-selected { color: #f44336; } .mat-option.mat-selected:not(.mat-option-multiple) { background: rgba(0, 0, 0, 0.04); } @@ -957,22 +859,25 @@ input.mat-input-element { .mat-pseudo-checkbox::after { color: #fafafa; } -.mat-pseudo-checkbox-checked, -.mat-pseudo-checkbox-indeterminate, -.mat-accent .mat-pseudo-checkbox-checked, -.mat-accent .mat-pseudo-checkbox-indeterminate { - background: #ff9800; } - +.mat-pseudo-checkbox-checked.mat-primary, +.mat-pseudo-checkbox-indeterminate.mat-primary, .mat-primary .mat-pseudo-checkbox-checked, .mat-primary .mat-pseudo-checkbox-indeterminate { background: #8bc34a; } +.mat-pseudo-checkbox-checked.mat-accent, +.mat-pseudo-checkbox-indeterminate.mat-accent, +.mat-accent .mat-pseudo-checkbox-checked, +.mat-accent .mat-pseudo-checkbox-indeterminate { + background: #ff9800; } + +.mat-pseudo-checkbox-checked.mat-warn, +.mat-pseudo-checkbox-indeterminate.mat-warn, .mat-warn .mat-pseudo-checkbox-checked, .mat-warn .mat-pseudo-checkbox-indeterminate { background: #f44336; } -.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, -.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { +.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { background: #b0b0b0; } .mat-app-background { @@ -1058,7 +963,7 @@ input.mat-input-element { .mat-button-toggle-checked { background-color: #e0e0e0; - color: rgba(0, 0, 0, 0.54); } + color: black; } .mat-button-toggle-disabled { background-color: #eeeeee; @@ -1115,38 +1020,19 @@ input.mat-input-element { .mat-chip:not(.mat-basic-chip) { background-color: #e0e0e0; color: rgba(0, 0, 0, 0.87); } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove:hover { - opacity: 0.54; } -.mat-chip.mat-chip-selected.mat-primary { - background-color: #8bc34a; - color: rgba(0, 0, 0, 0.87); } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-warn { - background-color: #f44336; - color: white; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-accent { - background-color: #ff9800; +.mat-chip.mat-chip-selected:not(.mat-basic-chip) { + background-color: #808080; color: rgba(255, 255, 255, 0.87); } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove { - color: rgba(255, 255, 255, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove:hover { - opacity: 0.54; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary { + background-color: #8bc34a; + color: rgba(0, 0, 0, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent { + background-color: #ff9800; + color: rgba(255, 255, 255, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn { + background-color: #f44336; + color: white; } .mat-table { background: white; } @@ -1212,73 +1098,24 @@ input.mat-input-element { .mat-expansion-panel { background: white; - color: rgba(0, 0, 0, 0.87); } + color: black; } .mat-action-row { border-top-color: rgba(0, 0, 0, 0.12); } -.mat-expansion-panel-header:not([aria-disabled='true']).cdk-keyboard-focused, .mat-expansion-panel-header:not([aria-disabled='true']).cdk-program-focused, .mat-expansion-panel-header:not([aria-disabled='true']):hover { +.mat-expansion-panel-header:focus, +.mat-expansion-panel-header:hover { background: rgba(0, 0, 0, 0.04); } .mat-expansion-panel-header-title { color: rgba(0, 0, 0, 0.87); } -.mat-expansion-panel-header-description, +.mat-expansion-panel-header-description { + color: rgba(0, 0, 0, 0.54); } + .mat-expansion-indicator::after { color: rgba(0, 0, 0, 0.54); } -.mat-expansion-panel-header[aria-disabled='true'] { - color: rgba(0, 0, 0, 0.38); } - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-title, - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-description { - color: inherit; } - -.mat-form-field { - width: 200px; } - -.mat-form-field-placeholder { - color: rgba(0, 0, 0, 0.54); } - -.mat-hint { - color: rgba(0, 0, 0, 0.54); } - -.mat-focused .mat-form-field-placeholder { - color: #8bc34a; } - .mat-focused .mat-form-field-placeholder.mat-accent { - color: #ff9800; } - .mat-focused .mat-form-field-placeholder.mat-warn { - color: #f44336; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder .mat-form-field-required-marker, -.mat-focused .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #ff9800; } - -.mat-form-field-underline { - background-color: rgba(0, 0, 0, 0.42); } - .mat-form-field-underline.mat-disabled { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } - -.mat-form-field-ripple { - background-color: #8bc34a; } - .mat-form-field-ripple.mat-accent { - background-color: #ff9800; } - .mat-form-field-ripple.mat-warn { - background-color: #f44336; } - -.mat-form-field-invalid .mat-form-field-placeholder { - color: #f44336; } - .mat-form-field-invalid .mat-form-field-placeholder.mat-accent, - .mat-form-field-invalid .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #f44336; } - -.mat-form-field-invalid .mat-form-field-ripple { - background-color: #f44336; } - -.mat-error { - color: #f44336; } - .mat-icon.mat-primary { color: #8bc34a; } @@ -1288,21 +1125,51 @@ input.mat-input-element { .mat-icon.mat-warn { color: #f44336; } +.mat-input-placeholder { + color: rgba(0, 0, 0, 0.38); } + +.mat-focused .mat-input-placeholder { + color: #8bc34a; } + .mat-focused .mat-input-placeholder.mat-accent { + color: #ff9800; } + .mat-focused .mat-input-placeholder.mat-warn { + color: #f44336; } + .mat-input-element:disabled { - color: rgba(0, 0, 0, 0.42); } + color: rgba(0, 0, 0, 0.38); } -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required, +.mat-focused .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #ff9800; } + +.mat-input-underline { + background-color: rgba(0, 0, 0, 0.12); } + +.mat-input-ripple { + background-color: #8bc34a; } + .mat-input-ripple.mat-accent { + background-color: #ff9800; } + .mat-input-ripple.mat-warn { + background-color: #f44336; } + +.mat-input-invalid .mat-input-placeholder { + color: #f44336; } + .mat-input-invalid .mat-input-placeholder.mat-accent, + .mat-input-invalid .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #f44336; } + +.mat-input-invalid .mat-input-ripple { + background-color: #f44336; } + +.mat-input-error { + color: #f44336; } + +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { color: rgba(0, 0, 0, 0.87); } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - color: rgba(0, 0, 0, 0.87); } - -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { color: rgba(0, 0, 0, 0.54); } -.mat-list-item-disabled { - background-color: #eeeeee; } - .mat-divider { border-top-color: rgba(0, 0, 0, 0.12); } @@ -1311,12 +1178,7 @@ input.mat-input-element { .mat-nav-list .mat-list-item:hover, .mat-nav-list .mat-list-item.mat-list-item-focus { background: rgba(0, 0, 0, 0.04); } -.mat-list-option { - outline: none; } - .mat-list-option:hover, .mat-list-option.mat-list-item-focus { - background: rgba(0, 0, 0, 0.04); } - -.mat-menu-panel { +.mat-menu-content { background: white; } .mat-menu-item { @@ -1324,15 +1186,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-menu-item[disabled] { color: rgba(0, 0, 0, 0.38); } - -.mat-menu-item .mat-icon, -.mat-menu-item-submenu-trigger::after { - color: rgba(0, 0, 0, 0.54); } - -.mat-menu-item:hover:not([disabled]), -.mat-menu-item:focus:not([disabled]), -.mat-menu-item-highlighted:not([disabled]) { - background: rgba(0, 0, 0, 0.04); } + .mat-menu-item .mat-icon { + color: rgba(0, 0, 0, 0.54); + vertical-align: middle; } + .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) { + background: rgba(0, 0, 0, 0.04); } .mat-paginator { background: white; } @@ -1427,20 +1285,15 @@ input.mat-input-element { .mat-select-trigger, .mat-select-arrow { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-underline { - background-color: rgba(0, 0, 0, 0.42); } - -[aria-disabled='true'] .mat-select-underline { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } + background-color: rgba(0, 0, 0, 0.12); } .mat-select-disabled .mat-select-value, .mat-select-arrow, .mat-select-trigger { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-content, .mat-select-panel-done-animating { background: white; } @@ -1448,9 +1301,6 @@ input.mat-input-element { .mat-select-value { color: rgba(0, 0, 0, 0.87); } -.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) { - background: rgba(0, 0, 0, 0.12); } - .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-arrow { color: #8bc34a; } @@ -1463,26 +1313,26 @@ input.mat-input-element { .mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-underline { background-color: #ff9800; } -.mat-select:focus:not(.mat-select-disabled).mat-select-required .mat-select-placeholder::after { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow { color: #f44336; } -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, .mat-select-invalid .mat-select-trigger, .mat-select-invalid .mat-select-arrow { - color: #f44336; } - -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, .mat-select-invalid .mat-select-underline { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline { background-color: #f44336; } -.mat-drawer-container { +.mat-sidenav-container { background-color: #fafafa; color: rgba(0, 0, 0, 0.87); } -.mat-drawer { +.mat-sidenav { background-color: white; color: rgba(0, 0, 0, 0.87); } - .mat-drawer.mat-drawer-push { + .mat-sidenav.mat-sidenav-push { background-color: white; } -.mat-drawer-backdrop.mat-drawer-shown { +.mat-sidenav-backdrop.mat-sidenav-shown { background-color: rgba(0, 0, 0, 0.6); } .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb { @@ -1580,7 +1430,7 @@ input.mat-input-element { .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label { - background-color: rgba(0, 0, 0, 0.87); } + background-color: black; } .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb-label { @@ -1615,100 +1465,17 @@ input.mat-input-element { border-top: 1px solid rgba(0, 0, 0, 0.12); border-bottom: none; } +.mat-tab-label:focus { + background-color: rgba(220, 237, 200, 0.3); } + +.mat-ink-bar { + background-color: #8bc34a; } + .mat-tab-label, .mat-tab-link { color: rgba(0, 0, 0, 0.87); } .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled { color: rgba(0, 0, 0, 0.38); } -.mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.38); } - -.mat-tab-group[class*='mat-background-'] .mat-tab-header, -.mat-tab-nav-bar[class*='mat-background-'] { - border-bottom: none; - border-top: none; } - -.mat-tab-group.mat-primary .mat-tab-label:focus, .mat-tab-group.mat-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-primary .mat-tab-link:focus { - background-color: rgba(220, 237, 200, 0.3); } - -.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar { - background-color: #8bc34a; } - -.mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar { - background-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-group.mat-accent .mat-tab-label:focus, .mat-tab-group.mat-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-accent .mat-tab-link:focus { - background-color: rgba(255, 224, 178, 0.3); } - -.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar { - background-color: #ff9800; } - -.mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar { - background-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-warn .mat-tab-label:focus, .mat-tab-group.mat-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar { - background-color: #f44336; } - -.mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-label:focus, .mat-tab-group.mat-background-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-link:focus { - background-color: rgba(220, 237, 200, 0.3); } - -.mat-tab-group.mat-background-primary .mat-tab-header, .mat-tab-group.mat-background-primary .mat-tab-links, .mat-tab-nav-bar.mat-background-primary .mat-tab-header, .mat-tab-nav-bar.mat-background-primary .mat-tab-links { - background-color: #8bc34a; } - -.mat-tab-group.mat-background-primary .mat-tab-label, .mat-tab-group.mat-background-primary .mat-tab-link, .mat-tab-nav-bar.mat-background-primary .mat-tab-label, .mat-tab-nav-bar.mat-background-primary .mat-tab-link { - color: rgba(0, 0, 0, 0.87); } - .mat-tab-group.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-link.mat-tab-disabled { - color: rgba(0, 0, 0, 0.4); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-label:focus, .mat-tab-group.mat-background-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-link:focus { - background-color: rgba(255, 224, 178, 0.3); } - -.mat-tab-group.mat-background-accent .mat-tab-header, .mat-tab-group.mat-background-accent .mat-tab-links, .mat-tab-nav-bar.mat-background-accent .mat-tab-header, .mat-tab-nav-bar.mat-background-accent .mat-tab-links { - background-color: #ff9800; } - -.mat-tab-group.mat-background-accent .mat-tab-label, .mat-tab-group.mat-background-accent .mat-tab-link, .mat-tab-nav-bar.mat-background-accent .mat-tab-label, .mat-tab-nav-bar.mat-background-accent .mat-tab-link { - color: rgba(255, 255, 255, 0.87); } - .mat-tab-group.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-label:focus, .mat-tab-group.mat-background-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-background-warn .mat-tab-header, .mat-tab-group.mat-background-warn .mat-tab-links, .mat-tab-nav-bar.mat-background-warn .mat-tab-header, .mat-tab-nav-bar.mat-background-warn .mat-tab-links { - background-color: #f44336; } - -.mat-tab-group.mat-background-warn .mat-tab-label, .mat-tab-group.mat-background-warn .mat-tab-link, .mat-tab-nav-bar.mat-background-warn .mat-tab-label, .mat-tab-nav-bar.mat-background-warn .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - .mat-toolbar { background: whitesmoke; color: rgba(0, 0, 0, 0.87); } @@ -1725,13 +1492,6 @@ input.mat-input-element { .mat-tooltip { background: rgba(97, 97, 97, 0.9); } -.mat-snack-bar-container { - background: #323232; - color: white; } - -.mat-simple-snackbar-action { - color: #ff9800; } - .adf-panel-heading { float: left; font-size: 14px; @@ -2204,7 +1964,7 @@ container-widget md-input-container { width: 100%; } container-widget .mat-input-placeholder-wrapper { - top: 0 !important; } + top: 5px !important; } container-widget .mat-input-placeholder { top: 1.8em !important; } @@ -2366,16 +2126,16 @@ container-widget .mat-grid-tile { .adf-md-select { padding-top: 0px; } -.adf-start-task-input-container .mat-input-wrapper { +adf-start-task .adf-start-task-input-container .mat-input-wrapper { padding-top: 8px; } -.adf-error-text-container { +adf-start-task .adf-error-text-container { position: absolute; width: 81%; height: 20px; margin-top: 30px; } -.adf-error-text { +adf-start-task .adf-error-text { padding: 1px; height: 16px; font-size: 12px; @@ -2383,29 +2143,29 @@ container-widget .mat-grid-tile { float: left; color: #f44336; } -.adf-error-icon { +adf-start-task .adf-error-icon { float: right; font-size: 17px; color: #f44336; } -.adf-label { +adf-start-task .adf-label { color: #bababa; } -.adf-invalid .mat-input-underline { +adf-start-task .adf-invalid .mat-input-underline { background-color: #f44336 !important; } -.adf-invalid .adf-file { +adf-start-task .adf-invalid .adf-file { border-color: #f44336; } -.adf-invalid .mat-input-prefix { +adf-start-task .adf-invalid .mat-input-prefix { color: #f44336; } -.adf-invalid .adf-input { +adf-start-task .adf-invalid .adf-input { border-color: #f44336; } -.adf-invalid .adf-label { +adf-start-task .adf-invalid .adf-label { color: #f44336; } - .adf-invalid .adf-label:after { + adf-start-task .adf-invalid .adf-label:after { background-color: #f44336; } :host { @@ -3431,6 +3191,7 @@ adf-file-uploading-list-row:not(:first-child) { z-index: 5; } .adf-search-result { + box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); min-width: 112px; max-width: 280px; overflow: auto; @@ -3445,8 +3206,6 @@ adf-file-uploading-list-row:not(:first-child) { border-collapse: collapse; white-space: nowrap; font-size: 14px; } - .adf-search-result:not([class*='mat-elevation-z']) { - box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } .adf-search-result a { color: rgba(0, 0, 0, 0.87); text-decoration: none; } diff --git a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-green-purple.css b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-green-purple.css index ec8b6ceba1..f8e07e0bad 100644 --- a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-green-purple.css +++ b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-green-purple.css @@ -111,7 +111,7 @@ font: 400 34px/40px Muli, Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -137,14 +137,9 @@ .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -171,66 +166,6 @@ .mat-dialog-title { font: 500 20px/32px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -245,14 +180,62 @@ .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Muli, Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Muli, Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -261,7 +244,6 @@ input.mat-input-element { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -271,7 +253,6 @@ input.mat-input-element { font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -302,62 +283,33 @@ input.mat-input-element { .mat-list-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; @@ -511,7 +463,7 @@ input.mat-input-element { font: 400 34px/40px Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -537,14 +489,9 @@ input.mat-input-element { .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -571,66 +518,6 @@ input.mat-input-element { .mat-dialog-title { font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -645,14 +532,62 @@ input.mat-input-element { .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -661,7 +596,6 @@ input.mat-input-element { font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -671,7 +605,6 @@ input.mat-input-element { font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -702,62 +635,33 @@ input.mat-input-element { .mat-list-item { font-family: Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Roboto, "Helvetica Neue", sans-serif; @@ -778,9 +682,6 @@ input.mat-input-element { .mat-ripple { overflow: hidden; } - @media screen and (-ms-high-contrast: active) { - .mat-ripple { - display: none; } } .mat-ripple.mat-ripple-unbounded { overflow: visible; } @@ -827,11 +728,11 @@ input.mat-input-element { padding-right: 32px; } .mat-option-ripple { + position: absolute; top: 0; left: 0; - right: 0; bottom: 0; - position: absolute; + right: 0; pointer-events: none; } @media screen and (-ms-high-contrast: active) { .mat-option-ripple { @@ -876,6 +777,7 @@ input.mat-input-element { overflow: hidden; padding: 0; position: absolute; + text-transform: none; width: 1px; } .cdk-overlay-container, .cdk-global-overlay-wrapper { @@ -932,11 +834,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) { background: rgba(0, 0, 0, 0.04); } - .mat-primary .mat-option.mat-selected { + .mat-option.mat-selected.mat-primary, .mat-primary .mat-option.mat-selected { color: #8bc34a; } - .mat-accent .mat-option.mat-selected { + .mat-option.mat-selected.mat-accent, .mat-accent .mat-option.mat-selected { color: #3f51b5; } - .mat-warn .mat-option.mat-selected { + .mat-option.mat-selected.mat-warn, .mat-warn .mat-option.mat-selected { color: #f44336; } .mat-option.mat-selected:not(.mat-option-multiple) { background: rgba(0, 0, 0, 0.04); } @@ -957,22 +859,25 @@ input.mat-input-element { .mat-pseudo-checkbox::after { color: #fafafa; } -.mat-pseudo-checkbox-checked, -.mat-pseudo-checkbox-indeterminate, -.mat-accent .mat-pseudo-checkbox-checked, -.mat-accent .mat-pseudo-checkbox-indeterminate { - background: #3f51b5; } - +.mat-pseudo-checkbox-checked.mat-primary, +.mat-pseudo-checkbox-indeterminate.mat-primary, .mat-primary .mat-pseudo-checkbox-checked, .mat-primary .mat-pseudo-checkbox-indeterminate { background: #8bc34a; } +.mat-pseudo-checkbox-checked.mat-accent, +.mat-pseudo-checkbox-indeterminate.mat-accent, +.mat-accent .mat-pseudo-checkbox-checked, +.mat-accent .mat-pseudo-checkbox-indeterminate { + background: #3f51b5; } + +.mat-pseudo-checkbox-checked.mat-warn, +.mat-pseudo-checkbox-indeterminate.mat-warn, .mat-warn .mat-pseudo-checkbox-checked, .mat-warn .mat-pseudo-checkbox-indeterminate { background: #f44336; } -.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, -.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { +.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { background: #b0b0b0; } .mat-app-background { @@ -1058,7 +963,7 @@ input.mat-input-element { .mat-button-toggle-checked { background-color: #e0e0e0; - color: rgba(0, 0, 0, 0.54); } + color: black; } .mat-button-toggle-disabled { background-color: #eeeeee; @@ -1115,38 +1020,19 @@ input.mat-input-element { .mat-chip:not(.mat-basic-chip) { background-color: #e0e0e0; color: rgba(0, 0, 0, 0.87); } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove:hover { - opacity: 0.54; } -.mat-chip.mat-chip-selected.mat-primary { - background-color: #8bc34a; - color: rgba(0, 0, 0, 0.87); } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-warn { - background-color: #f44336; - color: white; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-accent { - background-color: #3f51b5; +.mat-chip.mat-chip-selected:not(.mat-basic-chip) { + background-color: #808080; color: rgba(255, 255, 255, 0.87); } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove { - color: rgba(255, 255, 255, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove:hover { - opacity: 0.54; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary { + background-color: #8bc34a; + color: rgba(0, 0, 0, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent { + background-color: #3f51b5; + color: rgba(255, 255, 255, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn { + background-color: #f44336; + color: white; } .mat-table { background: white; } @@ -1212,73 +1098,24 @@ input.mat-input-element { .mat-expansion-panel { background: white; - color: rgba(0, 0, 0, 0.87); } + color: black; } .mat-action-row { border-top-color: rgba(0, 0, 0, 0.12); } -.mat-expansion-panel-header:not([aria-disabled='true']).cdk-keyboard-focused, .mat-expansion-panel-header:not([aria-disabled='true']).cdk-program-focused, .mat-expansion-panel-header:not([aria-disabled='true']):hover { +.mat-expansion-panel-header:focus, +.mat-expansion-panel-header:hover { background: rgba(0, 0, 0, 0.04); } .mat-expansion-panel-header-title { color: rgba(0, 0, 0, 0.87); } -.mat-expansion-panel-header-description, +.mat-expansion-panel-header-description { + color: rgba(0, 0, 0, 0.54); } + .mat-expansion-indicator::after { color: rgba(0, 0, 0, 0.54); } -.mat-expansion-panel-header[aria-disabled='true'] { - color: rgba(0, 0, 0, 0.38); } - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-title, - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-description { - color: inherit; } - -.mat-form-field { - width: 200px; } - -.mat-form-field-placeholder { - color: rgba(0, 0, 0, 0.54); } - -.mat-hint { - color: rgba(0, 0, 0, 0.54); } - -.mat-focused .mat-form-field-placeholder { - color: #8bc34a; } - .mat-focused .mat-form-field-placeholder.mat-accent { - color: #3f51b5; } - .mat-focused .mat-form-field-placeholder.mat-warn { - color: #f44336; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder .mat-form-field-required-marker, -.mat-focused .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #3f51b5; } - -.mat-form-field-underline { - background-color: rgba(0, 0, 0, 0.42); } - .mat-form-field-underline.mat-disabled { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } - -.mat-form-field-ripple { - background-color: #8bc34a; } - .mat-form-field-ripple.mat-accent { - background-color: #3f51b5; } - .mat-form-field-ripple.mat-warn { - background-color: #f44336; } - -.mat-form-field-invalid .mat-form-field-placeholder { - color: #f44336; } - .mat-form-field-invalid .mat-form-field-placeholder.mat-accent, - .mat-form-field-invalid .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #f44336; } - -.mat-form-field-invalid .mat-form-field-ripple { - background-color: #f44336; } - -.mat-error { - color: #f44336; } - .mat-icon.mat-primary { color: #8bc34a; } @@ -1288,21 +1125,51 @@ input.mat-input-element { .mat-icon.mat-warn { color: #f44336; } +.mat-input-placeholder { + color: rgba(0, 0, 0, 0.38); } + +.mat-focused .mat-input-placeholder { + color: #8bc34a; } + .mat-focused .mat-input-placeholder.mat-accent { + color: #3f51b5; } + .mat-focused .mat-input-placeholder.mat-warn { + color: #f44336; } + .mat-input-element:disabled { - color: rgba(0, 0, 0, 0.42); } + color: rgba(0, 0, 0, 0.38); } -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required, +.mat-focused .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #3f51b5; } + +.mat-input-underline { + background-color: rgba(0, 0, 0, 0.12); } + +.mat-input-ripple { + background-color: #8bc34a; } + .mat-input-ripple.mat-accent { + background-color: #3f51b5; } + .mat-input-ripple.mat-warn { + background-color: #f44336; } + +.mat-input-invalid .mat-input-placeholder { + color: #f44336; } + .mat-input-invalid .mat-input-placeholder.mat-accent, + .mat-input-invalid .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #f44336; } + +.mat-input-invalid .mat-input-ripple { + background-color: #f44336; } + +.mat-input-error { + color: #f44336; } + +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { color: rgba(0, 0, 0, 0.87); } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - color: rgba(0, 0, 0, 0.87); } - -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { color: rgba(0, 0, 0, 0.54); } -.mat-list-item-disabled { - background-color: #eeeeee; } - .mat-divider { border-top-color: rgba(0, 0, 0, 0.12); } @@ -1311,12 +1178,7 @@ input.mat-input-element { .mat-nav-list .mat-list-item:hover, .mat-nav-list .mat-list-item.mat-list-item-focus { background: rgba(0, 0, 0, 0.04); } -.mat-list-option { - outline: none; } - .mat-list-option:hover, .mat-list-option.mat-list-item-focus { - background: rgba(0, 0, 0, 0.04); } - -.mat-menu-panel { +.mat-menu-content { background: white; } .mat-menu-item { @@ -1324,15 +1186,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-menu-item[disabled] { color: rgba(0, 0, 0, 0.38); } - -.mat-menu-item .mat-icon, -.mat-menu-item-submenu-trigger::after { - color: rgba(0, 0, 0, 0.54); } - -.mat-menu-item:hover:not([disabled]), -.mat-menu-item:focus:not([disabled]), -.mat-menu-item-highlighted:not([disabled]) { - background: rgba(0, 0, 0, 0.04); } + .mat-menu-item .mat-icon { + color: rgba(0, 0, 0, 0.54); + vertical-align: middle; } + .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) { + background: rgba(0, 0, 0, 0.04); } .mat-paginator { background: white; } @@ -1427,20 +1285,15 @@ input.mat-input-element { .mat-select-trigger, .mat-select-arrow { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-underline { - background-color: rgba(0, 0, 0, 0.42); } - -[aria-disabled='true'] .mat-select-underline { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } + background-color: rgba(0, 0, 0, 0.12); } .mat-select-disabled .mat-select-value, .mat-select-arrow, .mat-select-trigger { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-content, .mat-select-panel-done-animating { background: white; } @@ -1448,9 +1301,6 @@ input.mat-input-element { .mat-select-value { color: rgba(0, 0, 0, 0.87); } -.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) { - background: rgba(0, 0, 0, 0.12); } - .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-arrow { color: #8bc34a; } @@ -1463,26 +1313,26 @@ input.mat-input-element { .mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-underline { background-color: #3f51b5; } -.mat-select:focus:not(.mat-select-disabled).mat-select-required .mat-select-placeholder::after { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow { color: #f44336; } -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, .mat-select-invalid .mat-select-trigger, .mat-select-invalid .mat-select-arrow { - color: #f44336; } - -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, .mat-select-invalid .mat-select-underline { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline { background-color: #f44336; } -.mat-drawer-container { +.mat-sidenav-container { background-color: #fafafa; color: rgba(0, 0, 0, 0.87); } -.mat-drawer { +.mat-sidenav { background-color: white; color: rgba(0, 0, 0, 0.87); } - .mat-drawer.mat-drawer-push { + .mat-sidenav.mat-sidenav-push { background-color: white; } -.mat-drawer-backdrop.mat-drawer-shown { +.mat-sidenav-backdrop.mat-sidenav-shown { background-color: rgba(0, 0, 0, 0.6); } .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb { @@ -1580,7 +1430,7 @@ input.mat-input-element { .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label { - background-color: rgba(0, 0, 0, 0.87); } + background-color: black; } .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb-label { @@ -1615,100 +1465,17 @@ input.mat-input-element { border-top: 1px solid rgba(0, 0, 0, 0.12); border-bottom: none; } +.mat-tab-label:focus { + background-color: rgba(220, 237, 200, 0.3); } + +.mat-ink-bar { + background-color: #8bc34a; } + .mat-tab-label, .mat-tab-link { color: rgba(0, 0, 0, 0.87); } .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled { color: rgba(0, 0, 0, 0.38); } -.mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.38); } - -.mat-tab-group[class*='mat-background-'] .mat-tab-header, -.mat-tab-nav-bar[class*='mat-background-'] { - border-bottom: none; - border-top: none; } - -.mat-tab-group.mat-primary .mat-tab-label:focus, .mat-tab-group.mat-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-primary .mat-tab-link:focus { - background-color: rgba(220, 237, 200, 0.3); } - -.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar { - background-color: #8bc34a; } - -.mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar { - background-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-group.mat-accent .mat-tab-label:focus, .mat-tab-group.mat-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-accent .mat-tab-link:focus { - background-color: rgba(197, 202, 233, 0.3); } - -.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar { - background-color: #3f51b5; } - -.mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar { - background-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-warn .mat-tab-label:focus, .mat-tab-group.mat-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar { - background-color: #f44336; } - -.mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-label:focus, .mat-tab-group.mat-background-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-link:focus { - background-color: rgba(220, 237, 200, 0.3); } - -.mat-tab-group.mat-background-primary .mat-tab-header, .mat-tab-group.mat-background-primary .mat-tab-links, .mat-tab-nav-bar.mat-background-primary .mat-tab-header, .mat-tab-nav-bar.mat-background-primary .mat-tab-links { - background-color: #8bc34a; } - -.mat-tab-group.mat-background-primary .mat-tab-label, .mat-tab-group.mat-background-primary .mat-tab-link, .mat-tab-nav-bar.mat-background-primary .mat-tab-label, .mat-tab-nav-bar.mat-background-primary .mat-tab-link { - color: rgba(0, 0, 0, 0.87); } - .mat-tab-group.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-link.mat-tab-disabled { - color: rgba(0, 0, 0, 0.4); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-label:focus, .mat-tab-group.mat-background-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-link:focus { - background-color: rgba(197, 202, 233, 0.3); } - -.mat-tab-group.mat-background-accent .mat-tab-header, .mat-tab-group.mat-background-accent .mat-tab-links, .mat-tab-nav-bar.mat-background-accent .mat-tab-header, .mat-tab-nav-bar.mat-background-accent .mat-tab-links { - background-color: #3f51b5; } - -.mat-tab-group.mat-background-accent .mat-tab-label, .mat-tab-group.mat-background-accent .mat-tab-link, .mat-tab-nav-bar.mat-background-accent .mat-tab-label, .mat-tab-nav-bar.mat-background-accent .mat-tab-link { - color: rgba(255, 255, 255, 0.87); } - .mat-tab-group.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-label:focus, .mat-tab-group.mat-background-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-background-warn .mat-tab-header, .mat-tab-group.mat-background-warn .mat-tab-links, .mat-tab-nav-bar.mat-background-warn .mat-tab-header, .mat-tab-nav-bar.mat-background-warn .mat-tab-links { - background-color: #f44336; } - -.mat-tab-group.mat-background-warn .mat-tab-label, .mat-tab-group.mat-background-warn .mat-tab-link, .mat-tab-nav-bar.mat-background-warn .mat-tab-label, .mat-tab-nav-bar.mat-background-warn .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - .mat-toolbar { background: whitesmoke; color: rgba(0, 0, 0, 0.87); } @@ -1725,13 +1492,6 @@ input.mat-input-element { .mat-tooltip { background: rgba(97, 97, 97, 0.9); } -.mat-snack-bar-container { - background: #323232; - color: white; } - -.mat-simple-snackbar-action { - color: #3f51b5; } - .adf-panel-heading { float: left; font-size: 14px; @@ -2204,7 +1964,7 @@ container-widget md-input-container { width: 100%; } container-widget .mat-input-placeholder-wrapper { - top: 0 !important; } + top: 5px !important; } container-widget .mat-input-placeholder { top: 1.8em !important; } @@ -2366,16 +2126,16 @@ container-widget .mat-grid-tile { .adf-md-select { padding-top: 0px; } -.adf-start-task-input-container .mat-input-wrapper { +adf-start-task .adf-start-task-input-container .mat-input-wrapper { padding-top: 8px; } -.adf-error-text-container { +adf-start-task .adf-error-text-container { position: absolute; width: 81%; height: 20px; margin-top: 30px; } -.adf-error-text { +adf-start-task .adf-error-text { padding: 1px; height: 16px; font-size: 12px; @@ -2383,29 +2143,29 @@ container-widget .mat-grid-tile { float: left; color: #f44336; } -.adf-error-icon { +adf-start-task .adf-error-icon { float: right; font-size: 17px; color: #f44336; } -.adf-label { +adf-start-task .adf-label { color: #bababa; } -.adf-invalid .mat-input-underline { +adf-start-task .adf-invalid .mat-input-underline { background-color: #f44336 !important; } -.adf-invalid .adf-file { +adf-start-task .adf-invalid .adf-file { border-color: #f44336; } -.adf-invalid .mat-input-prefix { +adf-start-task .adf-invalid .mat-input-prefix { color: #f44336; } -.adf-invalid .adf-input { +adf-start-task .adf-invalid .adf-input { border-color: #f44336; } -.adf-invalid .adf-label { +adf-start-task .adf-invalid .adf-label { color: #f44336; } - .adf-invalid .adf-label:after { + adf-start-task .adf-invalid .adf-label:after { background-color: #f44336; } :host { @@ -3431,6 +3191,7 @@ adf-file-uploading-list-row:not(:first-child) { z-index: 5; } .adf-search-result { + box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); min-width: 112px; max-width: 280px; overflow: auto; @@ -3445,8 +3206,6 @@ adf-file-uploading-list-row:not(:first-child) { border-collapse: collapse; white-space: nowrap; font-size: 14px; } - .adf-search-result:not([class*='mat-elevation-z']) { - box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } .adf-search-result a { color: rgba(0, 0, 0, 0.87); text-decoration: none; } diff --git a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-indigo-pink.css b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-indigo-pink.css index dfadd8a74c..ac2936e4fc 100644 --- a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-indigo-pink.css +++ b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-indigo-pink.css @@ -111,7 +111,7 @@ font: 400 34px/40px Muli, Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -137,14 +137,9 @@ .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -171,66 +166,6 @@ .mat-dialog-title { font: 500 20px/32px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -245,14 +180,62 @@ .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Muli, Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Muli, Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -261,7 +244,6 @@ input.mat-input-element { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -271,7 +253,6 @@ input.mat-input-element { font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -302,62 +283,33 @@ input.mat-input-element { .mat-list-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; @@ -511,7 +463,7 @@ input.mat-input-element { font: 400 34px/40px Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -537,14 +489,9 @@ input.mat-input-element { .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -571,66 +518,6 @@ input.mat-input-element { .mat-dialog-title { font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -645,14 +532,62 @@ input.mat-input-element { .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -661,7 +596,6 @@ input.mat-input-element { font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -671,7 +605,6 @@ input.mat-input-element { font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -702,62 +635,33 @@ input.mat-input-element { .mat-list-item { font-family: Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Roboto, "Helvetica Neue", sans-serif; @@ -778,9 +682,6 @@ input.mat-input-element { .mat-ripple { overflow: hidden; } - @media screen and (-ms-high-contrast: active) { - .mat-ripple { - display: none; } } .mat-ripple.mat-ripple-unbounded { overflow: visible; } @@ -827,11 +728,11 @@ input.mat-input-element { padding-right: 32px; } .mat-option-ripple { + position: absolute; top: 0; left: 0; - right: 0; bottom: 0; - position: absolute; + right: 0; pointer-events: none; } @media screen and (-ms-high-contrast: active) { .mat-option-ripple { @@ -876,6 +777,7 @@ input.mat-input-element { overflow: hidden; padding: 0; position: absolute; + text-transform: none; width: 1px; } .cdk-overlay-container, .cdk-global-overlay-wrapper { @@ -932,11 +834,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) { background: rgba(0, 0, 0, 0.04); } - .mat-primary .mat-option.mat-selected { + .mat-option.mat-selected.mat-primary, .mat-primary .mat-option.mat-selected { color: #3f51b5; } - .mat-accent .mat-option.mat-selected { + .mat-option.mat-selected.mat-accent, .mat-accent .mat-option.mat-selected { color: #ff4081; } - .mat-warn .mat-option.mat-selected { + .mat-option.mat-selected.mat-warn, .mat-warn .mat-option.mat-selected { color: #f44336; } .mat-option.mat-selected:not(.mat-option-multiple) { background: rgba(0, 0, 0, 0.04); } @@ -957,22 +859,25 @@ input.mat-input-element { .mat-pseudo-checkbox::after { color: #fafafa; } -.mat-pseudo-checkbox-checked, -.mat-pseudo-checkbox-indeterminate, -.mat-accent .mat-pseudo-checkbox-checked, -.mat-accent .mat-pseudo-checkbox-indeterminate { - background: #ff4081; } - +.mat-pseudo-checkbox-checked.mat-primary, +.mat-pseudo-checkbox-indeterminate.mat-primary, .mat-primary .mat-pseudo-checkbox-checked, .mat-primary .mat-pseudo-checkbox-indeterminate { background: #3f51b5; } +.mat-pseudo-checkbox-checked.mat-accent, +.mat-pseudo-checkbox-indeterminate.mat-accent, +.mat-accent .mat-pseudo-checkbox-checked, +.mat-accent .mat-pseudo-checkbox-indeterminate { + background: #ff4081; } + +.mat-pseudo-checkbox-checked.mat-warn, +.mat-pseudo-checkbox-indeterminate.mat-warn, .mat-warn .mat-pseudo-checkbox-checked, .mat-warn .mat-pseudo-checkbox-indeterminate { background: #f44336; } -.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, -.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { +.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { background: #b0b0b0; } .mat-app-background { @@ -1058,7 +963,7 @@ input.mat-input-element { .mat-button-toggle-checked { background-color: #e0e0e0; - color: rgba(0, 0, 0, 0.54); } + color: black; } .mat-button-toggle-disabled { background-color: #eeeeee; @@ -1115,38 +1020,19 @@ input.mat-input-element { .mat-chip:not(.mat-basic-chip) { background-color: #e0e0e0; color: rgba(0, 0, 0, 0.87); } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove:hover { - opacity: 0.54; } -.mat-chip.mat-chip-selected.mat-primary { - background-color: #3f51b5; +.mat-chip.mat-chip-selected:not(.mat-basic-chip) { + background-color: #808080; color: rgba(255, 255, 255, 0.87); } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove { - color: rgba(255, 255, 255, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-warn { - background-color: #f44336; - color: white; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-accent { - background-color: #ff4081; - color: white; } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove:hover { - opacity: 0.54; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary { + background-color: #3f51b5; + color: rgba(255, 255, 255, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent { + background-color: #ff4081; + color: white; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn { + background-color: #f44336; + color: white; } .mat-table { background: white; } @@ -1212,73 +1098,24 @@ input.mat-input-element { .mat-expansion-panel { background: white; - color: rgba(0, 0, 0, 0.87); } + color: black; } .mat-action-row { border-top-color: rgba(0, 0, 0, 0.12); } -.mat-expansion-panel-header:not([aria-disabled='true']).cdk-keyboard-focused, .mat-expansion-panel-header:not([aria-disabled='true']).cdk-program-focused, .mat-expansion-panel-header:not([aria-disabled='true']):hover { +.mat-expansion-panel-header:focus, +.mat-expansion-panel-header:hover { background: rgba(0, 0, 0, 0.04); } .mat-expansion-panel-header-title { color: rgba(0, 0, 0, 0.87); } -.mat-expansion-panel-header-description, +.mat-expansion-panel-header-description { + color: rgba(0, 0, 0, 0.54); } + .mat-expansion-indicator::after { color: rgba(0, 0, 0, 0.54); } -.mat-expansion-panel-header[aria-disabled='true'] { - color: rgba(0, 0, 0, 0.38); } - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-title, - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-description { - color: inherit; } - -.mat-form-field { - width: 200px; } - -.mat-form-field-placeholder { - color: rgba(0, 0, 0, 0.54); } - -.mat-hint { - color: rgba(0, 0, 0, 0.54); } - -.mat-focused .mat-form-field-placeholder { - color: #3f51b5; } - .mat-focused .mat-form-field-placeholder.mat-accent { - color: #ff4081; } - .mat-focused .mat-form-field-placeholder.mat-warn { - color: #f44336; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder .mat-form-field-required-marker, -.mat-focused .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #ff4081; } - -.mat-form-field-underline { - background-color: rgba(0, 0, 0, 0.42); } - .mat-form-field-underline.mat-disabled { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } - -.mat-form-field-ripple { - background-color: #3f51b5; } - .mat-form-field-ripple.mat-accent { - background-color: #ff4081; } - .mat-form-field-ripple.mat-warn { - background-color: #f44336; } - -.mat-form-field-invalid .mat-form-field-placeholder { - color: #f44336; } - .mat-form-field-invalid .mat-form-field-placeholder.mat-accent, - .mat-form-field-invalid .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #f44336; } - -.mat-form-field-invalid .mat-form-field-ripple { - background-color: #f44336; } - -.mat-error { - color: #f44336; } - .mat-icon.mat-primary { color: #3f51b5; } @@ -1288,21 +1125,51 @@ input.mat-input-element { .mat-icon.mat-warn { color: #f44336; } +.mat-input-placeholder { + color: rgba(0, 0, 0, 0.38); } + +.mat-focused .mat-input-placeholder { + color: #3f51b5; } + .mat-focused .mat-input-placeholder.mat-accent { + color: #ff4081; } + .mat-focused .mat-input-placeholder.mat-warn { + color: #f44336; } + .mat-input-element:disabled { - color: rgba(0, 0, 0, 0.42); } + color: rgba(0, 0, 0, 0.38); } -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required, +.mat-focused .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #ff4081; } + +.mat-input-underline { + background-color: rgba(0, 0, 0, 0.12); } + +.mat-input-ripple { + background-color: #3f51b5; } + .mat-input-ripple.mat-accent { + background-color: #ff4081; } + .mat-input-ripple.mat-warn { + background-color: #f44336; } + +.mat-input-invalid .mat-input-placeholder { + color: #f44336; } + .mat-input-invalid .mat-input-placeholder.mat-accent, + .mat-input-invalid .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #f44336; } + +.mat-input-invalid .mat-input-ripple { + background-color: #f44336; } + +.mat-input-error { + color: #f44336; } + +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { color: rgba(0, 0, 0, 0.87); } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - color: rgba(0, 0, 0, 0.87); } - -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { color: rgba(0, 0, 0, 0.54); } -.mat-list-item-disabled { - background-color: #eeeeee; } - .mat-divider { border-top-color: rgba(0, 0, 0, 0.12); } @@ -1311,12 +1178,7 @@ input.mat-input-element { .mat-nav-list .mat-list-item:hover, .mat-nav-list .mat-list-item.mat-list-item-focus { background: rgba(0, 0, 0, 0.04); } -.mat-list-option { - outline: none; } - .mat-list-option:hover, .mat-list-option.mat-list-item-focus { - background: rgba(0, 0, 0, 0.04); } - -.mat-menu-panel { +.mat-menu-content { background: white; } .mat-menu-item { @@ -1324,15 +1186,11 @@ input.mat-input-element { color: rgba(0, 0, 0, 0.87); } .mat-menu-item[disabled] { color: rgba(0, 0, 0, 0.38); } - -.mat-menu-item .mat-icon, -.mat-menu-item-submenu-trigger::after { - color: rgba(0, 0, 0, 0.54); } - -.mat-menu-item:hover:not([disabled]), -.mat-menu-item:focus:not([disabled]), -.mat-menu-item-highlighted:not([disabled]) { - background: rgba(0, 0, 0, 0.04); } + .mat-menu-item .mat-icon { + color: rgba(0, 0, 0, 0.54); + vertical-align: middle; } + .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) { + background: rgba(0, 0, 0, 0.04); } .mat-paginator { background: white; } @@ -1427,20 +1285,15 @@ input.mat-input-element { .mat-select-trigger, .mat-select-arrow { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-underline { - background-color: rgba(0, 0, 0, 0.42); } - -[aria-disabled='true'] .mat-select-underline { - background-image: linear-gradient(to right, rgba(0, 0, 0, 0.42) 0%, rgba(0, 0, 0, 0.42) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } + background-color: rgba(0, 0, 0, 0.12); } .mat-select-disabled .mat-select-value, .mat-select-arrow, .mat-select-trigger { - color: rgba(0, 0, 0, 0.54); } + color: rgba(0, 0, 0, 0.38); } .mat-select-content, .mat-select-panel-done-animating { background: white; } @@ -1448,9 +1301,6 @@ input.mat-input-element { .mat-select-value { color: rgba(0, 0, 0, 0.87); } -.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) { - background: rgba(0, 0, 0, 0.12); } - .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-arrow { color: #3f51b5; } @@ -1463,26 +1313,26 @@ input.mat-input-element { .mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-underline { background-color: #ff4081; } -.mat-select:focus:not(.mat-select-disabled).mat-select-required .mat-select-placeholder::after { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow { color: #f44336; } -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, .mat-select-invalid .mat-select-trigger, .mat-select-invalid .mat-select-arrow { - color: #f44336; } - -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, .mat-select-invalid .mat-select-underline { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline { background-color: #f44336; } -.mat-drawer-container { +.mat-sidenav-container { background-color: #fafafa; color: rgba(0, 0, 0, 0.87); } -.mat-drawer { +.mat-sidenav { background-color: white; color: rgba(0, 0, 0, 0.87); } - .mat-drawer.mat-drawer-push { + .mat-sidenav.mat-sidenav-push { background-color: white; } -.mat-drawer-backdrop.mat-drawer-shown { +.mat-sidenav-backdrop.mat-sidenav-shown { background-color: rgba(0, 0, 0, 0.6); } .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb { @@ -1580,7 +1430,7 @@ input.mat-input-element { .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing .mat-slider-thumb-label { - background-color: rgba(0, 0, 0, 0.87); } + background-color: black; } .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb, .mat-slider-min-value.mat-slider-thumb-label-showing.cdk-focused .mat-slider-thumb-label { @@ -1615,100 +1465,17 @@ input.mat-input-element { border-top: 1px solid rgba(0, 0, 0, 0.12); border-bottom: none; } +.mat-tab-label:focus { + background-color: rgba(197, 202, 233, 0.3); } + +.mat-ink-bar { + background-color: #3f51b5; } + .mat-tab-label, .mat-tab-link { color: rgba(0, 0, 0, 0.87); } .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled { color: rgba(0, 0, 0, 0.38); } -.mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.38); } - -.mat-tab-group[class*='mat-background-'] .mat-tab-header, -.mat-tab-nav-bar[class*='mat-background-'] { - border-bottom: none; - border-top: none; } - -.mat-tab-group.mat-primary .mat-tab-label:focus, .mat-tab-group.mat-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-primary .mat-tab-link:focus { - background-color: rgba(197, 202, 233, 0.3); } - -.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar { - background-color: #3f51b5; } - -.mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar { - background-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-accent .mat-tab-label:focus, .mat-tab-group.mat-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-accent .mat-tab-link:focus { - background-color: rgba(255, 128, 171, 0.3); } - -.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar { - background-color: #ff4081; } - -.mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-warn .mat-tab-label:focus, .mat-tab-group.mat-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar { - background-color: #f44336; } - -.mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-label:focus, .mat-tab-group.mat-background-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-link:focus { - background-color: rgba(197, 202, 233, 0.3); } - -.mat-tab-group.mat-background-primary .mat-tab-header, .mat-tab-group.mat-background-primary .mat-tab-links, .mat-tab-nav-bar.mat-background-primary .mat-tab-header, .mat-tab-nav-bar.mat-background-primary .mat-tab-links { - background-color: #3f51b5; } - -.mat-tab-group.mat-background-primary .mat-tab-label, .mat-tab-group.mat-background-primary .mat-tab-link, .mat-tab-nav-bar.mat-background-primary .mat-tab-label, .mat-tab-nav-bar.mat-background-primary .mat-tab-link { - color: rgba(255, 255, 255, 0.87); } - .mat-tab-group.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-label:focus, .mat-tab-group.mat-background-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-link:focus { - background-color: rgba(255, 128, 171, 0.3); } - -.mat-tab-group.mat-background-accent .mat-tab-header, .mat-tab-group.mat-background-accent .mat-tab-links, .mat-tab-nav-bar.mat-background-accent .mat-tab-header, .mat-tab-nav-bar.mat-background-accent .mat-tab-links { - background-color: #ff4081; } - -.mat-tab-group.mat-background-accent .mat-tab-label, .mat-tab-group.mat-background-accent .mat-tab-link, .mat-tab-nav-bar.mat-background-accent .mat-tab-label, .mat-tab-nav-bar.mat-background-accent .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-label:focus, .mat-tab-group.mat-background-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-background-warn .mat-tab-header, .mat-tab-group.mat-background-warn .mat-tab-links, .mat-tab-nav-bar.mat-background-warn .mat-tab-header, .mat-tab-nav-bar.mat-background-warn .mat-tab-links { - background-color: #f44336; } - -.mat-tab-group.mat-background-warn .mat-tab-label, .mat-tab-group.mat-background-warn .mat-tab-link, .mat-tab-nav-bar.mat-background-warn .mat-tab-label, .mat-tab-nav-bar.mat-background-warn .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - .mat-toolbar { background: whitesmoke; color: rgba(0, 0, 0, 0.87); } @@ -1725,13 +1492,6 @@ input.mat-input-element { .mat-tooltip { background: rgba(97, 97, 97, 0.9); } -.mat-snack-bar-container { - background: #323232; - color: white; } - -.mat-simple-snackbar-action { - color: #ff4081; } - .adf-panel-heading { float: left; font-size: 14px; @@ -2204,7 +1964,7 @@ container-widget md-input-container { width: 100%; } container-widget .mat-input-placeholder-wrapper { - top: 0 !important; } + top: 5px !important; } container-widget .mat-input-placeholder { top: 1.8em !important; } @@ -2366,16 +2126,16 @@ container-widget .mat-grid-tile { .adf-md-select { padding-top: 0px; } -.adf-start-task-input-container .mat-input-wrapper { +adf-start-task .adf-start-task-input-container .mat-input-wrapper { padding-top: 8px; } -.adf-error-text-container { +adf-start-task .adf-error-text-container { position: absolute; width: 81%; height: 20px; margin-top: 30px; } -.adf-error-text { +adf-start-task .adf-error-text { padding: 1px; height: 16px; font-size: 12px; @@ -2383,29 +2143,29 @@ container-widget .mat-grid-tile { float: left; color: #f44336; } -.adf-error-icon { +adf-start-task .adf-error-icon { float: right; font-size: 17px; color: #f44336; } -.adf-label { +adf-start-task .adf-label { color: #bababa; } -.adf-invalid .mat-input-underline { +adf-start-task .adf-invalid .mat-input-underline { background-color: #f44336 !important; } -.adf-invalid .adf-file { +adf-start-task .adf-invalid .adf-file { border-color: #f44336; } -.adf-invalid .mat-input-prefix { +adf-start-task .adf-invalid .mat-input-prefix { color: #f44336; } -.adf-invalid .adf-input { +adf-start-task .adf-invalid .adf-input { border-color: #f44336; } -.adf-invalid .adf-label { +adf-start-task .adf-invalid .adf-label { color: #f44336; } - .adf-invalid .adf-label:after { + adf-start-task .adf-invalid .adf-label:after { background-color: #f44336; } :host { @@ -3431,6 +3191,7 @@ adf-file-uploading-list-row:not(:first-child) { z-index: 5; } .adf-search-result { + box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); min-width: 112px; max-width: 280px; overflow: auto; @@ -3445,8 +3206,6 @@ adf-file-uploading-list-row:not(:first-child) { border-collapse: collapse; white-space: nowrap; font-size: 14px; } - .adf-search-result:not([class*='mat-elevation-z']) { - box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } .adf-search-result a { color: rgba(0, 0, 0, 0.87); text-decoration: none; } diff --git a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-pink-bluegrey.css b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-pink-bluegrey.css index 9941f10968..930e9c678f 100644 --- a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-pink-bluegrey.css +++ b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-pink-bluegrey.css @@ -111,7 +111,7 @@ font: 400 34px/40px Muli, Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -137,14 +137,9 @@ .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -171,66 +166,6 @@ .mat-dialog-title { font: 500 20px/32px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -245,14 +180,62 @@ .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Muli, Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Muli, Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -261,7 +244,6 @@ input.mat-input-element { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -271,7 +253,6 @@ input.mat-input-element { font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -302,62 +283,33 @@ input.mat-input-element { .mat-list-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; @@ -511,7 +463,7 @@ input.mat-input-element { font: 400 34px/40px Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -537,14 +489,9 @@ input.mat-input-element { .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -571,66 +518,6 @@ input.mat-input-element { .mat-dialog-title { font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -645,14 +532,62 @@ input.mat-input-element { .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -661,7 +596,6 @@ input.mat-input-element { font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -671,7 +605,6 @@ input.mat-input-element { font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -702,62 +635,33 @@ input.mat-input-element { .mat-list-item { font-family: Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Roboto, "Helvetica Neue", sans-serif; @@ -778,9 +682,6 @@ input.mat-input-element { .mat-ripple { overflow: hidden; } - @media screen and (-ms-high-contrast: active) { - .mat-ripple { - display: none; } } .mat-ripple.mat-ripple-unbounded { overflow: visible; } @@ -827,11 +728,11 @@ input.mat-input-element { padding-right: 32px; } .mat-option-ripple { + position: absolute; top: 0; left: 0; - right: 0; bottom: 0; - position: absolute; + right: 0; pointer-events: none; } @media screen and (-ms-high-contrast: active) { .mat-option-ripple { @@ -876,6 +777,7 @@ input.mat-input-element { overflow: hidden; padding: 0; position: absolute; + text-transform: none; width: 1px; } .cdk-overlay-container, .cdk-global-overlay-wrapper { @@ -932,11 +834,11 @@ input.mat-input-element { color: white; } .mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) { background: rgba(255, 255, 255, 0.04); } - .mat-primary .mat-option.mat-selected { + .mat-option.mat-selected.mat-primary, .mat-primary .mat-option.mat-selected { color: #c2185b; } - .mat-accent .mat-option.mat-selected { + .mat-option.mat-selected.mat-accent, .mat-accent .mat-option.mat-selected { color: #b0bec5; } - .mat-warn .mat-option.mat-selected { + .mat-option.mat-selected.mat-warn, .mat-warn .mat-option.mat-selected { color: #f44336; } .mat-option.mat-selected:not(.mat-option-multiple) { background: rgba(255, 255, 255, 0.04); } @@ -957,22 +859,25 @@ input.mat-input-element { .mat-pseudo-checkbox::after { color: #303030; } -.mat-pseudo-checkbox-checked, -.mat-pseudo-checkbox-indeterminate, -.mat-accent .mat-pseudo-checkbox-checked, -.mat-accent .mat-pseudo-checkbox-indeterminate { - background: #b0bec5; } - +.mat-pseudo-checkbox-checked.mat-primary, +.mat-pseudo-checkbox-indeterminate.mat-primary, .mat-primary .mat-pseudo-checkbox-checked, .mat-primary .mat-pseudo-checkbox-indeterminate { background: #c2185b; } +.mat-pseudo-checkbox-checked.mat-accent, +.mat-pseudo-checkbox-indeterminate.mat-accent, +.mat-accent .mat-pseudo-checkbox-checked, +.mat-accent .mat-pseudo-checkbox-indeterminate { + background: #b0bec5; } + +.mat-pseudo-checkbox-checked.mat-warn, +.mat-pseudo-checkbox-indeterminate.mat-warn, .mat-warn .mat-pseudo-checkbox-checked, .mat-warn .mat-pseudo-checkbox-indeterminate { background: #f44336; } -.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, -.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { +.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { background: #686868; } .mat-app-background { @@ -1058,7 +963,7 @@ input.mat-input-element { .mat-button-toggle-checked { background-color: #212121; - color: rgba(255, 255, 255, 0.7); } + color: white; } .mat-button-toggle-disabled { background-color: black; @@ -1113,40 +1018,21 @@ input.mat-input-element { background-color: rgba(244, 67, 54, 0.26); } .mat-chip:not(.mat-basic-chip) { - background-color: #616161; + background-color: #424242; color: white; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove:hover { - opacity: 0.54; } -.mat-chip.mat-chip-selected.mat-primary { - background-color: #c2185b; - color: rgba(255, 255, 255, 0.87); } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove { - color: rgba(255, 255, 255, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-warn { - background-color: #f44336; +.mat-chip.mat-chip-selected:not(.mat-basic-chip) { + background-color: #212121; color: white; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-accent { - background-color: #b0bec5; - color: rgba(0, 0, 0, 0.87); } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove:hover { - opacity: 0.54; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary { + background-color: #c2185b; + color: rgba(255, 255, 255, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent { + background-color: #b0bec5; + color: rgba(0, 0, 0, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn { + background-color: #f44336; + color: white; } .mat-table { background: #424242; } @@ -1217,68 +1103,19 @@ input.mat-input-element { .mat-action-row { border-top-color: rgba(255, 255, 255, 0.12); } -.mat-expansion-panel-header:not([aria-disabled='true']).cdk-keyboard-focused, .mat-expansion-panel-header:not([aria-disabled='true']).cdk-program-focused, .mat-expansion-panel-header:not([aria-disabled='true']):hover { +.mat-expansion-panel-header:focus, +.mat-expansion-panel-header:hover { background: rgba(255, 255, 255, 0.04); } .mat-expansion-panel-header-title { color: white; } -.mat-expansion-panel-header-description, +.mat-expansion-panel-header-description { + color: rgba(255, 255, 255, 0.7); } + .mat-expansion-indicator::after { color: rgba(255, 255, 255, 0.7); } -.mat-expansion-panel-header[aria-disabled='true'] { - color: rgba(255, 255, 255, 0.3); } - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-title, - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-description { - color: inherit; } - -.mat-form-field { - width: 200px; } - -.mat-form-field-placeholder { - color: rgba(255, 255, 255, 0.7); } - -.mat-hint { - color: rgba(255, 255, 255, 0.7); } - -.mat-focused .mat-form-field-placeholder { - color: #c2185b; } - .mat-focused .mat-form-field-placeholder.mat-accent { - color: #b0bec5; } - .mat-focused .mat-form-field-placeholder.mat-warn { - color: #f44336; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder .mat-form-field-required-marker, -.mat-focused .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #b0bec5; } - -.mat-form-field-underline { - background-color: rgba(255, 255, 255, 0.7); } - .mat-form-field-underline.mat-disabled { - background-image: linear-gradient(to right, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.7) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } - -.mat-form-field-ripple { - background-color: #c2185b; } - .mat-form-field-ripple.mat-accent { - background-color: #b0bec5; } - .mat-form-field-ripple.mat-warn { - background-color: #f44336; } - -.mat-form-field-invalid .mat-form-field-placeholder { - color: #f44336; } - .mat-form-field-invalid .mat-form-field-placeholder.mat-accent, - .mat-form-field-invalid .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #f44336; } - -.mat-form-field-invalid .mat-form-field-ripple { - background-color: #f44336; } - -.mat-error { - color: #f44336; } - .mat-icon.mat-primary { color: #c2185b; } @@ -1288,21 +1125,51 @@ input.mat-input-element { .mat-icon.mat-warn { color: #f44336; } +.mat-input-placeholder { + color: rgba(255, 255, 255, 0.3); } + +.mat-focused .mat-input-placeholder { + color: #c2185b; } + .mat-focused .mat-input-placeholder.mat-accent { + color: #b0bec5; } + .mat-focused .mat-input-placeholder.mat-warn { + color: #f44336; } + .mat-input-element:disabled { - color: rgba(255, 255, 255, 0.7); } + color: rgba(255, 255, 255, 0.3); } -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required, +.mat-focused .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #b0bec5; } + +.mat-input-underline { + background-color: rgba(255, 255, 255, 0.12); } + +.mat-input-ripple { + background-color: #c2185b; } + .mat-input-ripple.mat-accent { + background-color: #b0bec5; } + .mat-input-ripple.mat-warn { + background-color: #f44336; } + +.mat-input-invalid .mat-input-placeholder { + color: #f44336; } + .mat-input-invalid .mat-input-placeholder.mat-accent, + .mat-input-invalid .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #f44336; } + +.mat-input-invalid .mat-input-ripple { + background-color: #f44336; } + +.mat-input-error { + color: #f44336; } + +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { color: white; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - color: white; } - -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { color: rgba(255, 255, 255, 0.7); } -.mat-list-item-disabled { - background-color: black; } - .mat-divider { border-top-color: rgba(255, 255, 255, 0.12); } @@ -1311,12 +1178,7 @@ input.mat-input-element { .mat-nav-list .mat-list-item:hover, .mat-nav-list .mat-list-item.mat-list-item-focus { background: rgba(255, 255, 255, 0.04); } -.mat-list-option { - outline: none; } - .mat-list-option:hover, .mat-list-option.mat-list-item-focus { - background: rgba(255, 255, 255, 0.04); } - -.mat-menu-panel { +.mat-menu-content { background: #424242; } .mat-menu-item { @@ -1324,15 +1186,11 @@ input.mat-input-element { color: white; } .mat-menu-item[disabled] { color: rgba(255, 255, 255, 0.3); } - -.mat-menu-item .mat-icon, -.mat-menu-item-submenu-trigger::after { - color: white; } - -.mat-menu-item:hover:not([disabled]), -.mat-menu-item:focus:not([disabled]), -.mat-menu-item-highlighted:not([disabled]) { - background: rgba(255, 255, 255, 0.04); } + .mat-menu-item .mat-icon { + color: white; + vertical-align: middle; } + .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) { + background: rgba(255, 255, 255, 0.04); } .mat-paginator { background: #424242; } @@ -1427,20 +1285,15 @@ input.mat-input-element { .mat-select-trigger, .mat-select-arrow { - color: rgba(255, 255, 255, 0.7); } + color: rgba(255, 255, 255, 0.3); } .mat-select-underline { - background-color: rgba(255, 255, 255, 0.7); } - -[aria-disabled='true'] .mat-select-underline { - background-image: linear-gradient(to right, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.7) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } + background-color: rgba(255, 255, 255, 0.12); } .mat-select-disabled .mat-select-value, .mat-select-arrow, .mat-select-trigger { - color: rgba(255, 255, 255, 0.7); } + color: rgba(255, 255, 255, 0.3); } .mat-select-content, .mat-select-panel-done-animating { background: #424242; } @@ -1448,9 +1301,6 @@ input.mat-input-element { .mat-select-value { color: white; } -.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) { - background: rgba(255, 255, 255, 0.12); } - .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-arrow { color: #c2185b; } @@ -1463,26 +1313,26 @@ input.mat-input-element { .mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-underline { background-color: #b0bec5; } -.mat-select:focus:not(.mat-select-disabled).mat-select-required .mat-select-placeholder::after { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow { color: #f44336; } -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, .mat-select-invalid .mat-select-trigger, .mat-select-invalid .mat-select-arrow { - color: #f44336; } - -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, .mat-select-invalid .mat-select-underline { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline { background-color: #f44336; } -.mat-drawer-container { +.mat-sidenav-container { background-color: #303030; color: white; } -.mat-drawer { +.mat-sidenav { background-color: #424242; color: white; } - .mat-drawer.mat-drawer-push { + .mat-sidenav.mat-sidenav-push { background-color: #424242; } -.mat-drawer-backdrop.mat-drawer-shown { +.mat-sidenav-backdrop.mat-sidenav-shown { background-color: rgba(189, 189, 189, 0.6); } .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb { @@ -1615,100 +1465,17 @@ input.mat-input-element { border-top: 1px solid rgba(255, 255, 255, 0.12); border-bottom: none; } +.mat-tab-label:focus { + background-color: rgba(233, 30, 99, 0.3); } + +.mat-ink-bar { + background-color: #c2185b; } + .mat-tab-label, .mat-tab-link { color: white; } .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled { color: rgba(255, 255, 255, 0.3); } -.mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.3); } - -.mat-tab-group[class*='mat-background-'] .mat-tab-header, -.mat-tab-nav-bar[class*='mat-background-'] { - border-bottom: none; - border-top: none; } - -.mat-tab-group.mat-primary .mat-tab-label:focus, .mat-tab-group.mat-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-primary .mat-tab-link:focus { - background-color: rgba(233, 30, 99, 0.3); } - -.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar { - background-color: #c2185b; } - -.mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar { - background-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-accent .mat-tab-label:focus, .mat-tab-group.mat-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-accent .mat-tab-link:focus { - background-color: rgba(207, 216, 220, 0.3); } - -.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar { - background-color: #b0bec5; } - -.mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar { - background-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-group.mat-warn .mat-tab-label:focus, .mat-tab-group.mat-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar { - background-color: #f44336; } - -.mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-label:focus, .mat-tab-group.mat-background-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-link:focus { - background-color: rgba(233, 30, 99, 0.3); } - -.mat-tab-group.mat-background-primary .mat-tab-header, .mat-tab-group.mat-background-primary .mat-tab-links, .mat-tab-nav-bar.mat-background-primary .mat-tab-header, .mat-tab-nav-bar.mat-background-primary .mat-tab-links { - background-color: #c2185b; } - -.mat-tab-group.mat-background-primary .mat-tab-label, .mat-tab-group.mat-background-primary .mat-tab-link, .mat-tab-nav-bar.mat-background-primary .mat-tab-label, .mat-tab-nav-bar.mat-background-primary .mat-tab-link { - color: rgba(255, 255, 255, 0.87); } - .mat-tab-group.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-label:focus, .mat-tab-group.mat-background-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-link:focus { - background-color: rgba(207, 216, 220, 0.3); } - -.mat-tab-group.mat-background-accent .mat-tab-header, .mat-tab-group.mat-background-accent .mat-tab-links, .mat-tab-nav-bar.mat-background-accent .mat-tab-header, .mat-tab-nav-bar.mat-background-accent .mat-tab-links { - background-color: #b0bec5; } - -.mat-tab-group.mat-background-accent .mat-tab-label, .mat-tab-group.mat-background-accent .mat-tab-link, .mat-tab-nav-bar.mat-background-accent .mat-tab-label, .mat-tab-nav-bar.mat-background-accent .mat-tab-link { - color: rgba(0, 0, 0, 0.87); } - .mat-tab-group.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-link.mat-tab-disabled { - color: rgba(0, 0, 0, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-label:focus, .mat-tab-group.mat-background-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-background-warn .mat-tab-header, .mat-tab-group.mat-background-warn .mat-tab-links, .mat-tab-nav-bar.mat-background-warn .mat-tab-header, .mat-tab-nav-bar.mat-background-warn .mat-tab-links { - background-color: #f44336; } - -.mat-tab-group.mat-background-warn .mat-tab-label, .mat-tab-group.mat-background-warn .mat-tab-link, .mat-tab-nav-bar.mat-background-warn .mat-tab-label, .mat-tab-nav-bar.mat-background-warn .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - .mat-toolbar { background: #212121; color: white; } @@ -1725,13 +1492,6 @@ input.mat-input-element { .mat-tooltip { background: rgba(97, 97, 97, 0.9); } -.mat-snack-bar-container { - background: #fafafa; - color: rgba(0, 0, 0, 0.87); } - -.mat-simple-snackbar-action { - color: inherit; } - .adf-panel-heading { float: left; font-size: 14px; @@ -2204,7 +1964,7 @@ container-widget md-input-container { width: 100%; } container-widget .mat-input-placeholder-wrapper { - top: 0 !important; } + top: 5px !important; } container-widget .mat-input-placeholder { top: 1.8em !important; } @@ -2366,16 +2126,16 @@ container-widget .mat-grid-tile { .adf-md-select { padding-top: 0px; } -.adf-start-task-input-container .mat-input-wrapper { +adf-start-task .adf-start-task-input-container .mat-input-wrapper { padding-top: 8px; } -.adf-error-text-container { +adf-start-task .adf-error-text-container { position: absolute; width: 81%; height: 20px; margin-top: 30px; } -.adf-error-text { +adf-start-task .adf-error-text { padding: 1px; height: 16px; font-size: 12px; @@ -2383,29 +2143,29 @@ container-widget .mat-grid-tile { float: left; color: #f44336; } -.adf-error-icon { +adf-start-task .adf-error-icon { float: right; font-size: 17px; color: #f44336; } -.adf-label { +adf-start-task .adf-label { color: #bababa; } -.adf-invalid .mat-input-underline { +adf-start-task .adf-invalid .mat-input-underline { background-color: #f44336 !important; } -.adf-invalid .adf-file { +adf-start-task .adf-invalid .adf-file { border-color: #f44336; } -.adf-invalid .mat-input-prefix { +adf-start-task .adf-invalid .mat-input-prefix { color: #f44336; } -.adf-invalid .adf-input { +adf-start-task .adf-invalid .adf-input { border-color: #f44336; } -.adf-invalid .adf-label { +adf-start-task .adf-invalid .adf-label { color: #f44336; } - .adf-invalid .adf-label:after { + adf-start-task .adf-invalid .adf-label:after { background-color: #f44336; } :host { @@ -3431,6 +3191,7 @@ adf-file-uploading-list-row:not(:first-child) { z-index: 5; } .adf-search-result { + box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); min-width: 112px; max-width: 280px; overflow: auto; @@ -3445,8 +3206,6 @@ adf-file-uploading-list-row:not(:first-child) { border-collapse: collapse; white-space: nowrap; font-size: 14px; } - .adf-search-result:not([class*='mat-elevation-z']) { - box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } .adf-search-result a { color: white; text-decoration: none; } diff --git a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-purple-green.css b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-purple-green.css index 00a93c96b8..cb9d1eb3ff 100644 --- a/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-purple-green.css +++ b/ng2-components/ng2-alfresco-core/prebuilt-themes/adf-purple-green.css @@ -111,7 +111,7 @@ font: 400 34px/40px Muli, Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -137,14 +137,9 @@ .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -171,66 +166,6 @@ .mat-dialog-title { font: 500 20px/32px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -245,14 +180,62 @@ .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Muli, Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Muli, Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -261,7 +244,6 @@ input.mat-input-element { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -271,7 +253,6 @@ input.mat-input-element { font: 400 14px/20px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -302,62 +283,33 @@ input.mat-input-element { .mat-list-item { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Muli, Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Muli, Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Muli, Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Muli, Roboto, "Helvetica Neue", sans-serif; @@ -511,7 +463,7 @@ input.mat-input-element { font: 400 34px/40px Roboto, "Helvetica Neue", sans-serif; margin: 0 0 64px; } -.mat-button, .mat-raised-button, .mat-icon-button, .mat-fab, .mat-mini-fab { +.mat-button, .mat-raised-button, .mat-icon-button { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 14px; font-weight: 500; } @@ -537,14 +489,9 @@ input.mat-input-element { .mat-checkbox-layout .mat-checkbox-label { line-height: 24px; } -.mat-chip { +.mat-chip:not(.mat-basic-chip) { font-size: 13px; - line-height: 18px; } - .mat-chip .mat-chip-remove.mat-icon { - font-size: 18px; } - -.mat-table { - font-family: Roboto, "Helvetica Neue", sans-serif; } + line-height: 16px; } .mat-header-cell { font-size: 12px; @@ -571,66 +518,6 @@ input.mat-input-element { .mat-dialog-title { font: 500 20px/32px Roboto, "Helvetica Neue", sans-serif; } -.mat-expansion-panel-header { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 15px; - font-weight: 400; } - -.mat-expansion-panel-content { - font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } - -.mat-form-field { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: inherit; - font-weight: 400; - line-height: 1.125; } - -.mat-form-field-wrapper { - padding-bottom: 1.25em; } - -.mat-form-field-prefix .mat-icon, -.mat-form-field-suffix .mat-icon { - font-size: 150%; - line-height: 1.125; } - -.mat-form-field-prefix .mat-icon-button, -.mat-form-field-suffix .mat-icon-button { - height: 1.5em; - width: 1.5em; } - .mat-form-field-prefix .mat-icon-button .mat-icon, - .mat-form-field-suffix .mat-icon-button .mat-icon { - height: 1.125em; - line-height: 1.125; } - -.mat-form-field-infix { - padding: 0.4375em 0; - border-top: 0.84375em solid transparent; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-placeholder-wrapper { - top: -0.84375em; - padding-top: 0.84375em; } - -.mat-form-field-placeholder { - top: 1.28125em; } - .mat-form-field-placeholder.mat-form-field-float:not(.mat-form-field-empty), - .mat-focused .mat-form-field-placeholder.mat-form-field-float { - transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); - -ms-transform: translateY(-1.28125em) scale(0.75); - width: 133.33333%; } - -.mat-form-field-underline { - bottom: 1.25em; } - -.mat-form-field-subscript-wrapper { - font-size: 75%; - margin-top: 0.54167em; - top: calc(100% - 1.66667em); } - .mat-grid-tile-header, .mat-grid-tile-footer { font-size: 14px; } @@ -645,14 +532,62 @@ input.mat-input-element { .mat-grid-tile-footer .mat-line:nth-child(n+2) { font-size: 12px; } -input.mat-input-element { - margin-top: -0.0625em; } +.mat-input-container { + font: 400 inherit/1.125 Roboto, "Helvetica Neue", sans-serif; } + +.mat-input-wrapper { + padding-bottom: 1.29688em; } + +.mat-input-prefix .mat-icon, +.mat-input-prefix .mat-datepicker-toggle, +.mat-input-suffix .mat-icon, +.mat-input-suffix .mat-datepicker-toggle { + font-size: 150%; } + +.mat-input-prefix .mat-icon-button, +.mat-input-suffix .mat-icon-button { + height: 1.5em; + width: 1.5em; } + .mat-input-prefix .mat-icon-button .mat-icon, + .mat-input-suffix .mat-icon-button .mat-icon { + line-height: 1.5; } + +.mat-input-infix { + padding: 0.4375em 0; + border-top: 0.84375em solid transparent; } + +.mat-input-element:-webkit-autofill + .mat-input-placeholder-wrapper .mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-placeholder-wrapper { + top: -0.84375em; + padding-top: 0.84375em; } + +.mat-input-placeholder { + top: 1.28125em; } + .mat-input-placeholder.mat-float:not(.mat-empty), .mat-focused .mat-input-placeholder.mat-float { + transform: translateY(-1.28125em) scale(0.75) perspective(100px) translateZ(0.001px); + -ms-transform: translateY(-1.28125em) scale(0.75); + width: 133.33333%; } + +.mat-input-underline { + bottom: 1.29688em; } + +.mat-input-subscript-wrapper { + font-size: 75%; + margin-top: 0.60417em; + top: calc(100% - 1.72917em); } .mat-menu-item { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 16px; } -.mat-paginator, +.mat-paginator { + font-family: Roboto, "Helvetica Neue", sans-serif; + font-size: 12px; } + .mat-paginator-page-size .mat-select-trigger { font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; } @@ -661,7 +596,6 @@ input.mat-input-element { font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select { - padding-top: 16px; font-family: Roboto, "Helvetica Neue", sans-serif; } .mat-select-trigger { @@ -671,7 +605,6 @@ input.mat-input-element { font: 400 14px/20px Roboto, "Helvetica Neue", sans-serif; } .mat-slider-thumb-label-text { - font-family: Roboto, "Helvetica Neue", sans-serif; font-size: 12px; font-weight: 500; } @@ -702,62 +635,33 @@ input.mat-input-element { .mat-list-item { font-family: Roboto, "Helvetica Neue", sans-serif; } -.mat-list-option { - font-family: Roboto, "Helvetica Neue", sans-serif; } - -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { font-size: 16px; } - .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line, .mat-selection-list .mat-list-item .mat-line { + .mat-list .mat-list-item .mat-line, .mat-nav-list .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list .mat-list-item .mat-line:nth-child(n+2) { + .mat-list .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list .mat-list-item .mat-line:nth-child(n+2) { font-size: 14px; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - font-size: 16px; } - .mat-list .mat-list-option .mat-line, .mat-nav-list .mat-list-option .mat-line, .mat-selection-list .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list .mat-list-option .mat-line:nth-child(n+2) { - font-size: 14px; } +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { + font: 500 14px/24px Roboto, "Helvetica Neue", sans-serif; } -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 14px; - font-weight: 500; } - -.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item, .mat-selection-list[dense] .mat-list-item { +.mat-list[dense] .mat-list-item, .mat-nav-list[dense] .mat-list-item { font-size: 12px; } - .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line, .mat-selection-list[dense] .mat-list-item .mat-line { + .mat-list[dense] .mat-list-item .mat-line, .mat-nav-list[dense] .mat-list-item .mat-line { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; box-sizing: border-box; } - .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-item .mat-line:nth-child(n+2) { + .mat-list[dense] .mat-list-item .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-item .mat-line:nth-child(n+2) { font-size: 12px; } -.mat-list[dense] .mat-list-option, .mat-nav-list[dense] .mat-list-option, .mat-selection-list[dense] .mat-list-option { - font-size: 12px; } - .mat-list[dense] .mat-list-option .mat-line, .mat-nav-list[dense] .mat-list-option .mat-line, .mat-selection-list[dense] .mat-list-option .mat-line { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - display: block; - box-sizing: border-box; } - .mat-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-nav-list[dense] .mat-list-option .mat-line:nth-child(n+2), .mat-selection-list[dense] .mat-list-option .mat-line:nth-child(n+2) { - font-size: 12px; } - -.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader, .mat-selection-list[dense] .mat-subheader { - font-family: Roboto, "Helvetica Neue", sans-serif; - font-size: 12px; - font-weight: 500; } +.mat-list[dense] .mat-subheader, .mat-nav-list[dense] .mat-subheader { + font: 500 12px Roboto, "Helvetica Neue", sans-serif; } .mat-option { font-family: Roboto, "Helvetica Neue", sans-serif; @@ -778,9 +682,6 @@ input.mat-input-element { .mat-ripple { overflow: hidden; } - @media screen and (-ms-high-contrast: active) { - .mat-ripple { - display: none; } } .mat-ripple.mat-ripple-unbounded { overflow: visible; } @@ -827,11 +728,11 @@ input.mat-input-element { padding-right: 32px; } .mat-option-ripple { + position: absolute; top: 0; left: 0; - right: 0; bottom: 0; - position: absolute; + right: 0; pointer-events: none; } @media screen and (-ms-high-contrast: active) { .mat-option-ripple { @@ -876,6 +777,7 @@ input.mat-input-element { overflow: hidden; padding: 0; position: absolute; + text-transform: none; width: 1px; } .cdk-overlay-container, .cdk-global-overlay-wrapper { @@ -932,11 +834,11 @@ input.mat-input-element { color: white; } .mat-option:hover:not(.mat-option-disabled), .mat-option:focus:not(.mat-option-disabled) { background: rgba(255, 255, 255, 0.04); } - .mat-primary .mat-option.mat-selected { + .mat-option.mat-selected.mat-primary, .mat-primary .mat-option.mat-selected { color: #7b1fa2; } - .mat-accent .mat-option.mat-selected { + .mat-option.mat-selected.mat-accent, .mat-accent .mat-option.mat-selected { color: #69f0ae; } - .mat-warn .mat-option.mat-selected { + .mat-option.mat-selected.mat-warn, .mat-warn .mat-option.mat-selected { color: #f44336; } .mat-option.mat-selected:not(.mat-option-multiple) { background: rgba(255, 255, 255, 0.04); } @@ -957,22 +859,25 @@ input.mat-input-element { .mat-pseudo-checkbox::after { color: #303030; } -.mat-pseudo-checkbox-checked, -.mat-pseudo-checkbox-indeterminate, -.mat-accent .mat-pseudo-checkbox-checked, -.mat-accent .mat-pseudo-checkbox-indeterminate { - background: #69f0ae; } - +.mat-pseudo-checkbox-checked.mat-primary, +.mat-pseudo-checkbox-indeterminate.mat-primary, .mat-primary .mat-pseudo-checkbox-checked, .mat-primary .mat-pseudo-checkbox-indeterminate { background: #7b1fa2; } +.mat-pseudo-checkbox-checked.mat-accent, +.mat-pseudo-checkbox-indeterminate.mat-accent, +.mat-accent .mat-pseudo-checkbox-checked, +.mat-accent .mat-pseudo-checkbox-indeterminate { + background: #69f0ae; } + +.mat-pseudo-checkbox-checked.mat-warn, +.mat-pseudo-checkbox-indeterminate.mat-warn, .mat-warn .mat-pseudo-checkbox-checked, .mat-warn .mat-pseudo-checkbox-indeterminate { background: #f44336; } -.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, -.mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { +.mat-pseudo-checkbox-checked.mat-pseudo-checkbox-disabled, .mat-pseudo-checkbox-indeterminate.mat-pseudo-checkbox-disabled { background: #686868; } .mat-app-background { @@ -1058,7 +963,7 @@ input.mat-input-element { .mat-button-toggle-checked { background-color: #212121; - color: rgba(255, 255, 255, 0.7); } + color: white; } .mat-button-toggle-disabled { background-color: black; @@ -1113,40 +1018,21 @@ input.mat-input-element { background-color: rgba(244, 67, 54, 0.26); } .mat-chip:not(.mat-basic-chip) { - background-color: #616161; + background-color: #424242; color: white; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip:not(.mat-basic-chip) .mat-chip-remove:hover { - opacity: 0.54; } -.mat-chip.mat-chip-selected.mat-primary { - background-color: #7b1fa2; - color: rgba(255, 255, 255, 0.87); } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove { - color: rgba(255, 255, 255, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-primary .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-warn { - background-color: #f44336; +.mat-chip.mat-chip-selected:not(.mat-basic-chip) { + background-color: #212121; color: white; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove { - color: white; - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-warn .mat-chip-remove:hover { - opacity: 0.54; } - -.mat-chip.mat-chip-selected.mat-accent { - background-color: #69f0ae; - color: rgba(0, 0, 0, 0.87); } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove { - color: rgba(0, 0, 0, 0.87); - opacity: 0.4; } - .mat-chip.mat-chip-selected.mat-accent .mat-chip-remove:hover { - opacity: 0.54; } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-primary { + background-color: #7b1fa2; + color: rgba(255, 255, 255, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-accent { + background-color: #69f0ae; + color: rgba(0, 0, 0, 0.87); } + .mat-chip.mat-chip-selected:not(.mat-basic-chip).mat-warn { + background-color: #f44336; + color: white; } .mat-table { background: #424242; } @@ -1217,68 +1103,19 @@ input.mat-input-element { .mat-action-row { border-top-color: rgba(255, 255, 255, 0.12); } -.mat-expansion-panel-header:not([aria-disabled='true']).cdk-keyboard-focused, .mat-expansion-panel-header:not([aria-disabled='true']).cdk-program-focused, .mat-expansion-panel-header:not([aria-disabled='true']):hover { +.mat-expansion-panel-header:focus, +.mat-expansion-panel-header:hover { background: rgba(255, 255, 255, 0.04); } .mat-expansion-panel-header-title { color: white; } -.mat-expansion-panel-header-description, +.mat-expansion-panel-header-description { + color: rgba(255, 255, 255, 0.7); } + .mat-expansion-indicator::after { color: rgba(255, 255, 255, 0.7); } -.mat-expansion-panel-header[aria-disabled='true'] { - color: rgba(255, 255, 255, 0.3); } - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-title, - .mat-expansion-panel-header[aria-disabled='true'] .mat-expansion-panel-header-description { - color: inherit; } - -.mat-form-field { - width: 200px; } - -.mat-form-field-placeholder { - color: rgba(255, 255, 255, 0.7); } - -.mat-hint { - color: rgba(255, 255, 255, 0.7); } - -.mat-focused .mat-form-field-placeholder { - color: #7b1fa2; } - .mat-focused .mat-form-field-placeholder.mat-accent { - color: #69f0ae; } - .mat-focused .mat-form-field-placeholder.mat-warn { - color: #f44336; } - -.mat-form-field-autofill-float:-webkit-autofill + .mat-form-field-placeholder .mat-form-field-required-marker, -.mat-focused .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #69f0ae; } - -.mat-form-field-underline { - background-color: rgba(255, 255, 255, 0.7); } - .mat-form-field-underline.mat-disabled { - background-image: linear-gradient(to right, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.7) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } - -.mat-form-field-ripple { - background-color: #7b1fa2; } - .mat-form-field-ripple.mat-accent { - background-color: #69f0ae; } - .mat-form-field-ripple.mat-warn { - background-color: #f44336; } - -.mat-form-field-invalid .mat-form-field-placeholder { - color: #f44336; } - .mat-form-field-invalid .mat-form-field-placeholder.mat-accent, - .mat-form-field-invalid .mat-form-field-placeholder.mat-form-field-float .mat-form-field-required-marker { - color: #f44336; } - -.mat-form-field-invalid .mat-form-field-ripple { - background-color: #f44336; } - -.mat-error { - color: #f44336; } - .mat-icon.mat-primary { color: #7b1fa2; } @@ -1288,21 +1125,51 @@ input.mat-input-element { .mat-icon.mat-warn { color: #f44336; } +.mat-input-placeholder { + color: rgba(255, 255, 255, 0.3); } + +.mat-focused .mat-input-placeholder { + color: #7b1fa2; } + .mat-focused .mat-input-placeholder.mat-accent { + color: #69f0ae; } + .mat-focused .mat-input-placeholder.mat-warn { + color: #f44336; } + .mat-input-element:disabled { - color: rgba(255, 255, 255, 0.7); } + color: rgba(255, 255, 255, 0.3); } -.mat-list .mat-list-item, .mat-nav-list .mat-list-item, .mat-selection-list .mat-list-item { +input.mat-input-element:-webkit-autofill + .mat-input-placeholder .mat-placeholder-required, +.mat-focused .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #69f0ae; } + +.mat-input-underline { + background-color: rgba(255, 255, 255, 0.12); } + +.mat-input-ripple { + background-color: #7b1fa2; } + .mat-input-ripple.mat-accent { + background-color: #69f0ae; } + .mat-input-ripple.mat-warn { + background-color: #f44336; } + +.mat-input-invalid .mat-input-placeholder { + color: #f44336; } + .mat-input-invalid .mat-input-placeholder.mat-accent, + .mat-input-invalid .mat-input-placeholder.mat-float .mat-placeholder-required { + color: #f44336; } + +.mat-input-invalid .mat-input-ripple { + background-color: #f44336; } + +.mat-input-error { + color: #f44336; } + +.mat-list .mat-list-item, .mat-nav-list .mat-list-item { color: white; } -.mat-list .mat-list-option, .mat-nav-list .mat-list-option, .mat-selection-list .mat-list-option { - color: white; } - -.mat-list .mat-subheader, .mat-nav-list .mat-subheader, .mat-selection-list .mat-subheader { +.mat-list .mat-subheader, .mat-nav-list .mat-subheader { color: rgba(255, 255, 255, 0.7); } -.mat-list-item-disabled { - background-color: black; } - .mat-divider { border-top-color: rgba(255, 255, 255, 0.12); } @@ -1311,12 +1178,7 @@ input.mat-input-element { .mat-nav-list .mat-list-item:hover, .mat-nav-list .mat-list-item.mat-list-item-focus { background: rgba(255, 255, 255, 0.04); } -.mat-list-option { - outline: none; } - .mat-list-option:hover, .mat-list-option.mat-list-item-focus { - background: rgba(255, 255, 255, 0.04); } - -.mat-menu-panel { +.mat-menu-content { background: #424242; } .mat-menu-item { @@ -1324,15 +1186,11 @@ input.mat-input-element { color: white; } .mat-menu-item[disabled] { color: rgba(255, 255, 255, 0.3); } - -.mat-menu-item .mat-icon, -.mat-menu-item-submenu-trigger::after { - color: white; } - -.mat-menu-item:hover:not([disabled]), -.mat-menu-item:focus:not([disabled]), -.mat-menu-item-highlighted:not([disabled]) { - background: rgba(255, 255, 255, 0.04); } + .mat-menu-item .mat-icon { + color: white; + vertical-align: middle; } + .mat-menu-item:hover:not([disabled]), .mat-menu-item:focus:not([disabled]) { + background: rgba(255, 255, 255, 0.04); } .mat-paginator { background: #424242; } @@ -1427,20 +1285,15 @@ input.mat-input-element { .mat-select-trigger, .mat-select-arrow { - color: rgba(255, 255, 255, 0.7); } + color: rgba(255, 255, 255, 0.3); } .mat-select-underline { - background-color: rgba(255, 255, 255, 0.7); } - -[aria-disabled='true'] .mat-select-underline { - background-image: linear-gradient(to right, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.7) 33%, transparent 0%); - background-size: 4px 1px; - background-repeat: repeat-x; } + background-color: rgba(255, 255, 255, 0.12); } .mat-select-disabled .mat-select-value, .mat-select-arrow, .mat-select-trigger { - color: rgba(255, 255, 255, 0.7); } + color: rgba(255, 255, 255, 0.3); } .mat-select-content, .mat-select-panel-done-animating { background: #424242; } @@ -1448,9 +1301,6 @@ input.mat-input-element { .mat-select-value { color: white; } -.mat-select-panel .mat-option.mat-selected:not(.mat-option-multiple) { - background: rgba(255, 255, 255, 0.12); } - .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-primary .mat-select-arrow { color: #7b1fa2; } @@ -1463,26 +1313,26 @@ input.mat-input-element { .mat-select:focus:not(.mat-select-disabled).mat-accent .mat-select-underline { background-color: #69f0ae; } -.mat-select:focus:not(.mat-select-disabled).mat-select-required .mat-select-placeholder::after { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-trigger, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-arrow { color: #f44336; } -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-trigger, .mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-arrow, .mat-select-invalid .mat-select-trigger, .mat-select-invalid .mat-select-arrow { - color: #f44336; } - -.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, .mat-select-invalid .mat-select-underline { +.mat-select:focus:not(.mat-select-disabled).mat-warn .mat-select-underline, +.mat-select:not(:focus).ng-invalid.ng-touched:not(.mat-select-disabled) .mat-select-underline { background-color: #f44336; } -.mat-drawer-container { +.mat-sidenav-container { background-color: #303030; color: white; } -.mat-drawer { +.mat-sidenav { background-color: #424242; color: white; } - .mat-drawer.mat-drawer-push { + .mat-sidenav.mat-sidenav-push { background-color: #424242; } -.mat-drawer-backdrop.mat-drawer-shown { +.mat-sidenav-backdrop.mat-sidenav-shown { background-color: rgba(189, 189, 189, 0.6); } .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-thumb { @@ -1615,100 +1465,17 @@ input.mat-input-element { border-top: 1px solid rgba(255, 255, 255, 0.12); border-bottom: none; } +.mat-tab-label:focus { + background-color: rgba(156, 39, 176, 0.3); } + +.mat-ink-bar { + background-color: #7b1fa2; } + .mat-tab-label, .mat-tab-link { color: white; } .mat-tab-label.mat-tab-disabled, .mat-tab-link.mat-tab-disabled { color: rgba(255, 255, 255, 0.3); } -.mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.3); } - -.mat-tab-group[class*='mat-background-'] .mat-tab-header, -.mat-tab-nav-bar[class*='mat-background-'] { - border-bottom: none; - border-top: none; } - -.mat-tab-group.mat-primary .mat-tab-label:focus, .mat-tab-group.mat-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-primary .mat-tab-link:focus { - background-color: rgba(156, 39, 176, 0.3); } - -.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar { - background-color: #7b1fa2; } - -.mat-tab-group.mat-primary.mat-background-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary.mat-background-primary .mat-ink-bar { - background-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-accent .mat-tab-label:focus, .mat-tab-group.mat-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-accent .mat-tab-link:focus { - background-color: rgba(185, 246, 202, 0.3); } - -.mat-tab-group.mat-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent .mat-ink-bar { - background-color: #69f0ae; } - -.mat-tab-group.mat-accent.mat-background-accent .mat-ink-bar, .mat-tab-nav-bar.mat-accent.mat-background-accent .mat-ink-bar { - background-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-group.mat-warn .mat-tab-label:focus, .mat-tab-group.mat-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn .mat-ink-bar { - background-color: #f44336; } - -.mat-tab-group.mat-warn.mat-background-warn .mat-ink-bar, .mat-tab-nav-bar.mat-warn.mat-background-warn .mat-ink-bar { - background-color: white; } - -.mat-tab-group.mat-background-primary .mat-tab-label:focus, .mat-tab-group.mat-background-primary .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-primary .mat-tab-link:focus { - background-color: rgba(156, 39, 176, 0.3); } - -.mat-tab-group.mat-background-primary .mat-tab-header, .mat-tab-group.mat-background-primary .mat-tab-links, .mat-tab-nav-bar.mat-background-primary .mat-tab-header, .mat-tab-nav-bar.mat-background-primary .mat-tab-links { - background-color: #7b1fa2; } - -.mat-tab-group.mat-background-primary .mat-tab-label, .mat-tab-group.mat-background-primary .mat-tab-link, .mat-tab-nav-bar.mat-background-primary .mat-tab-label, .mat-tab-nav-bar.mat-background-primary .mat-tab-link { - color: rgba(255, 255, 255, 0.87); } - .mat-tab-group.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-primary .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-primary .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.87); } - -.mat-tab-group.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-primary .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-label:focus, .mat-tab-group.mat-background-accent .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-accent .mat-tab-link:focus { - background-color: rgba(185, 246, 202, 0.3); } - -.mat-tab-group.mat-background-accent .mat-tab-header, .mat-tab-group.mat-background-accent .mat-tab-links, .mat-tab-nav-bar.mat-background-accent .mat-tab-header, .mat-tab-nav-bar.mat-background-accent .mat-tab-links { - background-color: #69f0ae; } - -.mat-tab-group.mat-background-accent .mat-tab-label, .mat-tab-group.mat-background-accent .mat-tab-link, .mat-tab-nav-bar.mat-background-accent .mat-tab-label, .mat-tab-nav-bar.mat-background-accent .mat-tab-link { - color: rgba(0, 0, 0, 0.87); } - .mat-tab-group.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-accent .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-accent .mat-tab-link.mat-tab-disabled { - color: rgba(0, 0, 0, 0.4); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.87); } - -.mat-tab-group.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-accent .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(0, 0, 0, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-label:focus, .mat-tab-group.mat-background-warn .mat-tab-link:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-label:focus, .mat-tab-nav-bar.mat-background-warn .mat-tab-link:focus { - background-color: rgba(255, 205, 210, 0.3); } - -.mat-tab-group.mat-background-warn .mat-tab-header, .mat-tab-group.mat-background-warn .mat-tab-links, .mat-tab-nav-bar.mat-background-warn .mat-tab-header, .mat-tab-nav-bar.mat-background-warn .mat-tab-links { - background-color: #f44336; } - -.mat-tab-group.mat-background-warn .mat-tab-label, .mat-tab-group.mat-background-warn .mat-tab-link, .mat-tab-nav-bar.mat-background-warn .mat-tab-label, .mat-tab-nav-bar.mat-background-warn .mat-tab-link { - color: white; } - .mat-tab-group.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-group.mat-background-warn .mat-tab-link.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-label.mat-tab-disabled, .mat-tab-nav-bar.mat-background-warn .mat-tab-link.mat-tab-disabled { - color: rgba(255, 255, 255, 0.4); } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-chevron { - border-color: white; } - -.mat-tab-group.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron, .mat-tab-nav-bar.mat-background-warn .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron { - border-color: rgba(255, 255, 255, 0.4); } - .mat-toolbar { background: #212121; color: white; } @@ -1725,13 +1492,6 @@ input.mat-input-element { .mat-tooltip { background: rgba(97, 97, 97, 0.9); } -.mat-snack-bar-container { - background: #fafafa; - color: rgba(0, 0, 0, 0.87); } - -.mat-simple-snackbar-action { - color: inherit; } - .adf-panel-heading { float: left; font-size: 14px; @@ -2204,7 +1964,7 @@ container-widget md-input-container { width: 100%; } container-widget .mat-input-placeholder-wrapper { - top: 0 !important; } + top: 5px !important; } container-widget .mat-input-placeholder { top: 1.8em !important; } @@ -2366,16 +2126,16 @@ container-widget .mat-grid-tile { .adf-md-select { padding-top: 0px; } -.adf-start-task-input-container .mat-input-wrapper { +adf-start-task .adf-start-task-input-container .mat-input-wrapper { padding-top: 8px; } -.adf-error-text-container { +adf-start-task .adf-error-text-container { position: absolute; width: 81%; height: 20px; margin-top: 30px; } -.adf-error-text { +adf-start-task .adf-error-text { padding: 1px; height: 16px; font-size: 12px; @@ -2383,29 +2143,29 @@ container-widget .mat-grid-tile { float: left; color: #f44336; } -.adf-error-icon { +adf-start-task .adf-error-icon { float: right; font-size: 17px; color: #f44336; } -.adf-label { +adf-start-task .adf-label { color: #bababa; } -.adf-invalid .mat-input-underline { +adf-start-task .adf-invalid .mat-input-underline { background-color: #f44336 !important; } -.adf-invalid .adf-file { +adf-start-task .adf-invalid .adf-file { border-color: #f44336; } -.adf-invalid .mat-input-prefix { +adf-start-task .adf-invalid .mat-input-prefix { color: #f44336; } -.adf-invalid .adf-input { +adf-start-task .adf-invalid .adf-input { border-color: #f44336; } -.adf-invalid .adf-label { +adf-start-task .adf-invalid .adf-label { color: #f44336; } - .adf-invalid .adf-label:after { + adf-start-task .adf-invalid .adf-label:after { background-color: #f44336; } :host { @@ -3431,6 +3191,7 @@ adf-file-uploading-list-row:not(:first-child) { z-index: 5; } .adf-search-result { + box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); min-width: 112px; max-width: 280px; overflow: auto; @@ -3445,8 +3206,6 @@ adf-file-uploading-list-row:not(:first-child) { border-collapse: collapse; white-space: nowrap; font-size: 14px; } - .adf-search-result:not([class*='mat-elevation-z']) { - box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } .adf-search-result a { color: white; text-decoration: none; }