From d23c1128c82c9b89d813dc02f0504fce97ff5066 Mon Sep 17 00:00:00 2001 From: Jake Hamilton Date: Tue, 11 Jun 2024 04:26:47 -0700 Subject: [PATCH] feat: add new auxolotl logo and hero styles --- public/aux-text.svg | 301 +++++++++++++++++++++++++++++++++ public/auxolotl.svg | 34 ++++ src/components/Header.astro | 62 ++++--- src/components/home/Hero.astro | 42 ++--- src/components/home/Home.astro | 12 +- src/layouts/Layout.astro | 8 +- 6 files changed, 406 insertions(+), 53 deletions(-) create mode 100644 public/aux-text.svg create mode 100644 public/auxolotl.svg diff --git a/public/aux-text.svg b/public/aux-text.svg new file mode 100644 index 0000000..3e17b5f --- /dev/null +++ b/public/aux-text.svg @@ -0,0 +1,301 @@ + + + + diff --git a/public/auxolotl.svg b/public/auxolotl.svg new file mode 100644 index 0000000..11c144c --- /dev/null +++ b/public/auxolotl.svg @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/components/Header.astro b/src/components/Header.astro index b300f1d..8dbe0a0 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -4,35 +4,57 @@ interface Props {} import { useTranslations } from "../i18n/utils"; import type { Params } from "../i18n/utils"; import { Image } from "astro:assets"; -import aux from "../../public/aux.svg"; +import auxolotl from "../../public/auxolotl.svg"; const { lang } = Astro.params as Params; const translation = useTranslations(lang); ---
-
- - auxolotl.org logo - Auxolotl - -
+
+
+ + auxolotl.org logo + +
- +
  • + Wiki +
    • +
  • + {translation("header.community")} +
    • +
  • + GitHub +
    • + + +
    diff --git a/src/components/home/Hero.astro b/src/components/home/Hero.astro index e3c6bee..f05f896 100644 --- a/src/components/home/Hero.astro +++ b/src/components/home/Hero.astro @@ -1,20 +1,21 @@ --- import { useTranslations } from "../../i18n/utils"; import { Image } from "astro:assets"; -import aux from "../../../public/aux.svg"; +import auxText from "../../../public/aux-text.svg"; import type { Params } from "../../i18n/utils"; const { lang } = Astro.params as Params; const translation = useTranslations(lang); --- -
    -
    -
    - auxolotl.org logo +
    +
    +
    +
    + aux +
    +
    {translation("root.description")}
    -

    auxolotl.org

    -
    {translation("root.description")}
    @@ -22,8 +23,11 @@ const translation = useTranslations(lang); .hero { display: flex; justify-content: center; - max-width: 600px; + width: 100%; margin: 0 auto; + background: rgb(var(--background-light)); + padding-top: 1rem; + padding-bottom: 1rem; } .content { @@ -38,23 +42,10 @@ const translation = useTranslations(lang); position: relative; } - .content .icon::before { - content: ""; - display: block; - position: absolute; - width: 100%; - height: 60%; - background: rgb(var(--accent)); - border-radius: 50%; - bottom: 0; - left: 0; - transform: rotateZ(-5deg) skewX(-8deg) skewY(-8deg); - z-index: -1; - } - .content .icon img { - width: 250px; - height: 250px; + width: 100%; + height: auto; + max-width: 450px; } .content .title { @@ -65,6 +56,7 @@ const translation = useTranslations(lang); .content .description { text-align: center; - font-size: 1rem; + font-size: 1.25rem; + text-wrap: balance; } diff --git a/src/components/home/Home.astro b/src/components/home/Home.astro index 6d68b0c..0b3c58d 100644 --- a/src/components/home/Home.astro +++ b/src/components/home/Home.astro @@ -8,9 +8,13 @@ import Roadmap from "./Roadmap.astro";
    -
    - - - +
    +
    + + + +
    diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 69d2c5e..f41dbba 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -32,9 +32,9 @@ const { lang } = Astro.params as Params;