From 1e88c7f1ca7ba8d47ba83a94732b03ef30130006 Mon Sep 17 00:00:00 2001 From: Bradley Taunt Date: Fri, 17 Jan 2025 15:47:56 -0500 Subject: Revert "Complete styling changes - again" This reverts commit 068badb857215f0e10500ddd29a8b335efe3b2bd. --- Makefile | 2 + footer.html | 14 +- gzip.sh | 1 - header.html | 4 +- index.md | 12 +- pages/now.md | 2 +- public/fonts/IBMPlexSans-Bold.woff2 | Bin 0 -> 55396 bytes public/fonts/IBMPlexSans-Italic.woff2 | Bin 0 -> 59468 bytes public/fonts/IBMPlexSans-Regular.woff2 | Bin 0 -> 55380 bytes public/fonts/SofiaSans-Medium.woff2 | Bin 44700 -> 0 bytes public/fonts/SofiaSans-MediumItalic.woff2 | Bin 45952 -> 0 bytes public/fonts/SofiaSans-Regular.woff2 | Bin 41524 -> 0 bytes public/fonts/SofiaSans-SemiBold.woff2 | Bin 44912 -> 0 bytes public/style.css | 318 +++++++++++++++++++++--------- wruby.rb | 8 +- 15 files changed, 243 insertions(+), 118 deletions(-) delete mode 100644 gzip.sh create mode 100644 public/fonts/IBMPlexSans-Bold.woff2 create mode 100644 public/fonts/IBMPlexSans-Italic.woff2 create mode 100644 public/fonts/IBMPlexSans-Regular.woff2 delete mode 100644 public/fonts/SofiaSans-Medium.woff2 delete mode 100644 public/fonts/SofiaSans-MediumItalic.woff2 delete mode 100644 public/fonts/SofiaSans-Regular.woff2 delete mode 100644 public/fonts/SofiaSans-SemiBold.woff2 diff --git a/Makefile b/Makefile index 28a6eb2..2207bdc 100644 --- a/Makefile +++ b/Makefile @@ -6,3 +6,5 @@ clean: rm -rf build/* .PHONY: build clean + + find . -type f \( -name "*.html" -o -name "*.css" -o -name "*.jpg" -o -name "*.png" -o -name "*.webp" \) -exec gzip -k -f {} \; diff --git a/footer.html b/footer.html index 9bab6a5..8e89757 100644 --- a/footer.html +++ b/footer.html @@ -6,19 +6,13 @@
  • Home
  • Posts
  • Projects
  • Uses
  • Wiki
  • Resume
  • Colophon
  • Now
  • Pizza
  • Recipes
  • RSS
  • ↑ Top
    • - - Built with wruby
    - Type set in Sofia Sans
    + Built with wruby
    Running on OpenBSD via Linveo
    Supporter of NextDNS & Fathom Analytics
    - All site content is CC-BY-SA and the source code + The content for this site is CC-BY-SA
    + The code for this site is MIT     diff --git a/gzip.sh b/gzip.sh deleted file mode 100644 index 653b18b..0000000 --- a/gzip.sh +++ /dev/null @@ -1 +0,0 @@ -find . -type f \( -name "*.html" -o -name "*.css" -o -name "*.jpg" -o -name "*.png" -o -name "*.webp" -o -name "*.woff2" \) -exec gzip -k -f {} \; \ No newline at end of file diff --git a/header.html b/header.html index 1aae739..29cc254 100644 --- a/header.html +++ b/header.html @@ -11,7 +11,9 @@
    diff --git a/index.md b/index.md index cacae98..a07d173 100644 --- a/index.md +++ b/index.md @@ -1,14 +1,16 @@ -# btxx.org +# btxx -*Fullstack Developer / UX Designer* +## Fullstack Developer / UX Designer -I'm Brad, a designer/developer hybrid. I help software companies improve their user experience and ship more performant products. I'm passionate about open source software, usability, performance, privacy, and minimal design. This small piece of the internet stores a growing collection of my personal [brain dumps](/posts/dump). +As a designer/developer hybrid, I help software companies improve their user experience and ship more performant products. I'm passionate about open source software, usability, performance, privacy, and minimal design. This small piece of the internet stores a growing collection of my personal [brain dumps](/posts/dump). I also actively maintain several [open source projects](/projects). -Core tools are HTML, CSS, Ruby, JavaScript & PHP. I also enjoy tinkering with basic shell scripts and [Unix systems](/public/images/unix.gif). +## Skills & Languages -*Design Thought Experiments:* +Core tools are HTML, CSS, Ruby, JavaScript & PHP. Currently improving my skills with Rails & MongoDB. I also enjoy tinkering with basic shell scripts and [Unix systems](/public/images/unix.gif). + +## Design Thought Experiments * [Stop Using Hamburger Menus (Sometimes)](/posts/hamburgers) * [Better Search Results](https://search.btxx.org) diff --git a/pages/now.md b/pages/now.md index 88f71e7..5d4bd7b 100644 --- a/pages/now.md +++ b/pages/now.md @@ -8,7 +8,7 @@ This page is based off the [now page concept](https://nownownow.com/about) by De ## Life -- Raising my three children (aged 6, 5 and 2 respectively) with my wonderful wife +- Raising my three children (aged 6, 4 and 2 respectively) with my wonderful wife - Trying to contribute more to open source projects that I actively use - Slowly teaching myself C & RSpec - Advancing my knowledge of Ruby diff --git a/public/fonts/IBMPlexSans-Bold.woff2 b/public/fonts/IBMPlexSans-Bold.woff2 new file mode 100644 index 0000000..b570504 Binary files /dev/null and b/public/fonts/IBMPlexSans-Bold.woff2 differ diff --git a/public/fonts/IBMPlexSans-Italic.woff2 b/public/fonts/IBMPlexSans-Italic.woff2 new file mode 100644 index 0000000..57523c9 Binary files /dev/null and b/public/fonts/IBMPlexSans-Italic.woff2 differ diff --git a/public/fonts/IBMPlexSans-Regular.woff2 b/public/fonts/IBMPlexSans-Regular.woff2 new file mode 100644 index 0000000..ca64cc5 Binary files /dev/null and b/public/fonts/IBMPlexSans-Regular.woff2 differ diff --git a/public/fonts/SofiaSans-Medium.woff2 b/public/fonts/SofiaSans-Medium.woff2 deleted file mode 100644 index b251a2c..0000000 Binary files a/public/fonts/SofiaSans-Medium.woff2 and /dev/null differ diff --git a/public/fonts/SofiaSans-MediumItalic.woff2 b/public/fonts/SofiaSans-MediumItalic.woff2 deleted file mode 100644 index 4ebf61b..0000000 Binary files a/public/fonts/SofiaSans-MediumItalic.woff2 and /dev/null differ diff --git a/public/fonts/SofiaSans-Regular.woff2 b/public/fonts/SofiaSans-Regular.woff2 deleted file mode 100644 index 4d16f7a..0000000 Binary files a/public/fonts/SofiaSans-Regular.woff2 and /dev/null differ diff --git a/public/fonts/SofiaSans-SemiBold.woff2 b/public/fonts/SofiaSans-SemiBold.woff2 deleted file mode 100644 index c690dcc..0000000 Binary files a/public/fonts/SofiaSans-SemiBold.woff2 and /dev/null differ diff --git a/public/style.css b/public/style.css index 58e63c7..4d8fd13 100644 --- a/public/style.css +++ b/public/style.css @@ -2,147 +2,275 @@ box-sizing: border-box; } -@font-face { - font-family: 'Sofia Sans'; - font-style: normal; - font-weight: normal; - src: url('/public/fonts/SofiaSans-Regular.woff2') format('woff2'); +:root { + --main-color: #228427; } -@font-face { - font-family: 'Sofia Sans'; - font-style: italic; - font-weight: normal; - src: url('/public/fonts/SofiaSans-MediumItalic.woff2') format('woff2'); -} -@font-face { - font-family: 'Sofia Sans'; - font-weight: bold; - src: url('/public/fonts/SofiaSans-SemiBold.woff2') format('woff2'); + +html { + font-family: "Lucida Grande", Lucida, Geneva, Helvetica, Arial, sans-serif; + padding: 0; + margin: 0; + scroll-behavior: smooth; } body { - color: #2d2d2d; - font-family: "Sofia Sans", serif; - line-height: 1.48; - font-size: 16px; - padding: 0 10px; - margin: 4rem auto; - max-width: 680px; + background-color: #f9f9f9; + color: #333; + font-size: 100%; + max-width: 85%; + margin: 1rem auto; + padding: 0; } -nav#top a { - display: inline-block; - margin: 0 0 1rem 0; +nav > ul { + display: flex; + margin: 0; + padding: 0; + list-style-type: none; + flex-wrap: wrap; + font-weight: bold; + flex-direction: row; + position: relative; } +nav > ul > li { + align-items: center; + display: inline-flex; +} + +nav > ul > li > a { + border: 1px solid var(--main-color); + color: var(--main-color); + display: inline-block; + margin: 0 -1px -1px 0; + padding: 7px; + text-decoration: none; + white-space: nowrap; +} + +nav > ul > li > a:hover, nav > ul > li > a:active { + text-decoration: none; + background-color: var(--main-color); + color: #fff; +} + +/*--- End Top Nav ---*/ + main { - max-width: 42em; - margin:15 auto; + display: block; + width: 100%; + margin: 0; + padding: 1px 0 20px 0; + border: 1px solid var(--main-color); + background-color: #fff; } -pre { - background: lightgoldenrodyellow; - border-radius: 2px; - overflow: auto; - padding: 8px; +main > p > em { + font-weight: normal; + font-style: italic; } -code { - background: lightgoldenrodyellow; - border-radius: 2px; - color: saddlebrown; - font-size: 14px; - padding: 1px 2px; +main ul, main ol { + padding-right: 10px; } -img { - height: auto; - max-width: 100%; +/*--- Begin Footer ---*/ + +footer nav ul { + margin: -1px 0 0 0; +} +footer small { + display: block; + margin: 20px 0 0 0; + padding: 0 0 0 10px; } -figure { - margin: 3rem 0; +/*--- Links ---*/ + +a { + color: var(--main-color); } -figcaption { - font-family: sans-serif; - font-size: 90%; + +a:hover { + text-decoration: none; + color: #fff; + background-color: var(--main-color); } -blockquote { - background: rgba(0,0,0,0.05); - border-left: 2px solid; - margin-bottom: 2rem; - margin-top: 2rem; - padding-left: 10px; +a:active { + text-decoration: none; + color: #fff; + background-color: var(--main-color); +} + +a, img { + border: none; +} + +a:focus, img:focus { + outline: none; } +/*--- Header Styles ---*/ + h1 { - font-size: 28px; - line-height: 1.2; - margin: 0 0 10px; + font-size: 190%; + margin: 18px 18px 0 18px; } -h1 + p { - margin-bottom: 2rem; - margin-top: 0; + +h2 { + font-size: 125%; + margin: 18px 18px 0 18px; +} + +h3 { + font-size: 113%; + margin: 18px 18px 0 18px; } -h2,h3,h4,h5,h6 { - color: grey; - line-height: 1.2; - margin-top: 3rem; +h4 { + margin: 18px 18px 0 18px; } -.posts { - list-style: none; +p { + margin: 12px 18px 18px 18px; padding: 0; + line-height: 1.25em; } -.posts li { - display: flex; - justify-content: space-between; - margin-bottom: 8px; + +hr { + margin: 2rem 0; } -.posts li span { - font-size: 90%; - font-style: italic; - margin-left: 10px; - min-width: 100px; - opacity: 0.7; - text-align: right; + +img { + height: auto; + max-width: 100%; } -footer { - margin-top: 4rem; +pre { + background: #eee; + padding: 20px; + overflow: auto; } -footer nav { - margin-bottom: 2rem; +code { + font-size: 110%; } -footer nav ul { - list-style: none; +.table-container { + margin: 2rem 0; + overflow-y: scroll; +} +table { + border-collapse: collapse; + min-width: 500px; + text-align: left; + width: 100%; +} +table caption { + background: #eee; + font-weight: bold; + font-size: 120%; + padding: 10px; + text-align: left; +} +table tr { + border-bottom: 1px solid; +} +table th, table td { + padding: 10px; +} + +blockquote { + background: #f2f2f2; + border-left: 2px solid grey; + padding: 6px; +} +blockquote p { margin: 0; - padding: 0; } -footer nav ul li { - display: inline-block; - margin-right: 10px; + +.footnotes { + font-size: 90%; +} + +/*--- List Styles ---*/ + +ol { + line-height: 1.25em; +} + +ul, ol { + margin: 12px 0 0 36px; + padding: 0 0 0 24px; + line-height: 1.5em; +} + +ul { + list-style-type: square; +} + +li ul, li ol { + margin-top: 0; +} + +ul.posts li { + margin-bottom: 10px; +} +ul.posts li span { + display: block; +} + +@media(max-width:600px) { + body { + max-width: 100%; + margin: 12px; + } + nav ul { + display: block; + margin: 0 0 -1px 0; + } + nav > ul > li { + width: 50%; + } + nav > ul > li > a { + border-right: 0; + display: block; + margin: 0; + width: 100%; + } + nav ul li:nth-of-type(even) a { + border-right: 1px solid var(--main-color); + } + + footer nav ul li { + margin: 0 0 -1px 0; + } } @media(prefers-color-scheme: dark) { + :root { + --main-color: #eee8a7; + } + html, body { + background: black; + } body { + color: white; + } + main { background: #2d2d2d; - color: #f1f1f1; } - h2,h3,h4,h5,h6 { - color: lightgrey; + table caption { + background: black; + } + nav > ul > li > a:hover, nav > ul > li > a:active,a:hover,a:active { + color: black; + } + pre { + background: black; } blockquote { - background: rgba(0,0,0,0.5); + background: black; } } - -@media(max-width:680px) { - body { - margin: 1rem auto; - } -} \ No newline at end of file diff --git a/wruby.rb b/wruby.rb index c646630..d4f49e6 100644 --- a/wruby.rb +++ b/wruby.rb @@ -58,8 +58,6 @@ def process_markdown_files(input_directory, output_directory, header_content, fo date = Date.parse(lines[2]&.strip || '') rescue Date.today html_content = Kramdown::Document.new(md_content).to_html - formatted_date = date.strftime("%b %d, %Y") - relative_path = path.sub(input_directory + '/', '').sub('.md', '') item_dir = File.join(output_directory, relative_path) output_file = "#{item_dir}/index.html" @@ -68,7 +66,7 @@ def process_markdown_files(input_directory, output_directory, header_content, fo header = replace_title_placeholder(header_content, title) File.write(output_file, header + html_content + footer_content) - items << { title: title, date: date, formatted_date: formatted_date, link: relative_path + '/', content: html_content } + items << { title: title, date: date, link: relative_path + '/', content: html_content } end items @@ -83,7 +81,7 @@ def generate_index(posts, header_content, footer_content, root_index_file, post_ header = replace_title_placeholder(header_content, root_title) index_content = header + root_html + "\n

    View all posts →

    \n" + footer_content File.write("#{output_dir}/index.html", index_content) @@ -98,7 +96,7 @@ def generate_full_posts_list(posts, header_content, footer_content, posts_index_ header = replace_title_placeholder(header_content, posts_title) list_content = header + posts_html + "\n" + footer_content File.write("#{output_dir}/posts/index.html", list_content) -- cgit v1.2.3-70-g09d2