diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/app.d.ts | 10 | ||||
| -rw-r--r-- | src/app.html | 92 | ||||
| -rw-r--r-- | src/lib/supabase.ts | 8 | ||||
| -rw-r--r-- | src/routes/index.svelte | 3 | ||||
| -rw-r--r-- | src/routes/team/PersonBio.svelte | 20 | ||||
| -rw-r--r-- | src/routes/team/PersonCard.svelte | 26 | ||||
| -rw-r--r-- | src/routes/team/index.svelte | 43 |
7 files changed, 202 insertions, 0 deletions
diff --git a/src/app.d.ts b/src/app.d.ts new file mode 100644 index 0000000..9cbf1c5 --- /dev/null +++ b/src/app.d.ts @@ -0,0 +1,10 @@ +/// <reference types="@sveltejs/kit" /> + +// See https://kit.svelte.dev/docs/types#the-app-namespace +// for information about these interfaces +declare namespace App { + // interface Locals {} + // interface Platform {} + // interface Session {} + // interface Stuff {} +} diff --git a/src/app.html b/src/app.html new file mode 100644 index 0000000..5747f5d --- /dev/null +++ b/src/app.html @@ -0,0 +1,92 @@ +<!DOCTYPE html> +<html lang="en"> + <head> + <meta charset="utf-8" /> + <meta name="description" content="" /> + <link rel="icon" href="%svelte.assets%/favicon.png" /> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + <title>Misty Mountains Therapy</title> + + <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> + <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script> + + <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.1/font/bootstrap-icons.css"> + + <link rel="preconnect" href="https://fonts.googleapis.com"> + <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> + <link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400&display=swap" rel="stylesheet"> + + <style> + body { + font-family: 'Nunito Sans', sans-serif; + } + a { + text-decoration: none; + } + </style> + + %svelte.head% + </head> + <body class="d-flex flex-column min-vh-100"> + <nav class="navbar navbar-expand-md navbar-dark bg-dark"> + <div class="container"> + <a href="/" class="navbar-brand abs"> + <img height="100" src="/logo.png" alt="Misty Mountains Therapy"/> + </a> + <button class="navbar-toggler ms-auto" type="button" data-bs-toggle="collapse" data-bs-target="#toggle"> + <span class="navbar-toggler-icon"></span> + </button> + <div class="navbar-collapse collapse" id="toggle"> + <ul class="navbar-nav"> + <li class="nav-item active"> + <a class="nav-link" href="/">Home</a> + </li> + <li class="nav-item active"> + <a class="nav-link" href="/team">Our Team</a> + </li> + <li class="nav-item active"> + <a class="nav-link" href="/#/service">Services</a> + </li> + <li class="nav-item active"> + <a class="nav-link" href="/#/service">Approach</a> + </li> + <li class="nav-item active"> + <a class="nav-link" href="https://joni-hunt.clientsecure.me/" target="_blank">Portal</a> + </li> + </ul> + <ul class="navbar-nav ms-auto"> + <li class="nav-item"> + <a class="btn btn-success" href="/contact">Contact Us</a> + </li> + </ul> + </div> + </div> + </nav> + <div class="container mt-2"> + %svelte.body% + </div> + + <footer class="mt-auto bg-dark"> + <div class="container mt-2 mb-2 text-white"> + <div class="row justify-content-center align-items-center"> + <div class="col-md-5"> + <a href="mailto:jeffer@mistymountainsthreapy.com">jeffer@mistymountainsthreapy.com</a> + <br> + <span><a href="tel:15306383546">(530) 638 - 3546</a> (call or text)</span> + <hr> + <span>©Misty Mountains Therapy, 2022</span> + <br> + <span><a href="https://docs.google.com/document/d/10S_-yfiaDZnuD-0tvXTEIIyZiErVwrTj0y_0JiRT5_U/edit?usp=sharing" target="_blank">Privacy Policy</a></span> + </div> + <div class="col-md-5"> + <span>534 Trejo Street, Suite 200F</span> + <br> + <span>Rexburg, ID</span> + <br> + <span>83440</span> + </div> + </div> + </div> + </footer> + </body> +</html> diff --git a/src/lib/supabase.ts b/src/lib/supabase.ts new file mode 100644 index 0000000..37c828f --- /dev/null +++ b/src/lib/supabase.ts @@ -0,0 +1,8 @@ +import { createClient } from '@supabase/supabase-js'; + +export const supabase = createClient( + import.meta.env.VITE_SUPABASE_URL as string, + import.meta.env.VITE_SUPABASE_ANON_KEY as string, +); + +export default supabase;
\ No newline at end of file diff --git a/src/routes/index.svelte b/src/routes/index.svelte new file mode 100644 index 0000000..f9234a1 --- /dev/null +++ b/src/routes/index.svelte @@ -0,0 +1,3 @@ +<h1> + HELLO +</h1>
\ No newline at end of file diff --git a/src/routes/team/PersonBio.svelte b/src/routes/team/PersonBio.svelte new file mode 100644 index 0000000..437f57b --- /dev/null +++ b/src/routes/team/PersonBio.svelte @@ -0,0 +1,20 @@ +<script> + export let bio; + let showMore = false; +</script> + +<main> + {#if showMore} + <p>{bio}</p> + <button on:click={() => showMore = false}>Show Less</button> + {:else} + <p>{bio.substr(0, bio.lastIndexOf(' ', 150)) + '...'}</p> + <button on:click={() => showMore = true}>Show More</button> + {/if} +</main> + +<style> + p { + white-space: pre-line; + } +</style>
\ No newline at end of file diff --git a/src/routes/team/PersonCard.svelte b/src/routes/team/PersonCard.svelte new file mode 100644 index 0000000..3859179 --- /dev/null +++ b/src/routes/team/PersonCard.svelte @@ -0,0 +1,26 @@ +<script> + import PersonBio from './PersonBio.svelte'; + + export let person; + export let direction; +</script> + +<main> + <div class="row"> + {#if direction == 'right'} + <div class="col-sm-3"> + <img class="img-fluid" src={person.image} alt={person.name} /> + </div> + <div class="col-sm-9"> + <PersonBio bio={person.bio} /> + </div> + {:else} + <div class="col-sm-9"> + <PersonBio bio={person.bio} /> + </div> + <div class="col-sm-3"> + <img class="img-fluid" src={person.image} alt={person.name} /> + </div> + {/if} + </div> +</main>
\ No newline at end of file diff --git a/src/routes/team/index.svelte b/src/routes/team/index.svelte new file mode 100644 index 0000000..56a7e33 --- /dev/null +++ b/src/routes/team/index.svelte @@ -0,0 +1,43 @@ +<script> + import PersonCard from './PersonCard.svelte'; + + import { onMount } from 'svelte'; + import { supabase } from '$lib/supabase'; + + const getPeople = async () => { + const { data, error } = await supabase.from('people').select(); + if (!error) { + return data; + } + console.log(error); + return []; + } + + const mapImages = (people) => { + return people.map((x) => { + const { publicURL, error } = supabase + .storage + .from('mistymountains') + .getPublicUrl(x.image); + if (!error) { + return { ...x, image: publicURL }; + } + return x; + }); + } + + let people = []; + onMount(async () => { + people = await getPeople().then(mapImages); + }); +</script> + +<main> + {#if people.length} + {#each people as person, i} + <div class="row"> + <PersonCard person={person} direction={i % 2 ? 'left' : 'right'} /> + </div> + {/each} + {/if} +</main>
\ No newline at end of file |