update: Update main website content
Website now includes programming challenges I've done, groups I have
been active in, and certifications
Updated project list
Change-Id: Ib250aab4301c322031329c775e1ceb1e420ed906
Reviewed-on: https://git.clicks.codes/c/Coded/thecoded.prof/+/852
Reviewed-by: Samuel Shuert <coded@clicks.codes>
Tested-by: Samuel Shuert <coded@clicks.codes>
diff --git a/sites/main/src/components/Challenge.astro b/sites/main/src/components/Challenge.astro
new file mode 100644
index 0000000..4ffbd0a
--- /dev/null
+++ b/sites/main/src/components/Challenge.astro
@@ -0,0 +1,40 @@
+---
+
+import active from '../images/active.svg';
+import wip from '../images/wip.svg';
+import { Status } from './Project.astro';
+
+
+interface Props {
+ name: string,
+ url: string,
+ status: Status;
+}
+
+const { name, url, status } = Astro.props;
+
+let color: string;
+let icon: string;
+
+switch (status) {
+ case Status.Active: {
+ color = "bg-green";
+ icon = active.src;
+ break;
+ }
+ default:
+ case Status.Inactive:
+ case Status.WIP: {
+ color = "bg-yellow";
+ icon = wip.src;
+ break;
+ }
+}
+---
+
+<a href={url} class="w-max h-fit flex flex-col rounded-lg p-2 m-2 bg-surface0 shadow-md shadow-crust transition-transform hover:bg-surface1 hover:drop-shadow-md hover:-translate-y-1">
+ <div class="flex justify-between mr-1 mb-1 items-end gap-2">
+ <p class="text-text text-lg">{name}</p>
+ <img src={icon} alt="cross" class="h-8 self-start"/>
+ </div>
+</a>
diff --git a/sites/main/src/pages/index.astro b/sites/main/src/pages/index.astro
index 7fbdbb8..cd69689 100644
--- a/sites/main/src/pages/index.astro
+++ b/sites/main/src/pages/index.astro
@@ -1,6 +1,7 @@
---
import Layout from '../layouts/Layout.astro';
import Project, { Status } from '../components/Project.astro';
+import Challenge from '../components/Challenge.astro';
import active from '../images/active.svg'
import inactive from '../images/inactive.svg'
import wip from '../images/wip.svg'
@@ -20,6 +21,38 @@
I'm always looking for work so feel free to hit me up at any of my socials down below!
</p>
+ <!--Certifications-->
+ <h1 id="Certifications" class="text-text text-2xl mt-6">Certifications:</h1>
+ <div class="h-[3px] bg-surface2" />
+ <div id="key" class="w-full flex gap-6 justify-center items-center">
+ <p class="text-xs text-text -mr-4">Key:</p>
+ <div class="flex text-xs text-text h-fit w-fit items-center space-x-1"><img src={active.src} alt="cross" class="h-6"/><p>Complete</p></div>
+ <div class="flex text-xs text-text h-fit w-fit items-center space-x-1"><img src={wip.src} alt="cross" class="h-6"/><p>Work In Progress</p></div>
+ </div>
+ <div class="flex flex-wrap justify-center h-fit">
+ <Challenge name="IBM Back-end JavaScript Developer" url="https://www.coursera.org/professional-certificates/backend-javascript-developer" status={Status.WIP} />
+ </div>
+
+ <!--Groups-->
+ <h1 id="Groups" class="text-text text-2xl mt-6">Groups I'm a part of:</h1>
+ <div class="h-[3px] bg-surface2" />
+ <div id="key" class="w-full flex gap-6 justify-center items-center">
+ <p class="text-xs text-text -mr-4">Key:</p>
+ <div class="flex text-xs text-text h-fit w-fit items-center space-x-1"><img src={active.src} alt="cross" class="h-6"/><p>Active in</p></div>
+ <div class="flex text-xs text-text h-fit w-fit items-center space-x-1"><img src={inactive.src} alt="cross" class="h-6"/><p>Not active in</p></div>
+ </div>
+ <div class="flex flex-wrap justify-center h-fit">
+ <Project name="Freshly Baked Cake" url="https://freshlybakedca.ke" status={Status.Active}>
+ A collboration between people in hopes to bring good defaults to everyone. (Link broken because there's no site yet)
+ </Project>
+ <Project name="Auxolotl" url="https://auxolotl.org" status={Status.Active}>
+ A Nix ecosystem fork based on lix.systems, we aim to recreate lib and provide a new package set based on modules
+ </Project>
+ <Project name="Clicks Codes" url="https://clicks.codes" status={Status.Inactive}>
+ A friend group of 3, who during covid produced discord bots. Some Nix infra code is also available
+ </Project>
+ </div>
+
<!--PROJECTS-->
<h1 id="Projects" class="text-text text-2xl mt-6">Projects:</h1>
<div class="h-[3px] bg-surface2" />
@@ -30,18 +63,24 @@
<div class="flex text-xs text-text h-fit w-fit items-center space-x-1"><img src={inactive.src} alt="cross" class="h-6"/><p>Inactive</p></div>
</div>
<div class="flex flex-wrap justify-center h-fit">
+ <Project name="Convection" url="https://app.radicle.xyz/nodes/ash.radicle.garden/rad:z2Yde2rCwmHJ2g1XzSEJFxhe8VnHM" status={Status.Active}>
+ Fork off radicle-explorer with gerrit like code review
+ </Project>
+ <Project name="Tidepool" url="https://git.auxolotl.org/auxolotl/labs/src/branch/main/tidepool" status={Status.Active}>
+ Nix based package set including package builders as a rewrite from Auxolotl
+ </Project>
<Project name='Chimera' url='https://git.clicks.codes/plugins/gitiles/Chimera/NixFiles' status={Status.Active}>
Personal Nix configuration for me and my friends systems using Snowfall lib.
</Project>
<Project name="thecoded.prof suite" url="https://git.clicks.codes/plugins/gitiles/Coded/thecoded.prof/" status={Status.Active}>
My series of websites, including this one and my blog.
</Project>
- <Project name="Clicks.Codes" url="https://git.clicks.codes/plugins/gitiles/Clicks/clicks.codes/" status={Status.Active}>
- The main page for ClicksCodes, a programming group run by me and some of my friends.
- </Project>
<Project name="Clicks Nix" url="https://git.clicks.codes/plugins/gitiles/Infra/NixFiles/" status={Status.Active}>
Nix configuration for Clicks Server.
</Project>
+ <Project name="Clicks.Codes" url="https://git.clicks.codes/plugins/gitiles/Clicks/clicks.codes/" status={Status.Inactive}>
+ The main page for ClicksCodes, a programming group run by me and some of my friends.
+ </Project>
<Project name="NixFiles" url="https://git.clicks.codes/plugins/gitiles/Coded/nixConfig/" status={Status.Inactive}>
My old Nix configuration, deprecated since move to Chimera.
</Project>
@@ -56,12 +95,25 @@
</Project>
</div>
+ <!--Short term programming challenges-->
+ <h1 id="Challenges" class="text-text text-2xl mt-6">Short term programming challenges:</h1>
+ <div class="h-[3px] bg-surface2" />
+ <div id="key" class="w-full flex gap-6 justify-center items-center">
+ <p class="text-xs text-text -mr-4">Key:</p>
+ <div class="flex text-xs text-text h-fit w-fit items-center space-x-1"><img src={active.src} alt="cross" class="h-6"/><p>Complete</p></div>
+ <div class="flex text-xs text-text h-fit w-fit items-center space-x-1"><img src={wip.src} alt="cross" class="h-6"/><p>Work In Progress</p></div>
+ </div>
+ <div class="flex flex-wrap justify-center h-fit">
+ <Challenge name="CodeCrafters Shell" url="https://app.radicle.xyz/nodes/ash.radicle.garden/rad:zcbMgnTGaVN5x2AeY2NhEbXEZWKL" status={Status.Active} />
+ <Challenge name="CodeCrafters Interpreter" url="https://app.radicle.xyz/nodes/ash.radicle.garden/rad:z3NugEsPZCuTaPHktFWRXrwwJboei" status={Status.WIP} />
+ </div>
+
<!--Contacts/Socials-->
<h1 id="Projects" class="text-text text-2xl mt-6">Contact Me:</h1>
<div class="h-[3px] bg-surface2" />
<div class="flex flex-col gap-1">
<p class="text-text text-sm">Discord: @thecodedprof</p>
- <p class="text-text text-sm">Matrix: <a href="https://matrix.to/#/@coded:clicks.codes" class="text-blue">@coded:clicks.codes</a></p>
+ <p class="text-text text-sm">Matrix: <a href="https://matrix.to/#/@coded:clicks.codes" class="text-blue">@coded:auxolotl.org</a></p>
<p class="text-text text-sm">Email: <a href="mailto:me@thecoded.prof" class="text-blue">me@thecoded.prof</a></p>
<p class="text-text text-sm">Text: <a href="sms:+12673426954" class="text-blue">+1(267)342-6954</a></p>
</div>