footer: update copyright

feat: link to matrix lobby
fix: invalid comment
9 changed files with 212 additions and 61 deletions
--- a/index.html
+++ b/index.html
@ -4,9 +4,14 @@
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <meta name="description" content="Where developers can collectively learn and grow.">
+        <meta name="keywords" content="Developers, Dev, Community, Open, Free">
        <title>/dev.space</title>
        <link rel="stylesheet" href="styles/index.css" />
        <link rel="shortcut icon" href="favicon.svg" type="image/svg+xml" />
+
+        <!-- Plausible analytics -->
+        <script async defer data-domain="slashdev.space" src="https://analytics.slashdev.space/js/plausible.js"></script>
    </head>
    <body>
        <section class="welcome">
@ -15,16 +20,20 @@
                <h3 class="welcome__text-area__subheading">
                    Where developers can collectively learn and grow.
                </h3>
-                <p class="welcome__text-area__description">
+                <p class="description">
                    Whether you're freshly starting out, or you are just looking
-                    to connect with likeminded people. Our suite of online
-                    services helps you turn your project ideas into reality.
+                    to connect with likeminded people. /dev.space is the
+                    community you've been looking for.
                </p>
            </div>
        </section>
        <section class="services">
            <div class="services__container">
-                <h1 class="services__heading">What you get</h1>
+                <h2 class="services__heading">Our Services</h2>
+                <p class="description">
+                    Our suite of online services helps you turn your project
+                    ideas into reality.
+                </p>
                <div class="services__offers">
                    <div class="services__offers__card">
                        <h1 class="services__offers__card__heading">Chat</h1>
@ -34,9 +43,9 @@
                        </p>
                        <a
                            href="https://matrix.slashdev.space"
-                            class="services__offers_card__button"
+                            class="button__link"
                        >
-                            <p>Join here!</p>
+                            <p>Join a room</p>
                        </a>
                    </div>

@ -49,9 +58,9 @@
                        </p>
                        <a
                            href="https://git.slashdev.space"
-                            class="services__offers_card__button"
+                            class="button__link"
                        >
-                            <p>Set up your account!</p>
+                            <p>Set up your account</p>
                        </a>
                    </div>

@ -62,25 +71,61 @@
                        </p>
                        <a
                            href="https://boards.slashdev.space"
-                            class="services__offers_card__button"
-                        >
-                            <p>Get agile!</p>
-                        </a>
-                    </div>
-                    <div class="services__offers__card">
-                        <h1 class="services__offers__card__heading">Fediverse</h1>
-                        <p class="services__offers__card__description">
-                            We host our own federated social media instance.
-                        </p>
-                        <a
-                            href="https://social.slashdev.space"
-                            class="services__offers_card__button"
+                            class="button__link"
                        >
-                            <p>Toot with us!</p>
+                            <p>Get agile</p>
                        </a>
                    </div>
                </div>
            </div>
        </section>
+        <section class="contact">
+            <div class="contact__container">
+                <h2>How to join</h2>
+                <p>
+                    /dev.space is a free and open community. Anyone and everyone
+                    is welcome. Simply join our Matrix server and chat with us.
+                    Already got an account on another instance? Great!
+                </p>
+                <a
+                    class="button__link button__contact"
+                    href="https://matrix.to/#/#lobby:matrix.slashdev.space"
+                    ><p>#lobby:matrix.slashdev.space</p></a
+                >
+            </div>
+        </section>
+        <section class="support-us">
+            <div class="support-us__container">
+                <h2>Support Us</h2>
+                <p>
+                    The services on this platform are 100% free of charge.
+                    Hosting servers does have its price though. Consider
+                    supporting us by leaving a small donation.
+                </p>
+                <div class="support-us__donations__container">
+                    <a
+                        class="button__link support-us__donations__button"
+                        href="https://donate.slashdev.space"
+                        ><p>Donate with Fosspay</p></a
+                    >
+                    <a
+                        class="button__link support-us__donations__button"
+                        href="https://liberapay.com/slashdev.space/donate"
+                        ><p>Donate with Liberapay</p></a
+                    >
+                </div>
+            </div>
+        </section>
    </body>
