From 325396330c78dc76021a0f433c018eec47836d32 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 20 Nov 2018 17:01:51 +0100 Subject: [PATCH 1/2] Apply border to primary button if on log in page (and not in a dark container) or if in header, fix #12294 Signed-off-by: Jan-Christoph Borchardt --- core/css/inputs.scss | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/core/css/inputs.scss b/core/css/inputs.scss index fde251075a868..e96f055f24364 100644 --- a/core/css/inputs.scss +++ b/core/css/inputs.scss @@ -85,14 +85,22 @@ div[contenteditable=true], /* Primary action button, use sparingly */ &.primary { background-color: var(--color-primary-element); - border: 1px solid var(--color-primary-text); + border-color: var(--color-primary-element); color: var(--color-primary-text); cursor: pointer; + + /* Apply border to primary button if on log in page (and not in a dark container) or if in header */ + #body-login :not(body-login-container) &, + #header & { + border-color: var(--color-primary-text); + } + &:not(:disabled) { &:hover, &:focus, - &:active { - background-color: var(--color-primary-element-light) + &:active { + background-color: var(--color-primary-element-light); + border-color: var(--color-primary-element-light); } &:active { color: var(--color-primary-text-dark); From f80a0234319ce1206892259b65e63f5277b2ecb9 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Wed, 21 Nov 2018 14:30:05 +0100 Subject: [PATCH 2/2] Always give primary button a border for light primary colors Signed-off-by: Jan-Christoph Borchardt --- apps/theming/css/theming.scss | 7 +++---- core/css/inputs.scss | 2 +- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/apps/theming/css/theming.scss b/apps/theming/css/theming.scss index e2cd8fb11eeb0..ea3792458fa5c 100644 --- a/apps/theming/css/theming.scss +++ b/apps/theming/css/theming.scss @@ -82,10 +82,9 @@ $invert: luma($color-primary) > 0.6; @include icon-color('checkbox-mark', 'actions', $color-white, 1, true); } } - #body-user { - .primary { - border: 1px solid transparent; - } + /* Always give primary button a border for light primary colors */ + .primary { + border-color: var(--color-border) !important; } } @else { #appmenu:not(.inverted) svg { diff --git a/core/css/inputs.scss b/core/css/inputs.scss index e96f055f24364..8b4198644da6d 100644 --- a/core/css/inputs.scss +++ b/core/css/inputs.scss @@ -90,7 +90,7 @@ div[contenteditable=true], cursor: pointer; /* Apply border to primary button if on log in page (and not in a dark container) or if in header */ - #body-login :not(body-login-container) &, + #body-login :not(.body-login-container) &, #header & { border-color: var(--color-primary-text); }