From 7051213e0fdbd47ab1c0e6e8a67bda4f9cfba323 Mon Sep 17 00:00:00 2001 From: Fuwn Date: Wed, 21 Sep 2022 18:29:52 -0700 Subject: feat: initial commit --- src/app.css | 110 ++++++++++++++++++++++++++ src/app.d.ts | 14 ++++ src/app.html | 12 +++ src/hooks.server.ts | 16 ++++ src/lib/Counter.svelte | 103 ++++++++++++++++++++++++ src/lib/header/Header.svelte | 132 +++++++++++++++++++++++++++++++ src/lib/header/capybara-markets-logo.svg | 1 + src/routes/+layout.svelte | 49 ++++++++++++ src/routes/+page.svelte | 48 +++++++++++ src/routes/+page.ts | 1 + src/routes/about/+page.svelte | 35 ++++++++ src/routes/about/+page.ts | 9 +++ 12 files changed, 530 insertions(+) create mode 100644 src/app.css create mode 100644 src/app.d.ts create mode 100644 src/app.html create mode 100644 src/hooks.server.ts create mode 100644 src/lib/Counter.svelte create mode 100644 src/lib/header/Header.svelte create mode 100644 src/lib/header/capybara-markets-logo.svg create mode 100644 src/routes/+layout.svelte create mode 100644 src/routes/+page.svelte create mode 100644 src/routes/+page.ts create mode 100644 src/routes/about/+page.svelte create mode 100644 src/routes/about/+page.ts (limited to 'src') diff --git a/src/app.css b/src/app.css new file mode 100644 index 0000000..ab61613 --- /dev/null +++ b/src/app.css @@ -0,0 +1,110 @@ +@import '@fontsource/fira-mono'; + +@font-face { + font-family: 'Gilroy ExtraBold'; + src: url('/Gilroy-FREE/Gilroy-ExtraBold.otf'); +} + +@font-face { + font-family: 'Gilroy Light'; + src: url('/Gilroy-FREE/Gilroy-Light.otf'); +} + +:root { + font-family: 'Fira Mono', monospace; + --font-mono: 'Fira Mono', monospace; + --pure-white: #ffffff; + --primary-color: #b9c6d2; + --secondary-color: #d0dde9; + --tertiary-color: #edf0f8; + --accent-color: #ffe000; + --heading-color: rgba(0, 0, 0, 0.7); + --text-color: #444444; + --background-without-opacity: rgba(255, 255, 255, 0.7); + --column-width: 42rem; + --column-margin-top: 4rem; +} + +body { + min-height: 100vh; + margin: 0; + /* background-color: var(--primary-color); */ +} + +body::before { + content: ''; + width: 80vw; + height: 100vh; + position: absolute; + top: 0; + left: 10vw; + z-index: -1; + background: radial-gradient( + 50% 50% at 50% 50%, + var(--pure-white) 0%, + rgba(255, 255, 255, 0) 100% + ); + opacity: 0.05; +} + +#svelte { + min-height: 100vh; + display: flex; + flex-direction: column; +} + +h1, +h2, +p { + font-weight: 400; + color: var(--heading-color); +} + +p { + line-height: 1.5; +} + +a { + color: var(--accent-color); + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +h1 { + font-size: 2rem; + text-align: center; +} + +h2 { + font-size: 1rem; +} + +pre { + font-size: 16px; + font-family: var(--font-mono); + background-color: rgba(255, 255, 255, 0.45); + border-radius: 3px; + box-shadow: 2px 2px 6px rgb(255 255 255 / 25%); + padding: 0.5em; + overflow-x: auto; + color: var(--text-color); +} + +input, +button { + font-size: inherit; + font-family: inherit; +} + +button:focus:not(:focus-visible) { + outline: none; +} + +@media (min-width: 720px) { + h1 { + font-size: 2.4rem; + } +} diff --git a/src/app.d.ts b/src/app.d.ts new file mode 100644 index 0000000..89fa05e --- /dev/null +++ b/src/app.d.ts @@ -0,0 +1,14 @@ +// See https://kit.svelte.dev/docs/types#app +// for information about these interfaces +// and what to do when importing types +declare namespace App { + interface Locals { + userid: string; + } + + // interface PageData {} + + // interface PageError {} + + // interface Platform {} +} diff --git a/src/app.html b/src/app.html new file mode 100644 index 0000000..5b53ef7 --- /dev/null +++ b/src/app.html @@ -0,0 +1,12 @@ + + + + + + + %sveltekit.head% + + +
%sveltekit.body%
+ + diff --git a/src/hooks.server.ts b/src/hooks.server.ts new file mode 100644 index 0000000..ef64e7f --- /dev/null +++ b/src/hooks.server.ts @@ -0,0 +1,16 @@ +import type { Handle } from '@sveltejs/kit'; + +export const handle: Handle = async ({ event, resolve }) => { + let userid = event.cookies.get('userid'); + + if (!userid) { + // if this is the first time the user has visited this app, + // set a cookie so that we recognise them when they return + userid = crypto.randomUUID(); + event.cookies.set('userid', userid, { path: '/' }); + } + + event.locals.userid = userid; + + return resolve(event); +}; diff --git a/src/lib/Counter.svelte b/src/lib/Counter.svelte new file mode 100644 index 0000000..bb71271 --- /dev/null +++ b/src/lib/Counter.svelte @@ -0,0 +1,103 @@ + + +
+ + +
+
+ + {Math.floor($displayed_count)} +
+
+ + +
+ + diff --git a/src/lib/header/Header.svelte b/src/lib/header/Header.svelte new file mode 100644 index 0000000..534f306 --- /dev/null +++ b/src/lib/header/Header.svelte @@ -0,0 +1,132 @@ + + +
+
+ + + + + +

Capybara

+

Markets

+ +
+ + + +
+ +
+
+ + diff --git a/src/lib/header/capybara-markets-logo.svg b/src/lib/header/capybara-markets-logo.svg new file mode 100644 index 0000000..9dd986d --- /dev/null +++ b/src/lib/header/capybara-markets-logo.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte new file mode 100644 index 0000000..e6c496d --- /dev/null +++ b/src/routes/+layout.svelte @@ -0,0 +1,49 @@ + + +
+ +
+ +
+ + + + diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte new file mode 100644 index 0000000..b80f6cf --- /dev/null +++ b/src/routes/+page.svelte @@ -0,0 +1,48 @@ + + Home | Capybara Markets + + + +
+

+ + Capybara Markets + +

+ +

Your one-stop shop to all things finance

+ +

+ Capybara Markets delivers complete coverage of finance, #crypto, and the world. +

+
+ + diff --git a/src/routes/+page.ts b/src/routes/+page.ts new file mode 100644 index 0000000..189f71e --- /dev/null +++ b/src/routes/+page.ts @@ -0,0 +1 @@ +export const prerender = true; diff --git a/src/routes/about/+page.svelte b/src/routes/about/+page.svelte new file mode 100644 index 0000000..c7e3099 --- /dev/null +++ b/src/routes/about/+page.svelte @@ -0,0 +1,35 @@ + + About | Capybara Markets + + + +
+

About Capybara Markets

+ +

+ Welcome to Capybara Markets. You can expect us to cover + finance, #crypto, and world news in the near future. +

+ +

+ Capybara Markets is under active development. If you'd like to stay up to date, follow us on + Twitter. +

+ + + 
twitter.com/@CapybaraMarkets
+ + +

+ Our goal is to construct a complete, trusted, and collaberative platform where readers from all + around the world can tune in. +

+
+ + diff --git a/src/routes/about/+page.ts b/src/routes/about/+page.ts new file mode 100644 index 0000000..3e13462 --- /dev/null +++ b/src/routes/about/+page.ts @@ -0,0 +1,9 @@ +import { dev } from '$app/environment'; + +// we don't need any JS on this page, though we'll load +// it in dev so that we get hot module replacement... +export const csr = dev; + +// since there's no dynamic data here, we can prerender +// it so that it gets served as a static asset in prod +export const prerender = true; -- cgit v1.2.3