From 24f3e90235cf25fc069330b98ed68d1b00e3bfe9 Mon Sep 17 00:00:00 2001 From: Pet Date: Thu, 12 Apr 2018 20:51:16 +0200 Subject: [PATCH] Updated Lackis infoscreen layout --- public/iframe/infoscreenframe.css | 134 ++++++++++++++++++++++++++++++ 1 file changed, 134 insertions(+) create mode 100644 public/iframe/infoscreenframe.css diff --git a/public/iframe/infoscreenframe.css b/public/iframe/infoscreenframe.css new file mode 100644 index 0000000..919656e --- /dev/null +++ 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; + } +}