diff --git a/output/index.html b/output/index.html index a03c84f..ed9667b 100755 --- a/output/index.html +++ b/output/index.html @@ -14,19 +14,25 @@
- - - - +
-

- Hiya there! My name is Tyler Clarke, but I also go by weird_pusheen online. I'm a physics student at the Georgia Institute of Technology in Atlanta. I'm also a mostly self-taught software engineer - and an OSS maintainer. This is my website! -

- +

+ Hiya there! My name is Tyler Clarke, but I also go by weird_pusheen online. I'm a physics student at the Georgia Institute of Technology in Atlanta. I'm also a mostly self-taught software engineer + and an OSS maintainer. This is my website! +

+

+ I do freelance web development and software development. If you want to see some of my work, check out my portfolio. If you want to hire me, contact me! +

+
- + + +
+ + +
+ diff --git a/output/main.css b/output/main.css index d4c3dfa..2932b59 100755 --- a/output/main.css +++ b/output/main.css @@ -29,6 +29,7 @@ body > div { margin-left: auto; margin-right: auto; margin-top: 100px; + margin-bottom: 100px; background-color: hsl(225, 30%, 26%); border-radius: 100px; box-shadow: 0px 0px 50px black; @@ -43,48 +44,12 @@ body > div { padding-bottom: 50px; } -#toplogo > img { +#toplogo img { height: 128px; -} - -#nav { - position: sticky; - top: 0px; - display: flex; - width: max-content; - margin-left: auto; - margin-right: auto; - border-bottom: 1px solid white; - padding: 10px; -} - -#nav > a { - text-decoration: none; - color: white; - transition: background-color 0.25s, color 0.25s; - background-color: rgb(22, 22, 22); - padding: 10px; - border-radius: 10px; - font-weight: bold; - margin-left: 10px; - margin-right: 10px; - height: 100%; -} - -#nav > a > img { - height: calc(1em + 20px); -} - -#nav > a:has(> img) { - padding: 0px; - background-color: transparent; - transition: margin 0.5s; -} - -#nav > a:has(> img):hover { - margin-bottom: 10px; - margin-top: -10px; - background-color: transparent; + padding-left: 10%; + padding-right: 10%; + padding-bottom: 10%; + border-bottom: 2px solid white; } h1:not(.scrolly-visible)+#nav { /* sticky stuck! */ @@ -113,4 +78,22 @@ h1, h2 { p { line-height: 2em; +} + +a { + text-decoration: none; + color: white; + background-image: linear-gradient(transparent 0%, transparent 50%, white 50%, white 100%); + background-size: 100% 200%; + background-position: 0px -2px; + transition: background-position 0.1s, color 0.1s; +} + +a:has(img) { + background-image: none; +} + +a:hover { + background-position: 0px 100%; + color: black; } \ No newline at end of file diff --git a/output/nav.html b/output/nav.html deleted file mode 100755 index c0ba5e6..0000000 --- a/output/nav.html +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/site/default.html b/site/default.html index 1b24c65..38aa42a 100644 --- a/site/default.html +++ b/site/default.html @@ -11,12 +11,18 @@
- - [#nav.html] +
- [^maincontent] + [^cards.0]
+ [f cards card] + [i card cards.0 equals not] +
+ [^card] +
+ [/] + [/] diff --git a/site/index.html b/site/index.html index 2bb30a6..751bfb8 100644 --- a/site/index.html +++ b/site/index.html @@ -1,9 +1,17 @@ [!] [=title "Tyler Clarke's homepage"] -[=maincontent-] -

- Hiya there! My name is Tyler Clarke, but I also go by weird_pusheen online. I'm a physics student at the Georgia Institute of Technology in Atlanta. I'm also a mostly self-taught software engineer - and an OSS maintainer. This is my website! -

+[=cards-] + [=+-] +

+ Hiya there! My name is Tyler Clarke, but I also go by weird_pusheen online. I'm a physics student at the Georgia Institute of Technology in Atlanta. I'm also a mostly self-taught software engineer + and an OSS maintainer. This is my website! +

+

+ I do freelance web development and software development. If you want to see some of my work, check out my portfolio. If you want to hire me, contact me! +

+ [/] + [=+-] + + [/] [/] [#default.html] diff --git a/site/main.css b/site/main.css index cdb7892..9a46afe 100644 --- a/site/main.css +++ b/site/main.css @@ -28,6 +28,7 @@ body > div { margin-left: auto; margin-right: auto; margin-top: 100px; + margin-bottom: 100px; background-color: hsl(225, 30%, 26%); border-radius: 100px; box-shadow: 0px 0px 50px black; @@ -42,48 +43,12 @@ body > div { padding-bottom: 50px; } -#toplogo > img { +#toplogo img { height: 128px; -} - -#nav { - position: sticky; - top: 0px; - display: flex; - width: max-content; - margin-left: auto; - margin-right: auto; - border-bottom: 1px solid white; - padding: 10px; -} - -#nav > a { - text-decoration: none; - color: white; - transition: background-color 0.25s, color 0.25s; - background-color: rgb(22, 22, 22); - padding: 10px; - border-radius: 10px; - font-weight: bold; - margin-left: 10px; - margin-right: 10px; - height: 100%; -} - -#nav > a > img { - height: calc(1em + 20px); -} - -#nav > a:has(> img) { - padding: 0px; - background-color: transparent; - transition: margin 0.5s; -} - -#nav > a:has(> img):hover { - margin-bottom: 10px; - margin-top: -10px; - background-color: transparent; + padding-left: 10%; + padding-right: 10%; + padding-bottom: 10%; + border-bottom: 2px solid white; } h1:not(.scrolly-visible)+#nav { /* sticky stuck! */ @@ -112,4 +77,22 @@ h1, h2 { p { line-height: 2em; +} + +a { + text-decoration: none; + color: white; + background-image: linear-gradient(transparent 0%, transparent 50%, white 50%, white 100%); + background-size: 100% 200%; + background-position: 0px -2px; + transition: background-position 0.1s, color 0.1s; +} + +a:has(img) { + background-image: none; +} + +a:hover { + background-position: 0px 100%; + color: black; } \ No newline at end of file diff --git a/site/nav.html b/site/nav.html deleted file mode 100644 index cb60cc3..0000000 --- a/site/nav.html +++ /dev/null @@ -1,2 +0,0 @@ -[?] [#config.stx] - \ No newline at end of file