forks/peertube
1
0
Fork 0
Code Releases Activity

Fix themes colors by using SCSS variables (#3376)

Browse source 
* 💄 Use foreground var for code

* 💄 Use submenu var color

* 💄 Use foreground var color for menu

* 🐛 Fix var used in menu
This commit is contained in:
Mathieu Brunot 2020-11-30 16:45:22 +01:00 committed by GitHub
parent 617f4f5cb2
commit a742b4b0e2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
client/src/app/menu/menu.component.scss
View file

@ -164,7 +164,7 @@ menu {
&:hover, &:hover,
&:focus-visible { &:focus-visible {
my-global-icon { my-global-icon {
@include apply-svg-color(var(--mainBackgroundColor)); @include apply-svg-color(var(--menuForegroundColor));
} }
} }
@ -269,7 +269,7 @@ menu {
a, span[role=button] { a, span[role=button] {
display: inline-block; display: inline-block;
text-decoration: none; text-decoration: none;
color: pvar(--mainBackgroundColor); color: pvar(--menuForegroundColor);
opacity: $footer-links-base-opacity; opacity: $footer-links-base-opacity;
white-space: nowrap; white-space: nowrap;
font-size: 90%; font-size: 90%;
@ -284,7 +284,7 @@ menu {
height: 1.4rem; height: 1.4rem;
my-global-icon { my-global-icon {
@include apply-svg-color(pvar(--mainBackgroundColor)); @include apply-svg-color(pvar(--menuForegroundColor));
display: flex; display: flex;
width: auto; width: auto;
@ -298,7 +298,7 @@ menu {
.footer-copyleft small a { .footer-copyleft small a {
@include disable-default-a-behaviour; @include disable-default-a-behaviour;
color: pvar(--mainBackgroundColor); color: pvar(--menuForegroundColor);
opacity: $footer-links-base-opacity - .2; opacity: $footer-links-base-opacity - .2;
} }
} }

3
client/src/sass/application.scss
View file

@ -105,6 +105,7 @@ label {
code { code {
background-color: pvar(--greyBackgroundColor); background-color: pvar(--greyBackgroundColor);
color: pvar(--greyForegroundColor);
border-radius: 3px; border-radius: 3px;
padding: .2em .4em; padding: .2em .4em;
margin: auto .4em; margin: auto .4em;
@ -261,7 +262,7 @@ code {
opacity: 0.6; opacity: 0.6;
&.active { &.active {
background-color: #f0f0f0; background-color: pvar(--submenuColor);
} }
&.active, &:hover, &:active, &:focus { &.active, &:hover, &:active, &:focus {