CSS cleanup, use HTML5 tags instead of divs

parent 6ffef053
......@@ -4,7 +4,6 @@ body {
background-color: $bg-color1;
color: $fg-color-normal;
font-family: sans-serif;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
a {
......@@ -29,7 +28,7 @@ svg {
}
}
.header {
header {
background-color: $bg-color3;
box-shadow: 0 5px 5px 0 $shadow-color;
font-size: 1.3em;
......@@ -41,21 +40,11 @@ svg {
z-index: 5;
.title,
.menu .entry {
nav.menu .entry {
padding: $header-height/3.5 $header-height/3.5 0;
}
.title {
padding-right: 30px;
}
@media (max-width: $small-screen-max-width) {
.menu {
min-width: 100%;
}
}
.menu {
nav.menu {
display: flex;
position: relative;
......@@ -76,17 +65,12 @@ svg {
opacity: 1;
}
.menu-border {
$border-height: 3px;
background-color: $fg-color-normal;
height: $border-height;
left: 0;
position: absolute;
top: $header-height - $border-height;
@media (max-width: $small-screen-max-width) {
min-width: 100%;
}
}
.icons {
nav.icons {
position: absolute;
right: $header-height/3.5;
top: $header-height/3.5;
......@@ -112,13 +96,13 @@ svg {
}
}
.cards {
section.cards {
display: flex;
flex-flow: row wrap;
margin-left: -$content-spacing;
margin-top: -$content-spacing;
.card {
article.card {
background-color: $bg-color2;
box-shadow: -5px 5px 5px 0 $shadow-color;
flex-grow: 1;
......
{{define "error404"}}
{{template "header" . }}
<div class="page">
<div class="cards">
<div class="card">
<section class="cards">
<article class="card">
<h3>Error 404</h3>
<p>not found</p>
</div>
</div>
</article>
</section>
</div>
{{template "footer"}}
{{end}}
\ No newline at end of file
......@@ -20,7 +20,7 @@
<link rel="icon" type="image/png" href="/img/favicon-194x194.png" sizes="194x194">
</head>
<body>
<div class="header">
<header>
<div class="left title">
hashworks.net
</div>
......@@ -31,10 +31,9 @@
<a href="/status" class="entry{{ if .StatusTab }} active{{ end }}">
status
</a>
<div class="menuBorder"></div>
</nav>
<div class="icons">
<nav class="icons">
<a href="https://github.com/hashworks" target="_blank" class="icon">
<svg height="23px" width="24px">
<desc>GitHub Icon</desc>
......@@ -53,9 +52,8 @@
<path d="M480.5,251c0-27.7-22.2-50.2-49.5-50.2c-13,0-24.7,5-33.6,13.3c-32.4-22.8-76.1-37.8-124.9-40.6l21.9-73.2l67.1,13.5 c2.3,22.7,21.2,40.4,44.3,40.4c0.1,0,0.1,0,0.2,0c0.1,0,0.1,0,0.2,0c24.6,0,44.5-20.2,44.5-45.1S430.7,64,406.1,64 c-0.1,0-0.1,0-0.2,0c0,0-0.1,0-0.1,0c-17.2,0-32,9.8-39.5,24.3l-89.7-18l-30.8,103l-2.5,0.1c-50.3,2.2-95.5,17.4-128.7,40.7 c-8.8-8.3-20.6-13.3-33.6-13.3c-27.3,0-49.5,22.5-49.5,50.2c0,19.6,11,36.5,27.1,44.8c-0.8,4.9-1.2,9.8-1.2,14.8 C57.5,386.4,146.4,448,256,448s198.5-61.6,198.5-137.5c0-5-0.4-9.9-1.1-14.8C469.5,287.4,480.5,270.5,480.5,251z M65.8,271.1 c-6.6-4.5-10.9-12.1-10.9-20.8c0-13.8,11.1-25.1,24.7-25.1c5.6,0,10.8,1.9,15,5.1C81.1,242.2,71.1,256,65.8,271.1z M389.3,109.1 c0-9.2,7.4-16.8,16.5-16.8s16.5,7.5,16.5,16.8c0,9.2-7.4,16.8-16.5,16.8S389.3,118.4,389.3,109.1z M158.5,288.4 c0-17.6,14.2-31.8,31.8-31.8s31.8,14.2,31.8,31.8c0,17.6-14.2,31.8-31.8,31.8S158.5,306,158.5,288.4z M256,400 c-47.6-0.2-76-28.5-77.2-29.7l12.6-12.4c0.2,0.2,23.7,24.2,64.6,24.4c40.3-0.2,64.2-24.2,64.5-24.4l12.6,12.4 C331.9,371.5,303.6,399.8,256,400z M322.3,320.2c-17.6,0-31.8-14.2-31.8-31.8c0-17.6,14.2-31.8,31.8-31.8s31.8,14.2,31.8,31.8 C354.1,306,339.8,320.2,322.3,320.2z M446.4,271.5c-5.4-15.3-15.6-29.4-29.3-41.4c4.2-3.3,9.5-5.2,15.2-5.2 c13.9,0,25.1,11.4,25.1,25.5C457.5,259.2,453.1,266.9,446.4,271.5z"></path>
</svg>
</a>
</div>
</div>
</nav>
</header>
<div class="content">
{{end}}
\ No newline at end of file
{{define "index"}}
{{template "header" . }}
<div class="page">
<div class="cards">
<div class="card full">
<section class="cards">
<article class="card full">
<h3>Contact</h3>
<!--<div class="tag">tag</div>-->
<p>You can contact me by mail using <a href="mailto:mail@hashworks.net">mail@hashworks.net</a>.</p>
<p>My PGP public key is available <a href="/static/pgp_public_key.asc">here</a>.</p>
<br/>
<p>Additionally you can find me as `hashworks` on the <a href="https://freenode.net/" target="_blank">freenode irc network</a>.</p>
</div>
</div>
</div>
</article>
</section>
</div>
{{template "footer"}}
{{end}}
\ No newline at end of file
{{define "status"}}
{{template "header" . }}
<div class="page">
<div class="cards">
<div class="card full">
<h3>heart-rate</h3>
<section class="cards">
<article class="card full">
<h3>Heart-rate</h3>
<br/>
<div class="status-svg">
<div></div>
</div>
</div>
</div>
</article>
</section>
</div>
{{template "footer"}}
{{end}}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment