Actualiser main-site.scss
This commit is contained in:
parent
b1d9af7839
commit
116c42f579
1 changed files with 24 additions and 40 deletions
|
|
@ -13,30 +13,14 @@ $dangercolortext: #fff;
|
|||
$dangercolortextoutline: rgb(250, 200, 200);
|
||||
$confirmationcolor: rgb(100, 200, 100);
|
||||
$confirmationcolortext: rgb(220, 255, 220);
|
||||
:root {
|
||||
--pri-color: rgb(150 255 161);
|
||||
--bg-color: grey;
|
||||
--text-color: lime;
|
||||
--sec-color: rgb(74 74 74);
|
||||
--sec-color-darklight: rgb(27 27 27);
|
||||
--error-bg: rgb(150, 50, 50);
|
||||
--error-color: rgb(255, 220, 220);
|
||||
--event-bg: rgb(255, 255, 255);
|
||||
--sec-color-light: rgb(180, 180, 180);
|
||||
--danger-color-1: #c40014;
|
||||
--danger-color-2: #e86500;
|
||||
--danger-color-text: #fff;
|
||||
--danger-color-text-outline: rgb(250, 200, 200);
|
||||
--confirmation-color: rgb(100, 200, 100);
|
||||
--confirmation-color-text: rgb(220, 255, 220);
|
||||
}
|
||||
|
||||
|
||||
* {
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-color);
|
||||
background-color: $bgcolor;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
|
|
@ -46,14 +30,14 @@ body {
|
|||
|
||||
main.content {
|
||||
margin: 0px 10px;
|
||||
background-color: var(--bg-color);
|
||||
color: var(--text-color);
|
||||
background-color: $bgcolor;
|
||||
color: $textcolor;
|
||||
flex: 2 0 0%;
|
||||
}
|
||||
|
||||
main.content .admindiv {
|
||||
width: 80%;
|
||||
background-image: linear-gradient(20deg, var(--danger-color-1) 25%, var(--danger-color-2) 25%, var(--danger-color-2) 50%, var(--danger-color-1) 50%, var(--danger-color-1) 75%, var(--danger-color-2) 75%, var(--danger-color-2) 100%);
|
||||
background-image: linear-gradient(20deg, $dangercolor1 25%, $dangercolor2 25%, $dangercolor2 50%, $dangercolor1 50%, $dangercolor1 75%, $dangercolor2 75%, $dangercolor2 100%);
|
||||
background-size: 116.95px 42.57px;
|
||||
position: relative;
|
||||
left: 50%;
|
||||
|
|
@ -63,21 +47,21 @@ main.content .admindiv {
|
|||
place-self: center;
|
||||
border-radius: 20px;
|
||||
padding: 20px;
|
||||
color: var(--danger-color-text);
|
||||
color: $dangercolortext;
|
||||
}
|
||||
|
||||
main.content .admindiv * {
|
||||
color: var(--danger-color-text);
|
||||
color: $dangercolortext;
|
||||
font-weight: 900;
|
||||
-webkit-text-fill-color: var(--danger-color-text);
|
||||
-webkit-text-fill-color: $dangercolortext;
|
||||
-webkit-text-stroke-width: 0.5px;
|
||||
-webkit-text-stroke-color: var(--danger-color-text-outline);
|
||||
-webkit-text-stroke-color: $dangercolortextoutline;
|
||||
}
|
||||
|
||||
header.header {
|
||||
height: 50px;
|
||||
background-color: var(--sec-color);
|
||||
color: var(--pri-color);
|
||||
background-color: $seccolor;
|
||||
color: $pricolor;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
|
|
@ -125,19 +109,19 @@ header.header ul.nav li.nav-item {
|
|||
}
|
||||
|
||||
header.header ul.nav li.nav-item a {
|
||||
background-color: var(--sec-color);
|
||||
background-color: $seccolor;
|
||||
display: inline-block;
|
||||
padding: 0px 20px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: var(--pri-color);
|
||||
color: $pricolor;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
header.header ul.nav li.nav-item.active a {
|
||||
background-color: var(--sec-color-darklight);
|
||||
background-color: $seccolordarklight;
|
||||
}
|
||||
|
||||
header.header ul.nav li.nav-item a:hover {
|
||||
|
|
@ -156,7 +140,7 @@ header.header .toggler-label svg {
|
|||
}
|
||||
|
||||
header.header .toggler-label svg path {
|
||||
fill: var(--pri-color);
|
||||
fill: $pricolor;
|
||||
}
|
||||
|
||||
.toggler~header.header .toggler-label {
|
||||
|
|
@ -180,7 +164,7 @@ header.header .toggler-label svg path {
|
|||
right: 0px;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
background: var(--pri-color);
|
||||
background: $pricolor;
|
||||
flex-flow: column wrap;
|
||||
transition: all 0.5s ease 0s;
|
||||
z-index: 50 !important;
|
||||
|
|
@ -212,8 +196,8 @@ header.header .toggler-label svg path {
|
|||
|
||||
.toggler:checked~header.header ul.nav li.nav-item {
|
||||
min-width: calc(50% - 2px);
|
||||
border-left: 1px solid var(--pri-color);
|
||||
border-right: solid 1px var(--pri-color);
|
||||
border-left: 1px solid $pricolor;
|
||||
border-right: solid 1px $pricolor;
|
||||
}
|
||||
|
||||
.toggler:checked~header.header ul.nav li.nav-item a {
|
||||
|
|
@ -236,12 +220,12 @@ footer.footer {
|
|||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: var(--sec-color);
|
||||
color: var(--pri-color);
|
||||
background-color: $seccolor;
|
||||
color: $pricolor;
|
||||
}
|
||||
|
||||
footer.footer a {
|
||||
color: var(--pri-color);
|
||||
color: $pricolor;
|
||||
}
|
||||
|
||||
footer.footer a:hover {
|
||||
|
|
@ -260,7 +244,7 @@ footer.footer a:hover {
|
|||
margin: 10px 0px;
|
||||
flex-direction: row;
|
||||
width: 80%;
|
||||
background-color: var(--event-bg);
|
||||
background-color: $eventbg;
|
||||
padding: 10px;
|
||||
border-radius: 20px;
|
||||
height: 300px;
|
||||
|
|
@ -296,7 +280,7 @@ footer.footer a:hover {
|
|||
|
||||
.eventitem .eventinfos time.date {
|
||||
place-self: center;
|
||||
background-color: var(--sec-color-light);
|
||||
background-color: $seccolorlight;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
|
@ -306,7 +290,7 @@ footer.footer a:hover {
|
|||
flex: 2 0 0%;
|
||||
max-height: 200px;
|
||||
overflow: auto;
|
||||
border: 2px solid var(--sec-color);
|
||||
border: 2px solid $seccolor;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue