Install screen

a7f25403 · Bob Mottram · 858339a8 · a7f25403 · a7f25403 · 858339a8
Commit a7f25403 authored 6 years ago by Bob Mottram
--- a/img/icon_desktop.png
+++ b/img/icon_desktop.png
--- a/img/icon_sbc.png
+++ b/img/icon_sbc.png
--- a/img/logo.png
+++ b/img/logo.png
--- a/img/logo_color.png
+++ b/img/logo_color.png
--- a/website/EN/freedombone.css
+++ b/website/EN/freedombone.css
@@ -21,14 +21,14 @@ a:hover {

 a:active {
    background-color: #427fed;
-    color: #fffff6;
+    color: #ffffff;
 }

 body {
-    background-color: #fffff6;
+    background-color: #ffffff;
    background-image: none;
    color: #330;
-    font-family: georgia;
+    font-family: Arial;
    font-size: 15pt;
    margin: 2em auto;
    padding: 0 2em;
@@ -37,7 +37,7 @@ body {
 }

 h1, h2, h3, h4, h5, h6 {
-    color: #703820;
+    color: #72a7cf;
    line-height: 1.2em;
 }


--- a/website/EN/install.html
+++ b/website/EN/install.html
+<!DOCTYPE html>
+<html>
+  <style>
+    * {
+        box-sizing: border-box;
+    }
+
+    a, u {
+        text-decoration: none;
+        color: #72a7cf;
+        font-weight: bold;
+    }
+
+    a:visited{
+        color: #72a7cf;
+        font-weight: bold;
+    }
+
+    #headerpic {
+        width: 60%;
+        height: auto;
+        margin-right : auto;
+        margin-left : auto;
+        min-width : 220px;
+    }
+
+    body {
+        margin: 0;
+        font-family: Arial;
+    }
+
+    .header {
+        text-align: center;
+        padding: 32px;
+    }
+
+    .headertext {
+        color: #72a7cf;
+        text-align: center;
+        font-size: 120%;
+        font-weight: bold;
+    }
+
+    .row {
+        display: -ms-flexbox;
+        display: flex;
+        -ms-flex-wrap: wrap;
+        flex-wrap: wrap;
+        padding: 0 4px;
+    }
+
+    .column {
+        -ms-flex: 25%;
+        flex: 25%;
+        max-width: 25%;
+        padding: 0 4px;
+    }
+    .columnempty {
+        -ms-flex: 25%;
+        flex: 25%;
+        max-width: 25%;
+        padding: 0 4px;
+    }
+
+    .column img {
+        margin-top: 8px;
+        vertical-align: middle;
+    }
+
+    @media screen and (max-width: 600px) {
+        .column {
+            -ms-flex: 50%;
+            flex: 25%;
+            max-width: 50%;
+        }
+        .columnempty {
+            -ms-flex: 0%;
+            flex: 0%;
+            max-width: 0%;
+        }
+    }
+
+    @media screen and (max-width: 200px) {
+        .column {
+            -ms-flex: 25%;
+            flex: 25%;
+            max-width: 25%;
+        }
+    }
+  </style>
+  <body>
+
+    <div class="header">
+      <a href="index.html"><img id="headerpic" class="img-responsive" src="images/logo.png"></a>
+
+      <p class="headertext">Select the hardware to install onto</p>
+
+      <div class="row">
+        <div class="columnempty">
+          <div>
+          </div>
+        </div>
+        <div class="column">
+          <div>
+            <a href="./blocking.html">
+              <img src="images/icon_desktop.png" style="width:100%">
+              <center>Desktop/Laptop</center>
+            </a>
+          </div>
+        </div>
+        <div class="column">
+          <div>
+            <a href="./dynamicdns.html">
+              <img src="images/icon_sbc.png" style="width:100%">
+              <center>Single Board Computer</center>
+            </a>
+          </div>
+        </div>
+      </div>
+        <div class="columnempty">
+          <div>
+          </div>
+        </div>
+    </div>
+
+  </body>
+</html>
--- a/website/freedombone.css
+++ b/website/freedombone.css
@@ -21,14 +21,14 @@ a:hover {

 a:active {
    background-color: #427fed;
-    color: #fffff6;
+    color: #ffffff;
 }

 body {
-    background-color: #fffff6;
+    background-color: #ffffff;
    background-image: none;
    color: #330;
-    font-family: georgia;
+    font-family: Arial;
    font-size: 15pt;
    margin: 2em auto;
    padding: 0 2em;
@@ -37,7 +37,7 @@ body {
 }

 h1, h2, h3, h4, h5, h6 {
-    color: #703820;
+    color: #72a7cf;
    line-height: 1.2em;
 }