diff --git a/asset/logo-1024.png b/asset/logo-1024.png new file mode 100644 index 0000000..20f87d5 Binary files /dev/null and b/asset/logo-1024.png differ diff --git a/asset/logo-2048.png b/asset/logo-2048.png new file mode 100644 index 0000000..9013e16 Binary files /dev/null and b/asset/logo-2048.png differ diff --git a/asset/logo-256.png b/asset/logo-256.png new file mode 100644 index 0000000..9ac284a Binary files /dev/null and b/asset/logo-256.png differ diff --git a/asset/logo-512.png b/asset/logo-512.png new file mode 100644 index 0000000..6476b16 Binary files /dev/null and b/asset/logo-512.png differ diff --git a/asset/logo.svg b/asset/logo.svg new file mode 100644 index 0000000..cb8a6cb --- /dev/null +++ b/asset/logo.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/meta.php b/meta.php index aaf36eb..7db3cc0 100644 --- a/meta.php +++ b/meta.php @@ -5,7 +5,9 @@ // DEPENDENCIES // // used extensions + self::$use[] = "lang"; self::$use[] = "page"; + self::$use[] = "file"; self::$use[] = "project"; diff --git a/page/start/index.php b/page/start/index.php new file mode 100644 index 0000000..3023f89 --- /dev/null +++ b/page/start/index.php @@ -0,0 +1,74 @@ +get("title")); + Page::icon("./asset/logo-256.png"); + Page::description($dict->get("description")); + + Page::lang($lang->get()); + Page::viewport(scale: 1, zoom: true); + + Page::robots(index: true, follow: true); + Page::author("Kim Endisch"); + Page::keywords("selbstbestimmungsgesetz-jetzt", "selbstbestimmungsgesetz", "selbstbestimmung", "tsg", "transsexuellengesetz", "roadmap", "timeline", "stand", "trans", "nicht-binär", "non-binary", "deutschland", "gender", "geschlecht", "identität"); + + Page::css(__DIR__ . "/style.css"); + + Page::font("ubuntu"); + Page::font("tabler"); +?> + + + + + +
+
+
+
+ + Über +
+
+
+ Content +
+
+
+
+
+ + + +
+
+ " alt="logo" /> + get("text_sourcecode") ?> + v +
+ +
+ + get() === "de" ? "class=\"selected\"" : "") ?> href="?lang=de">DE + | + get() === "en" ? "class=\"selected\"" : "") ?> href="?lang=en">EN +
+ +
+ © 2023 Kim Endisch + | + " target="_blank">get("text_imprint") ?> + | + " target="_blank">get("text_privacy_policy") ?> +
+
diff --git a/page/start/style.css b/page/start/style.css new file mode 100644 index 0000000..7c727b8 --- /dev/null +++ b/page/start/style.css @@ -0,0 +1,237 @@ +:root { + --color-bg: #21252b; + --color-bg-light: #2c313a; + + --color-white: #c5cad3; + + --color-gray: #828997; + --color-gray-dark: #5c6370; + --color-gray-dark-dark: #454b54; + + --color-red: #e06c75; + --color-red-light: #e9969d; + --color-red-dark: #cb4d58; + + --color-orange: #d19a66; + --color-orange-light: #ddb48d; + --color-orange-dark: #b9804b; + + --color-yellow: #dace71; + --color-yellow-light: #e5dc9a; + --color-yellow-dark: #c4b754; + + --color-green: #98c379; + --color-green-light: #b3d39c; + --color-green-dark: #7fa762; + + --color-cyan: #71d6bc; + --color-cyan-light: #98e1cf; + --color-cyan-dark: #55bea4; + + --color-blue: #61afef; + --color-blue-light: #90c7f4; + --color-blue-dark: #3e97e0; + + --color-purple: #c678dd; + --color-purple-light: #d7a1e8; + --color-purple-dark: #af5bc8; + + + + --theme: var(--color-green); +} +* { + box-sizing: border-box; +} + + + +html, body { + margin: 0; + padding: 0; + overflow-x: hidden; + + color: var(--color-white); + background-color: var(--color-bg); +} +html { + font-size: 16px; +} +body { + min-height: 100vh; + min-height: 100dvh; + + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + + font-size: 0; + font-family: "Ubuntu", sans-serif; +} +span, pre { + font-size: 1rem; +} +a { + text-decoration: none; +} + + + + + +/* PAGE LAYOUT */ +.page-container { + flex-grow: 1; + + display: flex; + flex-direction: column; + align-items: center; + justify-content: flex-start; + + padding: 8rem 4rem; +} +.page { + width: 100000px; + max-width: 50vw; + + display: flex; + flex-direction: column; + gap: 4rem; + + text-align: center; +} +@media only screen and (max-width: 1000px) { + .page { + max-width: 100vw; + } +} + + + + + +/* SECTIONS */ +.section { + width: 100%; +} + +.section > .header { + display: flex; + flex-direction: row; + align-items: center; + justify-content: flex-start; + gap: 0.5rem; + + color: var(--theme); +} +.section > .header .extra { + color: var(--color-gray); +} + +.section > .content { + display: flex; + flex-direction: column; + gap: 1rem; + + padding: 1rem 2rem; +} + + + + + +/* BOX */ +.box { + display: flex; + flex-direction: column; + gap: 1rem; + + padding: 2rem; + + border-radius: 2rem; + background-color: var(--color-bg-light); +} +.box.shrink { + display: inline-flex; +} +.box.important { + border: 0.5rem solid var(--theme); +} + +.box .title { + display: inline-flex; + flex-direction: row; + justify-content: center; + align-items: center; + gap: 1rem; + + color: var(--theme); + font-size: 2rem; +} + + + + + +/* FOOTER */ +.footer { + width: 100%; + + display: flex; + flex-direction: row; + justify-content: space-between; + flex-wrap: wrap; + gap: 1rem; + + padding: 1rem; + + background-color: var(--color-bg-light); +} +.footer > div { + flex-grow: 1; + flex-shrink: 1; + flex-basis: 0px; + + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + gap: 0.5rem; +} +@media only screen and (max-width: 1000px) { + .footer > div { + flex-basis: 100%; + justify-content: center !important; + } +} + +.footer > div a { + font-size: 1rem; + color: var(--theme); +} +.footer > div a:hover { + text-decoration: underline; +} + +.footer .delimiter { + color: var(--color-gray); +} +.footer .brand { + justify-content: flex-start; +} +.footer .legal { + justify-content: flex-end; +} + +.footer .brand img { + height: 2rem; +} +.footer .brand .version { + color: var(--color-gray); +} + +.footer .lang .selected { + font-weight: bold; + color: inherit; +} diff --git a/page/strings.php b/page/strings.php new file mode 100644 index 0000000..1912fd2 --- /dev/null +++ b/page/strings.php @@ -0,0 +1,40 @@ +define([ + "title" => [ + "de" => "Selbstbestimmungsgesetz Jetzt!", + "en" => "Self-Determination Act Now!" + ], + + "description" => [ + "de" => "Das TSG muss endlich durch ein Selbstbestimmungsgesetz ersetzt werden! Diese Seite verfolgt den Fortschritt der Gesetzgebung.", + "en" => "The TSG must be replaced by a Self-Determination Law! This page is tracking the progress of the legislation." + ], + + + + + + "text_sourcecode" => [ + "de" => "Quellcode", + "en" => "Sourcecode" + ], + + "text_imprint" => [ + "de" => "Impressum", + "en" => "Imprint" + ], + "link_imprint" => [ + "de" => "https://www.tjdev.de/impressum", + "en" => "https://www.tjdev.de/imprint" + ], + + "text_privacy_policy" => [ + "de" => "Datenschutz­erklärung", + "en" => "Privacy Policy" + ], + "link_privacy_policy" => [ + "de" => "https://www.tjdev.de/datenschutz", + "en" => "https://www.tjdev.de/privacy" + ] + ]); +?>