1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-24 20:36:40 +07:00

replaced colors

This commit is contained in:
Fedor Katurov 2022-08-13 20:57:24 +07:00
parent f6b76055d3
commit f943ef31dd
15 changed files with 42 additions and 32 deletions

View file

@ -30,10 +30,10 @@
text-transform: uppercase; text-transform: uppercase;
&.open { &.open {
color: $color_danger; color: $color_offline;
} }
&.closed { &.closed {
color: $green; color: $color_online;
} }
} }

View file

@ -20,7 +20,7 @@
z-index: 100; z-index: 100;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background: linear-gradient(90deg, $dark_blue, $soft_blue, $dark_blue); background: $global_loader_gradient;
animation: spin infinite 1s linear; animation: spin infinite 1s linear;
} }

View file

@ -18,7 +18,7 @@ $pad_usual: $content_bg_lightest;
text-transform: uppercase; text-transform: uppercase;
.danger & { .danger & {
background: $color_danger_slate; background: $content_bg_danger;
} }
} }
} }
@ -30,7 +30,7 @@ $pad_usual: $content_bg_lightest;
position: relative; position: relative;
&.danger { &.danger {
box-shadow: inset $color_danger_slate 0 0 0 2px; box-shadow: inset $content_bg_danger 0 0 0 2px;
} }
&.with_title { &.with_title {

View file

@ -40,7 +40,7 @@
&.lab { &.lab {
&::after { &::after {
background: $blue; background: $color_lab;
} }
} }
} }

View file

@ -234,7 +234,7 @@
.primary { .primary {
@include outer_shadow; @include outer_shadow;
background: $color_primary_gradient; background: $primary_gradient;
} }
.danger { .danger {
@ -248,7 +248,7 @@
} }
.lab { .lab {
background: $blue; background: $color_lab;
} }
.flat { .flat {

View file

@ -17,7 +17,7 @@
} }
&.has_error { &.has_error {
box-shadow: inset $color_danger 0 0 0 1px; box-shadow: inset $content_bg_danger 0 0 0 1px;
} }
} }
@ -38,7 +38,7 @@
padding: 0 $gap * 0.5; padding: 0 $gap * 0.5;
border-radius: 4px; border-radius: 4px;
color: white; color: white;
background-color: $color_danger; background-color: $content_bg_danger;
bottom: 0; bottom: 0;
right: $gap * 0.5; right: $gap * 0.5;
transform: translate(0, 50%); transform: translate(0, 50%);
@ -66,6 +66,6 @@
.focused.has_error &, .focused.has_error &,
.not_empty.has_error & { .not_empty.has_error & {
color: white; color: white;
background-color: $color_danger; background-color: $content_bg_danger;
} }
} }

View file