+    <footer>
+        Copyright © 2022 <a href="https://garrit.xyz">Garrit Franke</a> and /dev.space contributers.<br />
+        This website is licensed under the
+        <a
+            href="https://git.slashdev.space/garrit/slashdev.space-landing/src/branch/main/LICENSE"
+            >MIT License</a
+        >. The source code for this website can be found
+        <a href="https://git.slashdev.space/garrit/slashdev.space-landing"
+            >here</a
+        >.
+    </footer>
 </html>
--- a/styles/atoms.css
+++ b/styles/atoms.css
@ -0,0 +1,36 @@
+.button__link {
+    font-weight: 350;
+    background: black;
+    border: 1px solid black;
+    color: white;
+    text-decoration: none;
+    padding: 0.6rem 2rem;
+    margin: 2rem 2.5rem;
+    transition: 0.2s;
+
+    display: flex;
+    align-items: center;
+}
+
+.button__link > p {
+    font-size: 1rem;
+    margin: auto;
+}
+
+.button__link:hover {
+    color: black;
+    background: white;
+}
+
+@media only screen and (max-width: 520px) {
+    .button__link p {
+        font-size: 1.3rem;
+    }
+}
+
+/* Description */
+
+.description {
+    margin-right: 12vw;
+    margin-left: 12vw;
+}
--- a/styles/contact.css
+++ b/styles/contact.css
@ -0,0 +1,17 @@
+.contact__container {
+    width: 80vw;
+    margin: auto;
+    justify-content: center;
+}
+
+.button__contact {
+    margin: auto;
+    margin-bottom: 2rem;
+    width: 20rem;
+}
+
+@media only screen and (max-width: 520px) {
+    .button__contact {
+        width: auto;
+    }
+}
--- a/styles/darkmode.css
+++ b/styles/darkmode.css
@ -0,0 +1,18 @@
+@media (prefers-color-scheme: dark) {
+    :root {
+        background-color: #161618;
+        color: #dbd7db;
+    }
+
+    html {
+        scrollbar-color: #dbd7db #161618 !important;
+    }
+
+    .button__link {
+        background-color: #67676c;
+    }
+
+    a {
+       color: #dbd7db;
+    }
+}
--- a/styles/index.css
+++ b/styles/index.css
@ -1,6 +1,14 @@
+@import url("./typography.css");
+@import url("./atoms.css");
+@import url("./darkmode.css");
+
+
 /* Components */
@import url("./welcome.css");
@import url("./services.css");
+@import url("./contact.css");
+@import url("./support.css");
+

 /* Fonts */
@font-face {
@ -14,8 +22,18 @@
    font-style: italic;
 }

+html {
+	scrollbar-color: black white;
+}
+
 body {
    margin: 0;
    font-family: "Work Sans", sans-serif;
    font-weight: 250;
+    overflow-x: hidden;
+    text-align: center;
+}
+
+footer {
+    margin-bottom: 2rem;
 }
--- a/styles/services.css
+++ b/styles/services.css
@ -2,12 +2,9 @@
    align-items: center;
    display: flex;
    justify-content: center;
-    text-align: center;
 }

 .services__heading {
-    font-size: 3.3rem;
-    font-weight: 350;
    margin-bottom: 1.5rem;
 }

@ -33,29 +30,17 @@
    margin-bottom: 1rem;
    margin: 0 3rem;
    height: 3rem;
+    font-size: 1rem;
 }

