This commit is contained in:
parent
96bc6da8d4
commit
1a6877e91d
9 changed files with 186 additions and 175 deletions
|
@ -2,7 +2,7 @@
|
||||||
"name": "thesandwich",
|
"name": "thesandwich",
|
||||||
"private": true,
|
"private": true,
|
||||||
"version": "0.0.0",
|
"version": "0.0.0",
|
||||||
"source": "src/*.html",
|
"source": ["src/*.html", "src/partials/*.html"],
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"start": "parcel",
|
"start": "parcel",
|
||||||
"build": "parcel build"
|
"build": "parcel build"
|
||||||
|
|
|
@ -132,7 +132,7 @@
|
||||||
<img id="indicator" class="htmx-indicator" width="64" height="64" src="/assets/spinner.svg">
|
<img id="indicator" class="htmx-indicator" width="64" height="64" src="/assets/spinner.svg">
|
||||||
</center>
|
</center>
|
||||||
<div id="tabs" hx-target="#tabs" hx-swap="innerHTML">
|
<div id="tabs" hx-target="#tabs" hx-swap="innerHTML">
|
||||||
<include src="src/projects.html"></include>
|
<yield></yield>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="background-color: #484848;">
|
<div style="background-color: #484848;">
|
|
@ -4,13 +4,15 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<nav class="tab-list" role="tablist" hx-indicator="#indicator">
|
<nav class="tab-list" role="tablist" hx-indicator="#indicator">
|
||||||
<button hx-get="/projects.html" class="{{ selected-- == 0 ? 'selected' : '' }}" role="tab"
|
<button hx-get="/partials/projects.html" hx-push-url="/projects.html" class="{{ selected-- == 0 ? 'selected' : '' }}"
|
||||||
aria-selected="{{ selected == -1 ? 'true' : 'false' }}" aria-controls="tab-content">Our
|
role="tab" aria-selected="{{ selected == -1 ? 'true' : 'false' }}" aria-controls="tab-content">Our
|
||||||
Projects</button>
|
Projects</button>
|
||||||
<button hx-get="/who_we_are.html" class="{{ selected-- == 0 ? 'selected' : '' }}" role="tab"
|
<button hx-get="/partials/who_we_are.html" hx-push-url="/who_we_are.html"
|
||||||
aria-selected="{{ selected == -1 ? 'true' : 'false' }}" aria-controls="tab-content">Who we are</button>
|
class="{{ selected-- == 0 ? 'selected' : '' }}" role="tab" aria-selected="{{ selected == -1 ? 'true' : 'false' }}"
|
||||||
<button hx-get="/interests.html" class="{{ selected-- == 0 ? 'selected' : '' }}" role="tab"
|
aria-controls="tab-content">Who we are</button>
|
||||||
aria-selected="{{ selected == -1 ? 'true' : 'false' }}" aria-controls="tab-content">Our Interests</button>
|
<button hx-get="/partials/interests.html" hx-push-url="/interests.html"
|
||||||
|
class="{{ selected-- == 0 ? 'selected' : '' }}" role="tab" aria-selected="{{ selected == -1 ? 'true' : 'false' }}"
|
||||||
|
aria-controls="tab-content">Our Interests</button>
|
||||||
</nav>
|
</nav>
|
||||||
<hr style="margin: 0">
|
<hr style="margin: 0">
|
||||||
<div id="tab-content" role="tabpanel" class="tab-content">
|
<div id="tab-content" role="tabpanel" class="tab-content">
|
||||||
|
|
|
@ -1,12 +1,3 @@
|
||||||
<x-tab-content selected="2">
|
<x-head>
|
||||||
<x-section-head header="Shoutouts to cool things!">
|
<include src="src/partials/interests.html"></include>
|
||||||
<x-blockquote cite="Tyson Jenkins (CEO of Tysoncloud)">
|
</x-head>
|
||||||
That's crazy
|
|
||||||
</x-blockquote>
|
|
||||||
</x-section-head>
|
|
||||||
<x-project text="?">
|
|
||||||
<fill:title># Coming soon to theaters</fill:title>
|
|
||||||
<fill:subtitle>## This website is under construction</fill:subtitle>
|
|
||||||
<fill:description>We'll get to it, trust</fill:description>
|
|
||||||
</x-project>
|
|
||||||
</x-tab-content>
|
|
12
src/partials/interests.html
Normal file
12
src/partials/interests.html
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
<x-tab-content selected="2">
|
||||||
|
<x-section-head header="Shoutouts to cool things!">
|
||||||
|
<x-blockquote cite="Tyson Jenkins (CEO of Tysoncloud)">
|
||||||
|
That's crazy
|
||||||
|
</x-blockquote>
|
||||||
|
</x-section-head>
|
||||||
|
<x-project text="?">
|
||||||
|
<fill:title># Coming soon to theaters</fill:title>
|
||||||
|
<fill:subtitle>## This website is under construction</fill:subtitle>
|
||||||
|
<fill:description>We'll get to it, trust</fill:description>
|
||||||
|
</x-project>
|
||||||
|
</x-tab-content>
|
143
src/partials/projects.html
Normal file
143
src/partials/projects.html
Normal file
|
@ -0,0 +1,143 @@
|
||||||
|
<x-tab-content selected="0">
|
||||||
|
<x-section-head header="Our projects">
|
||||||
|
<x-blockquote cite="You, just now">
|
||||||
|
Wow, such professionalism! What are these guys working on now?
|
||||||
|
</x-blockquote>
|
||||||
|
</x-section-head>
|
||||||
|
<x-project href="https://github.com/timmyjinks/TYSONCLOUD">
|
||||||
|
<fill:img>
|
||||||
|
<img src="/assets/tysoncloud.svg">
|
||||||
|
</fill:img>
|
||||||
|
<fill:title># TYSONCLOUD</fill:title>
|
||||||
|
<fill:subtitle>## When she compute your serve 'till you edge</fill:subtitle>
|
||||||
|
<fill:description>
|
||||||
|
<markdown>
|
||||||
|
Have you ever just gone to a cloud service interface like Google Cloud Console, Microsoft Azure Portal, or
|
||||||
|
AWS Console, and just gone "...what? What am I even looking at? *Huh*?"
|
||||||
|
|
||||||
|
No more will you have to scrunkle your brain in these confusing interfaces to get access to fast, reliable
|
||||||
|
cloud, with **TYSONCLOUD**. Just input a docker container, and hit go!
|
||||||
|
</markdown>
|
||||||
|
</fill:description>
|
||||||
|
</x-project>
|
||||||
|
<x-project href="https://github.com/richgrov/simulo" onclick="spaghetti()" class="project-alt"
|
||||||
|
titlestyle="font-family: 'Apex Mk2'" headerstyle="font-family: 'Apex Mk2'">
|
||||||
|
<fill:img>
|
||||||
|
<img src="/assets/simulo.svg">
|
||||||
|
</fill:img>
|
||||||
|
<fill:title># Simulo</fill:title>
|
||||||
|
<fill:subtitle>
|
||||||
|
## Roblox for the real world!
|
||||||
|
#### (what could go wrong?)
|
||||||
|
</fill:subtitle>
|
||||||
|
<fill:description>
|
||||||
|
<div style="font-family: monospace;">
|
||||||
|
<markdown>
|
||||||
|
Are you a hot sweaty gamer looking to get hot and sweaty but in a good way? Bring your IRL game ideas to
|
||||||
|
life
|
||||||
|
with **Simulo**! It's like using the *Earth* as your game engine! You
|
||||||
|
don't even need to learn Lua to get started, instead, just describe your game to the engine and watch it
|
||||||
|
come to life!
|
||||||
|
|
||||||
|
Simulo is the most accessible game engine by a longshot, you just need a $600 laser projector and a
|
||||||
|
MacBook or Linux machine! Anyone can use Simulo.
|
||||||
|
</markdown>
|
||||||
|
</div>
|
||||||
|
</fill:description>
|
||||||
|
</x-project>
|
||||||
|
<x-project href="https://c0re.com">
|
||||||
|
<fill:img>
|
||||||
|
<include src="assets/c0re.svg"></include>
|
||||||
|
</fill:img>
|
||||||
|
<fill:title>
|
||||||
|
# c0re
|
||||||
|
#### So shiny!
|
||||||
|
</fill:title>
|
||||||
|
<fill:subtitle>## Git gud scrub!</fill:subtitle>
|
||||||
|
<fill:description>
|
||||||
|
<markdown>
|
||||||
|
Crush your friends in the game of life and get receipts using **c0re**! Gamify the effort of surpassing your
|
||||||
|
peers in every possible area and become objectively and quantifiably the _best_ person.
|
||||||
|
</markdown>
|
||||||
|
<p>Join the fray, and become your best self <span id="c0re-countup"></span> ago!</p>
|
||||||
|
<script>
|
||||||
|
// Code from https://www.w3schools.com/howto/howto_js_countdown.asp
|
||||||
|
// Set the date we're counting down to
|
||||||
|
var countDownDate = new Date("March 7, 2025").getTime();
|
||||||
|
|
||||||
|
function countup() {
|
||||||
|
// Get today's date and time
|
||||||
|
var now = new Date().getTime();
|
||||||
|
|
||||||
|
// Find the distance between now and the count down date
|
||||||
|
var distance = now - countDownDate;
|
||||||
|
|
||||||
|
// Time calculations for days, hours, minutes and seconds
|
||||||
|
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
|
||||||
|
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
||||||
|
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
|
||||||
|
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
|
||||||
|
|
||||||
|
document.getElementById("c0re-countup").innerHTML = days + "d " + hours + "h "
|
||||||
|
+ minutes + "m " + seconds + "s ";
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
countup();
|
||||||
|
// Update the count down every 1 second
|
||||||
|
var x = setInterval(countup, 1000);
|
||||||
|
</script>
|
||||||
|
</fill:description>
|
||||||
|
</x-project>
|
||||||
|
<x-blockquote cite="The Washington Post">
|
||||||
|
Please stop sending your projects to the review department
|
||||||
|
</x-blockquote>
|
||||||
|
<x-project href="https://braindance.live" class="project-alt"
|
||||||
|
titlestyle="background-image: linear-gradient(to right, oklch(0.714 0.203 305.504) 0px, oklch(0.718 0.202 349.761) 100%); background-clip: text; color: transparent">
|
||||||
|
<fill:img>
|
||||||
|
<img src="/assets/braindance.svg">
|
||||||
|
</fill:img>
|
||||||
|
<fill:title># Braindance</fill:title>
|
||||||
|
<fill:subtitle>## Bringing the Coachella to you!</fill:subtitle>
|
||||||
|
<fill:description>
|
||||||
|
<markdown>
|
||||||
|
Ever wanted to vibe to some skibidicore with the boys, but without actually being *with* the boys? Now
|
||||||
|
you can with Braindance! No better way exists to transmit concert vibes directly into your home
|
||||||
|
|
||||||
|
(Braindance
|
||||||
|
is not responsible for destruction of property due to moshpits materializing in your home).
|
||||||
|
</markdown>
|
||||||
|
</fill:description>
|
||||||
|
</x-project>
|
||||||
|
<x-project text="e" href="https://github.com/StratusFearMe21/grezi-next">
|
||||||
|
<fill:title># Grezi</fill:title>
|
||||||
|
<fill:subtitle>## When the power is point</fill:subtitle>
|
||||||
|
<fill:description>
|
||||||
|
<markdown>
|
||||||
|
Imagine a slideshow, but with extra lizard brain! That's what Grezi is. On top of making your
|
||||||
|
presentation extra skibidi bop bop yes yes, it also allows you to write your presentation with a bespoke
|
||||||
|
markup
|
||||||
|
language!
|
||||||
|
|
||||||
|
Instead of dragging elements around on your slides, you can open your notepad and make silly
|
||||||
|
text move
|
||||||
|
on the screen with plain text. What an incredible innovation!
|
||||||
|
</markdown>
|
||||||
|
</fill:description>
|
||||||
|
</x-project>
|
||||||
|
<x-project text="?" class="project-alt">
|
||||||
|
<fill:title># Mystery</fill:title>
|
||||||
|
<fill:subtitle>## _Oooooooo_</fill:subtitle>
|
||||||
|
<fill:description>
|
||||||
|
<markdown>Nobody knows what this project is gonna be. The creator, Josh, won't tell anyone.</markdown>
|
||||||
|
<form hx-post="/api/speculate" hx-target="#speculation-result">
|
||||||
|
<label for="speculation">
|
||||||
|
Speculate about the <i>secret</i> project below:
|
||||||
|
</label><br>
|
||||||
|
<textarea name="speculation" id="speculation"></textarea>
|
||||||
|
<input type="submit" value="Speculate!">
|
||||||
|
</form>
|
||||||
|
<div id="speculation-result"></div>
|
||||||
|
</fill:description>
|
||||||
|
</x-project>
|
||||||
|
</x-tab-content>
|
12
src/partials/who_we_are.html
Normal file
12
src/partials/who_we_are.html
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
<x-tab-content selected="1">
|
||||||
|
<x-section-head header="Who are these guys?">
|
||||||
|
<x-blockquote cite="Your mom, last night">
|
||||||
|
OMG these projects are so skibidi! I must know the rizzlers behind them!
|
||||||
|
</x-blockquote>
|
||||||
|
</x-section-head>
|
||||||
|
<x-project text="?">
|
||||||
|
<fill:title># Coming soon to theaters</fill:title>
|
||||||
|
<fill:subtitle>## This website is under construction</fill:subtitle>
|
||||||
|
<fill:description>We'll get to it, trust</fill:description>
|
||||||
|
</x-project>
|
||||||
|
</x-tab-content>
|
|
@ -1,143 +1,3 @@
|
||||||
<x-tab-content selected="0">
|
<x-head>
|
||||||
<x-section-head header="Our projects">
|
<include src="src/partials/projects.html"></include>
|
||||||
<x-blockquote cite="You, just now">
|
</x-head>
|
||||||
Wow, such professionalism! What are these guys working on now?
|
|
||||||
</x-blockquote>
|
|
||||||
</x-section-head>
|
|
||||||
<x-project href="https://github.com/timmyjinks/TYSONCLOUD">
|
|
||||||
<fill:img>
|
|
||||||
<img src="/assets/tysoncloud.svg">
|
|
||||||
</fill:img>
|
|
||||||
<fill:title># TYSONCLOUD</fill:title>
|
|
||||||
<fill:subtitle>## When she compute your serve 'till you edge</fill:subtitle>
|
|
||||||
<fill:description>
|
|
||||||
<markdown>
|
|
||||||
Have you ever just gone to a cloud service interface like Google Cloud Console, Microsoft Azure Portal, or
|
|
||||||
AWS Console, and just gone "...what? What am I even looking at? *Huh*?"
|
|
||||||
|
|
||||||
No more will you have to scrunkle your brain in these confusing interfaces to get access to fast, reliable
|
|
||||||
cloud, with **TYSONCLOUD**. Just input a docker container, and hit go!
|
|
||||||
</markdown>
|
|
||||||
</fill:description>
|
|
||||||
</x-project>
|
|
||||||
<x-project href="https://github.com/richgrov/simulo" onclick="spaghetti()" class="project-alt"
|
|
||||||
titlestyle="font-family: 'Apex Mk2'" headerstyle="font-family: 'Apex Mk2'">
|
|
||||||
<fill:img>
|
|
||||||
<img src="/assets/simulo.svg">
|
|
||||||
</fill:img>
|
|
||||||
<fill:title># Simulo</fill:title>
|
|
||||||
<fill:subtitle>
|
|
||||||
## Roblox for the real world!
|
|
||||||
#### (what could go wrong?)
|
|
||||||
</fill:subtitle>
|
|
||||||
<fill:description>
|
|
||||||
<div style="font-family: monospace;">
|
|
||||||
<markdown>
|
|
||||||
Are you a hot sweaty gamer looking to get hot and sweaty but in a good way? Bring your IRL game ideas to
|
|
||||||
life
|
|
||||||
with **Simulo**! It's like using the *Earth* as your game engine! You
|
|
||||||
don't even need to learn Lua to get started, instead, just describe your game to the engine and watch it
|
|
||||||
come to life!
|
|
||||||
|
|
||||||
Simulo is the most accessible game engine by a longshot, you just need a $600 laser projector and a
|
|
||||||
MacBook or Linux machine! Anyone can use Simulo.
|
|
||||||
</markdown>
|
|
||||||
</div>
|
|
||||||
</fill:description>
|
|
||||||
</x-project>
|
|
||||||
<x-project href="https://c0re.com">
|
|
||||||
<fill:img>
|
|
||||||
<include src="assets/c0re.svg"></include>
|
|
||||||
</fill:img>
|
|
||||||
<fill:title>
|
|
||||||
# c0re
|
|
||||||
#### So shiny!
|
|
||||||
</fill:title>
|
|
||||||
<fill:subtitle>## Git gud scrub!</fill:subtitle>
|
|
||||||
<fill:description>
|
|
||||||
<markdown>
|
|
||||||
Crush your friends in the game of life and get receipts using **c0re**! Gamify the effort of surpassing your
|
|
||||||
peers in every possible area and become objectively and quantifiably the _best_ person.
|
|
||||||
</markdown>
|
|
||||||
<p>Join the fray, and become your best self <span id="c0re-countup"></span> ago!</p>
|
|
||||||
<script>
|
|
||||||
// Code from https://www.w3schools.com/howto/howto_js_countdown.asp
|
|
||||||
// Set the date we're counting down to
|
|
||||||
var countDownDate = new Date("March 7, 2025").getTime();
|
|
||||||
|
|
||||||
function countup() {
|
|
||||||
// Get today's date and time
|
|
||||||
var now = new Date().getTime();
|
|
||||||
|
|
||||||
// Find the distance between now and the count down date
|
|
||||||
var distance = now - countDownDate;
|
|
||||||
|
|
||||||
// Time calculations for days, hours, minutes and seconds
|
|
||||||
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
|
|
||||||
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
|
|
||||||
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
|
|
||||||
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
|
|
||||||
|
|
||||||
document.getElementById("c0re-countup").innerHTML = days + "d " + hours + "h "
|
|
||||||
+ minutes + "m " + seconds + "s ";
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
countup();
|
|
||||||
// Update the count down every 1 second
|
|
||||||
var x = setInterval(countup, 1000);
|
|
||||||
</script>
|
|
||||||
</fill:description>
|
|
||||||
</x-project>
|
|
||||||
<x-blockquote cite="The Washington Post">
|
|
||||||
Please stop sending your projects to the review department
|
|
||||||
</x-blockquote>
|
|
||||||
<x-project href="https://braindance.live" class="project-alt"
|
|
||||||
titlestyle="background-image: linear-gradient(to right, oklch(0.714 0.203 305.504) 0px, oklch(0.718 0.202 349.761) 100%); background-clip: text; color: transparent">
|
|
||||||
<fill:img>
|
|
||||||
<img src="/assets/braindance.svg">
|
|
||||||
</fill:img>
|
|
||||||
<fill:title># Braindance</fill:title>
|
|
||||||
<fill:subtitle>## Bringing the Coachella to you!</fill:subtitle>
|
|
||||||
<fill:description>
|
|
||||||
<markdown>
|
|
||||||
Ever wanted to vibe to some skibidicore with the boys, but without actually being *with* the boys? Now
|
|
||||||
you can with Braindance! No better way exists to transmit concert vibes directly into your home
|
|
||||||
|
|
||||||
(Braindance
|
|
||||||
is not responsible for destruction of property due to moshpits materializing in your home).
|
|
||||||
</markdown>
|
|
||||||
</fill:description>
|
|
||||||
</x-project>
|
|
||||||
<x-project text="e" href="https://github.com/StratusFearMe21/grezi-next">
|
|
||||||
<fill:title># Grezi</fill:title>
|
|
||||||
<fill:subtitle>## When the power is point</fill:subtitle>
|
|
||||||
<fill:description>
|
|
||||||
<markdown>
|
|
||||||
Imagine a slideshow, but with extra lizard brain! That's what Grezi is. On top of making your
|
|
||||||
presentation extra skibidi bop bop yes yes, it also allows you to write your presentation with a bespoke
|
|
||||||
markup
|
|
||||||
language!
|
|
||||||
|
|
||||||
Instead of dragging elements around on your slides, you can open your notepad and make silly
|
|
||||||
text move
|
|
||||||
on the screen with plain text. What an incredible innovation!
|
|
||||||
</markdown>
|
|
||||||
</fill:description>
|
|
||||||
</x-project>
|
|
||||||
<x-project text="?" class="project-alt">
|
|
||||||
<fill:title># Mystery</fill:title>
|
|
||||||
<fill:subtitle>## _Oooooooo_</fill:subtitle>
|
|
||||||
<fill:description>
|
|
||||||
<markdown>Nobody knows what this project is gonna be. The creator, Josh, won't tell anyone.</markdown>
|
|
||||||
<form hx-post="/api/speculate" hx-target="#speculation-result">
|
|
||||||
<label for="speculation">
|
|
||||||
Speculate about the <i>secret</i> project below:
|
|
||||||
</label><br>
|
|
||||||
<textarea name="speculation" id="speculation"></textarea>
|
|
||||||
<input type="submit" value="Speculate!">
|
|
||||||
</form>
|
|
||||||
<div id="speculation-result"></div>
|
|
||||||
</fill:description>
|
|
||||||
</x-project>
|
|
||||||
</x-tab-content>
|
|
|
@ -1,12 +1,3 @@
|
||||||
<x-tab-content selected="1">
|
<x-head>
|
||||||
<x-section-head header="Who are these guys?">
|
<include src="src/partials/who_we_are.html"></include>
|
||||||
<x-blockquote cite="Your mom, last night">
|
</x-head>
|
||||||
OMG these projects are so skibidi! I must know the rizzlers behind them!
|
|
||||||
</x-blockquote>
|
|
||||||
</x-section-head>
|
|
||||||
<x-project text="?">
|
|
||||||
<fill:title># Coming soon to theaters</fill:title>
|
|
||||||
<fill:subtitle>## This website is under construction</fill:subtitle>
|
|
||||||
<fill:description>We'll get to it, trust</fill:description>
|
|
||||||
</x-project>
|
|
||||||
</x-tab-content>
|
|
Loading…
Add table
Add a link
Reference in a new issue