This commit is contained in:
Face
2025-09-07 20:43:41 +03:00
parent b588a61998
commit f4fd000322
43 changed files with 4015 additions and 0 deletions

141
site/src/app.css Normal file
View File

@@ -0,0 +1,141 @@
@import "tailwindcss";
@import "tw-animate-css";
@import '@fontsource/instrument-serif';
@custom-variant dark (&:is(.dark *));
:root {
--radius: 0.625rem;
--gurted-red: oklch(0.65 0.22 15); /* Bright red */
--gurted-red-hover: oklch(0.60 0.25 15); /* Darker red hover */
--gurted-yellow: oklch(0.80 0.15 85); /* Bright yellow */
--gurted-yellow-hover: oklch(0.75 0.18 85); /* Darker yellow hover */
--gurted-gray-dark: oklch(0.18 0 0); /* Dark gray #1b1b1b */
--gurted-gray-medium: oklch(0.25 0 0); /* Medium gray #2b2b2b */
--background: oklch(0.98 0.002 240);
--foreground: oklch(0.20 0.020 240);
--card: oklch(1 0 0);
--card-foreground: oklch(0.20 0.020 240);
--popover: oklch(1 0 0);
--popover-foreground: oklch(0.20 0.020 240);
--primary: var(--gurted-red);
--primary-foreground: oklch(0.985 0.002 240);
--secondary: oklch(0.96 0.003 240);
--secondary-foreground: oklch(0.20 0.020 240);
--muted: oklch(0.96 0.003 240);
--muted-foreground: oklch(0.55 0.027 240);
--accent: oklch(0.96 0.003 240);
--accent-foreground: oklch(0.20 0.020 240);
--destructive: oklch(0.577 0.245 27.325);
--border: oklch(0.928 0.006 240);
--input: oklch(0.928 0.006 240);
--ring: var(--gurted-red);
--chart-1: oklch(0.646 0.222 41.116);
--chart-2: oklch(0.6 0.118 184.704);
--chart-3: oklch(0.398 0.07 227.392);
--chart-4: oklch(0.828 0.189 84.429);
--chart-5: oklch(0.769 0.188 70.08);
--sidebar: oklch(0.985 0.002 240);
--sidebar-foreground: oklch(0.20 0.020 240);
--sidebar-primary: var(--gurted-red);
--sidebar-primary-foreground: oklch(0.985 0.002 240);
--sidebar-accent: oklch(0.96 0.003 240);
--sidebar-accent-foreground: oklch(0.20 0.020 240);
--sidebar-border: oklch(0.928 0.006 240);
--sidebar-ring: var(--gurted-red);
}
.dark {
--background: var(--gurted-gray-dark);
--foreground: oklch(0.985 0.002 240);
--card: var(--gurted-gray-medium);
--card-foreground: oklch(0.985 0.002 240);
--popover: var(--gurted-gray-medium);
--popover-foreground: oklch(0.985 0.002 240);
--primary: var(--gurted-red);
--primary-foreground: oklch(0.985 0.002 240);
--secondary: oklch(0.35 0.01 240);
--secondary-foreground: oklch(0.985 0.002 240);
--muted: oklch(0.35 0.01 240);
--muted-foreground: oklch(0.70 0.022 240);
--accent: oklch(0.35 0.01 240);
--accent-foreground: oklch(0.985 0.002 240);
--destructive: oklch(0.704 0.191 22.216);
--border: oklch(1 0 0 / 10%);
--input: oklch(1 0 0 / 15%);
--ring: var(--gurted-red);
}
@theme inline {
--radius-sm: calc(var(--radius) - 4px);
--radius-md: calc(var(--radius) - 2px);
--radius-lg: var(--radius);
--radius-xl: calc(var(--radius) + 4px);
--color-background: var(--background);
--color-foreground: var(--foreground);
--color-card: var(--card);
--color-card-foreground: var(--card-foreground);
--color-popover: var(--popover);
--color-popover-foreground: var(--popover-foreground);
--color-primary: var(--primary);
--color-primary-foreground: var(--primary-foreground);
--color-secondary: var(--secondary);
--color-secondary-foreground: var(--secondary-foreground);
--color-muted: var(--muted);
--color-muted-foreground: var(--muted-foreground);
--color-accent: var(--accent);
--color-accent-foreground: var(--accent-foreground);
--color-destructive: var(--destructive);
--color-border: var(--border);
--color-input: var(--input);
--color-ring: var(--ring);
--color-chart-1: var(--chart-1);
--color-chart-2: var(--chart-2);
--color-chart-3: var(--chart-3);
--color-chart-4: var(--chart-4);
--color-chart-5: var(--chart-5);
--color-sidebar: var(--sidebar);
--color-sidebar-foreground: var(--sidebar-foreground);
--color-sidebar-primary: var(--sidebar-primary);
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
--color-sidebar-accent: var(--sidebar-accent);
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
--color-sidebar-border: var(--sidebar-border);
--color-sidebar-ring: var(--sidebar-ring);
}
@layer base {
* {
@apply border-border outline-ring/50;
}
body {
@apply bg-background text-foreground;
}
}
/* Gurted specific styles */
.font-gurted {
font-family: 'Instrument Serif', serif;
}
.text-gurted-gradient {
background: linear-gradient(135deg, var(--gurted-red) 0%, var(--gurted-yellow) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
@keyframes float {
0%, 100% { transform: translateY(0px); }
50% { transform: translateY(-10px); }
}
.animate-float {
animation: float 3s ease-in-out infinite;
}
.hero-gradient {
background: linear-gradient(135deg, var(--gurted-gray-dark) 0%, var(--gurted-gray-medium) 50%, oklch(0.30 0.02 240) 100%);
}

13
site/src/app.d.ts vendored Normal file
View File

@@ -0,0 +1,13 @@
// See https://svelte.dev/docs/kit/types#app.d.ts
// for information about these interfaces
declare global {
namespace App {
// interface Error {}
// interface Locals {}
// interface PageData {}
// interface PageState {}
// interface Platform {}
}
}
export {};

14
site/src/app.html Normal file
View File

@@ -0,0 +1,14 @@
<!doctype html>
<html lang="en" class="dark">
<head>
<meta charset="utf-8" />
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Gurted - A New Web Ecosystem</title>
<meta name="description" content="Gurted introduces a new web ecosystem with the gurt:// protocol, custom browser Flumi, and revolutionary HTML/CSS/Lua standards." />
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover" class="dark bg-background text-foreground">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="107" height="128" viewBox="0 0 107 128"><title>svelte-logo</title><path d="M94.157 22.819c-10.4-14.885-30.94-19.297-45.792-9.835L22.282 29.608A29.92 29.92 0 0 0 8.764 49.65a31.5 31.5 0 0 0 3.108 20.231 30 30 0 0 0-4.477 11.183 31.9 31.9 0 0 0 5.448 24.116c10.402 14.887 30.942 19.297 45.791 9.835l26.083-16.624A29.92 29.92 0 0 0 98.235 78.35a31.53 31.53 0 0 0-3.105-20.232 30 30 0 0 0 4.474-11.182 31.88 31.88 0 0 0-5.447-24.116" style="fill:#ff3e00"/><path d="M45.817 106.582a20.72 20.72 0 0 1-22.237-8.243 19.17 19.17 0 0 1-3.277-14.503 18 18 0 0 1 .624-2.435l.49-1.498 1.337.981a33.6 33.6 0 0 0 10.203 5.098l.97.294-.09.968a5.85 5.85 0 0 0 1.052 3.878 6.24 6.24 0 0 0 6.695 2.485 5.8 5.8 0 0 0 1.603-.704L69.27 76.28a5.43 5.43 0 0 0 2.45-3.631 5.8 5.8 0 0 0-.987-4.371 6.24 6.24 0 0 0-6.698-2.487 5.7 5.7 0 0 0-1.6.704l-9.953 6.345a19 19 0 0 1-5.296 2.326 20.72 20.72 0 0 1-22.237-8.243 19.17 19.17 0 0 1-3.277-14.502 17.99 17.99 0 0 1 8.13-12.052l26.081-16.623a19 19 0 0 1 5.3-2.329 20.72 20.72 0 0 1 22.237 8.243 19.17 19.17 0 0 1 3.277 14.503 18 18 0 0 1-.624 2.435l-.49 1.498-1.337-.98a33.6 33.6 0 0 0-10.203-5.1l-.97-.294.09-.968a5.86 5.86 0 0 0-1.052-3.878 6.24 6.24 0 0 0-6.696-2.485 5.8 5.8 0 0 0-1.602.704L37.73 51.72a5.42 5.42 0 0 0-2.449 3.63 5.79 5.79 0 0 0 .986 4.372 6.24 6.24 0 0 0 6.698 2.486 5.8 5.8 0 0 0 1.602-.704l9.952-6.342a19 19 0 0 1 5.295-2.328 20.72 20.72 0 0 1 22.237 8.242 19.17 19.17 0 0 1 3.277 14.503 18 18 0 0 1-8.13 12.053l-26.081 16.622a19 19 0 0 1-5.3 2.328" style="fill:#fff"/></svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@@ -0,0 +1,49 @@
<script lang="ts">
import { Button } from '$lib/components/ui/button';
import { Download, FileText, Info } from 'lucide-svelte';
</script>
<nav class="fixed top-4 left-1/2 transform -translate-x-1/2 z-50 w-full max-w-2xl px-4">
<div class="bg-background backdrop-blur-xl border border-border/50 rounded-3xl px-6 py-3 shadow-2xl">
<div class="flex items-center justify-between">
<!-- Logo and Brand -->
<a href="/" class="flex items-center space-x-3">
<div class="w-8 h-8 flex items-center justify-center">
<img src="/favicon.svg" alt="Gurted Logo" class="w-8 h-8" />
</div>
<span class="font-gurted font-bold text-xl text-gurted-gradient">Gurted</span>
</a>
<!-- Navigation Links -->
<div class="hidden md:flex items-center space-x-1">
<Button variant="ghost" size="sm" class="text-muted-foreground hover:text-foreground" href="https://docs.gurted.com">
Docs
</Button>
<Button variant="ghost" size="sm" class="text-muted-foreground hover:text-foreground" href="https://github.com/outpoot/gurted">
GitHub
</Button>
<a href="/download">
<Button size="sm" class="bg-primary hover:bg-primary/90 text-primary-foreground shadow-lg">
Download
</Button>
</a>
</div>
<!-- Mobile Menu Button -->
<div class="md:hidden">
<a href="/download">
<Button size="sm" class="bg-primary hover:bg-primary/90 text-primary-foreground">
<Download class="w-4 h-4" />
</Button>
</a>
</div>
</div>
</div>
</nav>
<style>
nav {
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
}
</style>

View File

@@ -0,0 +1,50 @@
<script lang="ts" module>
import { type VariantProps, tv } from "tailwind-variants";
export const badgeVariants = tv({
base: "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden whitespace-nowrap rounded-md border px-2 py-0.5 text-xs font-medium transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none [&>svg]:size-3",
variants: {
variant: {
default:
"bg-primary text-primary-foreground [a&]:hover:bg-primary/90 border-transparent",
secondary:
"bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90 border-transparent",
destructive:
"bg-destructive [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/70 border-transparent text-white",
outline: "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
},
},
defaultVariants: {
variant: "default",
},
});
export type BadgeVariant = VariantProps<typeof badgeVariants>["variant"];
</script>
<script lang="ts">
import type { HTMLAnchorAttributes } from "svelte/elements";
import { cn, type WithElementRef } from "$lib/utils.js";
let {
ref = $bindable(null),
href,
class: className,
variant = "default",
children,
...restProps
}: WithElementRef<HTMLAnchorAttributes> & {
variant?: BadgeVariant;
} = $props();
</script>
<svelte:element
this={href ? "a" : "span"}
bind:this={ref}
data-slot="badge"
{href}
class={cn(badgeVariants({ variant }), className)}
{...restProps}
>
{@render children?.()}
</svelte:element>

View File

@@ -0,0 +1,2 @@
export { default as Badge } from "./badge.svelte";
export { badgeVariants, type BadgeVariant } from "./badge.svelte";

View File

@@ -0,0 +1,80 @@
<script lang="ts" module>
import { cn, type WithElementRef } from "$lib/utils.js";
import type { HTMLAnchorAttributes, HTMLButtonAttributes } from "svelte/elements";
import { type VariantProps, tv } from "tailwind-variants";
export const buttonVariants = tv({
base: "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium outline-none transition-all focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0 cursor-pointer",
variants: {
variant: {
default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
destructive:
"bg-destructive shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 text-white",
outline:
"bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border",
secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
link: "text-primary underline-offset-4 hover:underline",
},
size: {
default: "h-9 px-4 py-2 has-[>svg]:px-3",
sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
icon: "size-9",
},
},
defaultVariants: {
variant: "default",
size: "default",
},
});
export type ButtonVariant = VariantProps<typeof buttonVariants>["variant"];
export type ButtonSize = VariantProps<typeof buttonVariants>["size"];
export type ButtonProps = WithElementRef<HTMLButtonAttributes> &
WithElementRef<HTMLAnchorAttributes> & {
variant?: ButtonVariant;
size?: ButtonSize;
};
</script>
<script lang="ts">
let {
class: className,
variant = "default",
size = "default",
ref = $bindable(null),
href = undefined,
type = "button",
disabled,
children,
...restProps
}: ButtonProps = $props();
</script>
{#if href}
<a
bind:this={ref}
data-slot="button"
class={cn(buttonVariants({ variant, size }), className)}
href={disabled ? undefined : href}
aria-disabled={disabled}
role={disabled ? "link" : undefined}
tabindex={disabled ? -1 : undefined}
{...restProps}
>
{@render children?.()}
</a>
{:else}
<button
bind:this={ref}
data-slot="button"
class={cn(buttonVariants({ variant, size }), className)}
{type}
{disabled}
{...restProps}
>
{@render children?.()}
</button>
{/if}

View File

@@ -0,0 +1,17 @@
import Root, {
type ButtonProps,
type ButtonSize,
type ButtonVariant,
buttonVariants,
} from "./button.svelte";
export {
Root,
type ButtonProps as Props,
//
Root as Button,
buttonVariants,
type ButtonProps,
type ButtonSize,
type ButtonVariant,
};

View File

@@ -0,0 +1,20 @@
<script lang="ts">
import { cn, type WithElementRef } from "$lib/utils.js";
import type { HTMLAttributes } from "svelte/elements";
let {
ref = $bindable(null),
class: className,
children,
...restProps
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
</script>
<div
bind:this={ref}
data-slot="card-action"
class={cn("col-start-2 row-span-2 row-start-1 self-start justify-self-end", className)}
{...restProps}
>
{@render children?.()}
</div>

View File

@@ -0,0 +1,15 @@
<script lang="ts">
import type { HTMLAttributes } from "svelte/elements";
import { cn, type WithElementRef } from "$lib/utils.js";
let {
ref = $bindable(null),
class: className,
children,
...restProps
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
</script>
<div bind:this={ref} data-slot="card-content" class={cn("px-6", className)} {...restProps}>
{@render children?.()}
</div>

View File

@@ -0,0 +1,20 @@
<script lang="ts">
import type { HTMLAttributes } from "svelte/elements";
import { cn, type WithElementRef } from "$lib/utils.js";
let {
ref = $bindable(null),
class: className,
children,
...restProps
}: WithElementRef<HTMLAttributes<HTMLParagraphElement>> = $props();
</script>
<p
bind:this={ref}
data-slot="card-description"
class={cn("text-muted-foreground text-sm", className)}
{...restProps}
>
{@render children?.()}
</p>

View File

@@ -0,0 +1,20 @@
<script lang="ts">
import { cn, type WithElementRef } from "$lib/utils.js";
import type { HTMLAttributes } from "svelte/elements";
let {
ref = $bindable(null),
class: className,
children,
...restProps
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
</script>
<div
bind:this={ref}
data-slot="card-footer"
class={cn("[.border-t]:pt-6 flex items-center px-6", className)}
{...restProps}
>
{@render children?.()}
</div>

View File

@@ -0,0 +1,23 @@
<script lang="ts">
import { cn, type WithElementRef } from "$lib/utils.js";
import type { HTMLAttributes } from "svelte/elements";
let {
ref = $bindable(null),
class: className,
children,
...restProps
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
</script>
<div
bind:this={ref}
data-slot="card-header"
class={cn(
"@container/card-header has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6 grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6",
className
)}
{...restProps}
>
{@render children?.()}
</div>

View File

@@ -0,0 +1,20 @@
<script lang="ts">
import type { HTMLAttributes } from "svelte/elements";
import { cn, type WithElementRef } from "$lib/utils.js";
let {
ref = $bindable(null),
class: className,
children,
...restProps
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
</script>
<div
bind:this={ref}
data-slot="card-title"
class={cn("font-semibold leading-none", className)}
{...restProps}
>
{@render children?.()}
</div>

View File

@@ -0,0 +1,23 @@
<script lang="ts">
import type { HTMLAttributes } from "svelte/elements";
import { cn, type WithElementRef } from "$lib/utils.js";
let {
ref = $bindable(null),
class: className,
children,
...restProps
}: WithElementRef<HTMLAttributes<HTMLDivElement>> = $props();
</script>
<div
bind:this={ref}
data-slot="card"
class={cn(
"bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
className
)}
{...restProps}
>
{@render children?.()}
</div>

View File

@@ -0,0 +1,25 @@
import Root from "./card.svelte";
import Content from "./card-content.svelte";
import Description from "./card-description.svelte";
import Footer from "./card-footer.svelte";
import Header from "./card-header.svelte";
import Title from "./card-title.svelte";
import Action from "./card-action.svelte";
export {
Root,
Content,
Description,
Footer,
Header,
Title,
Action,
//
Root as Card,
Content as CardContent,
Description as CardDescription,
Footer as CardFooter,
Header as CardHeader,
Title as CardTitle,
Action as CardAction,
};

View File

@@ -0,0 +1,7 @@
import Root from "./separator.svelte";
export {
Root,
//
Root as Separator,
};

View File

@@ -0,0 +1,20 @@
<script lang="ts">
import { Separator as SeparatorPrimitive } from "bits-ui";
import { cn } from "$lib/utils.js";
let {
ref = $bindable(null),
class: className,
...restProps
}: SeparatorPrimitive.RootProps = $props();
</script>
<SeparatorPrimitive.Root
bind:ref
data-slot="separator"
class={cn(
"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=vertical]:h-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-px",
className
)}
{...restProps}
/>

1
site/src/lib/index.ts Normal file
View File

@@ -0,0 +1 @@
// place files you want to import through the `$lib` alias in this folder.

13
site/src/lib/utils.ts Normal file
View File

@@ -0,0 +1,13 @@
import { clsx, type ClassValue } from "clsx";
import { twMerge } from "tailwind-merge";
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs));
}
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export type WithoutChild<T> = T extends { child?: any } ? Omit<T, "child"> : T;
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export type WithoutChildren<T> = T extends { children?: any } ? Omit<T, "children"> : T;
export type WithoutChildrenOrChild<T> = WithoutChildren<WithoutChild<T>>;
export type WithElementRef<T, U extends HTMLElement = HTMLElement> = T & { ref?: U | null };

View File

@@ -0,0 +1,12 @@
<script lang="ts">
import '../app.css';
import favicon from '$lib/assets/favicon.svg';
let { children } = $props();
</script>
<svelte:head>
<link rel="icon" href={favicon} />
</svelte:head>
{@render children?.()}

View File

@@ -0,0 +1,354 @@
<script lang="ts">
import { Button } from '$lib/components/ui/button';
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle
} from '$lib/components/ui/card';
import { Badge } from '$lib/components/ui/badge';
import {
Download,
Shield,
Zap,
Palette,
Globe,
Wrench,
Rocket,
ExternalLink,
Search,
KeyRound,
Terminal,
Server
} from 'lucide-svelte';
import Navbar from '$lib/components/Navbar.svelte';
</script>
<svelte:head>
<title>Gurted</title>
<meta
name="description"
content="A web ecosystem with the gurt:// protocol, custom browser Flumi, DNS system, and modern HTML/CSS/Lua standards."
/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-tomorrow.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-core.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/autoloader/prism-autoloader.min.js"></script>
</svelte:head>
<main class="bg-background text-foreground min-h-screen">
<Navbar />
<!-- Hero Section -->
<section class="px-4 py-20 pt-40">
<div class="container mx-auto max-w-6xl text-center">
<div class="animate-fade-in-up">
<h1 class="text-6xl md:text-9xl lg:text-[8rem] font-bold mb-6 animate-fade-in font-gurted text-gurted-gradient">
Gurted
</h1>
<p class="text-muted-foreground mx-auto mb-4 max-w-3xl text-xl md:text-2xl">
A web ecosystem introducing the <code
class="bg-muted text-primary rounded px-2 py-1 font-mono">gurt://</code
> protocol
</p>
<div class="flex flex-col justify-center gap-4 sm:flex-row">
<Button size="lg" class="px-8 py-6 text-lg">
<Download class="h-5 w-5" />
Download
</Button>
<Button variant="outline" size="lg" class="px-8 py-6 text-lg">
<ExternalLink class="h-5 w-5" />
Documentation
</Button>
</div>
</div>
</div>
</section>
<!-- Ecosystem -->
<section class="px-4 py-20">
<div class="container mx-auto max-w-6xl">
<div class="grid gap-8 md:grid-cols-2 lg:grid-cols-3">
<Card
class="animate-float border-border/50 text-center transition-all duration-300 hover:shadow-xl"
style="animation-delay: 0s;"
>
<CardHeader>
<div
class="from-primary/20 to-secondary/20 mb-6 flex h-48 w-full items-center justify-center rounded-xl bg-gradient-to-br"
>
<img
src="/crt.gif"
alt="Flumi wayfinder"
class="h-full w-full rounded-xl object-cover"
/>
</div>
<CardTitle class="text-2xl">Flumi</CardTitle>
<CardDescription>The wayfinder (browser)</CardDescription>
</CardHeader>
<CardContent>
<p class="text-muted-foreground">
Built with the Godot game engine for native performance and features across all platforms, Flumi will light the way.
</p>
</CardContent>
</Card>
<!-- GURT Protocol -->
<Card
class="animate-float border-border/50 text-center transition-all duration-300 hover:shadow-xl"
style="animation-delay: 0.1s;"
>
<CardHeader>
<div
class="from-primary/20 to-secondary/20 mb-6 flex h-48 w-full items-center justify-center rounded-xl bg-gradient-to-br"
>
<img
src="/gurtprotocol.jpg"
alt="GURT Protocol"
class="h-full w-full rounded-xl object-cover"
/>
</div>
<CardTitle class="text-2xl">GURT Protocol</CardTitle>
<CardDescription>The protocol</CardDescription>
</CardHeader>
<CardContent>
<p class="text-muted-foreground">
HTTP-like protocol with mandatory TLS 1.3 encryption, built specifically for Gurted.
</p>
</CardContent>
</Card>
<Card
class="animate-float border-border/50 text-center transition-all duration-300 hover:shadow-xl"
style="animation-delay: 0.2s;"
>
<CardHeader>
<div
class="from-primary/20 to-secondary/20 mb-6 flex h-48 w-full items-center justify-center rounded-xl bg-gradient-to-br"
>
<img
src="/domains.png"
alt="GurtDNS"
class="h-full w-full rounded-xl object-cover"
/>
</div>
<CardTitle class="text-2xl">GurtDNS</CardTitle>
<CardDescription>The DNS server</CardDescription>
</CardHeader>
<CardContent>
<p class="text-muted-foreground">
Custom DNS system on GURT with encryption similar to DoH (DNS over HTTPS) and downloadable records.
</p>
</CardContent>
</Card>
<!-- Ringle Search Engine -->
<Card
class="animate-float border-border/50 text-center transition-all duration-300 hover:shadow-xl"
style="animation-delay: 0.3s;"
>
<CardHeader>
<div
class="from-primary/20 to-secondary/20 mb-6 flex h-48 w-full items-center justify-center rounded-xl bg-gradient-to-br"
>
<img
src="/ringle-preview.png"
alt="Ringle Search Engine"
class="h-full w-full rounded-xl object-cover"
/>
</div>
<CardTitle class="text-2xl">Ringle</CardTitle>
<CardDescription>The search engine</CardDescription>
</CardHeader>
<CardContent>
<p class="text-muted-foreground">
Powerful search engine designed specifically for the GURT ecosystem with privacy-first
approach.
</p>
</CardContent>
</Card>
<!-- GurtCA -->
<Card
class="animate-float border-border/50 text-center transition-all duration-300 hover:shadow-xl"
style="animation-delay: 0.4s;"
>
<CardHeader>
<div
class="from-primary/20 to-secondary/20 mb-6 flex h-48 w-full items-center justify-center rounded-xl bg-gradient-to-br"
>
<img
src="/gurtca.png"
alt="GurtCA Certificate Authority"
class="h-full w-full rounded-xl object-cover"
/>
</div>
<CardTitle class="text-2xl">GurtCA</CardTitle>
<CardDescription>The certificate authority</CardDescription>
</CardHeader>
<CardContent>
<p class="text-muted-foreground">
Certificate authority providing TLS certificates for GURT domains with automated
validation.
</p>
</CardContent>
</Card>
<!-- Gurty CLI -->
<Card
class="animate-float border-border/50 text-center transition-all duration-300 hover:shadow-xl"
style="animation-delay: 0.5s;"
>
<CardHeader>
<div
class="from-primary/20 to-secondary/20 mb-6 flex h-48 w-full items-center justify-center rounded-xl bg-gradient-to-br"
>
<img
src="/gurty.png"
alt="Gurty CLI Tool"
class="h-full w-full rounded-xl object-cover"
/>
</div>
<CardTitle class="text-2xl">Gurty</CardTitle>
<CardDescription>The CLI tool</CardDescription>
</CardHeader>
<CardContent>
<p class="text-muted-foreground">
Command-line interface for setting up and managing GURT protocol servers with ease.
</p>
</CardContent>
</Card>
</div>
</div>
</section>
<!-- Code Examples -->
<section class="bg-muted/30 px-4 py-20">
<div class="container mx-auto max-w-6xl">
<div class="mb-16 text-center">
<h2 class="font-gurted mb-4 text-4xl font-bold md:text-5xl">See It In Action</h2>
<p class="text-muted-foreground text-xl">
An example of a simple GURT site
</p>
</div>
<div class="grid gap-8 md:grid-cols-2">
<!-- HTML Example -->
<Card>
<CardHeader>
<CardTitle>HTML</CardTitle>
<CardDescription>HTML with utility-first styling</CardDescription>
</CardHeader>
<CardContent>
<pre class="bg-muted text-foreground overflow-x-auto rounded-lg p-4 text-sm"><code
class="language-html"
>{`<head>
<title>My Gurt Site</title>
<icon src="gurt://example.real/icon.png">
</head>
<body>
<h1 style="text-3xl font-bold text-center">
Welcome to Gurted!
</h1>
<div style="flex flex-col gap-4 p-4 bg-[#f8fafc]">
<p style="text-lg text-[#64748b]">
The future of web development
</p>
</div>
</body>`}</code
></pre>
</CardContent>
</Card>
<!-- Lua Example -->
<Card>
<CardHeader>
<CardTitle>Lua</CardTitle>
<CardDescription>Dynamic content with Lua scripting</CardDescription>
</CardHeader>
<CardContent>
<pre class="bg-muted text-foreground overflow-x-auto rounded-lg p-4 text-sm"><code class="language-lua">{`<script>
local heading = gurt.select('h1')
heading:text('Dynamic Content!')
local new_div = gurt.create('div', {
style = 'bg-blue-500 p-4 rounded'
})
new_div.text = 'Created with Lua!'
gurt.select('body'):append(new_div)
gurt.select('button'):on('click', function()
trace.log('Button clicked!')
end)
</script>`}</code></pre>
</CardContent>
</Card>
</div>
</div>
</section>
<!-- Downloads Section -->
<section class="bg-muted/30 px-4 py-10">
<div class="container mx-auto max-w-4xl text-center">
<h2 class="font-gurted mb-6 text-4xl font-bold md:text-5xl">Get Started Today</h2>
<div class="mb-8 grid gap-6 md:grid-cols-2 max-w-2xl mx-auto">
<Card class="bg-card border-border/50">
<CardHeader>
<CardTitle>1. Download</CardTitle>
<CardDescription>Get the Flumi wayfinder for your platform</CardDescription>
</CardHeader>
<CardContent>
<Button class="w-full">
<Download class="h-4 w-4" />
Download
</Button>
</CardContent>
</Card>
<Card class="bg-card border-border/50">
<CardHeader>
<CardTitle>2. Start Building</CardTitle>
<CardDescription>Create your first GURT site</CardDescription>
</CardHeader>
<CardContent>
<Button variant="outline" class="w-full">
<ExternalLink class="h-4 w-4" />
Documentation
</Button>
</CardContent>
</Card>
</div>
</div>
</section>
</main>
<style>
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.animate-fade-in-up {
animation: fadeInUp 0.8s ease-out;
}
code {
font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
}
pre {
font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
line-height: 1.4;
}
</style>

View File

@@ -0,0 +1,257 @@
<script lang="ts">
import { Button } from '$lib/components/ui/button';
import {
Card,
CardContent,
CardDescription,
CardHeader,
CardTitle
} from '$lib/components/ui/card';
import { Badge } from '$lib/components/ui/badge';
import {
Download,
Shield,
Globe,
Search,
KeyRound,
Terminal,
ExternalLink,
Github,
Monitor,
AppWindow,
} from 'lucide-svelte';
import Navbar from '$lib/components/Navbar.svelte';
const version = '1.0.0';
</script>
<svelte:head>
<title>Download - Gurted</title>
<meta
name="description"
content="Download Flumi browser and other Gurted ecosystem components for your platform."
/>
</svelte:head>
<main class="bg-background text-foreground min-h-screen">
<Navbar />
<!-- Main Downloads -->
<section class="px-4 pt-40">
<div class="container mx-auto max-w-6xl">
<div class="mb-16 text-center">
<h2 class="font-gurted mb-4 inline-block align-middle text-4xl font-bold md:text-5xl">
Flumi
</h2>
<Badge variant="secondary" class="ml-2 align-middle">v{version}</Badge>
<p class="text-muted-foreground mx-auto max-w-3xl text-xl">
The official wayfinder (browser) for the GURT ecosystem
</p>
</div>
<div class="mb-16 grid gap-8 md:grid-cols-3">
<!-- Windows -->
<Card class="text-center transition-all duration-300 hover:shadow-xl">
<CardHeader>
<div
class="bg-primary/10 mx-auto mb-4 flex h-20 w-20 items-center justify-center rounded-2xl"
>
<AppWindow class="text-primary h-12 w-12" />
</div>
<CardTitle class="text-2xl">Windows</CardTitle>
<CardDescription>Windows 10/11 (x64)</CardDescription>
</CardHeader>
<CardContent class="space-y-4">
<Button class="w-full" size="lg" href="https://github.com/outpoot/gurted/releases/download/v{version}/Flumi_Setup_Windows.exe" target="_blank" rel="noopener noreferrer">
<Download class="h-4 w-4 " />
Download
</Button>
</CardContent>
</Card>
<!-- macOS -->
<Card class="text-center transition-all duration-300 hover:shadow-xl">
<CardHeader>
<div
class="bg-primary/10 mx-auto mb-4 flex h-20 w-20 items-center justify-center rounded-2xl"
>
<Monitor class="text-primary h-12 w-12" />
</div>
<CardTitle class="text-2xl">macOS</CardTitle>
<CardDescription>macOS 11+ (Universal)</CardDescription>
</CardHeader>
<CardContent class="space-y-4">
<Button class="w-full" size="lg" disabled>
<Download class="h-4 w-4 "/>
Download (soon)
</Button>
</CardContent>
</Card>
<!-- Linux -->
<Card class="text-center transition-all duration-300 hover:shadow-xl">
<CardHeader>
<div
class="bg-primary/10 mx-auto mb-4 flex h-20 w-20 items-center justify-center rounded-2xl"
>
<Terminal class="text-primary h-12 w-12" />
</div>
<CardTitle class="text-2xl">Linux</CardTitle>
<CardDescription>Ubuntu 20.04+ / Fedora 35+</CardDescription>
</CardHeader>
<CardContent class="space-y-4">
<Button class="w-full" size="lg" onclick={() => alert('oh my god bruh')}>
<Download class="h-4 w-4 " />
Download
</Button>
</CardContent>
</Card>
</div>
</div>
</section>
<!-- Ecosystem Tools -->
<section class="bg-muted/30 px-4 py-10">
<div class="container mx-auto max-w-6xl">
<div class="mb-16 text-center">
<h2 class="font-gurted mb-4 text-4xl font-bold md:text-5xl">Ecosystem Tools</h2>
<p class="text-muted-foreground mx-auto max-w-3xl text-xl">
Additional tools and services for developers and server administrators
</p>
</div>
<div class="grid gap-8 md:grid-cols-2 lg:grid-cols-3">
<!-- GURT Protocol Library -->
<Card class="transition-all duration-300 hover:shadow-xl">
<CardHeader>
<div class="bg-primary/10 mb-4 flex h-16 w-16 items-center justify-center rounded-2xl">
<Shield class="text-primary h-8 w-8" />
</div>
<CardTitle>GURT Protocol</CardTitle>
</CardHeader>
<CardContent class="space-y-4">
<p class="text-muted-foreground text-sm">
Implementation libraries for the GURT protocol in multiple languages
</p>
<Button variant="outline" class="w-full" href="https://github.com/outpoot/gurted">
<ExternalLink class="h-4 w-4 " />
View on GitHub
</Button>
</CardContent>
</Card>
<!-- GurtDNS Server -->
<Card class="transition-all duration-300 hover:shadow-xl">
<CardHeader>
<div class="bg-primary/10 mb-4 flex h-16 w-16 items-center justify-center rounded-2xl">
<Globe class="text-primary h-8 w-8" />
</div>
<CardTitle>GurtDNS</CardTitle>
</CardHeader>
<CardContent class="space-y-4">
<p class="text-muted-foreground text-sm">
Self-hosted DNS server with encrypted queries and domain management
</p>
<Button variant="outline" class="w-full" href="https://github.com/outpoot/gurted">
<ExternalLink class="h-4 w-4 " />
View Repository
</Button>
</CardContent>
</Card>
<!-- Ringle Search -->
<Card class="transition-all duration-300 hover:shadow-xl">
<CardHeader>
<div class="bg-primary/10 mb-4 flex h-16 w-16 items-center justify-center rounded-2xl">
<Search class="text-primary h-8 w-8" />
</div>
<CardTitle>Ringle</CardTitle>
</CardHeader>
<CardContent class="space-y-4">
<p class="text-muted-foreground text-sm">
Privacy-focused search engine designed for the GURT ecosystem
</p>
<Button variant="outline" class="w-full" href="https://github.com/outpoot/gurted">
<ExternalLink class="h-4 w-4 " />
View Repository
</Button>
</CardContent>
</Card>
<!-- GurtCA -->
<Card class="transition-all duration-300 hover:shadow-xl">
<CardHeader>
<div class="bg-primary/10 mb-4 flex h-16 w-16 items-center justify-center rounded-2xl">
<KeyRound class="text-primary h-8 w-8" />
</div>
<CardTitle>GurtCA</CardTitle>
</CardHeader>
<CardContent class="space-y-4">
<p class="text-muted-foreground text-sm">
Automated certificate authority for GURT domains with DNS validation
</p>
<Button variant="outline" class="w-full" href="https://github.com/outpoot/gurted">
<ExternalLink class="h-4 w-4 " />
View Repository
</Button>
</CardContent>
</Card>
<!-- Gurty CLI -->
<Card class="transition-all duration-300 hover:shadow-xl">
<CardHeader>
<div class="bg-primary/10 mb-4 flex h-16 w-16 items-center justify-center rounded-2xl">
<Terminal class="text-primary h-8 w-8" />
</div>
<CardTitle>Gurty CLI</CardTitle>
</CardHeader>
<CardContent class="space-y-4">
<p class="text-muted-foreground text-sm">
CLI tool for setting up and managing GURT protocol servers
</p>
<Button variant="outline" class="w-full" href="https://github.com/outpoot/gurted">
<ExternalLink class="h-4 w-4 " />
View Repository
</Button>
</CardContent>
</Card>
<!-- Source Code -->
<Card class="transition-all duration-300 hover:shadow-xl">
<CardHeader>
<div class="bg-primary/10 mb-4 flex h-16 w-16 items-center justify-center rounded-2xl">
<Github class="text-primary h-8 w-8" />
</div>
<CardTitle>Source Code</CardTitle>
</CardHeader>
<CardContent class="space-y-4">
<p class="text-muted-foreground text-sm">
All Gurted components are open source and available on GitHub
</p>
<Button variant="outline" class="w-full" href="https://github.com/outpoot/gurted">
<ExternalLink class="h-4 w-4 " />
View Repository
</Button>
</CardContent>
</Card>
</div>
</div>
</section>
</main>
<style>
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.animate-fade-in-up {
animation: fadeInUp 0.8s ease-out;
}
</style>