diff --git a/public/internal/header.php b/public/internal/header.php
index a0c4a756eab3a4ef19feb1861f635a3987c90b8a..cf7ad8532c3dd1cebcf629a17392acafaca24f2d 100644
--- a/public/internal/header.php
+++ b/public/internal/header.php
@@ -22,6 +22,7 @@ function getHeader($pagetitle, $navselect)
<title > $pagetitle - Jonas Leder </title >
<link href = "/css/style.css" rel = "stylesheet" >
+ <link href = "/css/fas.css" rel = "stylesheet" >
</head >
<body >
<header >
diff --git a/scss/_colorMixer.scss b/scss/_colorMixer.scss
new file mode 100644
index 0000000000000000000000000000000000000000..7d24dc500268007ff041ad5aed65753d1a5e0672
--- /dev/null
+++ b/scss/_colorMixer.scss
@@ -0,0 +1,2 @@
+$back-color-2: darken($back-color, $darker-color);
+$accent-color-2: darken($accent-color, $darker-color);
\ No newline at end of file
diff --git a/scss/_general.scss b/scss/_general.scss
index e9633c306bb9c9509ce0b1cec881aa49be176c0e..53f64787c423d0f8d15ed98fb972f8c418c649bf 100644
--- a/scss/_general.scss
+++ b/scss/_general.scss
@@ -1,11 +1,11 @@
body {
margin: 0;
- background-color: #151d28;
- color: #b3b3b3;
+ background-color: $back-color-2;
+ color: $text-color;
font-family: 'Source Sans Pro', sans-serif;
}
#content{
- background-color: #1a2332;
+ background-color: $back-color;
width: 100%;
padding: 20px 20%;
img {
@@ -16,7 +16,7 @@ body {
#blueBar{
height: 5px;
width: 100%;
- background-color: #03A8F4;
+ background-color: $content-footer-div-color;
}
footer{
@@ -30,8 +30,12 @@ footer{
a{
padding: 0;
- color: #b3b3b3;
+ color: $accent-color;
text-decoration:underline;
+
+ &:HOVER{
+ color: $accent-color-2;
+ }
}
.footerIconSpacer{
@@ -48,7 +52,7 @@ a{
}
article{
- border: 2px solid #b3b3b3;
+ border: 2px solid $accent-color;
border-radius: 20px;
padding: 10px;
margin-right: 20px;
@@ -72,13 +76,17 @@ article:last-child{
}
button{
- background: #1cb09a;
+ background-color: $accent-color;
color: #fff;
text-transform: uppercase;
border: 0;
padding: 5px;
cursor: pointer;
border-radius: 5px;
+
+ &:HOVER{
+ background-color: $accent-color-2;
+ }
}
#homeImage{
@@ -103,12 +111,16 @@ button{
h3 {
margin-top: 0;
}
+
+ a {
+ color: $text-color;
+ }
}
.cookieinfo{
position: fixed;
- left: 0px;
- right: 0px;
+ left: 0;
+ right: 0;
height: auto;
min-height: 21px;
z-index: 2147483647;
@@ -117,10 +129,10 @@ button{
font-family: verdana, arial, sans-serif;
font-size: 14px;
text-align: center;
- bottom: 0px;
+ bottom: 0;
opacity: 1;
- background: #1a2332;
- color: #b3b3b3;
+ background-color: $back-color;
+ color: $text-color;
}
@@ -132,9 +144,13 @@ button{
margin-left: 5px;
border-radius: 5px;
cursor: pointer;
- background: #1cb09a;
+ background-color: $accent-color;
color: #fff;
text-align: center;
+
+ &:HOVER{
+ background-color: $accent-color-2;
+ }
}
.cookieinfo-text {
@@ -144,15 +160,19 @@ button{
.cookieinfo-link{
text-decoration: none;
- color: #1cb09a;
+ color: $accent-color;
+
+ &:HOVER{
+ color: $accent-color-2;
+ }
}
#newComment {
form {
input, textarea{
width: 100%;
- background: #1a2332;
- color: #b3b3b3;
- border: solid #212a39;
+ background-color: $back-color;
+ color: $text-color;
+ border: solid $back-color-2;
}
input:focus, textarea:focus {
@@ -164,7 +184,7 @@ button{
}
input[type=submit]{
- background: #1cb09a;
+ background-color: $accent-color;
color: #fff;
text-transform: uppercase;
padding: 15px;
@@ -172,6 +192,10 @@ button{
cursor: pointer;
outline: 0;
border: 0;
+
+ &:HOVER{
+ background-color: $accent-color-2;
+ }
}
}
}
diff --git a/scss/_menue.scss b/scss/_menue.scss
index b50b43e7b2c4a947d4e7784b942deb1b93b5bf2c..34e67daa7f82235ea9dfba26a7644c6530e67ce6 100644
--- a/scss/_menue.scss
+++ b/scss/_menue.scss
@@ -27,10 +27,10 @@
width: max-content;
left: 50%;
transform: translateX(-50%);
- background-color: #1a2332;
+ background-color: $back-color;
a {
- border-bottom: #151d28 solid 2px;
+ border-bottom: $back-color-2 solid 2px;
width: 100%;
}
}
diff --git a/scss/_var.scss b/scss/_var.scss
new file mode 100644
index 0000000000000000000000000000000000000000..47a3c1f213a4db55a8c844b9ec76bcd610b23036
--- /dev/null
+++ b/scss/_var.scss
@@ -0,0 +1,6 @@
+$back-color: #1a2332;
+$text-color: #b3b3b3;
+$accent-color: #1cb09a;
+$content-footer-div-color: #03A8F4;
+
+$darker-color: 5%;
\ No newline at end of file
diff --git a/scss/fas.scss b/scss/fas.scss
new file mode 100644
index 0000000000000000000000000000000000000000..483254dbf705b776459eab1c27038b1d2231aae0
--- /dev/null
+++ b/scss/fas.scss
@@ -0,0 +1 @@
+@import "Fork-Awesome/main";
\ No newline at end of file
diff --git a/scss/style.scss b/scss/style.scss
index 85943c1a07a0f75a2fcf7a3f2599243307993032..2be302ce88e902cd1042278c2ad3fd69c7ac7099 100644
--- a/scss/style.scss
+++ b/scss/style.scss
@@ -1,8 +1,9 @@
+@import "var";
+@import "colorMixer";
@import "general";
@import "menue";
@import "normalize";
@import "ntp";
@import "prism";
@import "sourcesanspro";
-@import "header";
-@import "Fork-Awesome/main";
\ No newline at end of file
+@import "header";
\ No newline at end of file