From c8d209facd5345288406f58c730e53249161e1de Mon Sep 17 00:00:00 2001 From: Isaac Mills Date: Wed, 9 Jul 2025 12:22:15 -0600 Subject: [PATCH] Add tabs --- .posthtmlrc | 2 +- assets/spinner.svg | 73 +++++++++++ package.json | 2 +- src/{ => components}/blockquote.html | 0 src/{ => components}/marquee.html | 0 src/{ => components}/project.html | 0 src/{ => components}/section-head.html | 0 src/components/tab-content.html | 16 +++ src/index.html | 161 +++---------------------- src/projects.html | 131 ++++++++++++++++++++ src/style.css | 17 ++- src/who_we_are.html | 12 ++ 12 files changed, 270 insertions(+), 144 deletions(-) create mode 100644 assets/spinner.svg rename src/{ => components}/blockquote.html (100%) rename src/{ => components}/marquee.html (100%) rename src/{ => components}/project.html (100%) rename src/{ => components}/section-head.html (100%) create mode 100644 src/components/tab-content.html create mode 100644 src/projects.html create mode 100644 src/who_we_are.html diff --git a/.posthtmlrc b/.posthtmlrc index 25eaebe..94aec39 100644 --- a/.posthtmlrc +++ b/.posthtmlrc @@ -1,7 +1,7 @@ { "plugins": { "posthtml-component": { - "root": "./src" + "root": "./src/components" }, "posthtml-include": {}, "posthtml-markdownit": {} diff --git a/assets/spinner.svg b/assets/spinner.svg new file mode 100644 index 0000000..e2c3c43 --- /dev/null +++ b/assets/spinner.svg @@ -0,0 +1,73 @@ + + + + + + + + + + + + + + + + diff --git a/package.json b/package.json index 7fa187a..bb737f1 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "thesandwich", "private": true, "version": "0.0.0", - "source": "src/index.html", + "source": "src/*.html", "scripts": { "start": "parcel", "build": "parcel build" diff --git a/src/blockquote.html b/src/components/blockquote.html similarity index 100% rename from src/blockquote.html rename to src/components/blockquote.html diff --git a/src/marquee.html b/src/components/marquee.html similarity index 100% rename from src/marquee.html rename to src/components/marquee.html diff --git a/src/project.html b/src/components/project.html similarity index 100% rename from src/project.html rename to src/components/project.html diff --git a/src/section-head.html b/src/components/section-head.html similarity index 100% rename from src/section-head.html rename to src/components/section-head.html diff --git a/src/components/tab-content.html b/src/components/tab-content.html new file mode 100644 index 0000000..c36390e --- /dev/null +++ b/src/components/tab-content.html @@ -0,0 +1,16 @@ + + +
+
+ +
\ No newline at end of file diff --git a/src/index.html b/src/index.html index fecd8e9..c3a72be 100644 --- a/src/index.html +++ b/src/index.html @@ -63,6 +63,20 @@ transform: translateX(-50%); } } + + #indicator { + animation: spin 2s linear infinite; + } + + @keyframes spin { + 0% { + transform: rotate(0deg); + } + + 100% { + transform: rotate(360deg); + } + } @@ -93,8 +107,8 @@
- - + +

Very professional people making
very professional things

@@ -114,145 +128,10 @@
- - - Wow, such professionalism! What are these guys working on now? - - - - # TYSONCLOUD - ## When she compute your serve 'till you edge - - - 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! - - - - - # Simulo - - ## Roblox for the real world! - #### (what could go wrong?) - - -
- - 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. - -
- - - - - # c0re - #### So shiny! - - ## Git gud scrub! - - - 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. - -

Join the fray, and become your best self ago!

- - - - - Please stop sending your projects to the review department - - - # Braindance - ## Bringing the Coachella to you! - - - 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). - - - - - # Grezi - ## When the power is point - - - 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! - - - - - # Mystery - ## _Oooooooo_ - - Nobody knows what this project is gonna be. The creator, Josh, won't tell anyone. -
-
- - -
-
- - - - - OMG these projects are so skibidi! I must know the rizzlers behind them! - - - - # Coming soon to theaters - ## This website is under construction - We'll get to it, trust - +
+ +
+

Copyright, The SANDWICH™ 2025 ©®☺ⓖⓨⓐⓣⓣ

diff --git a/src/projects.html b/src/projects.html new file mode 100644 index 0000000..2514a01 --- /dev/null +++ b/src/projects.html @@ -0,0 +1,131 @@ + + + + Wow, such professionalism! What are these guys working on now? + + + + # TYSONCLOUD + ## When she compute your serve 'till you edge + + + 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! + + + + + # Simulo + + ## Roblox for the real world! + #### (what could go wrong?) + + +
+ + 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. + +
+ + + + + # c0re + #### So shiny! + + ## Git gud scrub! + + + 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. + +

Join the fray, and become your best self ago!

+ + + + + Please stop sending your projects to the review department + + + # Braindance + ## Bringing the Coachella to you! + + + 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). + + + + + # Grezi + ## When the power is point + + + 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! + + + + + # Mystery + ## _Oooooooo_ + + Nobody knows what this project is gonna be. The creator, Josh, won't tell anyone. +
+
+ + +
+
+ + + \ No newline at end of file diff --git a/src/style.css b/src/style.css index 92d5b45..5518ad7 100644 --- a/src/style.css +++ b/src/style.css @@ -82,7 +82,6 @@ html { background-color: #484848; padding: 16px 24px; display: flex; - align-content: space-around; align-items: center; margin: 32px; } @@ -92,6 +91,22 @@ html { padding: 16px; } +.tab-list { + display: flex; + justify-content: space-around; +} + +.tab-list button { + background-color: transparent; + border: solid 3px transparent; + border-bottom: solid 3px #eee; + font-size: 16pt; +} + +.tab-list button.selected { + font-weight: bold; + border-bottom: solid 6px #eee; +} img.figure, .figure>svg { diff --git a/src/who_we_are.html b/src/who_we_are.html new file mode 100644 index 0000000..c8f8068 --- /dev/null +++ b/src/who_we_are.html @@ -0,0 +1,12 @@ + + + + OMG these projects are so skibidi! I must know the rizzlers behind them! + + + + # Coming soon to theaters + ## This website is under construction + We'll get to it, trust + + \ No newline at end of file