@ -53,7 +53,7 @@
} }
&.lab { &.lab {
background-color: $blue; background-color: $color_lab;
} }
&.danger { &.danger {

View file

@ -100,7 +100,7 @@
} }
.bar { .bar {
background: $color_primary_gradient; background: $primary_gradient;
position: absolute; position: absolute;
height: 10px; height: 10px;
left: 0; left: 0;

View file

@ -1,4 +1,4 @@
@import "src/styles/variables.scss"; @import 'src/styles/variables.scss';
img.image { img.image {
position: absolute; position: absolute;
@ -47,14 +47,14 @@ img.image {
right: 30px; right: 30px;
bottom: 40px; bottom: 40px;
opacity: 0.4; opacity: 0.4;
color: $orange; color: $color_offline;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
svg { svg {
fill: $orange; fill: currentColor;
} }
&__text { &__text {

View file

@ -46,7 +46,7 @@
color: white; color: white;
&.green { &.green {
background: $color_primary_gradient; background: $primary_gradient;
} }
&.orange { &.orange {

View file

@ -54,7 +54,7 @@ $big: 1.2;
} }
&:global(.green) { &:global(.green) {
background: $color_primary_gradient; background: $primary_gradient;
} }
&:global(.black) { &:global(.black) {

View file

@ -123,7 +123,7 @@
} }
&.lab::after { &.lab::after {
background: lighten($blue, 10%); background: lighten($color_lab, 10%);
} }
&.boris::after { &.boris::after {

View file

@ -4,18 +4,18 @@ $dark_blue: #592071;
$blue: #582cd0; $blue: #582cd0;
$green: #00d2b9; $green: #00d2b9;
$wisegreen: #007962; $wisegreen: #007962;
$olive: #8bc12a; $olive: #6cb337;
$red: #ff3344; $red: #ff3344;
$orange: #ff7549; $orange: #ff7549;
$color_primary: #007962;
$lightgreen: lighten(adjust_hue(#007962, -30deg), 10%); $lightgreen: lighten(adjust_hue(#007962, -30deg), 10%);
$soft_blue: #3c75ff; $soft_blue: #3c75ff;
$color_danger_slate: mix(#ff3344, #23201f, 60%); $brown: #23201f;
// main definitions (move to --vars) // main definitions (move to --vars)
$color_primary: $wisegreen; $color_primary: $wisegreen;
$color_danger: $red; $color_danger: $red;
$color_online: $olive; $color_online: $olive;
$color_offline: $red;
$color_link: $red; $color_link: $red;
$color_flow: $red; $color_flow: $red;
$color_lab: $blue; $color_lab: $blue;
@ -24,20 +24,30 @@ $color_lab: $blue;
$danger_gradient: linear-gradient(165deg, $orange -50%, $color_danger 150%); $danger_gradient: linear-gradient(165deg, $orange -50%, $color_danger 150%);
$info_gradient: linear-gradient(170deg, $blue, $dark_blue); $info_gradient: linear-gradient(170deg, $blue, $dark_blue);
$warning_gradient: linear-gradient(165deg, $yellow -50%, $color_danger 150%); $warning_gradient: linear-gradient(165deg, $yellow -50%, $color_danger 150%);
$color_primary_gradient: linear-gradient( $primary_gradient: linear-gradient(
170deg, 170deg,
$lightgreen -50%, $lightgreen -50%,
$color_primary 150% $color_primary 150%
); );
$magic_gradient: linear-gradient(260deg, $soft_blue -50%, #7b2653 150%); $magic_gradient: linear-gradient(260deg, $soft_blue -50%, #7b2653 150%);
$global_loader_gradient: linear-gradient(
90deg,
$dark_blue,
$soft_blue,
$dark_blue
);
// backgrounds (move to --vars) // backgrounds (move to --vars)
$content_bg: #23201f; $content_bg: $brown;
$content_bg_dark: darken($content_bg, 2%); $content_bg_dark: darken($brown, 2%);
$content_bg_darker: darken($content_bg, 4%); $content_bg_darker: darken($brown, 4%);
$content_bg_light: lighten($content_bg, 2%); $content_bg_light: lighten($brown, 2%);
$content_bg_lighter: lighten($content_bg, 4%); $content_bg_lighter: lighten($brown, 4%);
$content_bg_lightest: lighten($content_bg, 6%); $content_bg_lightest: lighten($brown, 6%);
$content_bg_success: mix($brown, $blue, 90%);
$content_bg_info: mix($brown, $wisegreen, 90%);
$content_bg_danger: mix($red, $brown, 50%);
// white shades (move to --vars) // white shades (move to --vars)
$white: white; $white: white;

View file

@ -23,7 +23,7 @@ $margin: 1em;
} }
pre { pre {
background-color: transparentize($blue, 0.9); background-color: $content_bg_lighter;
font-family: monospace; font-family: monospace;
font-size: 0.8em; font-size: 0.8em;
border-radius: 2px; border-radius: 2px;
@ -43,7 +43,7 @@ $margin: 1em;
p, p,
li { li {
code { code {
background-color: transparentize($blue, 0.9); background-color: transparentize($color_primary, 0.9);
padding: 2px 4px; padding: 2px 4px;
border-radius: 0.3em; border-radius: 0.3em;
color: transparentize($color_primary, 0.1); color: transparentize($color_primary, 0.1);

View file

@ -15,7 +15,7 @@ div.toast.error {
} }
div.toast.success { div.toast.success {
background: $color_primary_gradient; background: $primary_gradient;
} }
div.toast.info { div.toast.info {