Compare commits

...

3 Commits

Author SHA1 Message Date
Derek 02dafb48e6
Fix button like links on small width displays
flex on those mobile and tablet users
2018-08-02 14:29:33 -07:00
Derek d522973372
Remove css variables
Doin it the old fashioned way since its not like this site has
any reason other than pure lazyness to be compatible with IE11
2018-08-02 14:28:13 -07:00
Derek 99f70646e5
Make boring links into button like things 2018-08-02 13:55:06 -07:00
1 changed files with 23 additions and 23 deletions

View File

@ -1,20 +1,6 @@
body {
--background-color: #000000;
/* #212121 but 93% transparent and mixed to appear at the same lumonocity*/
--secondary-background-color: #242424EE;
--forground-color: #FFFFFF;
--secondary-foreground-color: #FAFAFA;
--trinary-foreground-color: #F5F5F5;
--primary-color: #607D8B;
--accent-color: #FF4081;
--accent-color-dark: #C51162;
}
body {
background-color: var(--background-color);
color: var(--forground-color);
background-color: #000000;
color: #FFFFFF;
margin: 0;
height: 100vh;
font-family: 'Roboto', sans-serif;
@ -22,20 +8,28 @@ body {
b {
font-weight: bold;
color: var(--secondary-foreground-color);
color: #FAFAFA;
}
a {
transition: color 0.14s cubic-bezier(0.4, 0, 0.2, 1);
color: var(--accent-color);
text-decoration: none;
transition: background-color 0.14s cubic-bezier(0.4, 0, 0.2, 1);
background-color: #FF4081;
color: #FAFAFA;
padding: 2px 4px;
margin: 2px;
border-radius: 3px;
}
a:hover {
color: var(--accent-color-dark);
background-color: #C51162;
}
a:visited {
color: #F5F5F5;
}
.striken {
text-decoration: line-through;
color: var(--trinary-foreground-color);
color: #F5F5F5;
}
#mainwrapper {
@ -55,14 +49,20 @@ a:hover {
#disc {
padding: 12px 32px;
background-color: var(--secondary-background-color);
/* #212121 but 93% transparent and mixed to appear at the same lumonocity*/
background-color: rgba(36,36,36,237);
}
#links {
display: flex;
flex-wrap: wrap;
align-items: baseline;
}
#header {
font-family: 'Raleway', sans-serif;
font-weight: 300;
font-size: 64px;
color: var(--secondary-foreground-color);
color: #FAFAFA;
}