forks
/
peertube
1
0
Fork 0
Code Releases Activity

Migrate palette to HSL

This commit is contained in:
Rigel Kent 2020-03-11 13:50:53 +01:00
parent 75264e371c
commit 680b549692
No known key found for this signature in database
GPG Key ID: 5E53E96A494E452F
4 changed files with 12 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client/src/app/+admin/system/logs/logs.component.scss
View File

@ -28,7 +28,7 @@
} }
.warn { .warn {
color: $orange-color; color: var(--mainColor);
} }
.error { .error {

8
client/src/sass/application.scss
View File

@ -23,12 +23,12 @@ body {
/*** theme ***/ /*** theme ***/
// now beware node-sass requires interpolation // now beware node-sass requires interpolation
// for css custom properties #{$var} // for css custom properties #{$var}
--mainColor: #{$orange-color}; --mainColor: #{$main-color};
--mainColorLighter: #{$orange-color-lighter}; --mainColorLighter: #{$main-color-lighter};
--mainHoverColor: #{$orange-hover-color}; --mainHoverColor: #{$main-hover-color};
--mainBackgroundColor: #{$bg-color}; --mainBackgroundColor: #{$bg-color};
--mainForegroundColor: #{$fg-color}; --mainForegroundColor: #{$fg-color};
--secondaryColor: #{$cyan-color}; --secondaryColor: #{$secondary-color};
--menuBackgroundColor: #{$menu-background}; --menuBackgroundColor: #{$menu-background};
--menuForegroundColor: #{$menu-color}; --menuForegroundColor: #{$menu-color};

2
client/src/sass/include/_mixins.scss
View File

@ -398,7 +398,7 @@
&:checked + span { &:checked + span {
border-color: transparent; border-color: transparent;
background: $orange-color; background: var(--mainColor);
animation: jelly 0.6s ease; animation: jelly 0.6s ease;
&:after { &:after {

11
client/src/sass/include/_variables.scss
View File

@ -13,11 +13,12 @@ $grey-background-hover-color: #EFEFEF;
$grey-foreground-color: #585858; $grey-foreground-color: #585858;
$grey-foreground-hover-color: #303030; $grey-foreground-hover-color: #303030;
$orange-color: #F1680D; // Palette
$orange-color-lighter: rgb(233, 159, 110); $main-color: hsl(24, 90%, 50%);
$orange-hover-color: #F97D46; $main-hover-color: lighten($main-color, 5%);
$main-color-lighter: lighten($main-color, 10%);
$cyan-color: hsl(187, 77%, 34%); $secondary-color: hsl(187, 77, 34);
//
$support-button: inherit; $support-button: inherit;
$support-button-heart: #e83e8c; $support-button-heart: #e83e8c;