Add reserved page

2024-06-26 09:54:11 +02:00 · 2024-06-26 09:54:11 +02:00 · c2b4f24f3b
commit c2b4f24f3b
parent 9dbc5c18c8
1 changed files with 88 additions and 0 deletions
--- a/reserved.html
+++ b/reserved.html
@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html lang="nl">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <link rel="icon" type="image/png" href="https://www.smartyellow.nl/favicon.png" />
+        <link rel="stylesheet" href="https://fonts.bunny.net/css?family=poppins:300,600&display=swap" />
+
+        <title>Domeinnaam gereserveerd</title>
+
+        <style>
+            html, body {
+                margin: 0;
+                padding: 0;
+                background-color: #313131;
+                color: #fff;
+                font-size: 24px;
+                font-weight: 300;
+                font-family: Poppins, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+                text-align: center;
+                line-height: 1.75em;
+            }
+            body {
+                margin: 20vh auto 1rem;
+                padding: 1rem;
+                max-width: 520px;
+            }
+
+            header {
+                display: flex;
+                justify-content: center;
+                margin-bottom: 2rem;
+            }
+            header h1 {
+                display: flex;
+                align-items: center;
+                line-height: 1;
+                height: 3rem;
+                margin: 0;
+                background: no-repeat url('data:image/svg+xml,%3Csvg viewBox="0 0 1250 1255" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2"%3E%3Cpath style="fill:none" d="M0 .3h1250v1250H0z"/%3E%3Cpath d="m597 364.8 45.6 3.8-71.4 82.4 176.6 14.7 69 169-75 86.6 45.5 3.8-71.3 82.4 177.5 14.7 121.7 298-317 130.1-117.2-287 135-155.8-45.6-3.8 71.4-82.4L473 698.9l-37.4-91.4L571.2 451l-45.6-3.8 71.4-82.4-269.7-22.4L248 148 565 18l106.6 260.8-74.5 86Zm-232.3 69 161 13.4-105.7 122 15.6 38.3-71.4 82.4 108.8 9 37.3 91.5 160 13.3-105 121.3 15.7 38.3-197.7 228.2-258.7-225 36.8-42.5-27.8-24.3 113.6-131.2-210-17.5 7.2-87.7L0 659.6l28.3-342 299 24.8 37.4 91.5Zm-46 252.3-71.5 82.4 45.6 3.8L161.4 924l230.8 200.7L565.3 925l-55-134.6-217.5-18.1 71.4-82.4-45.6-3.8 101.4-117L364.7 434l-299.3-25-21 254.4 274.2 22.8Zm816-418.3 27.8 24.3-96.8 111.7 147.2 12.2-7.3 87.8 44.4 3.6-28.3 342.1-328.2-27.3-37.4-91.4-68.8-5.7 45.2-52.1-15.7-38.4 132-152.2-201-16.7-37.3-91.4-68-5.7 44.7-51.4-15.7-38.4L912.8.3l258.7 225-36.8 42.5ZM710.5 374.3 1020 400l-71.4 82.4 45.6 3.8L832.5 673l23.6 57.8 328.5 27.3 21-254.3-211.3-17.6 71.4-82.4-45.6-3.8 114.6-132.2L903.9 67 687.2 317.2l23.3 57Z" style="fill:%23e99903"/%3E%3C/svg%3E%0A');
+                padding-left: 4rem;
+                font-size: 1.4rem;
+                font-weight: 600;
+                color: #e99903;
+            }
+            header h1 a {
+                text-decoration: none;
+            }
+
+            main {
+                padding: 1rem;
+                border: 4px solid #272727;
+                border-width: 2px 3px 5px;
+                border-radius: 8px;
+            }
+
+            a {
+                color: inherit;
+                text-decoration: underline;
+                text-underline-offset: 4px;
+                text-decoration-thickness: 1px;
+            }
+            a:hover {
+                text-decoration: none;
+            }
+            a:active {
+                opacity: 0.8;
+            }
+        </style>
+    </head>
+
+    <body>
+        <header>
+            <h1><a href="https://www.smartyellow.nl">Smart Yellow</a></h1>
+        </header>
+
+        <main>
+            <span class="domain">Dit domein</span>
+            is gereserveerd voor een klant van Smart Yellow
+        </main>
+
+        <script>
+            if (window.location.hostname) {
+                document.querySelector('.domain').innerHTML = window.location.hostname;
+            }
+        </script>
+    </body>
+</html>