diff --git a/css/design.css b/css/design.css index 8e4478a20ad959c21fc9390d7cae7c2bfedcddf1..4fbfe18658e3033a4f72cf85a12301fab9cc1317 100644 --- a/css/design.css +++ b/css/design.css @@ -8,6 +8,31 @@ body { font-family: Arial, serif; overflow: hidden; } +.impressum { + position: absolute; + left: 0px; + top: 0px; + color: #fff; + margin: 10px; + z-index: 1000; + background: #000; + font-size: 3em; + transition: opacity 5s 2s; + opacity: 0; + animation: 3s ease-out 0s 1 fadeOut; +} +.impressum:hover { + opacity: 1; + transition: none; +} +@keyframes fadeOut { + 0% { + opacity: 1; + } + 100% { + opacity: 0; + } +} [data-container=panel], [data-container=noscript] { background-color: rgba(8, 8, 8, 0.68); diff --git a/css/design.less b/css/design.less index c8d338a92bf33d7176788dbbc2cb746524b22e00..1de0ee349088054ad2c105c85726e3dffcd16a5d 100644 --- a/css/design.less +++ b/css/design.less @@ -12,6 +12,33 @@ body { overflow:hidden; } +.impressum { + position: absolute; + left: 0px; + top: 0px; + color: #fff; + margin: 10px; + z-index: 1000; + background: #000; + font-size: 3em; + transition: opacity 5s 2s; + opacity: 0; + animation: 3s ease-out 0s 1 fadeOut; +} +.impressum:hover { + opacity: 1; + transition: none; +} +@keyframes fadeOut { + 0% { + opacity: 1; + } + 100% { + opacity: 0; + } +} + + [data-container=panel] { background-color: rgba(8, 8, 8, 0.68); border: solid 1px #252525; diff --git a/index.html b/index.html index ddb75574cfdf8131d3efa5cf849e759404cb78d6..dea6c8a080f25c00947a0aac10be66ced8f7f562 100644 --- a/index.html +++ b/index.html @@ -23,5 +23,6 @@ <div data-container="noscript">Diese Seite benötigt JavaScript!</div> </noscript> </div> +<a href="https://oh14.de/impressum.html" class="impressum">Impressum</a> </body> </html>