Switch to more straight forward scss $var names

This commit is contained in:
0x1eef 2023-10-23 01:49:36 -03:00
parent a9315803f0
commit 75a72397e3
12 changed files with 44 additions and 44 deletions

View file

@ -1,4 +1,4 @@
$gold-primary: #ECB200; $gold1: #ECB200;
$gold-secondary: lighten($gold-primary, 5%); $gold2: lighten($gold1, 5%);
$blue-primary: darken(#e4eff8, 35%); $blue1: darken(#e4eff8, 35%);
$white-primary: #FFF; $white: #FFF;

View file

@ -2,10 +2,10 @@
@import "colors"; @import "colors";
.row.title { .row.title {
color: $blue-primary; color: $blue1;
} }
.row.dropdown-row .react-select { .row.dropdown-row .react-select {
color: $gold-primary; color: $gold1;
} }
} }

View file

@ -1,31 +1,31 @@
.play.icon { .play.icon {
fill: $blue-primary; fill: $blue1;
stroke: darken($blue-primary, 40%); stroke: darken($blue1, 40%);
stroke-width: 2px; stroke-width: 2px;
} }
.pause.icon { .pause.icon {
background: unset; background: unset;
rect { rect {
fill: $blue-primary; fill: $blue1;
stroke: darken($blue-primary, 40%); stroke: darken($blue1, 40%);
stroke-width: 1px; stroke-width: 1px;
} }
} }
.refresh.icon { .refresh.icon {
background: unset; background: unset;
fill: $blue-primary; fill: $blue1;
} }
.stalled.icon { .stalled.icon {
div { background: $gold-secondary; } div { background: $gold2; }
} }
.sound-on.icon, .sound-off.icon { .sound-on.icon, .sound-off.icon {
polygon { polygon {
fill: $blue-primary; fill: $blue1;
stroke-width: 2; stroke-width: 2;
} }
} }

View file

@ -2,10 +2,10 @@
@import "themes/blue/colors"; @import "themes/blue/colors";
.react-select.theme { .react-select.theme {
.selected-option.blue .circle { .selected-option.blue .circle {
background: $blue-primary; background: $blue1;
} }
ul li.blue .circle { ul li.blue .circle {
background: $blue-primary; background: $blue1;
} }
} }
} }

View file

@ -7,17 +7,17 @@
ul.body.index li.surah a { ul.body.index li.surah a {
&:active, &:link, &:visited { &:active, &:link, &:visited {
color: $blue-primary; color: $blue1;
} }
div:first-child .id { div:first-child .id {
color: $gold-secondary; color: $gold2;
} }
} }
.row.surah.choose-random { .row.surah.choose-random {
&:active, &:link, &:visited { &:active, &:link, &:visited {
color: $blue-primary; color: $blue1;
text-decoration: none; text-decoration: none;
} }
&:hover { &:hover {

View file

@ -3,17 +3,17 @@
@import "themes/blue/components/Icon"; @import "themes/blue/components/Icon";
.row.details { .row.details {
color: $gold-primary; color: $gold1;
} }
.row.footer .timer { .row.footer .timer {
color: $blue-primary; color: $blue1;
} }
ul.body.stream { ul.body.stream {
li.ayah { li.ayah {
span.title span { span.title span {
color: $gold-primary; color: $gold1;
} }
p { } p { }
} }
@ -26,7 +26,7 @@
.row.dropdown-row { .row.dropdown-row {
line-height: 30px; line-height: 30px;
span.surah-name { span.surah-name {
color: lighten($gold-primary, 25%); color: lighten($gold1, 25%);
} }
} }
} }

View file

@ -1,2 +1,2 @@
$green: #606850; $green1: #606850;
$white-primary: #FFF; $white: #FFF;

View file

@ -2,11 +2,11 @@
@import "colors"; @import "colors";
.row.title { .row.title {
color: $green; color: $green1;
} }
.row.dropdown-row .react-select { .row.dropdown-row .react-select {
background-color: transparent; background-color: transparent;
color: $green; color: $green1;
} }
} }

View file

@ -2,8 +2,8 @@
.play.icon { .play.icon {
background: unset; background: unset;
g path { g path {
fill: $green; fill: $green1;
stroke: $green; stroke: $green1;
stroke-width: 3px; stroke-width: 3px;
} }
} }
@ -11,14 +11,14 @@
.pause.icon { .pause.icon {
background: unset; background: unset;
g rect { g rect {
fill: $green; fill: $green1;
stroke: $green; stroke: $green1;
stroke-width: 1px; stroke-width: 1px;
} }
} }
.refresh.icon { .refresh.icon {
background: unset; background: unset;
fill: $green; fill: $green1;
} }
} }

View file

@ -2,10 +2,10 @@
@import "themes/green/colors"; @import "themes/green/colors";
.react-select.theme { .react-select.theme {
.selected-option.green .circle { .selected-option.green .circle {
background: $green; background: $green1;
} }
ul li.green .circle { ul li.green .circle {
background: $green; background: $green1;
} }
} }
} }

View file

@ -3,12 +3,12 @@
ul.body.index a { ul.body.index a {
&:active, &:link, &:visited { &:active, &:link, &:visited {
color: $green; color: $green1;
} }
.surah.id { .surah.id {
background: $green; background: $green1;
color: $white-primary; color: $white;
border-radius: 5px; border-radius: 5px;
padding: 3px; padding: 3px;
} }
@ -16,7 +16,7 @@
.row.surah.choose-random { .row.surah.choose-random {
&:active, &:link, &:visited { &:active, &:link, &:visited {
color: $green; color: $green1;
text-decoration: none; text-decoration: none;
} }
&:hover { &:hover {

View file

@ -3,31 +3,31 @@
@import "themes/green/components/Icon"; @import "themes/green/components/Icon";
.row.details { .row.details {
color: $green; color: $green1;
} }
ul.body.stream li.ayah { ul.body.stream li.ayah {
span.title span:first-child { span.title span:first-child {
color: $green; color: $green1;
} }
} }
.timer { .timer {
color: $green; color: $green1;
} }
.row .shape.refresh { .row .shape.refresh {
background: unset; background: unset;
fill: $green; fill: $green1;
} }
.stalled.icon { .stalled.icon {
background: $green; background: $green1;
} }
.sound-on.icon, .svg.sound-off.icon { .sound-on.icon, .svg.sound-off.icon {
polygon { polygon {
fill: $green; fill: $green1;
stroke-width: 2; stroke-width: 2;
} }
} }
@ -38,7 +38,7 @@
.row.dropdown-row { .row.dropdown-row {
.surah-name { .surah-name {
color: lighten($green, 15%); color: lighten($green1, 15%);
} }
} }