summaryrefslogtreecommitdiffstats
path: root/apps/frontpage/src
diff options
context:
space:
mode:
authorivarlovlie <git@ivarlovlie.no>2022-06-05 15:43:08 +0200
committerivarlovlie <git@ivarlovlie.no>2022-06-05 15:43:33 +0200
commit1cb220ef54ddaf635b322d8c24f38613f371285e (patch)
tree8fa0445d9642b8774b7ecfeea5d45a244403d82d /apps/frontpage/src
parentdccb6a5cf79699ed78bc3101f76c97b21f5a842e (diff)
downloadgreatoffice-1cb220ef54ddaf635b322d8c24f38613f371285e.tar.xz
greatoffice-1cb220ef54ddaf635b322d8c24f38613f371285e.zip
feat: New frontpage
Diffstat (limited to 'apps/frontpage/src')
-rw-r--r--apps/frontpage/src/app.d.ts10
-rw-r--r--apps/frontpage/src/app.html20
-rw-r--r--apps/frontpage/src/routes/__layout.svelte80
-rw-r--r--apps/frontpage/src/routes/app.scss7
-rw-r--r--apps/frontpage/src/routes/docs/__layout.svelte4
-rw-r--r--apps/frontpage/src/routes/docs/index.svelte1
-rw-r--r--apps/frontpage/src/routes/index.svelte2
-rw-r--r--apps/frontpage/src/routes/privacy.svelte1
-rw-r--r--apps/frontpage/src/routes/terms.svelte1
9 files changed, 106 insertions, 20 deletions
diff --git a/apps/frontpage/src/app.d.ts b/apps/frontpage/src/app.d.ts
deleted file mode 100644
index 121720c..0000000
--- a/apps/frontpage/src/app.d.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-/// <reference types="@sveltejs/kit" />
-
-// See https://kit.svelte.dev/docs/types#app
-// for information about these interfaces
-declare namespace App {
- // interface Locals {}
- // interface Platform {}
- // interface Session {}
- // interface Stuff {}
-}
diff --git a/apps/frontpage/src/app.html b/apps/frontpage/src/app.html
index 3dff376..917c2aa 100644
--- a/apps/frontpage/src/app.html
+++ b/apps/frontpage/src/app.html
@@ -1,12 +1,14 @@
<!DOCTYPE html>
<html lang="en">
- <head>
- <meta charset="utf-8" />
- <link rel="icon" href="%sveltekit.assets%/favicon.png" />
- <meta name="viewport" content="width=device-width, initial-scale=1" />
- %sveltekit.head%
- </head>
- <body>
- <main>%sveltekit.body%</main>
- </body>
+<head>
+ <meta charset="utf-8"/>
+ <link rel="icon"
+ href="%sveltekit.assets%/favicon.png"/>
+ <meta name="viewport"
+ content="width=device-width, initial-scale=1"/>
+ %sveltekit.head%
+</head>
+<body>
+<div>%sveltekit.body%</div>
+</body>
</html>
diff --git a/apps/frontpage/src/routes/__layout.svelte b/apps/frontpage/src/routes/__layout.svelte
new file mode 100644
index 0000000..f1a7eaa
--- /dev/null
+++ b/apps/frontpage/src/routes/__layout.svelte
@@ -0,0 +1,80 @@
+<script>
+ import {portal_base} from "$shared/lib/configuration";
+ import "./app.scss";
+ import {afterNavigate} from "$app/navigation";
+ import {page} from "$app/stores";
+
+ let showSidebar = false;
+ afterNavigate(() => showSidebar = false);
+</script>
+
+<div class="padding-component flex justify-between hide@sm">
+ <span class="text-lg">Greatoffice</span>
+ <button class="btn btn--primary"
+ on:click={() => showSidebar = !showSidebar}>{showSidebar ? "Close" : "Show"} menu
+ </button>
+</div>
+
+<style>
+ .nav-active {
+ color: var(--color-primary);
+ background: hsla(var(--color-contrast-higher-h), var(--color-contrast-higher-s), var(--color-contrast-higher-l), 0.075)
+ }
+</style>
+
+<div class="flex@sm">
+ <aside class="sidebar {showSidebar ? 'sidebar--is-visible': ''}">
+ <div class="sidebar__panel">
+ <header class="sidebar__header bg padding-y-sm padding-x-md border-bottom z-index-2">
+ <span class="text-md text-truncate">Menu</span>
+ <button class="reset sidebar__close-btn"
+ on:click={() => showSidebar = !showSidebar}>
+ <svg class="icon icon--xs"
+ viewBox="0 0 16 16"><title>Close panel</title>
+ <g stroke-width="2"
+ stroke="currentColor"
+ fill="none"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ stroke-miterlimit="10">
+ <line x1="13.5"
+ y1="2.5"
+ x2="2.5"
+ y2="13.5"></line>
+ <line x1="2.5"
+ y1="2.5"
+ x2="13.5"
+ y2="13.5"></line>
+ </g>
+ </svg>
+ </button>
+ </header>
+ <div class="position-relative padding-sm z-index-1">
+ <nav class="flex flex-column gap-xs text-lg">
+ <span class="text-lg hide block@sm">Greatoffice</span>
+ <a href="/"
+ class="reset"
+ title="Learn about the Greatoffice platform"
+ class:nav-active={$page.url.pathname === "/"}>About</a>
+ <a href="/privacy"
+ title="Read our privacy policy"
+ class="reset"
+ class:nav-active={$page.url.pathname.startsWith("/privacy")}>Privacy Policy</a>
+ <a href="/terms"
+ title="Read our terms of service"
+ class="reset"
+ class:nav-active={$page.url.pathname.startsWith("/terms")}>Terms of service</a>
+ <a href="{portal_base()}"
+ title="Login to you Greatoffice account"
+ >Login</a>
+ <a href="/docs"
+ title="Learn how to use Greatoffice">Documentation</a>
+ </nav>
+ </div>
+ </div>
+ </aside>
+
+ <main class="position-relative padding-sm z-index-1 flex-grow">
+ <slot></slot>
+ </main>
+</div>
diff --git a/apps/frontpage/src/routes/app.scss b/apps/frontpage/src/routes/app.scss
new file mode 100644
index 0000000..73a46ba
--- /dev/null
+++ b/apps/frontpage/src/routes/app.scss
@@ -0,0 +1,7 @@
+@use '../../web-shared/src/styles/base' as *;
+@use '../../web-shared/src/styles/custom-style/colors';
+@use '../../web-shared/src/styles/custom-style/spacing';
+@use '../../web-shared/src/styles/custom-style/shared-styles';
+@use '../../web-shared/src/styles/custom-style/typography';
+@use '../../web-shared/src/styles/custom-style/util';
+@use '../../web-shared/src/styles/components/responsive-sidebar';
diff --git a/apps/frontpage/src/routes/docs/__layout.svelte b/apps/frontpage/src/routes/docs/__layout.svelte
new file mode 100644
index 0000000..34c3139
--- /dev/null
+++ b/apps/frontpage/src/routes/docs/__layout.svelte
@@ -0,0 +1,4 @@
+<nav>
+ <a href="/">Home</a>
+</nav>
+<slot></slot> \ No newline at end of file
diff --git a/apps/frontpage/src/routes/docs/index.svelte b/apps/frontpage/src/routes/docs/index.svelte
new file mode 100644
index 0000000..da83065
--- /dev/null
+++ b/apps/frontpage/src/routes/docs/index.svelte
@@ -0,0 +1 @@
+<h1>Documentation</h1> \ No newline at end of file
diff --git a/apps/frontpage/src/routes/index.svelte b/apps/frontpage/src/routes/index.svelte
index 8038f19..ae068f6 100644
--- a/apps/frontpage/src/routes/index.svelte
+++ b/apps/frontpage/src/routes/index.svelte
@@ -1 +1 @@
-<h1>Welcome to Greatoffice</h1>
+<h1>About</h1>
diff --git a/apps/frontpage/src/routes/privacy.svelte b/apps/frontpage/src/routes/privacy.svelte
new file mode 100644
index 0000000..aaff3a9
--- /dev/null
+++ b/apps/frontpage/src/routes/privacy.svelte
@@ -0,0 +1 @@
+<h1>Privacy Policy</h1>
diff --git a/apps/frontpage/src/routes/terms.svelte b/apps/frontpage/src/routes/terms.svelte
new file mode 100644
index 0000000..d495e19
--- /dev/null
+++ b/apps/frontpage/src/routes/terms.svelte
@@ -0,0 +1 @@
+<h1>Terms of service</h1>