From fecb04e0e437326099c0c8d0332cc223b3acf6fc Mon Sep 17 00:00:00 2001 From: orange Date: Fri, 10 Mar 2023 17:36:13 +0600 Subject: [PATCH] =?UTF-8?q?=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=B8=D0=BB=20?= =?UTF-8?q?=D0=A1=D0=B0=D0=B9=D1=82?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Header.css | 67 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ index.html | 20 ++++++++++++++++ script.js | 0 style.css | 17 ++++++++++++++ 4 files changed, 104 insertions(+) create mode 100644 Header.css create mode 100644 index.html create mode 100644 script.js create mode 100644 style.css diff --git a/Header.css b/Header.css new file mode 100644 index 0000000..0abd97d --- /dev/null +++ b/Header.css @@ -0,0 +1,67 @@ +.header { + position: fixed; + height: 32px; + width: 100%; + background: #04030f; +} +.header > img { + height: 100%; + position: relative; + margin: auto; + display: block; + padding: 4px 0px 4px 0px; +} +.header > div.link { + display: block; + position: relative; + top: -32px; + margin: auto; + width: 96px; + height: 32px; + padding: 4px 0px 4px 0px; + opacity: 0; + background: #04030f; + background-image: url(img/g5183-6.svg); + background-repeat: no-repeat; + background-size: 96px; + background-position: 50% 4px; + /* transition: opacity .3s ease, height .3s ease, top 0s ease; */ + animation: checks .3s forwards; +} +.header > div.link:hover { + animation: check .3s forwards; + width: 100%; + height: 64px; + opacity: 1; +} +.header > div.link:hover > a.Discord { + display: block; +} +.header > div.link > a.Discord { + color: white; + display: none; + text-align: center; + position: relative; + top: calc(100% - 14px - (50% / 4)); + font-size: 14px; +} +@keyframes check { + 0% { + opacity: 0; + height: 32px; + } + 100% { + opacity: 1; + height: 64px; + } +} +@keyframes checks { + 0% { + opacity: 1; + height: 64px; + } + 100% { + opacity: 0; + height: 64px; + } +} \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..632f0bb --- /dev/null +++ b/index.html @@ -0,0 +1,20 @@ + + + + + + Document + + + + +
+ Logo + +
+
+ + + \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..e69de29 diff --git a/style.css b/style.css new file mode 100644 index 0000000..2354f94 --- /dev/null +++ b/style.css @@ -0,0 +1,17 @@ +@import url("https://fonts.googleapis.com/css?family=Martian+Mono"); + +* { + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: "Martian Mono", monospace; + font-size: 14pt; +} +body { + background: #24232f; +} + +.elem { + width: 20px; + height: 2000px; +} \ No newline at end of file