WebDev/Mind-Overflow-Website
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

started implementing cookies popup; made a "common-style" css file to keep everything tidy and not have duplicate code

Browse Source
This commit is contained in:
Lorenzo Dellacà
2020-07-09 03:23:47 +02:00
parent d1f41cab38
commit 7421f6d06e
9 changed files with 208 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

135
styles/common-style.css Normal file
View File

@@ -0,0 +1,135 @@
@charset "utf-8";
/* CSS Document */
html, body {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
margin: 0;
padding: 0;
height: 100%;
width: 100%;
}
h1 {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
width: 100%;
color: white;
position: absolute;
}
h2 {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
color: white;
margin: 0;
padding: 38px 20px 20px;
font-size: 40px;
}
h3 {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
color: white;
margin: 0;
padding: 30px 0 0;
font-size: 33px;
}
h4 {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
color: white;
margin: 0;
padding: 20px;
font-size: 25px;
}
a {
text-decoration: none;
color: paleturquoise;
position: relative;
}
/* Begin policy popup */
/* todo: this makes the page a little bit higher & larger, adding bars. fix it */
.policy-popup {
display: none; /*Hidden, we want to show it via JavaScript */
/* Theming */
background: #535353;
color: white;
border-radius: 3px;
padding: 10px;
font-size: 25px;
box-sizing: border-box;
/* Size */
width: 600px;
/* Positioning */
position: absolute;
left: 50px;
bottom: 50px;
z-index: 1;
}
.policy-popup p {
font-family: 'Montserrat', sans-serif;
font-weight: 200;
color: white;
font-size: 15px;
padding: 0 20px;
}
.policy-popup button {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
font-size: 15px;
transition-duration: 0.4s;
border-radius: 3px;
background-color: #917d6b;
border: none;
cursor: pointer;
color: white;
padding: 15px 30px;
text-align: center;
margin: 20px;
float: right;
}
.policy-popup button:hover {
background-color: #44277a;
}
/* End policy popup */
/* Begin fonts */
@font-face {
font-family: 'Oswald';
font-style: normal;
font-weight: 100;
src: url(https://fonts.gstatic.com/s/oswald/v24/TK3_WkUHHAIjg75cFRf3bXL8LICs169vsUZiZQ.woff2) format('woff2');
}
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 800;
src: url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_c5H3gnD_g.woff2) format('woff2');
}
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 200;
src: url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_aZA3gnD_g.woff2) format('woff2');
}
/* End fonts */

30
styles/home-style.css
View File

@@ -1,12 +1,7 @@
@charset "utf-8";
/* CSS Document */
html, body {
font-family: 'Montserrat', sans-serif;
height: 100%;
width: 100%;
margin: 0;
padding: 0;
background-color: black;
-moz-user-select: none;
-webkis-user-select: none;
-ms-user-select: none;
@@ -14,7 +9,7 @@ html, body {
-o-user-select: none;
}
.main{
.main {
height: 100%;
width: 100%;
margin: 0%;
@@ -30,10 +25,6 @@ html, body {
h1 {
font-size: 90px;
font-weight: 800;
width: 100%;
color: white;
position: absolute;
margin-top: 20px;
}
@@ -60,7 +51,6 @@ h1 {
background: linear-gradient(to right, #33ffc5 20%, #fc33ff, #ff3370, #ff3333, #3dff33, #33ffc5);
background-size: 800px, 800px;
color: aquamarine;
background-clip: text;
text-fill-color: transparent;
animation: gradient 2s linear infinite;
-webkit-background-clip: text;
@@ -156,20 +146,4 @@ h1 {
.bottomnav a {
font-size: 40px;
}
}
@font-face {
font-family: 'Oswald';
font-style: normal;
font-weight: 300;
src: url(https://fonts.gstatic.com/s/oswald/v24/TK3_WkUHHAIjg75cFRf3bXL8LICs169vsUZiZQ.woff2) format('woff2');
}
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 800;
src: url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_c5H3gnD_g.woff2) format('woff2');
}

60
styles/pages-style.css
View File

@@ -1,13 +1,8 @@
@charset "utf-8";
/* CSS Document */
html, body {
font-family: 'Montserrat', sans-serif;
font-weight: 800;
margin: 0;
padding: 0;
background-color: black;
height: 100%;
width: 100%;
}
.topnav {
@@ -48,12 +43,10 @@ html, body {
h1 {
font-size: 120px;
width: 100%;
margin: 0;
box-sizing: border-box;
padding-left: 5%;
padding-right: 5%;
position: absolute;
bottom: 10%;
}
@@ -77,25 +70,6 @@ h1 {
100% { top: 94%; }
}
h2 {
margin: 0;
padding: 20px;
padding-top: 38px;
font-size: 40px;
}
h3 {
margin: 0;
padding: 0;
padding-top: 38px;
font-size: 33px;
}
h4 {
margin: 0;
padding: 20px;
font-size: 25px;
}
.top-bar, footer {
background: linear-gradient(45deg, #067062, #063d70, #2d0670, #4e0670, #700667);
@@ -105,10 +79,8 @@ h4 {
color: white;
-moz-user-select: none;
-webkis-user-select: none;
-ms-user-select: none;
user-select: none;
-o-user-select: none;
}
.top-bar {
height: 100%;
@@ -129,13 +101,6 @@ h4 {
padding-bottom: 20px;
}
.content a {
text-decoration: none;
color: paleturquoise;
position: relative;
}
ul {
list-style-type: none;
padding: 0;
@@ -340,27 +305,4 @@ li {
li {
padding: 20px;
}
}
@font-face {
font-family: 'Oswald';
font-style: normal;
font-weight: 100;
src: url(https://fonts.gstatic.com/s/oswald/v24/TK3_WkUHHAIjg75cFRf3bXL8LICs169vsUZiZQ.woff2) format('woff2');
}
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 800;
src: url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_c5H3gnD_g.woff2) format('woff2');
}
@font-face {
font-family: 'Montserrat';
font-style: normal;
font-weight: 200;
src: url(https://fonts.gstatic.com/s/montserrat/v14/JTURjIg1_i6t8kCHKm45_aZA3gnD_g.woff2) format('woff2');
}