diff options
| -rw-r--r-- | TODO | 2 | ||||
| -rw-r--r-- | zola-static/content/about-me.md | 2 | ||||
| -rw-r--r-- | zola-static/content/about-this-site.md | 7 | ||||
| -rw-r--r-- | zola-static/sass/base.scss | 93 | ||||
| -rw-r--r-- | zola-static/templates/index.html | 18 | ||||
| -rw-r--r-- | zola-static/templates/project-list.html | 6 | ||||
| -rw-r--r-- | zola-static/templates/project-page.html | 3 |
7 files changed, 79 insertions, 52 deletions
@@ -1,5 +1,5 @@ - [ ] Meta descriptions (for SEO) Project Page Revamp -- [ ] Images for projects in list +- [x] Images for projects in list - [ ] Split up projects page diff --git a/zola-static/content/about-me.md b/zola-static/content/about-me.md index 5f0eecc..d654d56 100644 --- a/zola-static/content/about-me.md +++ b/zola-static/content/about-me.md @@ -5,7 +5,7 @@ template = "main-page.html" My name is Jack Jamison. I'm an American software engineer studying at the [Rensselaer Polytechnic Institute](https://www.rpi.edu) in New York. I've been programming since I was a little kid. -I enjoy GPU programming, cross-platform desktop application design, build systems, game development, and system administration. I'm also interested in operating systems and computer networking. +I enjoy GPU programming, operating system, cross-platform desktop application design, game development, and system administration. I use Emacs as my text editor. I've spent a lot of time configuring it. If you want, you can check out my [dotfiles](https://github.com/JackJ30/dotfiles). diff --git a/zola-static/content/about-this-site.md b/zola-static/content/about-this-site.md index fabd3fb..0ae6045 100644 --- a/zola-static/content/about-this-site.md +++ b/zola-static/content/about-this-site.md @@ -4,9 +4,8 @@ template = "main-page.html" +++ # About this website -- The pages are generated from markdown files with [Zola](https://getzola.org). -- I use [Nginx](https://nginx.org/) as my web server. -- It is hosted on [Vultr](https://www.vultr.com/). -- [Epik](https://epik.com) is my domain registrar. +- The pages are generated from markdown files by [Zola](https://getzola.org). +- Content is served by [Nginx](https://nginx.org/). +- The domain is registered with [Njalla](https://njal.la/). There are no ads or trackers on this site. The source code is available on [github](https://github.com/JackJ30/jackjamison.net). diff --git a/zola-static/sass/base.scss b/zola-static/sass/base.scss index bb23005..e93fab4 100644 --- a/zola-static/sass/base.scss +++ b/zola-static/sass/base.scss @@ -1,4 +1,11 @@ -// Main styles and centering +// colors +$background: #252422; +$background_light: #2e2d2c; +$foreground: #DCE1DE; +$accent1: #8B95C9; +$code-background: #171615; + +// main styles and centering html { color-scheme: dark; } @@ -10,12 +17,12 @@ body { font-size: 1.2rem; padding: 0 2rem; - background-color: #252422; - color: #DCE1DE; + background-color: $background; + color: $foreground; font-family: "Courier New", Courier, monospace; } -// more compact margins +// general customizations h1, h2, h3, h4 { margin-bottom: 0.3rem; } @@ -24,7 +31,7 @@ ul { } a { - color: #8B95C9; + color: $accent1; } h1 a { @@ -35,21 +42,53 @@ hr { height: 0.25rem; border-radius: 0.2rem; border: none; - background-color: #2e2d2c; + background-color: $background-light; } -.header-separator { - margin-top: -0.2rem; +img { + width: 40rem; + display: block; + margin: 0 auto; +} + +.youtube { + width: 40rem; + aspect-ratio: 16/9; + display: block; + margin: 0 auto; } -// Blog titles +// header .header-title { margin: 0; font-size: 2.5rem; } + +.header-separator { + margin-top: -0.2rem; +} + +// sections +.index-section { + background-color: $background-light; + padding: 0.7rem; + margin-top: 0.6rem; + border-radius: 0.4rem; +} + +.index-section h2 { + margin-top: -0.3rem; +} + +.index-section ul { + margin-bottom: 0.3rem; +} + +// blog header .subtitle { margin: 0.5rem auto; } + .blog-header { display: flex; justify-content: space-between; @@ -65,7 +104,13 @@ hr { text-align: right; } -// Blog element styling +// project list styling +.project-section h2 { + text-align: center; + text-decoration: none; +} + +// blog element styling pre { padding : 0.5rem; border-radius: 0.3rem; @@ -75,7 +120,7 @@ pre { } blockquote { - background: #171615; + background: $code-background; border-left: 0.7rem solid #F3E9DC; margin: 1.5em 10px; padding: 0.5em 10px; @@ -87,39 +132,19 @@ blockquote p { } p code { - background: #171615; + background: $code-background; padding-left: 0.25rem; padding-right: 0.25rem; font-family: monospace; } -img { - width: 40rem; - display: block; - margin: 0 auto; -} - +// index .footer-text { text-align: center; - color: #2e2d2c; + color: $background-light; } .footer-text a { text-decoration: none; padding: 0rem 0.5rem; } - -.index-section { - background-color: #2e2d2c; - padding: 0.7rem; - margin-top: 0.6rem; - border-radius: 0.4rem; -} - -.index-section h2 { - margin-top: -0.3rem; -} - -.index-section ul { - margin-bottom: 0.3rem; -} diff --git a/zola-static/templates/index.html b/zola-static/templates/index.html index fd4d508..3c83240 100644 --- a/zola-static/templates/index.html +++ b/zola-static/templates/index.html @@ -9,21 +9,13 @@ </ul> </div> <div class="index-section"> - <h2>Articles</h2> - <ul> - <li><a href="{{ get_url(path='@/blog/sdl-native-wayland.md') }}">Forcing SDL to use Wayland on Wayland</a></li> - <li><a href="{{ get_url(path='@/blog/my-emacs-tips-and-tricks.md') }}">My Emacs Tips and Tricks</a></li> - <li><a href="{{ get_url(path='@/blog/emacs-garbage-collection.md') }}">Solving Emacs Garbage Collection Stutters</a></li> - </ul> -</div> -<div class="index-section"> <h2>Projects</h2> <ul> <li><a href="{{ get_url(path='@/projects/connection-machine.md') }}">Connection Machine Logic Simulator</a></li> <li><a href="{{ get_url(path='@/projects/swenu.md') }}">Swenu Wayland Menu</a></li> <li><a href="{{ get_url(path='@/projects/string-sniper.md') }}">Ghidra String Sniper</a></li> - <li><a href="{{ get_url(path='@/projects/_index.md') }}">View More</a></li> </ul> + <b><a href="{{ get_url(path='@/projects/_index.md') }}">View More</a></b> </div> <div class="index-section"> <h2>Links</h2> @@ -32,5 +24,13 @@ <li><a href="https://portfolio.jackjamison.net">Old portfolio (haven't migrated here yet)</a></li> </ul> </div> +<div class="index-section"> + <h2>Articles</h2> + <ul> + <li><a href="{{ get_url(path='@/blog/sdl-native-wayland.md') }}">Forcing SDL to use Wayland on Wayland</a></li> + <li><a href="{{ get_url(path='@/blog/my-emacs-tips-and-tricks.md') }}">My Emacs Tips and Tricks</a></li> + <li><a href="{{ get_url(path='@/blog/emacs-garbage-collection.md') }}">Solving Emacs Garbage Collection Stutters</a></li> + </ul> +</div> <p class="footer-text"><b><a href="{{ get_url(path='@/blog/_index.md') }}">All articles sorted by date</a>•<a href="{{ get_url(path='@/the-archive.md') }}">Archive</a></b></p> {% endblock content %} diff --git a/zola-static/templates/project-list.html b/zola-static/templates/project-list.html index eb66dad..50a9677 100644 --- a/zola-static/templates/project-list.html +++ b/zola-static/templates/project-list.html @@ -5,11 +5,11 @@ <h1 class="title"> {{ section.title }} </h1> -<ul> <!-- If you are using pagination, section.pages will be empty. You need to use the paginator object --> {% for page in section.pages %} - <li><a href="{{ page.permalink | safe }}">{{ page.title }}</a></li> + <div class="index-section project-section"> + <a href="{{ page.permalink | safe }}"><h2>{{ page.title }}</h2><img src="/images/projects/{{ page.extra.cover }}" alt="{{ page.title }}"></a> + </div> {% endfor %} -</ul> {% endblock content %} diff --git a/zola-static/templates/project-page.html b/zola-static/templates/project-page.html index ac332ef..f152c2b 100644 --- a/zola-static/templates/project-page.html +++ b/zola-static/templates/project-page.html @@ -19,4 +19,7 @@ {% block content %} <img src="/images/projects/{{ page.extra.cover }}" alt="{{ page.title }}"> {{ page.content | safe }} +{% if page.extra.youtube_id %} +<iframe class="youtube" src="https://www.youtube.com/embed/{{ page.extra.youtube_id }}" title="YouTube video player" frameborder="0" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe> +{% endif %} {% endblock content %} |