-.services__offers_card__button {
-    font-weight: 350;
-    background: black;
-    border: 1px solid black;
-    color: white;
-    text-decoration: none;
-    padding: 0.6rem 2rem;
-    margin: 2rem 2.5rem;
-    transition: 0.2s;
-
-    display: flex;
-    align-items: center;
-}
-
-.services__offers_card__button > p {
-    margin: auto;
-}
-
-.services__offers_card__button:hover {
-    color: black;
-    background: white;
+@media only screen and (max-width: 520px) {
+    .services__offers__card {
+        margin-bottom: 3rem;
+    }
+    .services__offers__card__description {
+        font-size: 1.3rem;
+        height: auto;
+    }
 }

@media only screen and (max-width: 380px) {
@ -66,5 +51,11 @@

    .services__offers__card {
        width: 25rem;
+        margin-bottom: 3rem;
+    }
+
+    .services__offers__card__description {
+        font-size: 1.3rem;
+        height: auto;
    }
 }
--- a/styles/support.css
+++ b/styles/support.css
@ -0,0 +1,16 @@
+.support-us__container {
+    width: 80vw;
+    margin: auto;
+    justify-content: center
+}
+
+.support-us__donations__container {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    margin-bottom: 2rem;
+}
+
+.support-us__donations__button {
+    margin: 1rem;
+}
--- a/styles/typography.css
+++ b/styles/typography.css
@ -0,0 +1,25 @@
+h1 {
+    font-size: 5rem;
+    font-weight: 400;
+    margin: 1rem;
+}
+
+h2 {
+    font-size: 3.3rem;
+    font-weight: 350;
+}
+
+h3 {
+    font-size: 2rem;
+    font-weight: 300;
+}
+
+p {
+    font-size: 1.5rem;
+	font-weight: 200;
+    line-height: 1.3;
+}
+
+a {
+    color: black;
+}
--- a/styles/welcome.css
+++ b/styles/welcome.css
@ -2,25 +2,13 @@
    align-items: center;
    display: flex;
    justify-content: center;
-    font-family: "Work Sans", sans-serif;
 }

 .welcome__container {
 	margin-top: 8vh;
-    text-align: center;
-}
-
-.welcome__text-area__heading {
-    font-size: 5rem;
-    font-weight: 400;
-    margin: 1rem;
-    text-align: center;
 }

 .welcome__text-area__subheading {
-    font-size: 2rem;
-    font-weight: 300;
-    text-align: center;
 	margin-top: 0;
 	margin-bottom: 2em;
    max-width: 80vw;
@ -29,9 +17,6 @@
 }

 .welcome__text-area__description {
-    font-size: 1.5rem;
-	font-weight: 200;
-    text-align: center;
 	margin-left: 12vw;
 	margin-right: 12vw;
 }
Author	SHA1	Message	Date
Garrit Franke	fccca87cd7	footer: update copyright	2 years ago
Garrit Franke	e34c9bd675	feat: link to matrix lobby	3 years ago
Garrit Franke	98a645e49e	fix: invalid comment	3 years ago
Garrit Franke	55154c7468	feat: plausible analytics	3 years ago
Garrit Franke	e354e27d20	Remove social.slashdev.space	3 years ago
TobTobXX	9f3c3c1cb4	Give some care for the scrollbars (#5 ) Fix intendation style Style scrollbars (for FF) (I don't know how to do that for Chrome, but tbh, I don't care.) Merge remote-tracking branch 'upstream/main' Hide x-direction scrollbar Co-authored-by: FiliusPatris <filiuspatrisapps@gmail.com> Reviewed-on: #5 Co-Authored-By: TobTobXX <tobtobxx@gmail.com> Co-Committed-By: TobTobXX <tobtobxx@gmail.com>	3 years ago
Garrit Franke	57e228bbea	fix: darkmode color palette	3 years ago
Garrit Franke	c22ec2d0de	feat: dark mode!	3 years ago
Garrit Franke	f13b4fa7d5	feat: add matrix community	3 years ago
Garrit Franke	d040d15143	feat: add meta tags	3 years ago
Garrit Franke	1981397235	fix: typo	3 years ago
Garrit Franke	a94173c866	fix: donation link	3 years ago
Garrit Franke	179dc4eb34	feat: note about matrix public directory	3 years ago
Garrit Franke	5e6a10ef78	feat: better line height	3 years ago
Garrit Franke	6db4dd8d95	feat: liberapay donation button	3 years ago
Garrit Franke	9fc749a0e3	fix: text sizes	3 years ago
Garrit Franke	2c53164350	feat: add note for contributers	3 years ago
Garrit Franke	d3b4f23a02	feat: support us section	3 years ago
Garrit Franke	a97593356c	feat: contact section	3 years ago
Garrit Franke	a2b2e52301	chore: refactor styles	3 years ago
Garrit Franke	22e933466d	feat: change services heading	3 years ago
Garrit Franke	ee461fe98d	Merge pull request 'chore: refactor grid to use flexbox' (#4 ) from grid2flex into main Reviewed-on: garrit/slashdev.space-landing#4	3 years ago