mirror of
https://git.suyu.dev/suyu/website.git
synced 2026-01-05 05:58:07 +01:00
Merge pull request #2 from TheDokT0r/Improved-navbar
Improved NavBar Icons
This commit is contained in:
commit
5813e6f09c
9 changed files with 2825 additions and 16 deletions
4
src/app.pcss
Normal file
4
src/app.pcss
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
/* Write your global styles here, in PostCSS syntax */
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
|
@ -1,10 +1,12 @@
|
|||
<script lang="ts">
|
||||
import "../app.pcss";
|
||||
import { goto } from "$app/navigation";
|
||||
import BackgroundProvider from "$components/BackgroundProvider.svelte";
|
||||
import LogoWithTextHorizontal from "$components/LogoWithTextHorizontal.svelte";
|
||||
import { page } from "$app/stores";
|
||||
import "$lib/css/index.css";
|
||||
import { onMount } from "svelte";
|
||||
import { Button } from "flowbite-svelte";
|
||||
import {DiscordSolid, DownloadOutline} from "flowbite-svelte-icons";
|
||||
|
||||
const excludedRoutesNav = ["/mockup/boot", "/mockup/w11"];
|
||||
const excludedRoutesBg = ["/mockup", "/mockup/w11"];
|
||||
|
|
@ -18,21 +20,29 @@
|
|||
<LogoWithTextHorizontal on:click={() => goto("/")} size={50} />
|
||||
</div>
|
||||
<div class="right">
|
||||
<a href="https://gitlab.com/suyu-emu/suyu/-/releases" target="_blank">Download</a>
|
||||
<a href="https://discord.gg/suyu" target="_blank">Discord</a>
|
||||
<a href="https://gitlab.com/suyu-emu/suyu/-/releases" target="_blank">
|
||||
<Button class='!p-2' pill={true}>
|
||||
<DownloadOutline />
|
||||
</Button>
|
||||
</a>
|
||||
<a href="https://discord.gg/suyu" target="_blank">
|
||||
<Button class='!p-2' pill={true}>
|
||||
<DiscordSolid />
|
||||
</Button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
{#if !isBgExcluded}
|
||||
<BackgroundProvider size={80} gap={12} speed={1} />
|
||||
<BackgroundProvider size={80} gap={12} speed={1}></BackgroundProvider>
|
||||
<div class="below">
|
||||
<div class="page-contents">
|
||||
<slot />
|
||||
</div>
|
||||
<div class="bullshit-flex-container">
|
||||
<div class="bullshit-flex-placeholder" />
|
||||
<div class="bg-below-gradient" />
|
||||
<div class="bullshit-flex-placeholder"></div>
|
||||
<div class="bg-below-gradient"></div>
|
||||
</div>
|
||||
</div>
|
||||
{:else}
|
||||
|
|
@ -97,6 +107,6 @@
|
|||
.right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 32px;
|
||||
gap: 1rem;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,7 @@
|
|||
<script lang="ts">
|
||||
import Logo from "$components/Logo.svelte";
|
||||
import { onMount, tick } from "svelte";
|
||||
import { onMount } from "svelte";
|
||||
import strings from "$lib/data/strings.json";
|
||||
import Card from "$components/Card.svelte";
|
||||
import odyssey from "$assets/cards/Super-Mario-Odyssey.jpg";
|
||||
import ScrollIcon from "$components/ScrollIcon.svelte";
|
||||
import totk from "$assets/cards/totk.webp";
|
||||
|
|
@ -145,9 +144,8 @@
|
|||
}
|
||||
|
||||
.hero-header {
|
||||
font-size: 110px;
|
||||
margin-top: -48px;
|
||||
margin-bottom: -24px;
|
||||
margin-top: -2rem;
|
||||
margin-bottom: 2rempx;
|
||||
}
|
||||
|
||||
.hero-text {
|
||||
|
|
@ -181,7 +179,7 @@
|
|||
|
||||
.below {
|
||||
width: 100%;
|
||||
min-height: calc(100vh - 80px);
|
||||
min-height: calc(106vh - 80px);
|
||||
height: fit-content;
|
||||
padding-bottom: 80px;
|
||||
position: relative;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue