diff --git a/apps/theming/css/theming.scss b/apps/theming/css/theming.scss index a18176f8b5..dcc6fbee20 100644 --- a/apps/theming/css/theming.scss +++ b/apps/theming/css/theming.scss @@ -82,39 +82,6 @@ $invert: luma($color-primary) > 0.6; #appmenu .icon-more-white { @include icon-color('more', 'actions', $color-black, 1, true); } - - #body-login { - - input, - #alternative-logins li a { - border: 1px solid nc-lighten($color-primary-text, 50%); - } - input.primary, - button.primary, - #alternative-logins li a { - background-color: $color-primary; - color: $color-primary-text; - } - a, - label, - footer p, - #alternative-logins legend, - .lost-password-container #lost-password { - color: $color-primary-text; - } - input[type='checkbox'].checkbox--white + label:before { - border-color: nc-darken($color-primary-element, 40%) !important; - } - input[type='checkbox'].checkbox--white:not(:disabled):not(:checked) + label:hover:before, - input[type='checkbox'].checkbox--white:focus + label:before { - border-color: nc-darken($color-primary-element, 30%) !important; - } - input[type='checkbox'].checkbox--white:checked + label:before { - border-color: nc-darken($color-primary-element, 30%) !important; - background-color: nc-darken($color-primary-element, 30%) !important; - @include icon-color('checkbox-mark', 'actions', $color-white, 1, true); - } - } } @else { #appmenu:not(.inverted) svg { filter: none; @@ -204,14 +171,11 @@ input.primary, @if ($invert) { #body-login { .body-login-container { - background-color: $color-main-background; - } - #submit-wrapper .icon-confirm-white { - background-image: url('../../../core/img/actions/confirm.svg'); - } - .body-login-container { + background-color: transparentize(nc-lighten($color-primary, 30%), 0.2); + color: $color-primary-text !important; + h2 { - color: $color-main-text; + color: $color-primary-text; } .icon-search.icon-white { // CSS variable is not used here since it is on the public page layout, @@ -219,6 +183,49 @@ input.primary, background-image: url('../../../core/img/actions/search.svg'); } } + + input, + #alternative-logins li a { + border: 1px solid nc-lighten($color-primary-text, 50%); + } + input.primary, + button.primary, + #alternative-logins li a { + background-color: $color-primary; + color: $color-primary-text; + } + a, + label, + footer p, + #alternative-logins legend, + .lost-password-container #lost-password, + .warning, .update, .error { + color: $color-primary-text !important; + } + input[type='checkbox'].checkbox--white + label:before { + border-color: nc-darken($color-primary-element, 40%) !important; + } + input[type='checkbox'].checkbox--white:not(:disabled):not(:checked) + label:hover:before, + input[type='checkbox'].checkbox--white:focus + label:before { + border-color: nc-darken($color-primary-element, 30%) !important; + } + input[type='checkbox'].checkbox--white:checked + label:before { + border-color: nc-darken($color-primary-element, 30%) !important; + background-color: nc-darken($color-primary-element, 30%) !important; + @include icon-color('checkbox-mark', 'actions', $color-white, 1, true); + } + #submit-wrapper .icon-confirm-white { + background-image: url('../../../core/img/actions/confirm.svg'); + } + + .two-factor-provider { + &:hover, &:focus { + border-color: $color-primary-text; + } + img { + filter: invert(1); + } + } } #body-public #header .icon-more-white { background-image: var(--icon-more-000);