diff options
| author | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2018-06-05 16:06:01 +0200 |
|---|---|---|
| committer | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2018-06-20 19:20:51 +0200 |
| commit | 4dd9490490d260e9523d4be22272d54b21843bb7 (patch) | |
| tree | 14624b9c476864d4cdfdfde3a7d03c7357dbd58b /core/css/inputs.scss | |
| parent | f2cc3a1ab6b173a87f2fa7a7e40d470acc6aaec4 (diff) | |
| download | nextcloud-server-4dd9490490d260e9523d4be22272d54b21843bb7.tar.gz nextcloud-server-4dd9490490d260e9523d4be22272d54b21843bb7.zip | |
RGBA and variables fixes
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
Diffstat (limited to 'core/css/inputs.scss')
| -rw-r--r-- | core/css/inputs.scss | 31 |
1 files changed, 20 insertions, 11 deletions
diff --git a/core/css/inputs.scss b/core/css/inputs.scss index 887b32298c6..4d916e22f27 100644 --- a/core/css/inputs.scss +++ b/core/css/inputs.scss @@ -32,6 +32,13 @@ div[contenteditable=false] { box-sizing: border-box; } +/** + * color-text-lighter normal state + * color-text-lighter active state + * color-text-maxcontrast disabled state + */ + + /* Default global values */ select, button, .button, @@ -59,11 +66,12 @@ div[contenteditable=true], &:active { outline: none; background-color: var(--color-main-background); + color: var(--color-text-light); } } &:disabled { background-color: var(--color-background-dark); - color: rgba(var(--color-main-text), 0.4); + color: var(--color-text-maxcontrast); cursor: default; opacity: 0.5; } @@ -82,15 +90,17 @@ div[contenteditable=true], cursor: pointer; &:not(:disabled) { &:hover, - &:focus { - background-color: rgba(var(--color-primary-element), .85); + &:focus, + &:active { + background-color: var(--color-primary-element-light) } &:active { - background-color: rgba(var(--color-primary-element), .7); + color: var(--color-primary-text-dark); } } &:disabled { - background-color: rgba(var(--color-primary-element), .7); + // opacity is already defined to .5 if disabled + background-color: var(--color-primary-element); color: var(--color-primary-text-dark); } } @@ -108,7 +118,7 @@ div[contenteditable=false] { cursor: text; background-color: var(--color-background-dark); - color: rgba(var(--color-main-text), 0.4); + color: var(--color-text-lighter); cursor: default; opacity: 0.5; } @@ -349,7 +359,6 @@ input { /* We do not use the nc-darken function as this is not supposed to be changed */ $color-checkbox-radio-white: #fff; - --color-checkbox-radio-white: $color-checkbox-radio-white; &.radio--white, &.checkbox--white { + label:before, @@ -357,7 +366,7 @@ input { border-color: darken($color-checkbox-radio-white, 27%); } &:not(:disabled):not(:checked) + label:hover:before { - border-color: var(--color-checkbox-radio-white); + border-color: $color-checkbox-radio-white; } &:checked + label:before { box-shadow: inset 0px 0px 0px 2px var(--color-main-background); @@ -366,11 +375,11 @@ input { } &:disabled + label:before { background-color: darken($color-checkbox-radio-white, 27%) !important; /* override other status */ - border-color: rgba(var(--color-checkbox-radio-white), 0.4) !important; /* override other status */ + border-color: rgba($color-checkbox-radio-white, 0.4) !important; /* override other status */ } &:checked:disabled + label:before { box-shadow: inset 0px 0px 0px 2px var(--color-main-background); - border-color: rgba(var(--color-checkbox-radio-white), 0.4) !important; /* override other status */ + border-color: rgba($color-checkbox-radio-white, 0.4) !important; /* override other status */ background-color: darken($color-checkbox-radio-white, 27%); } } @@ -378,7 +387,7 @@ input { &:checked + label:before, &:indeterminate + label:before { background-color: transparent !important; /* Override default checked */ - border-color: var(--color-checkbox-radio-white) !important; /* Override default checked */ + border-color: $color-checkbox-radio-white !important; /* Override default checked */ background-image: url('../img/actions/checkbox-mark-white.svg'); } &:indeterminate + label:before { |