Skip to content

Commit

Permalink
Merge pull request #71 from ngblaylock/52-add-basic-animation
Browse files Browse the repository at this point in the history
Add basic animation, Add next and previous project links
  • Loading branch information
ngblaylock authored Jul 8, 2024
2 parents e0d6d52 + 118dd72 commit bcc9b2e
Show file tree
Hide file tree
Showing 9 changed files with 529 additions and 432 deletions.
76 changes: 74 additions & 2 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 3 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,9 @@
"@sveltejs/adapter-auto": "^2.0.0",
"@sveltejs/adapter-static": "^2.0.3",
"@sveltejs/kit": "^1.20.4",
"@types/aos": "^3.0.7",
"@types/chroma-js": "^2.4.0",
"aos": "^2.3.4",
"bootstrap": "^5.3.1",
"chroma-js": "^2.4.2",
"mdsvex": "^0.11.0",
Expand All @@ -30,4 +32,4 @@
"vite": "^4.4.12"
},
"type": "module"
}
}
9 changes: 9 additions & 0 deletions src/components/Debug.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
<script lang="ts">
export let data;
</script>

<div class="card text-bg-dark">
<div class="card-body">
<pre class="m-0 p-0">{JSON.stringify(data, null, 2)}</pre>
</div>
</div>
63 changes: 63 additions & 0 deletions src/lib/projectList.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
export const projects = [
{
alt: 'Space Dynamics Laboratory',
route: 'sdl',
},
{
alt: 'Grammy Tammy\'s Delights',
route: 'gtd',
},
{
alt: 'Cookbook',
route: 'cookbook',
},
{
alt: 'Greater Smithfield Chamber of Commerce',
route: 'smithfield-chamber-of-commerce',
},
{
alt: 'Scoresheet App',
route: 'scoresheet',
},
{
alt: 'Extract GSheet',
route: 'extract-gsheet',
},
{
alt: 'Placeholdate Figma Plugin',
route: 'placeholdate',
},
{
alt: 'Small Satellite Conference',
route: 'smallsat',
},
{
alt: 'Jeffrey R. Wangsgard and Associates',
route: 'jrwcpatax',
},
{
alt: 'Busy Bee Odd Jobs',
route: 'busy-bee-odd-jobs',
},
{
alt: 'Bingo Caller',
route: 'bingo-caller',
},
{
alt: 'Sorenson Center',
route: 'scce',
},
// // ARCHIVED PROJECTS
// {
// alt: 'Psychology Department Website',
// route: 'psychology',
// },
// {
// alt: 'Enoch Initiative',
// route: 'enoch-initiative',
// },
// {
// alt: 'Group Sale Tracker',
// route: 'group-sale-tracker',
// },
];
12 changes: 12 additions & 0 deletions src/routes/+layout.svelte
Original file line number Diff line number Diff line change
@@ -1,11 +1,23 @@
<script lang="ts">
import { pageTitle } from '$lib/stores';
import { onMount } from 'svelte';
import Footer from '$components/Footer.svelte';
import Navbar from '$components/Navbar.svelte';
import Favicons from '$components/Favicons.svelte';
import BgAngle from '$components/BgAngle.svelte';
import MqHelper from '$components/MqHelper.svelte';
import Analytics from '$components/Analytics.svelte';
// Animate On Scroll
import 'aos/dist/aos.css';
import AOS from 'aos';
onMount(() => {
AOS.init({
once: true,
offset: 100,
});
});
</script>

<svelte:head>
Expand Down
83 changes: 11 additions & 72 deletions src/routes/+page.svelte
Original file line number Diff line number Diff line change
@@ -1,83 +1,22 @@
<script>
import SEO from '$components/SEO.svelte';
let projects = [
{
alt: 'Space Dynamics Laboratory',
route: 'sdl',
},
{
alt: 'Grammy Tammy\'s Delights',
route: 'gtd',
},
{
alt: 'Cookbook',
route: 'cookbook',
},
{
alt: 'Greater Smithfield Chamber of Commerce',
route: 'smithfield-chamber-of-commerce',
},
{
alt: 'Scoresheet App',
route: 'scoresheet',
},
{
alt: 'Extract GSheet',
route: 'extract-gsheet',
},
{
alt: 'Placeholdate Figma Plugin',
route: 'placeholdate',
},
{
alt: 'Small Satellite Conference',
route: 'smallsat',
},
{
alt: 'Jeffrey R. Wangsgard and Associates',
route: 'jrwcpatax',
},
{
alt: 'Busy Bee Odd Jobs',
route: 'busy-bee-odd-jobs',
},
{
alt: 'Bingo Caller',
route: 'bingo-caller',
},
{
alt: 'Sorenson Center',
route: 'scce',
},
// // ARCHIVED PROJECTS
// {
// alt: 'Psychology Department Website',
// route: 'psychology',
// },
// {
// alt: 'Enoch Initiative',
// route: 'enoch-initiative',
// },
// {
// alt: 'Group Sale Tracker',
// route: 'group-sale-tracker',
// },
];
import { projects } from '$lib/projectList';
</script>

<SEO title="Projects" robots />

<div class="row mb-5">
{#each projects as project}
<div class="col-sm-4 mb-2">
<a href="/projects/{project.route}"
><img
src="/images/optimized/projects/{project.route}/lg_{project.route}.jpg"
alt={project.alt}
class="img-fluid rounded shadow"
/></a
>
<div class="col-sm-4" data-aos="fade-up">
<div class="shadow mb-4">
<a href="/projects/{project.route}"
><img
src="/images/optimized/projects/{project.route}/lg_{project.route}.jpg"
alt={project.alt}
class="img-fluid rounded"
/></a
>
</div>
</div>
{/each}
</div>
Loading

0 comments on commit bcc9b2e

Please sign in to comment.