open-dsi
/
nextcloud-server
mirror of https://github.com/nextcloud/server
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

RGBA and variables fixes

Browse Source 
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
pull/9723/head
John Molakvoæ (skjnldsv) 7 years ago
parent f2cc3a1ab6
commit 4dd9490490
No known key found for this signature in database
GPG Key ID: 60C25B8C072916CF
9 changed files with 43 additions and 38 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 4
      core/css/apps.scss
  2. 5
      core/css/css-variables.scss
  3. 3
      core/css/header.scss
  4. 6
      core/css/icons.scss
  5. 31
      core/css/inputs.scss
  6. 2
      core/css/mobile.scss
  7. 3
      core/css/share.scss
  8. 17
      core/css/styles.scss
  9. 10
      core/css/variables.scss

4
core/css/apps.scss
Unescape View File

@ -250,7 +250,7 @@ kbd {
box-sizing: border-box;
white-space: nowrap;
text-overflow: ellipsis;
color: var(--color-error);
color: var(--color-main-text);
opacity: .57;
flex: 1 1 0px;
z-index: 100; /* above the bullet to allow click*/
@ -644,7 +644,7 @@ kbd {
.info-text {
padding: 5px 0 7px 22px;
color: rgba(var(--color-main-text), .4);
color: var(--color-text-lighter);
}
input {
&[type='checkbox'],

5
core/css/css-variables.scss
Unescape View File

@ -13,19 +13,20 @@
--color-primary-text: $color-primary-text;
--color-primary-text-dark: $color-primary-text-dark;
--color-primary-element: $color-primary-element;
--color-primary-element-light: $color-primary-element-light;
--color-error: $color-error;
--color-warning: $color-warning;
--color-success: $color-success;
--color-text-maxcontrast: $color-text-maxcontrast;
--color-text-light: $color-text-light;
--color-text-lighter: $color-text-lighter;
--color-text-details: $color-text-details;
--image-logo: $image-logo;
--image-login-background: $image-login-background;
--color-loading: $color-loading;
--color-loading-light: $color-loading-light;
--color-loading-dark: $color-loading-dark;
--color-box-shadow: $color-box-shadow;

3
core/css/header.scss
Unescape View File

@ -340,7 +340,6 @@ nav[role='navigation'] {
#settings {
display: inline-block;
height: 100%;
color: rgba(var(--color-primary-text), 0.7);
cursor: pointer;
flex: 0 0 auto;
@ -500,7 +499,7 @@ nav[role='navigation'] {
border-radius: var(--border-radius);
border-top-left-radius: 0;
border-top-right-radius: 0;
color: rgba(var(--color-main-text), .7);
color: var(--color-text-lighter);
width: auto;
left: 50%;
top: 100%;

6
core/css/icons.scss
Unescape View File

@ -42,14 +42,14 @@
-webkit-transform-origin: center;
-ms-transform-origin: center;
transform-origin: center;
border: 2px solid rgba(var(--color-loading), 0.5);
border-top-color: var(--color-loading);
border: 2px solid var(--color-loading-dark);
border-top-color: var(--color-loading-light);
}
}
.icon-loading-dark:after,
.icon-loading-small-dark:after {
border: 2px solid rgba(var(--color-loading-dark), 0.5);
border: 2px solid var(--color-loading-light);
border-top-color: var(--color-loading-dark);
}

31
core/css/inputs.scss
Unescape View File

@ -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 {

2
core/css/mobile.scss
Unescape View File

@ -72,7 +72,7 @@
width: 44px;
height: 44px;
z-index: 149;
background-color: rgba(var(--color-main-background), .7);
background-color: var(--color-main-background-darker);
cursor: pointer;
opacity: .6;
}

3
core/css/share.scss
Unescape View File

@ -61,7 +61,6 @@
.error {
color: var(--color-error);
border-color: var(--color-error);
box-shadow: 0 0 6px rgba(var(--color-error), 0.35);
}
.mailView .icon-mail {
opacity: 0.5;
@ -173,7 +172,7 @@
.notCreatable {
padding-left: 12px;
padding-top: 12px;
color: rgba(var(--color-main-text), .4);
color: var(--color-text-lighter);
}
.contactsmenu-popover {

17
core/css/styles.scss
Unescape View File

@ -110,14 +110,14 @@ body {
width: 258px !important;
display: inline-block;
margin-bottom: 0 !important;
background-color: rgba(var(--color-main-text), 0.3) !important;
background-color: var(--color-background-darker) !important;
border: none !important;
}
.two-factor-link {
display: inline-block;
padding: 12px;
color: rgba(var(--color-main-background), 0.75);
color: var(--color-text-lighter);
}
.float-spinner {
@ -138,7 +138,7 @@ body {
width: 100%;
z-index: 9000;
text-align: center;
background-color: rgba(var(--color-main-text), 0.5);
background-color: var(--color-background-darker);
color: var(--color-primary-text);
line-height: 125%;
font-size: 24px;
@ -200,7 +200,7 @@ body {
width: 155px;
cursor: text;
background-color: var(--color-primary) !important;
border: 1px solid rgba(var(--color-primary-text), 0.5) !important;
border: 1px solid var(--color-primary-text-dark) !important;
}
&:hover, &:focus, &:active {
opacity: 1;
@ -236,7 +236,7 @@ body {
height: 44px;
padding: 0;
margin: 0;
background-color: rgba(var(--color-main-background), 0.95);
background-color: var(--color-main-background-light);
z-index: 60;
-webkit-user-select: none;
-moz-user-select: none;
@ -488,7 +488,6 @@ body {
border-top: 0 !important;
border-bottom: 0 !important;
border-radius: 0 !important;
box-shadow: 0 1px 0 rgba(var(--color-main-text), 0.1) inset !important;
}
#body-login .groupbottom input, .groupbottom input {
@ -496,7 +495,6 @@ body {
border-top: 0 !important;
border-top-right-radius: 0 !important;
border-top-left-radius: 0 !important;
box-shadow: 0 1px 0 rgba(var(--color-main-text), 0.1) inset !important;
}
#body-login .groupbottom input[type=submit] {
@ -522,7 +520,6 @@ label.infield {
user-select: none;
}
.errors {
background: rgba(var(--color-error), .35);
border: 1px solid var(--color-error);
list-style-indent: inside;
margin: 0 0 2em;
@ -530,7 +527,6 @@ label.infield {
}
}
.success {
background: rgba(var(--color-success), .35);
border: 1px solid var(--color-success);
width: 35%;
margin: 30px auto;
@ -645,7 +641,7 @@ label.infield {
.warning, .update, .error {
display: block;
padding: 10px;
background-color: rgba(var(--color-main-text), 0.3);
background-color: var(--color-background-darker);
color: var(--color-primary-text);
text-align: left;
border-radius: var(--border-radius);
@ -674,7 +670,6 @@ label.infield {
#body-user .warning, #body-settings .warning {
margin-top: 8px;
padding: 5px;
background: rgba(var(--color-error), .15);
border-radius: var(--border-radius);
}

10
core/css/variables.scss
Unescape View File

@ -8,8 +8,9 @@
}
// SCSS variables
$color-main-text: #000000;
$color-main-background: #ffffff;
// DEPRECATED, please use CSS4 vars
$color-main-text: #000;
$color-main-background: #fff;
// used for different active/disabled states
$color-background-dark: nc-darken($color-main-background, 7%);
@ -19,6 +20,7 @@ $color-primary: #0082c9;
$color-primary-text: #ffffff;
$color-primary-text-dark: nc-darken($color-primary-text, 7%);
$color-primary-element: $color-primary;
$color-primary-element-light: nc-lighten($color-primary-element, 15%);
$color-error: #e9322d;
$color-warning: #eca700;
@ -34,8 +36,8 @@ $color-text-lighter: nc-lighten($color-main-text, 30%);
$image-logo: url('../img/logo.svg?v=1');
$image-login-background: url('../img/background.png?v=2');
$color-loading: #969696;
$color-loading-dark: #bbbbbb;
$color-loading-light: #777;
$color-loading-dark: #ccc;
$color-box-shadow: rgba(nc-darken($color-main-background, 70%), 0.75);

Write Preview
Loading…
Cancel
Save