removed font, added colors as variables, fixed favicon

5 years ago · 5dc62542d7
2 changed files with 23 additions and 10 deletions
--- a/index.html
+++ b/index.html
@ -4,8 +4,7 @@
 	<meta charset="utf-8">
 	<meta name="viewport" content="width=device-width, initial-scale=1.0">
 	<link rel="stylesheet" type="text/css" href="style.css"/>
-	<link rel="stylesheet" type="text/css" href="fonts/inconsolata.css"/>
-	<link rel"icon" type="image/png" href="img/favicon.png"/>
+	<link rel="icon" type="image/png" href="img/favicon.png"/>
        <title>Jmix</title>
 </head>
 <body>
--- a/style.css
+++ b/style.css
@ -1,14 +1,28 @@
+/* getting colors from my Xresources */
+:root {
+	--color0:   #0F0F0F;
+	--color1:   #b2564d;
+	--color2:   #c39c74;
+	--color3:   #7c60ba;
+	/* This ones are still unused */
+	--color4:   #af6ec1;
+	--color5:   #d7a4ab;
+	--color6:   #bc6469;
+	--color7:   #c7c3c3;
+	--color8:   #594d4b;
+	--color9:   #b2564d;
+}
+
 body{
 	margin: 0;
-	font-family: "Inconsolata", monospace;
 	color: white;
-	background: #0F0F0F;
+	background: var(--color0);
 }

-h1{font-size: 2em !important; color: #7c60ba;}
+h1{font-size: 2em !important; color: var(--color3);}
 p, a, li{font-size: 1.2em;}
-a{text-decoration: none; color: #c39c74;}
-a:hover{color: #b2564d}
+a{text-decoration: none; color: var(--color2);}
+a:hover{color: var(--color1)}

 .flex-row{
 	display: flex;
@ -22,7 +36,7 @@ header{
 	height: 30px;
 	position: fixed;
 	width: 100%;
-	background: #b2564d;
+	background: var(--color1);
 	padding: 5px;
 }

@ -47,10 +61,10 @@ header a, header a:hover{

 /* Only works with !important -.- */
 #menu a:hover, .active{
-	border-bottom: 3px double #c39c74 !important;
+	border-bottom: 3px double var(--color2) !important;
 }
 #menu a:hover{
-	background: #7c60ba;
+	background: var(--color3);
 }

 #content{