diff --git a/fedi/index.css b/fedi/index.css new file mode 100644 index 0000000..f765128 --- /dev/null +++ b/fedi/index.css @@ -0,0 +1,148 @@ +.center { + text-align: center; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + will-change: transform; + animation: blurIn 500ms ease-in-out; +} + +.content { + will-change: transform; + animation: blurIn 500ms ease-in-out; +} + +@media (prefers-color-scheme: dark) { + body { + animation: fadeIn 500ms ease-in-out; + background-color: black; + color: white; + font-family: system-ui, sans-serif; + margin: 1em auto; + padding: 1em; + max-width: 50em; + } + .button { + display:inline-block; + padding:10px 24px; + margin:2px; + border-radius:24px; + background-color:#1b1b1b; + color:#ffffff; + text-decoration:none; + font-size:16px; + margin-bottom:16px; + box-shadow:inset 0 0.0625rem 0 rgb(255 255 255 / 0.1); + transition: 0.3s ease-out; + } + + .button-white { + background-color:#ffffff; + color:#000000 + } + + .button:hover { + background-color:#ffffff; + color:#000000; + } + .link { + color: #ffffff; + background-color: #1b1b1b; + font-size: 0.9em; + text-decoration: none; + border-radius: 6px; + padding: 0.2em 0.7em; + transition: 0.2s; + } + + .link-large { + margin-bottom:16px; + padding:10px 24px; + margin:2px; + border-radius: 30px + } + + .link:hover { + color: #000000; + background-color: #ffffff; + } +} + +@media (prefers-color-scheme: light) { + body { + animation: fadeIn 500ms ease-in-out; + background-color: white; + color: black; + font-family: system-ui, sans-serif; + margin: 1em auto; + padding: 1em; + max-width: 50em; + } + .button { + display:inline-block; + padding:10px 24px; + margin:2px; + border-radius:24px; + background-color: #ebebeb; + color: black; + text-decoration:none; + font-size:16px; + margin-bottom:16px; + box-shadow:inset 0 0.0625rem 0 rgb(255 255 255 / 0.1); + transition: 0.3s ease-out; + } + + .button-white { + background-color: black; + color: white + } + + .button:hover { + background-color: black; + color: white; + } + .link { + color: black; + background-color: #ebebeb; + font-size: 0.9em; + text-decoration: none; + border-radius: 6px; + padding: 0.2em 0.7em; + transition: 0.2s; + } + + .link-large { + margin-bottom:16px; + padding:10px 24px; + margin:2px; + border-radius: 30px + } + + .link:hover { + color: white; + background-color: black; + } +} + +h1, h2, h3 { + font-weight: normal; +} + +@keyframes fadeIn { + from { + opacity:0; + } + to { + opacity:1; + } +} + +@keyframes blurIn { + from { + filter: blur(0.2rem); + } + to { + filter: blur(0rem); + } +} diff --git a/fedi/index.html b/fedi/index.html new file mode 100644 index 0000000..f814b5d --- /dev/null +++ b/fedi/index.html @@ -0,0 +1,12 @@ + + + + everypizza.im + + + + +
+

Stub page

+
+ diff --git a/test/index.css b/test/index.css new file mode 100644 index 0000000..f765128 --- /dev/null +++ b/test/index.css @@ -0,0 +1,148 @@ +.center { + text-align: center; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + will-change: transform; + animation: blurIn 500ms ease-in-out; +} + +.content { + will-change: transform; + animation: blurIn 500ms ease-in-out; +} + +@media (prefers-color-scheme: dark) { + body { + animation: fadeIn 500ms ease-in-out; + background-color: black; + color: white; + font-family: system-ui, sans-serif; + margin: 1em auto; + padding: 1em; + max-width: 50em; + } + .button { + display:inline-block; + padding:10px 24px; + margin:2px; + border-radius:24px; + background-color:#1b1b1b; + color:#ffffff; + text-decoration:none; + font-size:16px; + margin-bottom:16px; + box-shadow:inset 0 0.0625rem 0 rgb(255 255 255 / 0.1); + transition: 0.3s ease-out; + } + + .button-white { + background-color:#ffffff; + color:#000000 + } + + .button:hover { + background-color:#ffffff; + color:#000000; + } + .link { + color: #ffffff; + background-color: #1b1b1b; + font-size: 0.9em; + text-decoration: none; + border-radius: 6px; + padding: 0.2em 0.7em; + transition: 0.2s; + } + + .link-large { + margin-bottom:16px; + padding:10px 24px; + margin:2px; + border-radius: 30px + } + + .link:hover { + color: #000000; + background-color: #ffffff; + } +} + +@media (prefers-color-scheme: light) { + body { + animation: fadeIn 500ms ease-in-out; + background-color: white; + color: black; + font-family: system-ui, sans-serif; + margin: 1em auto; + padding: 1em; + max-width: 50em; + } + .button { + display:inline-block; + padding:10px 24px; + margin:2px; + border-radius:24px; + background-color: #ebebeb; + color: black; + text-decoration:none; + font-size:16px; + margin-bottom:16px; + box-shadow:inset 0 0.0625rem 0 rgb(255 255 255 / 0.1); + transition: 0.3s ease-out; + } + + .button-white { + background-color: black; + color: white + } + + .button:hover { + background-color: black; + color: white; + } + .link { + color: black; + background-color: #ebebeb; + font-size: 0.9em; + text-decoration: none; + border-radius: 6px; + padding: 0.2em 0.7em; + transition: 0.2s; + } + + .link-large { + margin-bottom:16px; + padding:10px 24px; + margin:2px; + border-radius: 30px + } + + .link:hover { + color: white; + background-color: black; + } +} + +h1, h2, h3 { + font-weight: normal; +} + +@keyframes fadeIn { + from { + opacity:0; + } + to { + opacity:1; + } +} + +@keyframes blurIn { + from { + filter: blur(0.2rem); + } + to { + filter: blur(0rem); + } +} diff --git a/test/index.html b/test/index.html new file mode 100644 index 0000000..f814b5d --- /dev/null +++ b/test/index.html @@ -0,0 +1,12 @@ + + + + everypizza.im + + + + +
+

Stub page

+
+