mirror of
https://github.com/sergi0g/cup.git
synced 2025-11-16 09:03:46 -05:00
V3
Many many many changes, honestly just read the release notes
This commit is contained in:
252
docs/src/app/components/Browser.tsx
Normal file
252
docs/src/app/components/Browser.tsx
Normal file
File diff suppressed because one or more lines are too long
23
docs/src/app/components/Card.tsx
Normal file
23
docs/src/app/components/Card.tsx
Normal file
@@ -0,0 +1,23 @@
|
||||
import { Icon as IconType } from "@tabler/icons-react";
|
||||
|
||||
export function Card({
|
||||
name,
|
||||
icon: Icon,
|
||||
description,
|
||||
}: {
|
||||
name: string;
|
||||
icon: IconType;
|
||||
description: string;
|
||||
}) {
|
||||
return (
|
||||
<div className="p-4 bg-white dark:bg-black group">
|
||||
<Icon className="text-black size-7 group-hover:size-9 dark:text-white inline mr-2 transition-[width,height] duration-200" />
|
||||
<span className="align-middle text-2xl font-bold text-black dark:text-white">
|
||||
{name}
|
||||
</span>
|
||||
<p className="text-xl font-semibold text-neutral-500 dark:text-neutral-500">
|
||||
{description}
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
33
docs/src/app/components/GradientText.tsx
Normal file
33
docs/src/app/components/GradientText.tsx
Normal file
@@ -0,0 +1,33 @@
|
||||
import React from "react";
|
||||
import { clsx } from "clsx";
|
||||
|
||||
export function GradientText({
|
||||
text,
|
||||
innerClassName,
|
||||
className,
|
||||
blur,
|
||||
}: {
|
||||
text: string;
|
||||
innerClassName: string;
|
||||
className?: string;
|
||||
blur: number;
|
||||
}) {
|
||||
return (
|
||||
<div className={clsx("relative", className)}>
|
||||
<p
|
||||
className={clsx("bg-clip-text text-transparent w-fit", innerClassName)}
|
||||
>
|
||||
{text}
|
||||
</p>
|
||||
<p
|
||||
className={clsx(
|
||||
"pointer-events-none absolute top-0 hidden select-none bg-clip-text text-transparent dark:block",
|
||||
innerClassName,
|
||||
)}
|
||||
style={{ filter: `blur(${blur}px)` }}
|
||||
>
|
||||
{text}
|
||||
</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
31
docs/src/app/components/GridPattern.tsx
Normal file
31
docs/src/app/components/GridPattern.tsx
Normal file
@@ -0,0 +1,31 @@
|
||||
import { useId } from "react";
|
||||
|
||||
const SIZE = 36;
|
||||
|
||||
export function GridPattern() {
|
||||
const id = useId();
|
||||
|
||||
return (
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
className="pointer-events-none absolute inset-0 bottom-0 left-0 right-0 top-0 h-full w-full -z-10 bg-white stroke-neutral-200 dark:stroke-white/10 dark:bg-black"
|
||||
>
|
||||
<defs>
|
||||
<pattern
|
||||
id={id}
|
||||
width={SIZE}
|
||||
height={SIZE}
|
||||
patternUnits="userSpaceOnUse"
|
||||
x={-1}
|
||||
y={-1}
|
||||
>
|
||||
<path
|
||||
d={`M.5 ${SIZE}V.5H${SIZE}`}
|
||||
fill="none"
|
||||
/>
|
||||
</pattern>
|
||||
</defs>
|
||||
<rect width="100%" height="100%" strokeWidth={0} fill={`url(#${id})`} />
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
29
docs/src/app/components/Head.tsx
Normal file
29
docs/src/app/components/Head.tsx
Normal file
@@ -0,0 +1,29 @@
|
||||
"use client";
|
||||
|
||||
import { Head as NextraHead } from "nextra/components";
|
||||
|
||||
export function Head() {
|
||||
return (
|
||||
<NextraHead>
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
|
||||
<meta
|
||||
name="theme-color"
|
||||
media="(prefers-color-scheme: light)"
|
||||
content="#ffffff"
|
||||
/>
|
||||
<meta
|
||||
name="theme-color"
|
||||
media="(prefers-color-scheme: dark)"
|
||||
content="#111111"
|
||||
/>
|
||||
<meta
|
||||
name="og:image"
|
||||
content="https://raw.githubusercontent.com/sergi0g/cup/main/docs/public/cup-og.png"
|
||||
/>
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:site" content="https://cup.sergi0g.dev" />
|
||||
<meta name="apple-mobile-web-app-title" content="Cup" />
|
||||
</NextraHead>
|
||||
);
|
||||
}
|
||||
57
docs/src/app/components/Logo.tsx
Normal file
57
docs/src/app/components/Logo.tsx
Normal file
@@ -0,0 +1,57 @@
|
||||
export default function Logo() {
|
||||
return (
|
||||
<svg
|
||||
viewBox="0 0 128 128"
|
||||
style={{ height: "calc(var(--nextra-navbar-height) * 0.6)" }}
|
||||
>
|
||||
<path
|
||||
style={{ fill: "#A6CFD6" }}
|
||||
d="M65.12,17.55c-17.6-0.53-34.75,5.6-34.83,14.36c-0.04,5.2,1.37,18.6,3.62,48.68s2.25,33.58,3.5,34.95
|
||||
c1.25,1.37,10.02,8.8,25.75,8.8s25.93-6.43,26.93-8.05c0.48-0.78,1.83-17.89,3.5-37.07c1.81-20.84,3.91-43.9,3.99-45.06
|
||||
C97.82,30.66,94.2,18.43,65.12,17.55z"
|
||||
/>
|
||||
<path
|
||||
style={{ fill: "#DCEDF6" }}
|
||||
d="M41.4,45.29c-0.12,0.62,1.23,24.16,2.32,27.94c1.99,6.92,9.29,7.38,10.23,4.16
|
||||
c0.9-3.07-0.38-29.29-0.38-29.29s-3.66-0.3-6.43-0.84C44,46.63,41.4,45.29,41.4,45.29z"
|
||||
/>
|
||||
<path
|
||||
style={{ fill: "#6CA4AE" }}
|
||||
d="M33.74,32.61c-0.26,8.83,20.02,12.28,30.19,12.22c13.56-0.09,29.48-4.29,29.8-11.7
|
||||
S79.53,21.1,63.35,21.1C49.6,21.1,33.96,25.19,33.74,32.61z"
|
||||
/>
|
||||
<path
|
||||
style={{ fill: "#DC0D27" }}
|
||||
d="M84.85,13.1c-0.58,0.64-9.67,30.75-9.67,30.75s2.01-0.33,4-0.79c2.63-0.61,3.76-1.06,3.76-1.06
|
||||
s7.19-22.19,7.64-23.09c0.45-0.9,21.61-7.61,22.31-7.93c0.7-0.32,1.39-0.4,1.46-0.78c0.06-0.38-2.34-6.73-3.11-6.73
|
||||
C110.47,3.47,86.08,11.74,84.85,13.1z"
|
||||
/>
|
||||
<path
|
||||
style={{ fill: "#8A1F0F" }}
|
||||
d="M110.55,7.79c1.04,2.73,2.8,3.09,3.55,2.77c0.45-0.19,1.25-1.84,0.01-4.47
|
||||
c-0.99-2.09-2.17-2.74-2.93-2.61C110.42,3.6,109.69,5.53,110.55,7.79z"
|
||||
/>
|
||||
<g>
|
||||
<path
|
||||
style={{ fill: "#8A1F0F" }}
|
||||
d="M91.94,18.34c-0.22,0-0.44-0.11-0.58-0.3l-3.99-5.77c-0.22-0.32-0.14-0.75,0.18-0.97
|
||||
c0.32-0.22,0.76-0.14,0.97,0.18l3.99,5.77c0.22,0.32,0.14,0.75-0.18,0.97C92.21,18.3,92.07,18.34,91.94,18.34z"
|
||||
/>
|
||||
</g>
|
||||
<g>
|
||||
<path
|
||||
style={{ fill: "#8A1F0F" }}
|
||||
d="M90.28,19.43c-0.18,0-0.35-0.07-0.49-0.2l-5.26-5.12c-0.28-0.27-0.28-0.71-0.01-0.99
|
||||
c0.27-0.28,0.71-0.28,0.99-0.01l5.26,5.12c0.28,0.27,0.28,0.71,0.01,0.99C90.64,19.36,90.46,19.43,90.28,19.43z"
|
||||
/>
|
||||
</g>
|
||||
<g>
|
||||
<path
|
||||
style={{ fill: "#8A1F0F" }}
|
||||
d="M89.35,21.22c-0.12,0-0.25-0.03-0.36-0.1l-5.6-3.39c-0.33-0.2-0.44-0.63-0.24-0.96
|
||||
c0.2-0.33,0.63-0.44,0.96-0.24l5.6,3.39c0.33,0.2,0.44,0.63,0.24,0.96C89.82,21.1,89.59,21.22,89.35,21.22z"
|
||||
/>
|
||||
</g>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
116
docs/src/app/components/pages/home.tsx
Normal file
116
docs/src/app/components/pages/home.tsx
Normal file
@@ -0,0 +1,116 @@
|
||||
import React from "react";
|
||||
import "./styles.css";
|
||||
|
||||
import { Browser } from "../Browser";
|
||||
import { Card } from "../Card";
|
||||
import {
|
||||
IconAdjustments,
|
||||
IconArrowRight,
|
||||
IconBarrierBlockOff,
|
||||
IconBolt,
|
||||
IconFeather,
|
||||
IconGitMerge,
|
||||
IconPuzzle,
|
||||
IconServer,
|
||||
IconTerminal,
|
||||
} from "@tabler/icons-react";
|
||||
import { GitHubIcon } from "nextra/icons";
|
||||
import { GridPattern } from "../GridPattern";
|
||||
import { GradientText } from "../GradientText";
|
||||
import Link from "next/link";
|
||||
|
||||
export default async function Home() {
|
||||
return (
|
||||
<>
|
||||
<div className="relative home bg-radial-[ellipse_at_center] from-transparent from-20% to-white dark:to-black">
|
||||
<GridPattern />
|
||||
<div className="px-4 pt-16 pb-8 sm:pt-24 lg:px-8">
|
||||
<div className="flex w-full flex-col items-center justify-between">
|
||||
<div>
|
||||
<h1 className="mx-auto max-w-2xl text-center text-6xl leading-none font-extrabold tracking-tighter text-black sm:text-7xl dark:text-white">
|
||||
The easiest way to manage your
|
||||
<GradientText
|
||||
text="container updates."
|
||||
className="mx-auto w-fit"
|
||||
innerClassName="bg-linear-to-r/oklch from-blue-500 to-green-500"
|
||||
blur={30}
|
||||
/>
|
||||
</h1>
|
||||
<h3 className="mx-auto mt-6 max-w-3xl text-center text-xl leading-tight font-medium text-neutral-500 dark:text-neutral-400">
|
||||
Cup is a small utility with a big impact. Simplify your
|
||||
container management workflow with fast and efficient update
|
||||
checking, a full-featured CLI and web interface, and more.
|
||||
</h3>
|
||||
</div>
|
||||
<div className="mt-8 grid w-fit grid-cols-2 gap-4 *:flex *:items-center *:gap-2 *:rounded-lg *:px-3 *:py-2">
|
||||
<Link
|
||||
href="/docs"
|
||||
className="hide-focus group h-full bg-black text-white dark:bg-white dark:text-black"
|
||||
>
|
||||
Get started
|
||||
<IconArrowRight className="ml-auto mr-1 transition-transform duration-300 ease-out group-hover:translate-x-1 group-focus:translate-x-1 dark:!text-black" />
|
||||
</Link>
|
||||
<a
|
||||
href="https://github.com/sergi0g/cup"
|
||||
target="_blank"
|
||||
className="hide-focus h-full bg-white dark:bg-black text-nowrap border border-black/15 transition-colors duration-200 ease-in-out hover:border-black/40 dark:border-white/15 hover:dark:border-white/40 hover:dark:shadow-sm focus:dark:border-white/30"
|
||||
>
|
||||
Star on GitHub
|
||||
<GitHubIcon className="ml-auto size-4 md:size-5" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="py-10 flex translate-y-32 justify-center" id="hero">
|
||||
<Browser />
|
||||
</div>
|
||||
</div>
|
||||
<div className="bg-white dark:bg-black py-12 px-8 w-full">
|
||||
<div className="flex h-full w-full items-center justify-center">
|
||||
<div className="grid md:grid-cols-2 md:grid-rows-4 lg:grid-cols-4 lg:grid-rows-2 w-full max-w-7xl gap-px border border-transparent bg-black/10 dark:bg-white/10">
|
||||
<Card
|
||||
name="Built for speed."
|
||||
icon={IconBolt}
|
||||
description="Cup is written in Rust and every release goes through extensive profiling to squeeze out every last drop of performance."
|
||||
/>
|
||||
<Card
|
||||
name="Configurable."
|
||||
icon={IconAdjustments}
|
||||
description="Make Cup yours with the extensive configuration options available. Customize and tailor it to your needs."
|
||||
/>
|
||||
<Card
|
||||
name="Extend it."
|
||||
icon={IconPuzzle}
|
||||
description="JSON output enables you to connect Cup with your favorite integrations, build automations and more."
|
||||
/>
|
||||
<Card
|
||||
name="CLI available."
|
||||
icon={IconTerminal}
|
||||
description="Do you like terminals? Cup has a CLI. Check for updates quickly without spinning up a server."
|
||||
/>
|
||||
<Card
|
||||
name="Multiple servers."
|
||||
icon={IconServer}
|
||||
description="Run multiple Cup instances and effortlessly check on them through one web interface."
|
||||
/>
|
||||
<Card
|
||||
name="Unstoppable."
|
||||
icon={IconBarrierBlockOff}
|
||||
description="Cup is designed to check for updates without using up any rate limits. 10 images per hour won't be a problem, even with 100 images."
|
||||
/>
|
||||
<Card
|
||||
name="Lightweight."
|
||||
icon={IconFeather}
|
||||
description="No need for a powerful server and endless storage. The tiny 5.4 MB binary won't hog your CPU and memory."
|
||||
/>
|
||||
<Card
|
||||
name="Open source."
|
||||
icon={IconGitMerge}
|
||||
description="All source code is publicly available in our GitHub repository. We're looking for contributors!"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
26
docs/src/app/components/pages/styles.css
Normal file
26
docs/src/app/components/pages/styles.css
Normal file
@@ -0,0 +1,26 @@
|
||||
article:has(.home) {
|
||||
padding-inline: 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
article div.x\:mt-16:last-child:empty {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
#hero {
|
||||
animation-name: hero;
|
||||
animation-duration: 1500ms;
|
||||
animation-delay: 500ms;
|
||||
animation-timing-function: ease-in-out;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
@keyframes hero {
|
||||
from {
|
||||
translate: 0 8rem;
|
||||
}
|
||||
to {
|
||||
translate: 0 0;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user