\ No newline at end of file
diff --git a/src/components/link/instagram.html b/src/components/link/instagram.html
new file mode 100644
index 0000000..1eb345a
--- /dev/null
+++ b/src/components/link/instagram.html
@@ -0,0 +1,17 @@
+
+
+
+
\ No newline at end of file
diff --git a/src/components/project.html b/src/components/project.html
new file mode 100644
index 0000000..8da8bde
--- /dev/null
+++ b/src/components/project.html
@@ -0,0 +1,30 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/project/index.html b/src/components/project/index.html
deleted file mode 100644
index 13b2018..0000000
--- a/src/components/project/index.html
+++ /dev/null
@@ -1,28 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
\ No newline at end of file
diff --git a/src/partials/interests.html b/src/partials/interests.html
index 8a555e2..dd84744 100644
--- a/src/partials/interests.html
+++ b/src/partials/interests.html
@@ -4,20 +4,62 @@
That's crazy
-
+
+
+
+ I love listening to the **works** albums from **Diverse System** while I'm working! Here's a 24-hour livestream
+ from them
+
+
+
+
+
- ?
+
- # Coming soon to theaters
+ # Dance Rush
- ## This website is under construction
+ ## Very good game
- We'll get to it, trust
-
+
+
+
+
+
+
+
+
+
+ I also love listening to Diverse System's **AD:** albums in my free time as well. This is a highlight reel of
+ one of my
+ favorites.
+
+
+
+
+
+
+
+
+
+
+ My favorite artist under Diverse System has gotta be **xi**. This is a highlight reel of my favorite album
+ by them.
+
+
+
+
\ No newline at end of file
diff --git a/src/partials/projects.html b/src/partials/projects.html
index bb6784d..8ef4d12 100644
--- a/src/partials/projects.html
+++ b/src/partials/projects.html
@@ -44,7 +44,7 @@
-
+
diff --git a/src/partials/who_we_are.html b/src/partials/who_we_are.html
index 9aeadaa..f7d3eaf 100644
--- a/src/partials/who_we_are.html
+++ b/src/partials/who_we_are.html
@@ -29,16 +29,12 @@
Tyson, let's get out of here
-
-
-
-
-
-
-
-
-
-
+
+
+ I think the rest of the card explains enough about me ngl. I don't think another bit of text would add much
+ value
+
+
@@ -65,48 +61,52 @@
Step on it, Richard!
-
-
- I love everything from making distributed systems, to physically building them. I'm in my element when I'm
- making software with Python, and deploying it via Docker.
-
-
+
+
+
+
+
+
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+ # Gunnar Huscroft
+
+
+
+ #### CEO of c0re (same thing)
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Nothing but the courage and unselfishness of individuals is ever going to make any system work properly
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -136,7 +136,7 @@
-
+
diff --git a/src/style.css b/src/style.css
index aba4335..8cfc35f 100644
--- a/src/style.css
+++ b/src/style.css
@@ -1,9 +1,18 @@
+@custom-media --tablet only screen and (max-width: 1200px);
+@custom-media --phone only screen and (max-width: 800px);
+@custom-media --smaller-phone only screen and (max-width: 500px);
+
:root {
--energy: 0px;
--page-width: min(100%, 1024px);
color: white;
}
+html {
+ color-scheme: dark;
+ font-family: system-ui;
+}
+
.title {
font-size: min(10vw, 36pt);
margin-bottom: 48px;
@@ -18,13 +27,18 @@
h1 {
font-size: 48pt;
}
+
+ @media (--tablet) {
+ text-align: center;
+ display: flex;
+ flex-direction: column-reverse;
+ }
}
center:has(> blockquote) {
margin: 10px auto;
font-size: min(5vw, 22pt);
padding: 15px;
- border-radius: 5px;
}
blockquote {
@@ -43,11 +57,10 @@ blockquote {
&+p {
text-align: right;
}
-}
-html {
- color-scheme: dark;
- font-family: system-ui;
+ @media (--phone) {
+ margin: 0px auto;
+ }
}
#page-content {
@@ -77,21 +90,91 @@ html {
padding: 0 40;
}
+.project-alt {
+ flex-direction: row-reverse;
+}
+
.project {
background-color: #484848;
- padding: 16px 24px;
display: flex;
align-items: center;
margin: 32px;
+ padding: 24px;
+ border-radius: 5rem;
+
+ iframe {
+ width: 100%;
+ aspect-ratio: 16/9;
+ margin: 16pt 0;
+ }
&>div {
padding: 16px;
}
+
+ @media (--phone) {
+ flex-direction: column;
+ padding: 32px;
+
+ &>div {
+ padding-top: 0;
+ padding-bottom: 0;
+ }
+ }
+
+ @media (--smaller-phone) {
+ margin: 8px;
+
+ p {
+ font-size: 14pt;
+ }
+
+ iframe {
+ margin: 14pt 0;
+ }
+ }
+}
+
+
+.interest {
+ display: flex;
+ align-items: flex-start;
+ justify-content: space-between;
+
+ .person {
+ width: 128px;
+ margin: 25px;
+ }
+
+ .project {
+ border-radius: 5rem;
+ padding: 36px;
+ }
+
+ @media (--tablet) {
+ flex-direction: column;
+ align-items: flex-start;
+ padding: 18px;
+
+ &.project-alt {
+ align-items: flex-end;
+ }
+ }
+
+ @media (--smaller-phone) {
+ .project {
+ margin: 0;
+ }
+ }
}
.project-title {
min-width: 275px;
+ @media (--smaller-phone) {
+ min-width: 0;
+ }
+
h1 {
font-size: 24pt;
margin: 0;
@@ -100,6 +183,10 @@ html {
.description {
width: 100%;
+
+ @media (--phone) {
+ width: unset;
+ }
}
.links {
@@ -127,6 +214,24 @@ html {
font-weight: bold;
border-bottom: solid 6px #eee;
}
+
+ @media only screen and (max-width: 550px) {
+ flex-direction: column;
+
+ a {
+ background-color: transparent;
+ border: solid 3px #999;
+ font-size: 16pt;
+ padding: 8px;
+ }
+
+ a[aria-selected=true] {
+ background-color: #eee;
+ font-weight: bold;
+ color: black;
+ border: solid 12px #eee;
+ }
+ }
}
.figure {
@@ -139,9 +244,6 @@ html {
}
}
-.project-alt {
- flex-direction: row-reverse;
-}
.person {
clip-path: circle(50%);
@@ -193,57 +295,4 @@ a {
color: inherit;
/* no underline */
text-decoration: none;
-}
-
-
-@media only screen and (max-width: 1200px) {
- .section-header {
- text-align: center;
- display: flex;
- flex-direction: column-reverse;
- }
-}
-
-@media only screen and (max-width: 700px) {
- .description {
- width: unset;
- }
-
- .project {
- flex-direction: column;
- padding: 18px;
-
- &>div {
- padding-top: 0;
- padding-bottom: 0;
- }
-
- p {
- font-size: 14pt;
- }
- }
-
- blockquote {
- margin: 0px auto;
- }
-}
-
-@media only screen and (max-width: 500px) {
- .tab-list {
- flex-direction: column;
-
- a {
- background-color: transparent;
- border: solid 3px #999;
- font-size: 16pt;
- padding: 8px;
- }
-
- a[aria-selected=true] {
- background-color: #eee;
- font-weight: bold;
- color: black;
- border: solid 12px #eee;
- }
- }
}
\ No newline at end of file
+ 
+ 
+ 