Style: Update blue variables with pure blue
This commit is contained in:
parent
a392c9ff21
commit
09f253c01a
4 changed files with 11 additions and 8 deletions
|
|
@ -94,12 +94,14 @@ section {
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
width: 48px;
|
width: 48px;
|
||||||
height: 48px;
|
height: 48px;
|
||||||
background-color: blue;
|
background-color: $pure-blue;
|
||||||
|
border: 1px solid $pure-blue;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: 300ms ease-in-out;
|
transition: 300ms ease-in-out;
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: $white;
|
background-color: $white;
|
||||||
|
border: 1px solid $red;
|
||||||
img {
|
img {
|
||||||
filter: brightness(0) saturate(100%) invert(18%) sepia(98%)
|
filter: brightness(0) saturate(100%) invert(18%) sepia(98%)
|
||||||
saturate(7267%) hue-rotate(342deg) brightness(94%) contrast(119%);
|
saturate(7267%) hue-rotate(342deg) brightness(94%) contrast(119%);
|
||||||
|
|
|
||||||
|
|
@ -7,8 +7,8 @@
|
||||||
width: fit-content;
|
width: fit-content;
|
||||||
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
|
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
|
||||||
border-radius: 24px;
|
border-radius: 24px;
|
||||||
background-color: blue;
|
background-color: $pure-blue;
|
||||||
border: 1px solid blue;
|
border: 1px solid $pure-blue;
|
||||||
transition: 300ms ease-in-out;
|
transition: 300ms ease-in-out;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
p {
|
p {
|
||||||
|
|
@ -19,10 +19,10 @@
|
||||||
}
|
}
|
||||||
&:not(:disabled):hover {
|
&:not(:disabled):hover {
|
||||||
background-color: white;
|
background-color: white;
|
||||||
border: 1px solid blue;
|
border: 1px solid $pure-blue;
|
||||||
p {
|
p {
|
||||||
transition: 300ms ease-in-out;
|
transition: 300ms ease-in-out;
|
||||||
color: blue;
|
color: $pure-blue;
|
||||||
}
|
}
|
||||||
.icon {
|
.icon {
|
||||||
transition: 300ms ease-in-out;
|
transition: 300ms ease-in-out;
|
||||||
|
|
|
||||||
|
|
@ -8,13 +8,13 @@
|
||||||
height: var(--btnRadius);
|
height: var(--btnRadius);
|
||||||
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
|
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
background-color: blue;
|
background-color: $pure-blue;
|
||||||
border: 1px solid blue;
|
border: 1px solid $pure-blue;
|
||||||
transition: 300ms ease-in-out;
|
transition: 300ms ease-in-out;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
&:not(:disabled):hover {
|
&:not(:disabled):hover {
|
||||||
background-color: white;
|
background-color: white;
|
||||||
border: 1px solid blue;
|
border: 1px solid $pure-blue;
|
||||||
.icon {
|
.icon {
|
||||||
transition: 300ms ease-in-out;
|
transition: 300ms ease-in-out;
|
||||||
filter: brightness(0) saturate(100%) invert(26%) sepia(77%)
|
filter: brightness(0) saturate(100%) invert(26%) sepia(77%)
|
||||||
|
|
|
||||||
|
|
@ -3,5 +3,6 @@ $white: #fff;
|
||||||
$black: #000;
|
$black: #000;
|
||||||
$gray: #ababab;
|
$gray: #ababab;
|
||||||
$blue: #2e3edf;
|
$blue: #2e3edf;
|
||||||
|
$pure-blue: #0000ff;
|
||||||
$light-blue: #969eef;
|
$light-blue: #969eef;
|
||||||
$red: #ff002e;
|
$red: #ff002e;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue