Skip to content

Commit 9f7443c

Browse files
HerschenglimeHerschenglime
authored
Merge pull request #1 from ufaes/dev
Add page skeletons and flesh out UI
2 parents ec4f9dc + 12f2d19 commit 9f7443c

21 files changed

Lines changed: 282 additions & 84 deletions

‎.cursorrules‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
{
2+
"language": "typescript",
3+
"framework": "svelte",
4+
"context": [
5+
"https://svelte-llm.khromov.se/sveltekit,svelte",
6+
"https://tailwindcss.com/docs",
7+
"https://svelte.dev/docs",
8+
"https://www.typescriptlang.org/docs/"
9+
],
10+
"api": {
11+
"svelte": {
12+
"docs": "https://svelte.dev/content.json",
13+
"refresh": "daily"
14+
},
15+
"typescript": {
16+
"strict": true
17+
}
18+
},
19+
"includePatterns": [
20+
"src/**/*.{ts,js,svelte}",
21+
"*.config.{ts,js}"
22+
],
23+
"excludePatterns": [
24+
"node_modules/**",
25+
".svelte-kit/**",
26+
"build/**"
27+
],
28+
"rules": {
29+
"svelte5_events": {
30+
"pattern": "on:(click|keydown|input|change|submit)",
31+
"message": "Use 'onclick', 'onkeydown', etc. in Svelte 5 instead of 'on:' event syntax",
32+
"replacement": {
33+
"on:click": "onclick",
34+
"on:keydown": "onkeydown",
35+
"on:input": "oninput",
36+
"on:change": "onchange",
37+
"on:submit": "onsubmit"
38+
}
39+
},
40+
"svelte5_reactivity": {
41+
"pattern": "\\$:",
42+
"message": "Use '$derived' or '$effect' in Svelte 5 instead of '$:' reactive statements"
43+
},
44+
"bun_sqlite_import": {
45+
"pattern": "bun:sqlite3",
46+
"message": "Use 'bun:sqlite' for Bun's SQLite package",
47+
"replacement": "bun:sqlite"
48+
},
49+
"sveltekit_request_event": {
50+
"pattern": "({ params })",
51+
"message": "Add RequestEvent type for SvelteKit endpoint parameters",
52+
"replacement": "({ params }: RequestEvent)"
53+
},
54+
"sveltekit_imports_order": {
55+
"pattern": "import.*from.*@sveltejs/kit.*\n.*import.*from.*\\$lib",
56+
"message": "Import $lib modules before @sveltejs/kit modules"
57+
}
58+
}
59+
}

‎README.md‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,16 @@
1-
# sv
1+
# ufaes.github.io
2+
3+
This stores the code and content for our club website! Eventually, a non-technical guide will be written for how to contribute content to the site, but for now it is still under heavy development.
4+
5+
## Dev Guide
6+
7+
This is a SvelteKit project using Svelte 5, the most recent version as of time of writing. To make the ui easier to develop for, this also uses TailwindCSS and the DaisyUI library.
8+
9+
Currently, it is configured to be published as a static site and uses the static SvelteKit adapter. What that means is that when a push is made to the main branch, our "Deploy" github action will fire and regenerate the site and deploy it to ufaes.github.io. As far as I'm aware our org should have plenty of CPU hours for the purposes of site regeneration, but most development should happen out of `main` as it is trivial to test changes to the site locally.
10+
11+
Read below for tips automatically generated by the project setup.
12+
13+
# sv (automatically generated documentation)
214

315
Everything you need to build a Svelte project, powered by [`sv`](https://github.com/sveltejs/cli).
416

‎bun.lock‎

Lines changed: 3 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,7 @@
4545
"vitest-browser-svelte": "^0.1.0"
4646
},
4747
"dependencies": {
48-
"daisyui": "^5.0.43"
48+
"daisyui": "^5.0.43",
49+
"theme-change": "^2.5.0"
4950
}
5051
}

‎src/app.css‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
11
@import 'tailwindcss';
22
@plugin '@tailwindcss/forms';
33
@plugin '@tailwindcss/typography';
4-
@plugin 'daisyui';
4+
@plugin 'daisyui' {
5+
themes: emerald --default, dark --prefers-dark;
6+
}

‎src/lib/Header.svelte‎

Lines changed: 0 additions & 71 deletions
This file was deleted.

src/lib/Footer.svelte renamed to src/lib/components/Footer.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<footer class="footer sm:footer-horizontal bg-neutral text-neutral-content items-center p-4">
1+
<footer class="footer sm:footer-horizontal bg-base-300 text-neutral-content items-center p-4">
22
<aside class="grid-flow-col items-center">
33
<img src="logo.png" alt="AES UF Logo" class="max-h-18 block pr-5" />
44
<p>Copyright © {new Date().getFullYear()} - All right reserved</p>

‎src/lib/components/Header.svelte‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<script>
2+
import NavigationLinks from '$lib/components/NavigationLinks.svelte';
3+
import ThemeToggle from '$lib/components/ThemeToggle.svelte';
4+
// TODO: make text of link highlight the accent color if active page
5+
</script>
6+
7+
<div class="navbar bg-base-200 shadow-sm">
8+
<div class="navbar-start">
9+
<div class="dropdown">
10+
<div tabindex="0" role="button" class="btn btn-ghost lg:hidden">
11+
<svg
12+
xmlns="http://www.w3.org/2000/svg"
13+
class="h-5 w-5"
14+
fill="none"
15+
viewBox="0 0 24 24"
16+
stroke="currentColor"
17+
>
18+
<path
19+
stroke-linecap="round"
20+
stroke-linejoin="round"
21+
stroke-width="2"
22+
d="M4 6h16M4 12h8m-8 6h16"
23+
/>
24+
</svg>
25+
</div>
26+
<ul
27+
tabindex="0"
28+
class="menu menu-sm dropdown-content bg-base-100 rounded-box z-1 mt-3 w-52 p-2 shadow"
29+
>
30+
<NavigationLinks />
31+
</ul>
32+
</div>
33+
<a class="btn btn-ghost text-xl hidden lg:block" href="/">AES @ UF</a>
34+
</div>
35+
<div class="navbar-center hidden lg:flex">
36+
<ul class="menu menu-horizontal px-1">
37+
<NavigationLinks />
38+
</ul>
39+
</div>
40+
<div class="navbar-center lg:hidden">
41+
<a class="btn btn-ghost text-xl" href="/">AES @ UF</a>
42+
</div>
43+
<div class="navbar-end mr-5">
44+
<ThemeToggle />
45+
</div>
46+
</div>

‎src/lib/components/NavigationLinks.svelte‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
<!-- These are the links that will be displayed in the navigation bar. They are broken out into a separate file so that they can be used in both the small-format and large-format menus. -->
2+
3+
<li><a href="/about">About</a></li>
4+
<li><a href="/events">Events</a></li>
5+
<li><a href="/projects">Projects</a></li>

‎src/lib/components/ThemeToggle.svelte‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<script lang="ts">
2+
import { onMount } from 'svelte';
3+
4+
//https://github.com/saadeghi/theme-change
5+
import { themeChange } from 'theme-change';
6+
7+
// NOTE: the element that is using one of the theme attributes must be in the DOM on mount
8+
onMount(() => {
9+
themeChange(false);
10+
// 👆 false parameter is required for svelte
11+
});
12+
</script>
13+
14+
<div class="btn btn-ghost btn-circle">
15+
<label class="swap swap-rotate">
16+
<!-- this hidden checkbox controls the state -->
17+
<input
18+
type="checkbox"
19+
class="theme-controller sr-only"
20+
data-toggle-theme="dark,emerald"
21+
data-act-class="ACTIVECLASS"
22+
/>
23+
24+
<!-- sun icon -->
25+
<svg
26+
class="swap-on fill-current w-10 h-10"
27+
xmlns="http://www.w3.org/2000/svg"
28+
viewBox="0 0 24 24"
29+
><path
30+
d="M5.64,17l-.71.71a1,1,0,0,0,0,1.41,1,1,0,0,0,1.41,0l.71-.71A1,1,0,0,0,5.64,17ZM5,12a1,1,0,0,0-1-1H3a1,1,0,0,0,0,2H4A1,1,0,0,0,5,12Zm7-7a1,1,0,0,0,1-1V3a1,1,0,0,0-2,0V4A1,1,0,0,0,12,5ZM5.64,7.05a1,1,0,0,0,.7.29,1,1,0,0,0,.71-.29,1,1,0,0,0,0-1.41l-.71-.71A1,1,0,0,0,4.93,6.34Zm12,.29a1,1,0,0,0,.7-.29l.71-.71a1,1,0,1,0-1.41-1.41L17,5.64a1,1,0,0,0,0,1.41A1,1,0,0,0,17.66,7.34ZM21,11H20a1,1,0,0,0,0,2h1a1,1,0,0,0,0-2Zm-9,8a1,1,0,0,0-1,1v1a1,1,0,0,0,2,0V20A1,1,0,0,0,12,19ZM18.36,17A1,1,0,0,0,17,18.36l.71.71a1,1,0,0,0,1.41,0,1,1,0,0,0,0-1.41ZM12,6.5A5.5,5.5,0,1,0,17.5,12,5.51,5.51,0,0,0,12,6.5Zm0,9A3.5,3.5,0,1,1,15.5,12,3.5,3.5,0,0,1,12,15.5Z"
31+
/></svg
32+
>
33+
34+
<!-- moon icon -->
35+
<svg
36+
class="swap-off fill-current w-10 h-10"
37+
xmlns="http://www.w3.org/2000/svg"
38+
viewBox="0 0 24 24"
39+
><path
40+
d="M21.64,13a1,1,0,0,0-1.05-.14,8.05,8.05,0,0,1-3.37.73A8.15,8.15,0,0,1,9.08,5.49a8.59,8.59,0,0,1,.25-2A1,1,0,0,0,8,2.36,10.14,10.14,0,1,0,22,14.05,1,1,0,0,0,21.64,13Zm-9.5,6.69A8.14,8.14,0,0,1,7.08,5.22v.27A10.15,10.15,0,0,0,17.22,15.63a9.79,9.79,0,0,0,2.1-.22A8.11,8.11,0,0,1,12.14,19.73Z"
41+
/></svg
42+
>
43+
</label>
44+
</div>

0 commit comments

Comments
 (0)