Skapade huvudsida

en-programmerare · web-flow · commit 1e0c6253892b · 2021-10-20T15:30:42.000+02:00
diff --git a/404.html b/404.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html lang="sv">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width,initial-scale=1">
+    <title>Sidan hittades inte - En programmerare</title>
+    <link rel="stylesheet" href="start.css" type="text/css" media="all">
+</head>
+<body>
+   <div class="rubrik">Sidan hittades inte</div>
+   <a href="https://en-programmerare.github.io/">
+      <div class="gymnasieval" style="background-color: grey">
+         Start
+      </div>
+   </a>
+</body>
+</html>
diff --git a/index.html b/index.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="sv">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width,initial-scale=1">
+    <title>En programmerares struntprojekt</title>
+    <link rel="stylesheet" href="start.css" type="text/css" media="all">
+</head>
+<body>
+   <div class="rubrik">Strunt</div>
+   <a href="https://en-programmerare.github.io/strunt/zpel.html">
+      <div class="gymnasieval" style="background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url('https://www.publicdomainpictures.net/pictures/210000/nahled/letter-z-1490187015Mgg.jpg')">
+         Zpel
+      </div>
+   </a>
+   <a href="https://en-programmerare.github.io/strunt/lektionenslutar.html">
+      <div class="gymnasieval" style="background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)),url('https://cdn.pixabay.com/photo/2015/10/11/20/19/hourglass-983001_1280.jpg')">
+         Lektionen slutar
+      </div>
+   </a> 
+</body>
+</html>
diff --git a/start.css b/start.css
@@ -0,0 +1,37 @@
+.gymnasieval {
+   height: 40vw;
+   width: 40vw;
+   overflow: hidden;
+   background-size: cover;
+   display: inline-block;
+   color: white;
+   text-decoration: none;
+   font-size: 7vw;
+   line-height: 40vw;
+   border-radius: 5px;
+   text-align: center;
+   border-style: solid;
+   border-color: black;
+}
+a {
+   text-decoration: none;
+}
+body {
+   text-align: center;
+}
+.rubrik {
+   font-size: 10vw;
+   font-weight: bold;
+}
+@media only screen and (min-width: 500px) {
+   .gymnasieval {
+      height: 20vw;
+      width: 20vw;
+      font-size: 3vw;
+      line-height: 20vw;
+   }
+   .rubrik {
+      font-size: 5vw;
+      font-weight: bold;
+   }
+}
