Initial commit, updated README.md

2018-04-15 19:14:33 +03:00 · 2018-04-15 19:14:33 +03:00 · 37ad5457ae
parent c9840db11c
commit 37ad5457ae
4 changed files with 120 additions and 2 deletions
--- a/README.md
+++ b/README.md
@ -1,2 +1,13 @@
-# digital-signage_at_k-space
-Make signs the easy way.
+# Digital Signs @ k-space.ee
+
+Make signs the easy way. Just open up your browser, type in the info and print! Yes, print!
+
+![select](/demo.gif)
+
+## Install
+
+Easy, install a webserver and put the included index.html and signs.css file into the public webroot directory.
+
+## License
+
+[MIT](LICENSE)
--- a/demo.gif
+++ b/demo.gif
--- a/public/index.html
+++ b/public/index.html
@ -0,0 +1,22 @@
+<!DOCTYPE HTML>
+<html>
+
+<head>
+	<title>Signs @ k-space</title>
+	<meta name="description" content="Signs @ k-space.ee">
+	<meta name="Author" content="Jaan Janesmae">
+	<meta charset="utf-8">
+	<meta content="width=device-width,initial-scale=1" name="viewport">
+	<link href="https://fonts.googleapis.com/css?family=Orbitron" rel="stylesheet">
+	<link href="signs.css" rel="stylesheet">
+</head>
+
+<body>
+	<section class="sheet padding-10mm">
+		<div class="logo">k-space.ee</div>
+		<div class="main" contentEditable="true"><br>Hack<br>the<br>planet!</div>
+		<div class="subline" contentEditable="true"><br>Never stop learning!<br>And have fun while doing it.</div>
+	</section>
+</body>
+
+</html>
--- a/public/signs.css
+++ b/public/signs.css
@ -0,0 +1,85 @@
+@page {
+        margin: 0;
+        size: A4 landscape;
+}
+
+html {
+        font-family: 'Orbitron', sans-serif;
+}
+
+body {
+        margin: 0;
+        width: 297mm;
+        height: 209mm;
+}
+
+.sheet {
+        position: relative;
+        box-sizing: border-box;
+        page-break-after: always;
+        padding: 10mm;
+}
+
+/* Put everything in the correct location */
+
+.logo {
+        font-size: 15mm;
+}
+
+.main {
+        font-size: 25mm;
+        width: 100%;
+        height: 12.5cm;
+        margin: 1cm 0;
+        text-align: center;
+}
+
+.subline {
+        font-size: 12mm;
+        text-align: center;
+}
+
+/** Screen **/
+
+@media screen {
+        body {
+                background: #eee
+        }
+        .sheet {
+                background: white;
+                box-shadow: 0 .5mm 2mm rgba(0, 0, 0, .3);
+                margin: 20mm auto;
+        }
+        .sheet, .sheet::before, .sheet::after {
+                box-shadow: 1px 1px 1px rgba(0, 0, 0, .4);
+                border: 1px solid #bbb;
+        }
+        .sheet::before, .sheet::after {
+                content: "";
+                position: absolute;
+                width: 297mm;
+                height: 210mm;
+                background-color: #eee;
+        }
+        .sheet::before {
+                right: 15px;
+                top: 0;
+                transform: rotate(-1deg);
+                z-index: -1;
+        }
+        .sheet::after {
+                top: 5px;
+                right: -5px;
+                transform: rotate(1deg);
+                z-index: -2;
+        }
+}
+
+@media print {
+        body {
+                width: 297mm
+        }
+        .sheet {
+                overflow: hidden;
+        }
+}