Updated Lackis infoscreen layout

2018-04-12 20:51:16 +02:00
parent ef1135962e
commit 24f3e90235
1 changed files with 134 additions and 0 deletions
--- a/public/iframe/infoscreenframe.css
+++ b/public/iframe/infoscreenframe.css
@@ -0,0 +1,134 @@
+html {
+    background-color: #fff;
+    overflow: hidden;
+}
+
+body {
+    display: flex;
+    flex-flow: wrap;
+    height: 100vh;
+    justify-content: space-between;
+    flex-direction: column;
+}
+
+.header {
+    height: 200px;
+    width: 100%
+}
+
+svg {
+    padding-top: 2em;
+}
+
+.impulsPath {
+    fill: none;
+    stroke: #04669c;
+    stroke-miterlimit: 1;
+    stroke-width: 6px;
+    stroke-dasharray: 1946.243;
+    stroke-dashoffset: 0;
+    stroke-linejoin: round;
+    stroke-linecap: round;
+    animation: dash 10s ease-out infinite;
+    animation-direction: normal;
+}
+
+.FET-logotext-stroke {
+    fill: #fff;
+}
+
+#FET-logotext {
+    opacity: 0;
+    animation: logotext 10s ease-in infinite;
+
+}
+
+
+.content-area {
+
+    height: auto;
+    width: 100%;
+}
+
+.footer {
+    width: 100%;
+    height: 150px;
+    background-color: #04669c;
+    padding-bottom: 10px;
+    display: flex;
+    flex-wrap: nowrap;
+    justify-content: space-between;
+    color: #fff;
+    flex-basis: bottom;
+}
+
+.footer h3,
+p {
+    margin: 0;
+    padding: 0 20px;
+    font-family: Helvetica, Arial;
+    letter-spacing: 0.1em;
+}
+
+.footer h3 {
+    padding-top: 20px;
+}
+
+.footer .adress {
+    margin: auto;
+    text-align: left;
+}
+
+.footer .contact {
+    margin: auto;
+    text-align: center;
+}
+
+.footer .servicecontainer{
+    display: inline-flex;
+    margin: auto;
+    
+}
+.footer .servicecontainer .servicetime {
+    margin: auto;
+    text-align: right;
+}
+
+.footer .servicecontainer .servicetime #time {
+    font-size: 0.7em
+}
+
+.footer .servicecontainer .servicestatus{
+    margin: auto;
+    width:20px;
+    height: 100%
+    padding-right: 30px;
+    background-color: #fff;
+}
+
+
+
+
+/*K E Y F R A M E S*/
+
+@keyframes dash {
+    from {
+        stroke-dashoffset: 1946.243;
+        opacity: 0;
+        stroke-width: 0.5;
+    }
+    to {
+        opacity: 1;
+        stroke-dashoffset: 0;
+        stroke-width: 5px;
+    }
+}
+
+@keyframes logotext {
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
+}