diff options
56 files changed, 1712 insertions, 61 deletions
@@ -1,6 +1,6 @@ --- permalink: /404.html -layout: default +layout: base --- <style type="text/css" media="screen"> diff --git a/_config.yml b/_config.yml index 1b3824c..539f7d3 100644 --- a/_config.yml +++ b/_config.yml @@ -1,25 +1,9 @@ -# Welcome to Jekyll! -# -# This config file is meant for settings that affect your whole blog, values -# which you are expected to set up once and rarely edit after that. If you find -# yourself editing this file very often, consider using Jekyll's data files -# feature for the data you need to update frequently. -# -# For technical reasons, this file is *NOT* reloaded automatically when you use -# 'bundle exec jekyll serve'. If you change this file, please restart the server process. -# -# If you need help with YAML syntax, here are some quick references for you: -# https://learn-the-web.algonquindesign.ca/topics/markdown-yaml-cheat-sheet/#yaml -# https://learnxinyminutes.com/docs/yaml/ -# -# Site settings -# These are used to personalize your new site. If you look in the HTML files, -# you will see them accessed via {{ site.title }}, {{ site.email }}, and so on. -# You can create any custom variable you would like, and they will be accessible -# in the templates via {{ site.myvariable }}. - title: btxx +meta_title: btxx.org email: bt@btxx.org +author: + name: Bradley Taunt + email: bt@btxx.org description: >- # this means to ignore newlines until "baseurl:" Designer, developer, hardware tinkerer, open source advocate, consumer of dark roast coffee, and writer of very long sentences. baseurl: "" # the subpath of your site, e.g. /blog @@ -28,7 +12,6 @@ twitter_username: jekyllrb github_username: jekyll # Build settings -theme: minima plugins: - jekyll-feed @@ -40,7 +23,7 @@ defaults: permalink: /posts/:title/ sass: - quiet_deps: true + sass_dir: _sass # Exclude from processing. # The following items will not be processed, by default. diff --git a/_includes/custom-head.html b/_includes/custom-head.html new file mode 100644 index 0000000..8559a67 --- /dev/null +++ b/_includes/custom-head.html @@ -0,0 +1,6 @@ +{% comment %} + Placeholder to allow defining custom head, in principle, you can add anything here, e.g. favicons: + + 1. Head over to https://realfavicongenerator.net/ to add your own favicons. + 2. Customize default _includes/custom-head.html in your source directory and insert the given code snippet. +{% endcomment %} diff --git a/_includes/disqus_comments.html b/_includes/disqus_comments.html new file mode 100644 index 0000000..87e255b --- /dev/null +++ b/_includes/disqus_comments.html @@ -0,0 +1,20 @@ +{%- if page.comments != false and jekyll.environment == "production" -%} + + <div id="disqus_thread"></div> + <script> + var disqus_config = function () { + this.page.url = '{{ absolute_url }}'; + this.page.identifier = '{{ page.url | absolute_url }}'; + }; + + (function() { + var d = document, s = d.createElement('script'); + + s.src = 'https://{{ site.disqus.shortname }}.disqus.com/embed.js'; + + s.setAttribute('data-timestamp', +new Date()); + (d.head || d.body).appendChild(s); + })(); + </script> + <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript" rel="nofollow">comments powered by Disqus.</a></noscript> +{%- endif -%} diff --git a/_includes/footer.html b/_includes/footer.html new file mode 100644 index 0000000..f4a8002 --- /dev/null +++ b/_includes/footer.html @@ -0,0 +1,30 @@ +<footer class="site-footer h-card"> + <data class="u-url" href="{{ "/" | relative_url }}"></data> + + <div class="wrapper"> + + <div class="footer-col-wrapper"> + <div class="footer-col"> + {%- if site.author %} + <ul class="contact-list"> + {% if site.author.name -%} + <li class="p-name">{{ site.author.name | escape }}</li> + {% endif -%} + {% if site.author.email -%} + <li><a class="u-email" href="mailto:{{ site.author.email }}">{{ site.author.email }}</a></li> + {%- endif %} + </ul> + {%- endif %} + </div> + <div class="footer-col"> + <p>{{ site.description | escape }}</p> + </div> + </div> + + <div class="social-links"> + {%- include social.html -%} + </div> + + </div> + +</footer> diff --git a/_includes/google-analytics.html b/_includes/google-analytics.html new file mode 100644 index 0000000..b8b4d38 --- /dev/null +++ b/_includes/google-analytics.html @@ -0,0 +1,9 @@ +<script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script> +<script> + window['ga-disable-{{ site.google_analytics }}'] = window.doNotTrack === "1" || navigator.doNotTrack === "1" || navigator.doNotTrack === "yes" || navigator.msDoNotTrack === "1"; + window.dataLayer = window.dataLayer || []; + function gtag(){window.dataLayer.push(arguments);} + gtag('js', new Date()); + + gtag('config', '{{ site.google_analytics }}'); +</script> diff --git a/_includes/head.html b/_includes/head.html new file mode 100644 index 0000000..82078b0 --- /dev/null +++ b/_includes/head.html @@ -0,0 +1,10 @@ +<head> + <meta charset="utf-8"> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}"> + <link rel="icon" href="data:,"> + {%- feed_meta -%} + <title>{% if page.title %}{{ page.title }} ·{% endif %} {{ site.meta_title | escape }}</title> + +</head> diff --git a/_includes/header.html b/_includes/header.html new file mode 100644 index 0000000..ed5a382 --- /dev/null +++ b/_includes/header.html @@ -0,0 +1,31 @@ +<header class="site-header"> + + <div class="wrapper"> + {%- assign default_paths = site.pages | map: "path" -%} + {%- assign page_paths = site.header_pages | default: default_paths -%} + {%- assign titles_size = site.pages | map: 'title' | join: '' | size -%} + <a class="site-title" rel="author" href="{{ "/" | relative_url }}">{{ site.title | escape }}</a> + + {%- if titles_size > 0 -%} + <nav class="site-nav"> + <input type="checkbox" id="nav-trigger" class="nav-trigger" /> + <label for="nav-trigger"> + <span class="menu-icon"> + <svg viewBox="0 0 18 15" width="18px" height="15px"> + <path d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.032C17.335,0,18,0.665,18,1.484L18,1.484z M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.032C17.335,6.031,18,6.696,18,7.516L18,7.516z M18,13.516C18,14.335,17.335,15,16.516,15H1.484 C0.665,15,0,14.335,0,13.516l0,0c0-0.82,0.665-1.483,1.484-1.483h15.032C17.335,12.031,18,12.695,18,13.516L18,13.516z"/> + </svg> + </span> + </label> + + <div class="trigger"> + {%- for path in page_paths -%} + {%- assign my_page = site.pages | where: "path", path | first -%} + {%- if my_page.title -%} + <a class="page-link" href="{{ my_page.url | relative_url }}">{{ my_page.title | escape }}</a> + {%- endif -%} + {%- endfor -%} + </div> + </nav> + {%- endif -%} + </div> +</header> diff --git a/_includes/social-icons/codeberg.svg b/_includes/social-icons/codeberg.svg new file mode 100644 index 0000000..d41b003 --- /dev/null +++ b/_includes/social-icons/codeberg.svg @@ -0,0 +1,11 @@ +<g + style="opacity:1" + transform="translate(-44.867463,-75.990641)"> + <g + style="opacity:1" + transform="matrix(0.62731857,0,0,0.30231784,25.415003,63.342477)" /> + <path + style="fill-opacity:1;stroke:none;stroke-width:0.247828;paint-order:markers fill stroke;stop-color:#000000" + d="m 52.866549,76.247505 c -4.39704,0 -7.936587,3.541376 -7.936587,7.938416 -2.1e-4,1.490827 0.420008,2.953458 1.212473,4.21737 l 6.616999,-8.555396 c 0.04781,-0.0612 0.166275,-0.0612 0.21405,0 l 2.763577,3.573179 h -1.979265 l 0.04286,0.157651 h 2.059061 l 0.583856,0.753172 h -2.430784 l 0.06818,0.247163 h 2.553387 l 0.513795,0.663645 h -2.882295 l 0.08948,0.319162 h 3.037983 l 0.459304,0.591634 h -3.331852 l 0.108975,0.389239 h 3.522585 l 0.402862,0.519626 h -3.781429 l 0.120675,0.430106 h 3.993552 l 0.3717,0.480709 h -4.230994 l 0.120675,0.430102 h 4.44312 c 0.792461,-1.263911 1.212724,-2.726542 1.212472,-4.217362 4e-6,-4.39704 -3.541365,-7.938416 -7.938408,-7.938416 z m 2.41707,12.636494 0.120675,0.430106 h 3.522521 c 0.114862,-0.1356 0.2337,-0.286688 0.339562,-0.430106 z m 0.254962,0.910808 0.118725,0.430105 h 2.356826 c 0.154163,-0.1314 0.321225,-0.283237 0.471203,-0.430102 z m 0.253013,0.91081 0.120675,0.428161 h 0.795843 c 0.235163,-0.134962 0.45306,-0.272325 0.688797,-0.428161 z" /> +</g> + diff --git a/_includes/social-icons/devto.svg b/_includes/social-icons/devto.svg new file mode 100644 index 0000000..f595e0e --- /dev/null +++ b/_includes/social-icons/devto.svg @@ -0,0 +1 @@ +<path d="M4.548,6.415C4.419,6.318,4.29,6.271,4.161,6.271h-0.58v3.471h0.58c0.129,0,0.258-0.049,0.387-0.145 C4.677,9.5,4.742,9.355,4.742,9.163V6.85C4.741,6.656,4.676,6.511,4.548,6.415z M13.981,0.559H2.016 c-0.804,0-1.457,0.65-1.458,1.455v11.973c0.002,0.805,0.655,1.455,1.458,1.455h11.968c0.805,0,1.457-0.65,1.459-1.455V2.014 C15.438,1.209,14.786,0.559,13.981,0.559z M5.68,9.169c0,0.625-0.386,1.572-1.605,1.569H2.532V5.242h1.573 c1.179,0,1.573,0.945,1.574,1.57V9.169z M9.024,6.225h-1.77V7.5h1.082v0.982H7.255v1.275h1.771v0.982H6.959 c-0.371,0.009-0.679-0.283-0.688-0.654V5.931c-0.008-0.37,0.285-0.679,0.655-0.688h2.099V6.225z M12.47,10.055 c-0.438,1.021-1.226,0.817-1.576,0l-1.28-4.812h1.081l0.988,3.778l0.981-3.778h1.082L12.47,10.055z"/> diff --git a/_includes/social-icons/dribbble.svg b/_includes/social-icons/dribbble.svg new file mode 100644 index 0000000..1d95de0 --- /dev/null +++ b/_includes/social-icons/dribbble.svg @@ -0,0 +1 @@ +<path d="M8 16c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm6.747-6.905c-.234-.074-2.115-.635-4.257-.292.894 2.456 1.258 4.456 1.328 4.872 1.533-1.037 2.624-2.68 2.93-4.58zM10.67 14.3c-.102-.6-.5-2.688-1.46-5.18l-.044.014C5.312 10.477 3.93 13.15 3.806 13.4c1.158.905 2.614 1.444 4.194 1.444.947 0 1.85-.194 2.67-.543zm-7.747-1.72c.155-.266 2.03-3.37 5.555-4.51.09-.03.18-.056.27-.08-.173-.39-.36-.778-.555-1.16-3.413 1.02-6.723.977-7.023.97l-.003.208c0 1.755.665 3.358 1.756 4.57zM1.31 6.61c.307.005 3.122.017 6.318-.832-1.132-2.012-2.353-3.705-2.533-3.952-1.912.902-3.34 2.664-3.784 4.785zM6.4 1.368c.188.253 1.43 1.943 2.548 4 2.43-.91 3.46-2.293 3.582-2.468C11.323 1.827 9.736 1.176 8 1.176c-.55 0-1.087.066-1.6.19zm6.89 2.322c-.145.194-1.29 1.662-3.816 2.694.16.325.31.656.453.99.05.117.1.235.147.352 2.274-.286 4.533.172 4.758.22-.015-1.613-.59-3.094-1.543-4.257z"/> diff --git a/_includes/social-icons/facebook.svg b/_includes/social-icons/facebook.svg new file mode 100644 index 0000000..c022403 --- /dev/null +++ b/_includes/social-icons/facebook.svg @@ -0,0 +1 @@ +<path d="M15.117 0H.883C.395 0 0 .395 0 .883v14.234c0 .488.395.883.883.883h7.663V9.804H6.46V7.39h2.086V5.607c0-2.066 1.262-3.19 3.106-3.19.883 0 1.642.064 1.863.094v2.16h-1.28c-1 0-1.195.48-1.195 1.18v1.54h2.39l-.31 2.42h-2.08V16h4.077c.488 0 .883-.395.883-.883V.883C16 .395 15.605 0 15.117 0"/> diff --git a/_includes/social-icons/flickr.svg b/_includes/social-icons/flickr.svg new file mode 100644 index 0000000..3b38772 --- /dev/null +++ b/_includes/social-icons/flickr.svg @@ -0,0 +1 @@ +<path d="M0 8c0 2.05 1.662 3.71 3.71 3.71 2.05 0 3.713-1.66 3.713-3.71S5.76 4.29 3.71 4.29C1.663 4.29 0 5.95 0 8zm8.577 0c0 2.05 1.662 3.71 3.712 3.71C14.33 11.71 16 10.05 16 8s-1.662-3.71-3.71-3.71c-2.05 0-3.713 1.66-3.713 3.71z"/> diff --git a/_includes/social-icons/github.svg b/_includes/social-icons/github.svg new file mode 100644 index 0000000..9301f84 --- /dev/null +++ b/_includes/social-icons/github.svg @@ -0,0 +1 @@ +<path d="M8 0C3.58 0 0 3.582 0 8c0 3.535 2.292 6.533 5.47 7.59.4.075.547-.172.547-.385 0-.19-.007-.693-.01-1.36-2.226.483-2.695-1.073-2.695-1.073-.364-.924-.89-1.17-.89-1.17-.725-.496.056-.486.056-.486.803.056 1.225.824 1.225.824.714 1.223 1.873.87 2.33.665.072-.517.278-.87.507-1.07-1.777-.2-3.644-.888-3.644-3.953 0-.873.31-1.587.823-2.147-.09-.202-.36-1.015.07-2.117 0 0 .67-.215 2.2.82.64-.178 1.32-.266 2-.27.68.004 1.36.092 2 .27 1.52-1.035 2.19-.82 2.19-.82.43 1.102.16 1.915.08 2.117.51.56.82 1.274.82 2.147 0 3.073-1.87 3.75-3.65 3.947.28.24.54.73.54 1.48 0 1.07-.01 1.93-.01 2.19 0 .21.14.46.55.38C13.71 14.53 16 11.53 16 8c0-4.418-3.582-8-8-8"/> diff --git a/_includes/social-icons/gitlab.svg b/_includes/social-icons/gitlab.svg new file mode 100644 index 0000000..6744b55 --- /dev/null +++ b/_includes/social-icons/gitlab.svg @@ -0,0 +1 @@ +<path d="m15.73 6.39-.023-.058L13.535.656a.587.587 0 0 0-.566-.36.61.61 0 0 0-.332.126.593.593 0 0 0-.192.293l-1.468 4.5h-5.95L3.555.715A.568.568 0 0 0 3.03.297a.558.558 0 0 0-.34.09.557.557 0 0 0-.222.27L.289 6.34l-.023.055a4.07 4.07 0 0 0-.11 2.558c.242.844.75 1.586 1.45 2.113l.007.004.02.016 3.32 2.484 1.637 1.242 1 .754a.67.67 0 0 0 .812 0l.996-.753 1.641-1.243 3.336-2.5.012-.004a4.049 4.049 0 0 0 1.343-4.675Zm0 0"/>
\ No newline at end of file diff --git a/_includes/social-icons/google_scholar.svg b/_includes/social-icons/google_scholar.svg new file mode 100644 index 0000000..37aab26 --- /dev/null +++ b/_includes/social-icons/google_scholar.svg @@ -0,0 +1 @@ +<circle opacity="0.7" cx="8.036" cy="11.08" r="4.3"/><path opacity="0.75" d="M0.585,6.505l7.42-5.885L8.03,6.582 C5.305,6.632,4.139,8.729,3.913,9.13L0.585,6.505z"/><path d="M15.415,6.509l-7.42-5.886L7.97,6.585c2.725,0.05,3.891,2.147,4.117,2.548L15.415,6.509z"/> diff --git a/_includes/social-icons/instagram.svg b/_includes/social-icons/instagram.svg new file mode 100644 index 0000000..d483d14 --- /dev/null +++ b/_includes/social-icons/instagram.svg @@ -0,0 +1 @@ +<path d="M8 0C5.827 0 5.555.01 4.702.048 3.85.088 3.27.222 2.76.42c-.526.204-.973.478-1.417.923-.445.444-.72.89-.923 1.417-.198.51-.333 1.09-.372 1.942C.008 5.555 0 5.827 0 8s.01 2.445.048 3.298c.04.852.174 1.433.372 1.942.204.526.478.973.923 1.417.444.445.89.72 1.417.923.51.198 1.09.333 1.942.372.853.04 1.125.048 3.298.048s2.445-.01 3.298-.048c.852-.04 1.433-.174 1.942-.372.526-.204.973-.478 1.417-.923.445-.444.72-.89.923-1.417.198-.51.333-1.09.372-1.942.04-.853.048-1.125.048-3.298s-.01-2.445-.048-3.298c-.04-.852-.174-1.433-.372-1.942-.204-.526-.478-.973-.923-1.417-.444-.445-.89-.72-1.417-.923-.51-.198-1.09-.333-1.942-.372C10.445.008 10.173 0 8 0zm0 1.44c2.136 0 2.39.01 3.233.048.78.036 1.203.166 1.485.276.374.145.64.318.92.598.28.28.453.546.598.92.11.282.24.705.276 1.485.038.844.047 1.097.047 3.233s-.01 2.39-.05 3.233c-.04.78-.17 1.203-.28 1.485-.15.374-.32.64-.6.92-.28.28-.55.453-.92.598-.28.11-.71.24-1.49.276-.85.038-1.1.047-3.24.047s-2.39-.01-3.24-.05c-.78-.04-1.21-.17-1.49-.28-.38-.15-.64-.32-.92-.6-.28-.28-.46-.55-.6-.92-.11-.28-.24-.71-.28-1.49-.03-.84-.04-1.1-.04-3.23s.01-2.39.04-3.24c.04-.78.17-1.21.28-1.49.14-.38.32-.64.6-.92.28-.28.54-.46.92-.6.28-.11.7-.24 1.48-.28.85-.03 1.1-.04 3.24-.04zm0 2.452c-2.27 0-4.108 1.84-4.108 4.108 0 2.27 1.84 4.108 4.108 4.108 2.27 0 4.108-1.84 4.108-4.108 0-2.27-1.84-4.108-4.108-4.108zm0 6.775c-1.473 0-2.667-1.194-2.667-2.667 0-1.473 1.194-2.667 2.667-2.667 1.473 0 2.667 1.194 2.667 2.667 0 1.473-1.194 2.667-2.667 2.667zm5.23-6.937c0 .53-.43.96-.96.96s-.96-.43-.96-.96.43-.96.96-.96.96.43.96.96z"/> diff --git a/_includes/social-icons/keybase.svg b/_includes/social-icons/keybase.svg new file mode 100644 index 0000000..0770447 --- /dev/null +++ b/_includes/social-icons/keybase.svg @@ -0,0 +1,4 @@ +<path d="M10.34,13.58c-0.298,0-0.54,0.242-0.54,0.54s0.242,0.54,0.54,0.54c0.298,0,0.54-0.242,0.54-0.54S10.638,13.58,10.34,13.58 L10.34,13.58z M6.38,13.58c-0.298,0-0.54,0.242-0.54,0.54s0.242,0.54,0.54,0.54c0.298,0,0.54-0.242,0.54-0.54 S6.678,13.58,6.38,13.58z"/> +<path fill="none" stroke="#000000" stroke-width="0.72" stroke-linecap="round" stroke-miterlimit="10" d="M1.58,13.22 c0.104,0.771,0.344,1.497,0.688,2.16 M5.93,3.86H4.31c-0.149,0-0.27-0.121-0.27-0.27V1.97c0-0.149,0.121-0.27,0.27-0.27h1.62 c0.149,0,0.27,0.121,0.27,0.27v1.08"/> +<path d="M8.18,7.46c-1.489,0-2.7-1.211-2.7-2.7c0-2.471,2.012-4.329,2.098-4.407c0.125-0.113,0.309-0.125,0.447-0.029 s0.191,0.273,0.129,0.429C8,1.142,7.861,1.791,8.002,1.999C8.015,2.018,8.044,2.06,8.18,2.06c1.489,0,2.7,1.211,2.7,2.7 C10.88,6.249,9.669,7.46,8.18,7.46z"/> +<path d="M15.178,11.759c-0.174-2.216-1.372-4.173-3.196-5.341c-0.015-0.009-0.029-0.02-0.044-0.029 c-0.121-0.076-0.245-0.147-0.371-0.217c-0.044-0.024-0.088-0.049-0.133-0.073c-0.029-0.016-0.061-0.029-0.09-0.043 c-0.228,0.551-0.594,1.03-1.056,1.394l1.206,1.207c0.141,0.141,0.141,0.368,0,0.509c-0.07,0.07-0.162,0.105-0.254,0.105 s-0.185-0.035-0.255-0.105l-0.301-0.301l-0.65,0.651C9.963,9.585,9.871,9.62,9.779,9.62c-0.092,0-0.184-0.035-0.254-0.105 c-0.141-0.141-0.141-0.369,0-0.509l0.651-0.651L9.8,7.979L9.334,8.445c-0.07,0.07-0.162,0.105-0.254,0.105S8.896,8.516,8.826,8.445 C8.74,8.36,8.714,8.245,8.73,8.135C8.552,8.164,8.368,8.18,8.18,8.18c-1.452,0-2.692-0.911-3.188-2.19 C2.318,7.245,0.8,10.089,0.8,13.94v1.08l0.648-0.864c0.669-0.893,1.483-1.789,2.256-2.502c-0.19,0.508-0.318,1.016-0.381,1.521 l-0.113,0.905l0.701-0.585c0.021-0.017,2.087-1.716,4.449-1.716c1.159,0,1.792,0.107,2.352,0.202 c0.479,0.081,0.931,0.157,1.609,0.157c1.115,0,1.727-0.57,1.993-1.254c0.071,0.304,0.121,0.614,0.146,0.931 c0.013,0.167,0.021,0.334,0.021,0.504c0,1.015-0.238,1.987-0.709,2.895c-0.092,0.176-0.022,0.394,0.154,0.485 c0.053,0.027,0.109,0.04,0.165,0.04c0.13,0,0.256-0.07,0.32-0.194c0.523-1.01,0.789-2.095,0.789-3.226 C15.2,12.132,15.192,11.944,15.178,11.759z"/> diff --git a/_includes/social-icons/linkedin.svg b/_includes/social-icons/linkedin.svg new file mode 100644 index 0000000..8a61bf1 --- /dev/null +++ b/_includes/social-icons/linkedin.svg @@ -0,0 +1 @@ +<path d="M13.632 13.635h-2.37V9.922c0-.886-.018-2.025-1.234-2.025-1.235 0-1.424.964-1.424 1.96v3.778h-2.37V6H8.51v1.04h.03c.318-.6 1.092-1.233 2.247-1.233 2.4 0 2.845 1.58 2.845 3.637v4.188zM3.558 4.955c-.762 0-1.376-.617-1.376-1.377 0-.758.614-1.375 1.376-1.375.76 0 1.376.617 1.376 1.375 0 .76-.617 1.377-1.376 1.377zm1.188 8.68H2.37V6h2.376v7.635zM14.816 0H1.18C.528 0 0 .516 0 1.153v13.694C0 15.484.528 16 1.18 16h13.635c.652 0 1.185-.516 1.185-1.153V1.153C16 .516 15.467 0 14.815 0z"/> diff --git a/_includes/social-icons/mastodon.svg b/_includes/social-icons/mastodon.svg new file mode 100644 index 0000000..77d35f4 --- /dev/null +++ b/_includes/social-icons/mastodon.svg @@ -0,0 +1 @@ +<path d="M15.195,5.352c0-3.347-2.193-4.328-2.193-4.328c-1.104-0.508-3.004-0.721-4.977-0.737H7.977 c-1.973,0.016-3.87,0.229-4.976,0.737c0,0-2.193,0.981-2.193,4.328c0,0.766-0.015,1.683,0.009,2.654c0.08,3.272,0.6,6.499,3.626,7.3 c1.396,0.369,2.594,0.446,3.559,0.394c1.75-0.097,2.732-0.624,2.732-0.624l-0.058-1.27c0,0-1.25,0.395-2.655,0.346 c-1.391-0.047-2.86-0.149-3.085-1.857c-0.021-0.15-0.031-0.312-0.031-0.479c0,0,1.365,0.334,3.096,0.413 c1.059,0.049,2.051-0.062,3.059-0.182c1.934-0.231,3.616-1.422,3.828-2.51C15.224,7.821,15.195,5.352,15.195,5.352z M12.609,9.664 h-1.606V5.73c0-0.83-0.349-1.25-1.047-1.25c-0.772,0-1.158,0.5-1.158,1.486V8.12H7.202V5.966c0-0.987-0.387-1.486-1.158-1.486 c-0.698,0-1.046,0.421-1.046,1.25v3.933H3.391V5.611c0-0.829,0.211-1.487,0.634-1.974c0.437-0.487,1.009-0.736,1.719-0.736 c0.822,0,1.444,0.315,1.855,0.947L8,4.519l0.4-0.67c0.412-0.632,1.033-0.947,1.855-0.947c0.71,0,1.282,0.25,1.72,0.736 c0.423,0.487,0.635,1.145,0.635,1.974V9.664z"/> diff --git a/_includes/social-icons/microdotblog.svg b/_includes/social-icons/microdotblog.svg new file mode 100644 index 0000000..285a719 --- /dev/null +++ b/_includes/social-icons/microdotblog.svg @@ -0,0 +1 @@ +<path d="M13.778,12.215c-0.102,0.218-0.171,0.385-0.212,0.498c-0.143,0.399-0.188,0.719-0.202,0.922 c-0.068,1.015,0.388,1.615,0.496,1.776c0.16,0.239,0.227,0.373,0.195,0.404c-0.059,0.104-0.241,0.104-0.546,0 c-0.457-0.157-1.72-0.647-2.196-1.338c-0.191-0.28-0.313-0.398-0.389-0.44C10.021,14.372,9.034,14.556,8,14.556 c-4.33,0-7.84-3.234-7.84-7.224c0-3.99,3.51-7.225,7.84-7.225s7.84,3.234,7.84,7.225C15.84,9.214,15.059,10.929,13.778,12.215z M7.944,9.692c1.542,0.999,2.38,1.439,2.513,1.322c0.133-0.117-0.027-1.051-0.479-2.799c1.436-1.092,2.114-1.753,2.033-1.981 c-0.082-0.229-1.018-0.365-2.81-0.408C8.607,4.13,8.188,3.28,7.944,3.28c-0.244,0-0.663,0.85-1.256,2.546 c-1.795,0.053-2.731,0.188-2.81,0.408c-0.078,0.219,0.6,0.88,2.033,1.981c-0.491,1.689-0.65,2.622-0.48,2.799 C5.602,11.19,6.44,10.75,7.944,9.692z"/> diff --git a/_includes/social-icons/pinterest.svg b/_includes/social-icons/pinterest.svg new file mode 100644 index 0000000..d3963c6 --- /dev/null +++ b/_includes/social-icons/pinterest.svg @@ -0,0 +1 @@ +<path d="M8 0C3.582 0 0 3.582 0 8c0 3.39 2.108 6.285 5.084 7.45-.07-.633-.133-1.604.028-2.295.146-.625.938-3.977.938-3.977s-.24-.48-.24-1.188c0-1.11.646-1.943 1.448-1.943.683 0 1.012.513 1.012 1.127 0 .687-.436 1.713-.662 2.664-.19.797.4 1.445 1.185 1.445 1.42 0 2.514-1.498 2.514-3.662 0-1.91-1.376-3.25-3.342-3.25-2.276 0-3.61 1.71-3.61 3.47 0 .69.263 1.43.593 1.83.066.08.075.15.057.23-.06.25-.196.8-.223.91-.035.15-.115.18-.268.11C3.516 10.46 2.89 9 2.89 7.82c0-2.52 1.834-4.84 5.287-4.84 2.774 0 4.932 1.98 4.932 4.62 0 2.76-1.74 4.98-4.16 4.98-.81 0-1.57-.42-1.84-.92l-.5 1.9c-.18.698-.67 1.57-1 2.1.75.23 1.54.357 2.37.357 4.41 0 8-3.58 8-8s-3.59-8-8-8z"/>
\ No newline at end of file diff --git a/_includes/social-icons/rss.svg b/_includes/social-icons/rss.svg new file mode 100644 index 0000000..e531f94 --- /dev/null +++ b/_includes/social-icons/rss.svg @@ -0,0 +1 @@ +<path d="M12.8 16C12.8 8.978 7.022 3.2 0 3.2V0c8.777 0 16 7.223 16 16h-3.2zM2.194 11.61c1.21 0 2.195.985 2.195 2.196 0 1.21-.99 2.194-2.2 2.194C.98 16 0 15.017 0 13.806c0-1.21.983-2.195 2.194-2.195zM10.606 16h-3.11c0-4.113-3.383-7.497-7.496-7.497v-3.11c5.818 0 10.606 4.79 10.606 10.607z"/> diff --git a/_includes/social-icons/stackoverflow.svg b/_includes/social-icons/stackoverflow.svg new file mode 100644 index 0000000..c2c78c4 --- /dev/null +++ b/_includes/social-icons/stackoverflow.svg @@ -0,0 +1 @@ +<path d="M12.566,14.12v-4.08h1.359v5.44H1.686v-5.44h1.36v4.08H12.566z M10.336,0.52L9.269,1.315l3.978,5.358l1.068-0.803 L10.336,0.52z M4.406,12.76h6.8V11.4h-6.8V12.76z M12.158,7.945L7.03,3.675l0.851-1.02l5.128,4.271L12.158,7.945z M5.357,6.646 l6.053,2.815l0.558-1.21L5.916,5.437L5.357,6.64V6.646z M11.227,10.91L4.494,9.774l0.272-1.306l6.549,1.306L11.227,10.91z"/> diff --git a/_includes/social-icons/telegram.svg b/_includes/social-icons/telegram.svg new file mode 100644 index 0000000..40bc43b --- /dev/null +++ b/_includes/social-icons/telegram.svg @@ -0,0 +1 @@ +<path d="M10.563,11.596l1.286-6.063c0.053-0.256,0.022-0.44-0.092-0.551c-0.113-0.111-0.264-0.131-0.45-0.061l-7.56,2.914 C3.579,7.897,3.463,7.971,3.402,8.052C3.34,8.134,3.333,8.211,3.38,8.284s0.14,0.13,0.28,0.171l1.934,0.604l4.489-2.826 c0.123-0.082,0.216-0.099,0.28-0.053c0.041,0.029,0.029,0.073-0.035,0.131L6.696,9.592l-0.14,1.996c0.134,0,0.265-0.064,0.394-0.193 l0.945-0.91l1.96,1.444C10.229,12.139,10.465,12.027,10.563,11.596z M15.84,8c0,1.062-0.207,2.077-0.621,3.045 c-0.414,0.969-0.972,1.803-1.671,2.503c-0.7,0.699-1.534,1.257-2.503,1.671C10.077,15.633,9.062,15.84,8,15.84 s-2.077-0.207-3.045-0.621c-0.969-0.414-1.803-0.972-2.502-1.671c-0.7-0.7-1.257-1.534-1.671-2.503C0.367,10.077,0.16,9.062,0.16,8 s0.207-2.077,0.621-3.045c0.414-0.969,0.971-1.803,1.671-2.502c0.7-0.7,1.534-1.257,2.502-1.671C5.923,0.367,6.938,0.16,8,0.16 s2.077,0.207,3.045,0.621c0.969,0.414,1.803,0.971,2.503,1.671c0.699,0.7,1.257,1.534,1.671,2.502C15.633,5.923,15.84,6.938,15.84,8 z"/> diff --git a/_includes/social-icons/twitter.svg b/_includes/social-icons/twitter.svg new file mode 100644 index 0000000..0f5322f --- /dev/null +++ b/_includes/social-icons/twitter.svg @@ -0,0 +1 @@ +<path d="M16 3.038c-.59.26-1.22.437-1.885.517.677-.407 1.198-1.05 1.443-1.816-.634.37-1.337.64-2.085.79-.598-.64-1.45-1.04-2.396-1.04-1.812 0-3.282 1.47-3.282 3.28 0 .26.03.51.085.75-2.728-.13-5.147-1.44-6.766-3.42C.83 2.58.67 3.14.67 3.75c0 1.14.58 2.143 1.46 2.732-.538-.017-1.045-.165-1.487-.41v.04c0 1.59 1.13 2.918 2.633 3.22-.276.074-.566.114-.865.114-.21 0-.41-.02-.61-.058.42 1.304 1.63 2.253 3.07 2.28-1.12.88-2.54 1.404-4.07 1.404-.26 0-.52-.015-.78-.045 1.46.93 3.18 1.474 5.04 1.474 6.04 0 9.34-5 9.34-9.33 0-.14 0-.28-.01-.42.64-.46 1.2-1.04 1.64-1.7z"/> diff --git a/_includes/social-icons/whatsapp.svg b/_includes/social-icons/whatsapp.svg new file mode 100644 index 0000000..579f08c --- /dev/null +++ b/_includes/social-icons/whatsapp.svg @@ -0,0 +1,4 @@ +<path + d="m13.64,2.33C12.14.83,10.15,0,8.03,0,3.66,0,.11,3.56.1,7.93c0,1.4.36,2.76,1.06,3.96L.04,16l4.2-1.1c1.16.63,2.46.96,3.79.97h0s0,0,0,0c4.37,0,7.93-3.56,7.93-7.93,0-2.12-.82-4.11-2.32-5.61Zm-5.61,12.2h0c-1.18,0-2.34-.32-3.35-.92l-.24-.14-2.49.65.67-2.43-.16-.25c-.66-1.05-1.01-2.26-1.01-3.51,0-3.63,2.96-6.59,6.59-6.59,1.76,0,3.41.69,4.66,1.93,1.24,1.25,1.93,2.9,1.93,4.66,0,3.63-2.96,6.59-6.59,6.59Z" /> +<path + d="m11.65,9.59c-.2-.1-1.17-.58-1.35-.64-.18-.07-.31-.1-.45.1-.13.2-.51.64-.63.78-.12.13-.23.15-.43.05-.2-.1-.84-.31-1.59-.98-.59-.53-.99-1.17-1.1-1.37-.12-.2-.01-.31.09-.4.09-.09.2-.23.3-.35.1-.12.13-.2.2-.33.07-.13.03-.25-.02-.35-.05-.1-.45-1.07-.61-1.47-.16-.39-.32-.33-.45-.34-.12,0-.25,0-.38,0s-.35.05-.53.25c-.18.2-.69.68-.69,1.65s.71,1.92.81,2.05c.1.13,1.4,2.13,3.38,2.99.47.2.84.33,1.13.42.47.15.91.13,1.25.08.38-.06,1.17-.48,1.34-.94.17-.46.17-.86.12-.94-.05-.08-.18-.13-.38-.23Z" /> diff --git a/_includes/social-icons/x.svg b/_includes/social-icons/x.svg new file mode 100644 index 0000000..1c8360c --- /dev/null +++ b/_includes/social-icons/x.svg @@ -0,0 +1,3 @@ +<path +d="M 9.5237333,6.7756869 15.481067,0 h -1.4112 L 8.8949333,5.8820316 4.7648,0 H 0 L 6.2469333,8.8955204 0,16 H 1.4112 L 6.8725333,9.7870441 11.2352,16 H 16 M 1.9205333,1.0412656 h 2.168 L 14.0688,15.009892 h -2.168533" +style="stroke-width:0.0533111" /> diff --git a/_includes/social-icons/youtube.svg b/_includes/social-icons/youtube.svg new file mode 100644 index 0000000..dfd5661 --- /dev/null +++ b/_includes/social-icons/youtube.svg @@ -0,0 +1 @@ +<path d="M0 7.345c0-1.294.16-2.59.16-2.59s.156-1.1.636-1.587c.608-.637 1.408-.617 1.764-.684C3.84 2.36 8 2.324 8 2.324s3.362.004 5.6.166c.314.038.996.04 1.604.678.48.486.636 1.588.636 1.588S16 6.05 16 7.346v1.258c0 1.296-.16 2.59-.16 2.59s-.156 1.102-.636 1.588c-.608.638-1.29.64-1.604.678-2.238.162-5.6.166-5.6.166s-4.16-.037-5.44-.16c-.356-.067-1.156-.047-1.764-.684-.48-.487-.636-1.587-.636-1.587S0 9.9 0 8.605v-1.26zm6.348 2.73V5.58l4.323 2.255-4.32 2.24z"/> diff --git a/_includes/social-item.html b/_includes/social-item.html new file mode 100644 index 0000000..7f2e101 --- /dev/null +++ b/_includes/social-item.html @@ -0,0 +1,7 @@ +<li>{% assign entry = include.item %} + <a {% unless entry.platform == 'rss' %}rel="me" {% endunless %}href="{{ entry.user_url }}" target="_blank" title="{{ entry.title | default: entry.platform }}"> + <svg class="svg-icon grey"> + <use xlink:href="{{ '/assets/minima-social-icons.svg#' | append: entry.platform | relative_url }}"></use> + </svg> + </a> +</li> diff --git a/_includes/social.html b/_includes/social.html new file mode 100644 index 0000000..8a4af8b --- /dev/null +++ b/_includes/social.html @@ -0,0 +1,5 @@ +<ul class="social-media-list"> +{%- for entry in site.minima.social_links -%} + {%- include social-item.html item = entry -%} +{%- endfor -%} +</ul> diff --git a/_includes/svg_symbol.html b/_includes/svg_symbol.html new file mode 100644 index 0000000..5c9127c --- /dev/null +++ b/_includes/svg_symbol.html @@ -0,0 +1,3 @@ +<symbol id="{{ include.key }}" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414" viewBox="0 0 16 16"> + {%- include social-icons/{{ include.key }}.svg -%} +</symbol> diff --git a/_layouts/all_posts.html b/_layouts/all_posts.html new file mode 100644 index 0000000..c81df2f --- /dev/null +++ b/_layouts/all_posts.html @@ -0,0 +1,61 @@ +--- +layout: base +--- + +<div class="home"> + {%- if page.title -%} + <h1 class="page-heading">{{ page.title }}</h1> + {%- endif -%} + + {{ content }} + + + {% if site.paginate %} + {% assign posts = paginator.posts %} + {% else %} + {% assign posts = site.posts %} + {% endif %} + + + {%- if posts.size > 0 -%} + {%- if page.list_title -%} + <h2 class="post-list-heading">{{ page.list_title }}</h2> + {%- endif -%} + <ul class="post-list"> + {%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%} + {%- for post in posts -%} + <li> + <span class="post-meta">{{ post.date | date: date_format }}</span> + <h3> + <a class="post-link" href="{{ post.url | relative_url }}"> + {{ post.title | escape }} + </a> + </h3> + {%- if site.show_excerpts -%} + {{ post.excerpt }} + {%- endif -%} + </li> + {%- endfor -%} + </ul> + + {% if site.paginate %} + <div class="pager"> + <ul class="pagination"> + {%- if paginator.previous_page %} + <li><a href="{{ paginator.previous_page_path | relative_url }}" class="previous-page">{{ paginator.previous_page }}</a></li> + {%- else %} + <li><div class="pager-edge">•</div></li> + {%- endif %} + <li><div class="current-page">{{ paginator.page }}</div></li> + {%- if paginator.next_page %} + <li><a href="{{ paginator.next_page_path | relative_url }}" class="next-page">{{ paginator.next_page }}</a></li> + {%- else %} + <li><div class="pager-edge">•</div></li> + {%- endif %} + </ul> + </div> + {%- endif %} + + {%- endif -%} + +</div> diff --git a/_layouts/base.html b/_layouts/base.html new file mode 100644 index 0000000..58e141b --- /dev/null +++ b/_layouts/base.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html lang="{{ page.lang | default: site.lang | default: "en" }}"> + + {%- include head.html -%} + + <body> + + {%- include header.html -%} + + <main class="page-content" aria-label="Content"> + <div class="wrapper"> + {{ content }} + </div> + </main> + + {%- include footer.html -%} + + </body> + +</html> diff --git a/_layouts/home.html b/_layouts/home.html new file mode 100644 index 0000000..34dc79b --- /dev/null +++ b/_layouts/home.html @@ -0,0 +1,63 @@ +--- +layout: base +--- + +<div class="home"> + {%- if page.title -%} + <h1 class="page-heading">{{ page.title }}</h1> + {%- endif -%} + + {{ content }} + + + {% if site.paginate %} + {% assign posts = paginator.posts %} + {% else %} + {% assign posts = site.posts %} + {% endif %} + + + {%- if posts.size > 0 -%} + {%- if page.list_title -%} + <h2 class="post-list-heading">{{ page.list_title }}</h2> + {%- endif -%} + <ul class="post-list"> + {%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%} + {%- for post in site.posts | limit: 5 -%} + <li> + <span class="post-meta">{{ post.date | date: date_format }}</span> + <h3> + <a class="post-link" href="{{ post.url | relative_url }}"> + {{ post.title | escape }} + </a> + </h3> + {%- if site.show_excerpts -%} + {{ post.excerpt }} + {%- endif -%} + </li> + {%- endfor -%} + </ul> + + {% if site.paginate %} + <div class="pager"> + <ul class="pagination"> + {%- if paginator.previous_page %} + <li><a href="{{ paginator.previous_page_path | relative_url }}" class="previous-page">{{ paginator.previous_page }}</a></li> + {%- else %} + <li><div class="pager-edge">•</div></li> + {%- endif %} + <li><div class="current-page">{{ paginator.page }}</div></li> + {%- if paginator.next_page %} + <li><a href="{{ paginator.next_page_path | relative_url }}" class="next-page">{{ paginator.next_page }}</a></li> + {%- else %} + <li><div class="pager-edge">•</div></li> + {%- endif %} + </ul> + </div> + {%- endif %} + + <a href="/posts">See All Posts →</a> + + {%- endif -%} + +</div> diff --git a/_layouts/page.html b/_layouts/page.html new file mode 100644 index 0000000..18544b4 --- /dev/null +++ b/_layouts/page.html @@ -0,0 +1,14 @@ +--- +layout: base +--- +<article class="post"> + + <header class="post-header"> + <h1 class="post-title">{{ page.title | escape }}</h1> + </header> + + <div class="post-content"> + {{ content }} + </div> + +</article> diff --git a/_layouts/post.html b/_layouts/post.html new file mode 100644 index 0000000..dc71866 --- /dev/null +++ b/_layouts/post.html @@ -0,0 +1,38 @@ +--- +layout: base +--- +<article class="post h-entry" itemscope itemtype="http://schema.org/BlogPosting"> + + <header class="post-header"> + <h1 class="post-title p-name" itemprop="name headline">{{ page.title | escape }}</h1> + <p class="post-meta"> + {%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%} + <time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished"> + {{ page.date | date: date_format }} + </time> + {%- if page.modified_date -%} + ~ + {%- assign mdate = page.modified_date | date_to_xmlschema -%} + <time class="dt-modified" datetime="{{ mdate }}" itemprop="dateModified"> + {{ mdate | date: date_format }} + </time> + {%- endif -%} + {%- if page.author -%} + • {% for author in page.author %} + <span itemprop="author" itemscope itemtype="http://schema.org/Person"> + <span class="p-author h-card" itemprop="name">{{ author }}</span></span> + {%- if forloop.last == false %}, {% endif -%} + {% endfor %} + {%- endif -%}</p> + </header> + + <div class="post-content e-content" itemprop="articleBody"> + {{ content }} + </div> + + {%- if site.disqus.shortname -%} + {%- include disqus_comments.html -%} + {%- endif -%} + + <a class="u-url" href="{{ page.url | relative_url }}" hidden></a> +</article> diff --git a/_sass/minima/_base.scss b/_sass/minima/_base.scss new file mode 100644 index 0000000..ea8d8f2 --- /dev/null +++ b/_sass/minima/_base.scss @@ -0,0 +1,281 @@ +html { + font-size: $base-font-size; +} + +/** + * Reset some basic elements + */ +body, h1, h2, h3, h4, h5, h6, +p, blockquote, pre, hr, +dl, dd, ol, ul, figure { + margin: 0; + padding: 0; + +} + + + +/** + * Basic styling + */ +body { + font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family; + color: $text-color; + background-color: $background-color; + -webkit-text-size-adjust: 100%; + -webkit-font-feature-settings: "kern" 1; + -moz-font-feature-settings: "kern" 1; + -o-font-feature-settings: "kern" 1; + font-feature-settings: "kern" 1; + font-kerning: normal; + display: flex; + min-height: 100vh; + flex-direction: column; + overflow-wrap: break-word; +} + + + +/** + * Set `margin-bottom` to maintain vertical rhythm + */ +h1, h2, h3, h4, h5, h6, +p, blockquote, pre, +ul, ol, dl, figure, +%vertical-rhythm { + margin-bottom: $spacing-unit * .5; +} + +hr { + margin-top: $spacing-unit; + margin-bottom: $spacing-unit; +} + +/** + * `main` element + */ +main { + display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */ +} + + + +/** + * Images + */ +img { + max-width: 100%; + vertical-align: middle; +} + + + +/** + * Figures + */ +figure > img { + display: block; +} + +figcaption { + font-size: $small-font-size; +} + + + +/** + * Lists + */ +ul, ol { + margin-left: $spacing-unit; +} + +li { + > ul, + > ol { + margin-bottom: 0; + } +} + + + +/** + * Headings + */ +h1, h2, h3, h4, h5, h6 { + font-weight: $base-font-weight; +} + + + +/** + * Links + */ +a { + color: $link-base-color; + text-decoration: none; + + &:visited { + color: $link-visited-color; + } + + &:hover { + color: $link-hover-color; + text-decoration: underline; + } + + .social-media-list &:hover { + text-decoration: none; + + .username { + text-decoration: underline; + } + } +} + + +/** + * Blockquotes + */ +blockquote { + color: $brand-color; + border-left: 4px solid $border-color-01; + padding-left: $spacing-unit * .5; + @include relative-font-size(1.125); + font-style: italic; + + > :last-child { + margin-bottom: 0; + } + + i, em { + font-style: normal; + } +} + + + +/** + * Code formatting + */ +pre, +code { + font-family: $code-font-family; + font-size: 0.9375em; + border: 1px solid $border-color-01; + border-radius: 3px; + background-color: $code-background-color; +} + +code { + padding: 1px 5px; +} + +pre { + padding: 8px 12px; + overflow-x: auto; + + > code { + border: 0; + padding-right: 0; + padding-left: 0; + } +} + +.highlight { + border-radius: 3px; + background: $code-background-color; + @extend %vertical-rhythm; + + .highlighter-rouge & { + background: $code-background-color; + } +} + + + +/** + * Wrapper + */ +.wrapper { + max-width: calc(#{$content-width} - (#{$spacing-unit})); + margin-right: auto; + margin-left: auto; + padding-right: $spacing-unit * .5; + padding-left: $spacing-unit * .5; + @extend %clearfix; + + @media screen and (min-width: $on-large) { + max-width: calc(#{$content-width} - (#{$spacing-unit} * 2)); + padding-right: $spacing-unit; + padding-left: $spacing-unit; + } +} + + + +/** + * Clearfix + */ +%clearfix:after { + content: ""; + display: table; + clear: both; +} + + + +/** + * Icons + */ + +.orange { + color: #f66a0a; +} + +.grey { + color: #828282; +} + +.svg-icon { + width: 1.25em; + height: 1.25em; + display: inline-block; + fill: currentColor; + vertical-align: text-bottom; +} + + +/** + * Tables + */ +table { + margin-bottom: $spacing-unit; + width: 100%; + text-align: $table-text-align; + color: $table-text-color; + border-collapse: collapse; + border: 1px solid $table-border-color; + tr { + &:nth-child(even) { + background-color: $table-zebra-color; + } + } + th, td { + padding: ($spacing-unit * 33.3333333333 * .01) ($spacing-unit * .5); + } + th { + background-color: $table-header-bg-color; + border: 1px solid $table-header-border; + } + td { + border: 1px solid $table-border-color; + } + + @include media-query($on-laptop) { + display: block; + overflow-x: auto; + -webkit-overflow-scrolling: touch; + -ms-overflow-style: -ms-autohiding-scrollbar; + } +} diff --git a/_sass/minima/_layout.scss b/_sass/minima/_layout.scss new file mode 100644 index 0000000..426f390 --- /dev/null +++ b/_sass/minima/_layout.scss @@ -0,0 +1,341 @@ +/** + * Site header + */ +.site-header { + border-top: 5px solid $border-color-03; + border-bottom: 1px solid $border-color-01; + min-height: $spacing-unit * 1.865; + line-height: $base-line-height * $base-font-size * 2.25; + + // Positioning context for the mobile navigation icon + position: relative; +} + +.site-title { + @include relative-font-size(1.625); + font-weight: 300; + letter-spacing: -1px; + margin-bottom: 0; + float: left; + + @include media-query($on-palm) { + padding-right: 45px; + } + + &, + &:visited { + color: $site-title-color; + } +} + +.site-nav { + position: absolute; + top: 9px; + right: $spacing-unit * .5; + background-color: $background-color; + border: 1px solid $border-color-01; + border-radius: 5px; + text-align: right; + + .nav-trigger { + display: none; + } + + .menu-icon { + float: right; + width: 36px; + height: 26px; + line-height: 0; + padding-top: 10px; + text-align: center; + + > svg path { + fill: $border-color-03; + } + } + + label[for="nav-trigger"] { + display: block; + float: right; + width: 36px; + height: 36px; + z-index: 2; + cursor: pointer; + } + + input ~ .trigger { + clear: both; + display: none; + } + + input:checked ~ .trigger { + display: block; + padding-bottom: 5px; + } + + .page-link { + color: $text-color; + line-height: $base-line-height; + display: block; + padding: 5px 10px; + + // Gaps between nav items, but not on the last one + &:not(:last-child) { + margin-right: 0; + } + margin-left: 20px; + } + + @media screen and (min-width: $on-medium) { + position: static; + float: right; + border: none; + background-color: inherit; + + label[for="nav-trigger"] { + display: none; + } + + .menu-icon { + display: none; + } + + input ~ .trigger { + display: block; + } + + .page-link { + display: inline; + padding: 0; + + &:not(:last-child) { + margin-right: 20px; + } + margin-left: auto; + } + } +} + + + +/** + * Site footer + */ +.site-footer { + border-top: 1px solid $border-color-01; + padding: $spacing-unit 0; +} + +.footer-heading { + @include relative-font-size(1.125); + margin-bottom: $spacing-unit * .5; +} + +.feed-subscribe .svg-icon { + padding: 5px 5px 2px 0 +} + +.contact-list, +.social-media-list { + list-style: none; + margin-left: 0; +} + +.footer-col-wrapper, +.social-links { + @include relative-font-size(0.9375); + color: $brand-color; +} + +.footer-col { + margin-bottom: $spacing-unit * .5; +} + +.footer-col-1, +.footer-col-2 { + width: calc(50% - (#{$spacing-unit} / 2)); +} + +.footer-col-3 { + width: calc(100% - (#{$spacing-unit} / 2)); +} + +@media screen and (min-width: $on-large) { + .footer-col-1 { + width: calc(35% - (#{$spacing-unit} / 2)); + } + + .footer-col-2 { + width: calc(20% - (#{$spacing-unit} / 2)); + } + + .footer-col-3 { + width: calc(45% - (#{$spacing-unit} / 2)); + } +} + +@media screen and (min-width: $on-medium) { + .footer-col-wrapper { + display: flex + } + + .footer-col { + width: calc(100% - (#{$spacing-unit} / 2)); + padding: 0 ($spacing-unit * .5); + + &:first-child { + padding-right: $spacing-unit * .5; + padding-left: 0; + } + + &:last-child { + padding-right: 0; + padding-left: $spacing-unit * .5; + } + } +} + + + +/** + * Page content + */ +.page-content { + padding: $spacing-unit 0; + flex: 1 0 auto; +} + +.page-heading { + @include relative-font-size(2); +} + +.post-list-heading { + @include relative-font-size(1.75); +} + +.post-list { + margin-left: 0; + list-style: none; + + > li { + margin-bottom: $spacing-unit; + } +} + +.post-meta { + font-size: $small-font-size; + color: $brand-color; +} + +.post-link { + display: block; + @include relative-font-size(1.2); +} + + + +/** + * Posts + */ +.post-header { + margin-bottom: $spacing-unit; +} + +.post-title, +.post-content h1 { + @include relative-font-size(2.625); + letter-spacing: -1px; + line-height: 1.15; + + @media screen and (min-width: $on-large) { + @include relative-font-size(2.625); + } +} + +.post-content { + margin-bottom: $spacing-unit; + + h1, h2, h3, h4, h5, h6 { margin-top: $spacing-unit } + + h2 { + @include relative-font-size(1.75); + + @media screen and (min-width: $on-large) { + @include relative-font-size(2); + } + } + + h3 { + @include relative-font-size(1.375); + + @media screen and (min-width: $on-large) { + @include relative-font-size(1.625); + } + } + + h4 { + @include relative-font-size(1.25); + } + + h5 { + @include relative-font-size(1.125); + } + h6 { + @include relative-font-size(1.0625); + } +} + + +.social-media-list { + display: table; + margin: 0 auto; + li { + float: left; + margin: 5px 10px 5px 0; + &:last-of-type { margin-right: 0 } + a { + display: block; + padding: 10px 12px; + border: 1px solid $border-color-01; + &:hover { border-color: $border-color-02 } + } + } +} + + + +/** + * Pagination navbar + */ +.pagination { + margin-bottom: $spacing-unit; + @extend .social-media-list; + li { + a, div { + min-width: 41px; + text-align: center; + box-sizing: border-box; + } + div { + display: block; + padding: $spacing-unit * .25; + border: 1px solid transparent; + + &.pager-edge { + color: $border-color-01; + border: 1px dashed; + } + } + } +} + + + +/** + * Grid helpers + */ +@media screen and (min-width: $on-large) { + .one-half { + width: calc(50% - (#{$spacing-unit} / 2)); + } +} diff --git a/_sass/minima/custom-styles.scss b/_sass/minima/custom-styles.scss new file mode 100644 index 0000000..7c1417f --- /dev/null +++ b/_sass/minima/custom-styles.scss @@ -0,0 +1,2 @@ +// Placeholder to allow defining custom styles that override everything else. +// (Use `_sass/minima/custom-variables.scss` to override variable defaults) diff --git a/_sass/minima/custom-variables.scss b/_sass/minima/custom-variables.scss new file mode 100644 index 0000000..2a2d0fa --- /dev/null +++ b/_sass/minima/custom-variables.scss @@ -0,0 +1 @@ +// Placeholder to allow overriding predefined variables smoothly. diff --git a/_sass/minima/initialize.scss b/_sass/minima/initialize.scss new file mode 100644 index 0000000..76efd77 --- /dev/null +++ b/_sass/minima/initialize.scss @@ -0,0 +1,50 @@ +@charset "utf-8"; + +// Define defaults for each variable. + +$base-font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", Roboto, Helvetica, Arial, sans-serif !default; +$code-font-family: "Menlo", "Inconsolata", "Consolas", "Roboto Mono", "Ubuntu Mono", "Liberation Mono", "Courier New", monospace; +$base-font-size: 16px !default; +$base-font-weight: 400 !default; +$small-font-size: $base-font-size * 0.875 !default; +$base-line-height: 1.5 !default; + +$spacing-unit: 30px !default; + +$table-text-align: left !default; + +// Width of the content area +$content-width: 800px !default; + +$on-palm: 600px !default; +$on-laptop: 800px !default; + +$on-medium: $on-palm !default; +$on-large: $on-laptop !default; + +// Use media queries like this: +// @include media-query($on-palm) { +// .wrapper { +// padding-right: $spacing-unit / 2; +// padding-left: $spacing-unit / 2; +// } +// } +// Notice the following mixin uses max-width, in a deprecated, desktop-first +// approach, whereas media queries used elsewhere now use min-width. +@mixin media-query($device) { + @media screen and (max-width: $device) { + @content; + } +} + +@mixin relative-font-size($ratio) { + font-size: #{$ratio}rem; +} + +// Import pre-styling-overrides hook and style-partials. +@import + "minima/custom-variables", // Hook to override predefined variables. + "minima/base", // Defines element resets. + "minima/layout", // Defines structure and style based on CSS selectors. + "minima/custom-styles" // Hook to override existing styles. +; diff --git a/_sass/minima/skins/auto.scss b/_sass/minima/skins/auto.scss new file mode 100644 index 0000000..8902e8c --- /dev/null +++ b/_sass/minima/skins/auto.scss @@ -0,0 +1,361 @@ +@charset "utf-8"; + +// Default color scheme settings +// These are overridden in classic.css and dark.scss + +$color-scheme-auto: true !default; +$color-scheme-dark: false !default; + + +// Light mode +// ---------- + +$lm-brand-color: #828282 !default; +$lm-brand-color-light: lighten($lm-brand-color, 40%) !default; +$lm-brand-color-dark: darken($lm-brand-color, 25%) !default; + +$lm-site-title-color: $lm-brand-color-dark !default; + +$lm-text-color: #111111 !default; +$lm-background-color: #fdfdfd !default; +$lm-code-background-color: #eeeeff !default; + +$lm-link-base-color: #2a7ae2 !default; +$lm-link-visited-color: darken($lm-link-base-color, 15%) !default; +$lm-link-hover-color: $lm-text-color !default; + +$lm-border-color-01: $lm-brand-color-light !default; +$lm-border-color-02: lighten($lm-brand-color, 35%) !default; +$lm-border-color-03: $lm-brand-color-dark !default; + +$lm-table-text-color: lighten($lm-text-color, 18%) !default; +$lm-table-zebra-color: lighten($lm-brand-color, 46%) !default; +$lm-table-header-bg-color: lighten($lm-brand-color, 43%) !default; +$lm-table-header-border: lighten($lm-brand-color, 37%) !default; +$lm-table-border-color: $lm-border-color-01 !default; + + +// Syntax highlighting styles should be adjusted appropriately for every "skin" +// ---------------------------------------------------------------------------- + +@mixin lm-highlight { + .highlight { + .c { color: #998; font-style: italic } // Comment + .err { color: #a61717; background-color: #e3d2d2 } // Error + .k { font-weight: bold } // Keyword + .o { font-weight: bold } // Operator + .cm { color: #998; font-style: italic } // Comment.Multiline + .cp { color: #999; font-weight: bold } // Comment.Preproc + .c1 { color: #998; font-style: italic } // Comment.Single + .cs { color: #999; font-weight: bold; font-style: italic } // Comment.Special + .gd { color: #000; background-color: #fdd } // Generic.Deleted + .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific + .ge { font-style: italic } // Generic.Emph + .gr { color: #a00 } // Generic.Error + .gh { color: #999 } // Generic.Heading + .gi { color: #000; background-color: #dfd } // Generic.Inserted + .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific + .go { color: #888 } // Generic.Output + .gp { color: #555 } // Generic.Prompt + .gs { font-weight: bold } // Generic.Strong + .gu { color: #aaa } // Generic.Subheading + .gt { color: #a00 } // Generic.Traceback + .kc { font-weight: bold } // Keyword.Constant + .kd { font-weight: bold } // Keyword.Declaration + .kp { font-weight: bold } // Keyword.Pseudo + .kr { font-weight: bold } // Keyword.Reserved + .kt { color: #458; font-weight: bold } // Keyword.Type + .m { color: #099 } // Literal.Number + .s { color: #d14 } // Literal.String + .na { color: #008080 } // Name.Attribute + .nb { color: #0086B3 } // Name.Builtin + .nc { color: #458; font-weight: bold } // Name.Class + .no { color: #008080 } // Name.Constant + .ni { color: #800080 } // Name.Entity + .ne { color: #900; font-weight: bold } // Name.Exception + .nf { color: #900; font-weight: bold } // Name.Function + .nn { color: #555 } // Name.Namespace + .nt { color: #000080 } // Name.Tag + .nv { color: #008080 } // Name.Variable + .ow { font-weight: bold } // Operator.Word + .w { color: #bbb } // Text.Whitespace + .mf { color: #099 } // Literal.Number.Float + .mh { color: #099 } // Literal.Number.Hex + .mi { color: #099 } // Literal.Number.Integer + .mo { color: #099 } // Literal.Number.Oct + .sb { color: #d14 } // Literal.String.Backtick + .sc { color: #d14 } // Literal.String.Char + .sd { color: #d14 } // Literal.String.Doc + .s2 { color: #d14 } // Literal.String.Double + .se { color: #d14 } // Literal.String.Escape + .sh { color: #d14 } // Literal.String.Heredoc + .si { color: #d14 } // Literal.String.Interpol + .sx { color: #d14 } // Literal.String.Other + .sr { color: #009926 } // Literal.String.Regex + .s1 { color: #d14 } // Literal.String.Single + .ss { color: #990073 } // Literal.String.Symbol + .bp { color: #999 } // Name.Builtin.Pseudo + .vc { color: #008080 } // Name.Variable.Class + .vg { color: #008080 } // Name.Variable.Global + .vi { color: #008080 } // Name.Variable.Instance + .il { color: #099 } // Literal.Number.Integer.Long + } +} + + +// Dark mode +// --------- + +$dm-brand-color: #999999 !default; +$dm-brand-color-light: lighten($dm-brand-color, 5%) !default; +$dm-brand-color-dark: darken($dm-brand-color, 35%) !default; + +$dm-site-title-color: $dm-brand-color-light !default; + +$dm-text-color: #bbbbbb !default; +$dm-background-color: #181818 !default; +$dm-code-background-color: #212121 !default; + +$dm-link-base-color: #79b8ff !default; +$dm-link-visited-color: $dm-link-base-color !default; +$dm-link-hover-color: $dm-text-color !default; + +$dm-border-color-01: $dm-brand-color-dark !default; +$dm-border-color-02: $dm-brand-color-light !default; +$dm-border-color-03: $dm-brand-color !default; + +$dm-table-text-color: $dm-text-color !default; +$dm-table-zebra-color: lighten($dm-background-color, 4%) !default; +$dm-table-header-bg-color: lighten($dm-background-color, 10%) !default; +$dm-table-header-border: lighten($dm-background-color, 21%) !default; +$dm-table-border-color: $dm-border-color-01 !default; + + +// Syntax highlighting styles should be adjusted appropriately for every "skin" +// List of tokens: https://github.com/rouge-ruby/rouge/wiki/List-of-tokens +// Some colors come from Material Theme Darker: +// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/settings/specific/darker-hc.ts +// https://github.com/material-theme/vsc-material-theme/blob/master/scripts/generator/color-set.ts +// ---------------------------------------------------------------------------- + +@mixin dm-highlight { + .highlight { + .c { color: #545454; font-style: italic } // Comment + .err { color: #f07178; background-color: #e3d2d2 } // Error + .k { color: #89DDFF; font-weight: bold } // Keyword + .o { font-weight: bold } // Operator + .cm { color: #545454; font-style: italic } // Comment.Multiline + .cp { color: #545454; font-weight: bold } // Comment.Preproc + .c1 { color: #545454; font-style: italic } // Comment.Single + .cs { color: #545454; font-weight: bold; font-style: italic } // Comment.Special + .gd { color: #000; background-color: #fdd } // Generic.Deleted + .gd .x { color: #000; background-color: #faa } // Generic.Deleted.Specific + .ge { font-style: italic } // Generic.Emph + .gr { color: #f07178 } // Generic.Error + .gh { color: #999 } // Generic.Heading + .gi { color: #000; background-color: #dfd } // Generic.Inserted + .gi .x { color: #000; background-color: #afa } // Generic.Inserted.Specific + .go { color: #888 } // Generic.Output + .gp { color: #555 } // Generic.Prompt + .gs { font-weight: bold } // Generic.Strong + .gu { color: #aaa } // Generic.Subheading + .gt { color: #f07178 } // Generic.Traceback + .kc { font-weight: bold } // Keyword.Constant + .kd { font-weight: bold } // Keyword.Declaration + .kp { font-weight: bold } // Keyword.Pseudo + .kr { font-weight: bold } // Keyword.Reserved + .kt { color: #FFCB6B; font-weight: bold } // Keyword.Type + .m { color: #F78C6C } // Literal.Number + .s { color: #C3E88D } // Literal.String + .na { color: #008080 } // Name.Attribute + .nb { color: #EEFFFF } // Name.Builtin + .nc { color: #FFCB6B; font-weight: bold } // Name.Class + .no { color: #008080 } // Name.Constant + .ni { color: #800080 } // Name.Entity + .ne { color: #900; font-weight: bold } // Name.Exception + .nf { color: #82AAFF; font-weight: bold } // Name.Function + .nn { color: #555 } // Name.Namespace + .nt { color: #FFCB6B } // Name.Tag + .nv { color: #EEFFFF } // Name.Variable + .ow { font-weight: bold } // Operator.Word + .w { color: #EEFFFF } // Text.Whitespace + .mf { color: #F78C6C } // Literal.Number.Float + .mh { color: #F78C6C } // Literal.Number.Hex + .mi { color: #F78C6C } // Literal.Number.Integer + .mo { color: #F78C6C } // Literal.Number.Oct + .sb { color: #C3E88D } // Literal.String.Backtick + .sc { color: #C3E88D } // Literal.String.Char + .sd { color: #C3E88D } // Literal.String.Doc + .s2 { color: #C3E88D } // Literal.String.Double + .se { color: #EEFFFF } // Literal.String.Escape + .sh { color: #C3E88D } // Literal.String.Heredoc + .si { color: #C3E88D } // Literal.String.Interpol + .sx { color: #C3E88D } // Literal.String.Other + .sr { color: #C3E88D } // Literal.String.Regex + .s1 { color: #C3E88D } // Literal.String.Single + .ss { color: #C3E88D } // Literal.String.Symbol + .bp { color: #999 } // Name.Builtin.Pseudo + .vc { color: #FFCB6B } // Name.Variable.Class + .vg { color: #EEFFFF } // Name.Variable.Global + .vi { color: #EEFFFF } // Name.Variable.Instance + .il { color: #F78C6C } // Literal.Number.Integer.Long + } +} + + +// Mode selection +// -------------- + + +// Classic skin (always light mode) +// Assign outside of the if construct to establish global variable scope + +$brand-color: $lm-brand-color; +$brand-color-light: $lm-brand-color-light; +$brand-color-dark: $lm-brand-color-dark; + +$site-title-color: $lm-site-title-color; + +$text-color: $lm-text-color; +$background-color: $lm-background-color; +$code-background-color: $lm-code-background-color; + +$link-base-color: $lm-link-base-color; +$link-visited-color: $lm-link-visited-color; +$link-hover-color: $lm-link-hover-color; + +$border-color-01: $lm-border-color-01; +$border-color-02: $lm-border-color-02; +$border-color-03: $lm-border-color-03; + +$table-text-color: $lm-table-text-color; +$table-zebra-color: $lm-table-zebra-color; +$table-header-bg-color: $lm-table-header-bg-color; +$table-header-border: $lm-table-header-border; +$table-border-color: $lm-table-border-color; + + +@if $color-scheme-auto { + + // Auto mode + + :root { + --minima-brand-color: #{$lm-brand-color}; + --minima-brand-color-light: #{$lm-brand-color-light}; + --minima-brand-color-dark: #{$lm-brand-color-dark}; + + --minima-site-title-color: #{$lm-site-title-color}; + + --minima-text-color: #{$lm-text-color}; + --minima-background-color: #{$lm-background-color}; + --minima-code-background-color: #{$lm-code-background-color}; + + --minima-link-base-color: #{$lm-link-base-color}; + --minima-link-visited-color: #{$lm-link-visited-color}; + --minima-link-hover-color: #{$lm-link-hover-color}; + + --minima-border-color-01: #{$lm-border-color-01}; + --minima-border-color-02: #{$lm-border-color-02}; + --minima-border-color-03: #{$lm-border-color-03}; + + --minima-table-text-color: #{$lm-table-text-color}; + --minima-table-zebra-color: #{$lm-table-zebra-color}; + --minima-table-header-bg-color: #{$lm-table-header-bg-color}; + --minima-table-header-border: #{$lm-table-header-border}; + --minima-table-border-color: #{$lm-table-border-color}; + } + + @include lm-highlight; + + @media (prefers-color-scheme: dark) { + :root { + --minima-brand-color: #{$dm-brand-color}; + --minima-brand-color-light: #{$dm-brand-color-light}; + --minima-brand-color-dark: #{$dm-brand-color-dark}; + + --minima-site-title-color: #{$dm-site-title-color}; + + --minima-text-color: #{$dm-text-color}; + --minima-background-color: #{$dm-background-color}; + --minima-code-background-color: #{$dm-code-background-color}; + + --minima-link-base-color: #{$dm-link-base-color}; + --minima-link-visited-color: #{$dm-link-visited-color}; + --minima-link-hover-color: #{$dm-link-hover-color}; + + --minima-border-color-01: #{$dm-border-color-01}; + --minima-border-color-02: #{$dm-border-color-02}; + --minima-border-color-03: #{$dm-border-color-03}; + + --minima-table-text-color: #{$dm-table-text-color}; + --minima-table-zebra-color: #{$dm-table-zebra-color}; + --minima-table-header-bg-color: #{$dm-table-header-bg-color}; + --minima-table-header-border: #{$dm-table-header-border}; + --minima-table-border-color: #{$dm-table-border-color}; + } + + @include dm-highlight; + } + + $brand-color: var(--minima-brand-color); + $brand-color-light: var(--minima-brand-color-light); + $brand-color-dark: var(--minima-brand-color-dark); + + $site-title-color: var(--minima-site-title-color); + + $text-color: var(--minima-text-color); + $background-color: var(--minima-background-color); + $code-background-color: var(--minima-code-background-color); + + $link-base-color: var(--minima-link-base-color); + $link-visited-color: var(--minima-link-visited-color); + $link-hover-color: var(--minima-link-hover-color); + + $border-color-01: var(--minima-border-color-01); + $border-color-02: var(--minima-border-color-02); + $border-color-03: var(--minima-border-color-03); + + $table-text-color: var(--minima-table-text-color); + $table-zebra-color: var(--minima-table-zebra-color); + $table-header-bg-color: var(--minima-table-header-bg-color); + $table-header-border: var(--minima-table-header-border); + $table-border-color: var(--minima-table-border-color); + + +} @else if $color-scheme-dark { + + // Dark skin (always dark mode) + + $brand-color: $dm-brand-color; + $brand-color-light: $dm-brand-color-light; + $brand-color-dark: $dm-brand-color-dark; + + $site-title-color: $dm-site-title-color; + + $text-color: $dm-text-color; + $background-color: $dm-background-color; + $code-background-color: $dm-code-background-color; + + $link-base-color: $dm-link-base-color; + $link-visited-color: $dm-link-visited-color; + $link-hover-color: $dm-link-hover-color; + + $border-color-01: $dm-border-color-01; + $border-color-02: $dm-border-color-02; + $border-color-03: $dm-border-color-03; + + $table-text-color: $dm-table-text-color; + $table-zebra-color: $dm-table-zebra-color; + $table-header-bg-color: $dm-table-header-bg-color; + $table-header-border: $dm-table-header-border; + $table-border-color: $dm-table-border-color; + + @include dm-highlight; + + +} @else { + + // Classic skin syntax highlighting + @include lm-highlight; + +} diff --git a/_sass/minima/skins/classic.scss b/_sass/minima/skins/classic.scss new file mode 100644 index 0000000..e61b078 --- /dev/null +++ b/_sass/minima/skins/classic.scss @@ -0,0 +1,5 @@ +@charset "utf-8"; + +$color-scheme-auto: false; +$color-scheme-dark: false; +@import "minima/skins/auto"; diff --git a/_sass/minima/skins/dark.scss b/_sass/minima/skins/dark.scss new file mode 100644 index 0000000..159226e --- /dev/null +++ b/_sass/minima/skins/dark.scss @@ -0,0 +1,5 @@ +@charset "utf-8"; + +$color-scheme-auto: false; +$color-scheme-dark: true; +@import "minima/skins/auto"; diff --git a/_sass/minima/skins/solarized-dark.scss b/_sass/minima/skins/solarized-dark.scss new file mode 100644 index 0000000..500dceb --- /dev/null +++ b/_sass/minima/skins/solarized-dark.scss @@ -0,0 +1,5 @@ +@charset "utf-8"; + +$sol-is-auto: false; +$sol-is-dark: true; +@import "minima/skins/solarized"; diff --git a/_sass/minima/skins/solarized-light.scss b/_sass/minima/skins/solarized-light.scss new file mode 100644 index 0000000..d2fc065 --- /dev/null +++ b/_sass/minima/skins/solarized-light.scss @@ -0,0 +1,4 @@ +@charset "utf-8"; + +$sol-is-auto: false; +@import "minima/skins/solarized"; diff --git a/_sass/minima/skins/solarized.scss b/_sass/minima/skins/solarized.scss new file mode 100644 index 0000000..7ac1f5a --- /dev/null +++ b/_sass/minima/skins/solarized.scss @@ -0,0 +1,201 @@ +@charset "utf-8"; + +// Solarized skin +// ============== +// Created by Sander Voerman <mailto:sander@savoerman.nl> using the Solarized +// color scheme by Ethan Schoonover <https://ethanschoonover.com/solarized>. + +// This style sheet implements three options for the minima.skin setting: +// "solarized-light" for light mode, "solarized-dark" for dark mode, and +// "solarized" for light or dark mode depending on user preference. +$sol-is-auto: true !default; +$sol-is-dark: false !default; + + +// Color scheme +// ------------ +// The inline comments show the canonical L*a*b values for each color. + +$sol-base03: #002b36; // 15 -12 -12 +$sol-base02: #073642; // 20 -12 -12 +$sol-base01: #586e75; // 45 -07 -07 +$sol-base00: #657b83; // 50 -07 -07 +$sol-base0: #839496; // 60 -06 -03 +$sol-base1: #93a1a1; // 65 -05 -02 +$sol-base2: #eee8d5; // 92 -00 10 +$sol-base3: #fdf6e3; // 97 00 10 +$sol-yellow: #b58900; // 60 10 65 +$sol-orange: #cb4b16; // 50 50 55 +$sol-red: #dc322f; // 50 65 45 +$sol-magenta: #d33682; // 50 65 -05 +$sol-violet: #6c71c4; // 50 15 -45 +$sol-blue: #268bd2; // 55 -10 -45 +$sol-cyan: #2aa198; // 60 -35 -05 +$sol-green: #859900; // 60 -20 65 + + +// Mixed colors +// ------------ +// While not part of the original Solarized base tones, these derived tones +// are meant to replicate the visual style of the classic skin. They should +// not be used in cases where sufficiently contrasting colors are needed. + +$sol-light-mix1: mix($sol-base1, $sol-base3); +$sol-light-mix2: mix($sol-blue, $sol-base00); +$sol-light-mix3: mix($sol-base2, $sol-base3); +$sol-dark-mix1: mix($sol-base01, $sol-base03); +$sol-dark-mix2: mix($sol-blue, $sol-base0); +$sol-dark-mix3: mix($sol-base02, $sol-base03); + + +// Mode selection +// -------------- + +$sol-mono3: $sol-base3; +$sol-mono2: $sol-base2; +$sol-mono1: $sol-base1; +$sol-mono00: $sol-base00; +$sol-mono01: $sol-base01; +$sol-mix1: $sol-light-mix1; +$sol-mix2: $sol-light-mix2; +$sol-mix3: $sol-light-mix3; + +@if $sol-is-dark { + $sol-mono3: $sol-base03; + $sol-mono2: $sol-base02; + $sol-mono1: $sol-base01; + $sol-mono00: $sol-base0; + $sol-mono01: $sol-base1; + $sol-mix1: $sol-dark-mix1; + $sol-mix2: $sol-dark-mix2; + $sol-mix3: $sol-dark-mix3; +} + +@if $sol-is-auto { + :root { + --solarized-mono3: #{$sol-base3}; + --solarized-mono2: #{$sol-base2}; + --solarized-mono1: #{$sol-base1}; + --solarized-mono00: #{$sol-base00}; + --solarized-mono01: #{$sol-base01}; + --solarized-mix1: #{$sol-light-mix1}; + --solarized-mix2: #{$sol-light-mix2}; + --solarized-mix3: #{$sol-light-mix3}; + } + + @media (prefers-color-scheme: dark) { + :root { + --solarized-mono3: #{$sol-base03}; + --solarized-mono2: #{$sol-base02}; + --solarized-mono1: #{$sol-base01}; + --solarized-mono00: #{$sol-base0}; + --solarized-mono01: #{$sol-base1}; + --solarized-mix1: #{$sol-dark-mix1}; + --solarized-mix2: #{$sol-dark-mix2}; + --solarized-mix3: #{$sol-dark-mix3}; + } + } + + $sol-mono3: var(--solarized-mono3); + $sol-mono2: var(--solarized-mono2); + $sol-mono1: var(--solarized-mono1); + $sol-mono00: var(--solarized-mono00); + $sol-mono01: var(--solarized-mono01); + $sol-mix1: var(--solarized-mix1); + $sol-mix2: var(--solarized-mix2); + $sol-mix3: var(--solarized-mix3); +} + + +// Minima color variables +// ---------------------- + +$brand-color: $sol-mono1 !default; +$brand-color-light: $sol-mix1 !default; +$brand-color-dark: $sol-mono00 !default; + +$site-title-color: $sol-mono00 !default; + +$text-color: $sol-mono01 !default; +$background-color: $sol-mono3 !default; +$code-background-color: $sol-mono2 !default; + +$link-base-color: $sol-blue !default; +$link-visited-color: $sol-mix2 !default; +$link-hover-color: $sol-mono00 !default; + +$border-color-01: $brand-color-light !default; +$border-color-02: $sol-mono1 !default; +$border-color-03: $sol-mono00 !default; + +$table-text-color: $sol-mono00 !default; +$table-zebra-color: $sol-mix3 !default; +$table-header-bg-color: $sol-mono2 !default; +$table-header-border: $sol-mono1 !default; +$table-border-color: $sol-mono1 !default; + + +// Syntax highlighting styles +// -------------------------- + +.highlight { + .c { color: $sol-mono1; font-style: italic } // Comment + .err { color: $sol-red } // Error + .k { color: $sol-mono01; font-weight: bold } // Keyword + .o { color: $sol-mono01; font-weight: bold } // Operator + .cm { color: $sol-mono1; font-style: italic } // Comment.Multiline + .cp { color: $sol-mono1; font-weight: bold } // Comment.Preproc + .c1 { color: $sol-mono1; font-style: italic } // Comment.Single + .cs { color: $sol-mono1; font-weight: bold; font-style: italic } // Comment.Special + .gd { color: $sol-red } // Generic.Deleted + .gd .x { color: $sol-red } // Generic.Deleted.Specific + .ge { color: $sol-mono00; font-style: italic } // Generic.Emph + .gr { color: $sol-red } // Generic.Error + .gh { color: $sol-mono1 } // Generic.Heading + .gi { color: $sol-green } // Generic.Inserted + .gi .x { color: $sol-green } // Generic.Inserted.Specific + .go { color: $sol-mono00 } // Generic.Output + .gp { color: $sol-mono00 } // Generic.Prompt + .gs { color: $sol-mono01; font-weight: bold } // Generic.Strong + .gu { color: $sol-mono1 } // Generic.Subheading + .gt { color: $sol-red } // Generic.Traceback + .kc { color: $sol-mono01; font-weight: bold } // Keyword.Constant + .kd { color: $sol-mono01; font-weight: bold } // Keyword.Declaration + .kp { color: $sol-mono01; font-weight: bold } // Keyword.Pseudo + .kr { color: $sol-mono01; font-weight: bold } // Keyword.Reserved + .kt { color: $sol-violet; font-weight: bold } // Keyword.Type + .m { color: $sol-cyan } // Literal.Number + .s { color: $sol-magenta } // Literal.String + .na { color: $sol-cyan } // Name.Attribute + .nb { color: $sol-blue } // Name.Builtin + .nc { color: $sol-violet; font-weight: bold } // Name.Class + .no { color: $sol-cyan } // Name.Constant + .ni { color: $sol-violet } // Name.Entity + .ne { color: $sol-violet; font-weight: bold } // Name.Exception + .nf { color: $sol-blue; font-weight: bold } // Name.Function + .nn { color: $sol-mono00 } // Name.Namespace + .nt { color: $sol-blue } // Name.Tag + .nv { color: $sol-cyan } // Name.Variable + .ow { color: $sol-mono01; font-weight: bold } // Operator.Word + .w { color: $sol-mono1 } // Text.Whitespace + .mf { color: $sol-cyan } // Literal.Number.Float + .mh { color: $sol-cyan } // Literal.Number.Hex + .mi { color: $sol-cyan } // Literal.Number.Integer + .mo { color: $sol-cyan } // Literal.Number.Oct + .sb { color: $sol-magenta } // Literal.String.Backtick + .sc { color: $sol-magenta } // Literal.String.Char + .sd { color: $sol-magenta } // Literal.String.Doc + .s2 { color: $sol-magenta } // Literal.String.Double + .se { color: $sol-magenta } // Literal.String.Escape + .sh { color: $sol-magenta } // Literal.String.Heredoc + .si { color: $sol-magenta } // Literal.String.Interpol + .sx { color: $sol-magenta } // Literal.String.Other + .sr { color: $sol-green } // Literal.String.Regex + .s1 { color: $sol-magenta } // Literal.String.Single + .ss { color: $sol-magenta } // Literal.String.Symbol + .bp { color: $sol-mono1 } // Name.Builtin.Pseudo + .vc { color: $sol-cyan } // Name.Variable.Class + .vg { color: $sol-cyan } // Name.Variable.Global + .vi { color: $sol-cyan } // Name.Variable.Instance + .il { color: $sol-cyan } // Literal.Number.Integer.Long +} @@ -4,7 +4,7 @@ title: About permalink: /about/ --- -Hi, my name is Bradley Taunt. I'm a designer/developer hybrid helping software companies improve their user experience and ship more performant products. +Hi, my name is Bradley Taunt. I'm a designer/developer hybrid helping software companies improve their user experience and ship more performant products. Currently making search engine results data more accessible at [SerpApi](https://serpapi.com). I also actively maintain several [open source projects](/projects). diff --git a/assets/css/style.scss b/assets/css/style.scss new file mode 100644 index 0000000..0d1fce9 --- /dev/null +++ b/assets/css/style.scss @@ -0,0 +1,7 @@ +--- +# Only the main Sass file needs front matter (the dashes are enough) +--- + +@import + "minima/skins/{{ site.minima.skin | default: 'classic' }}", + "minima/initialize"; diff --git a/assets/minima-social-icons.liquid b/assets/minima-social-icons.liquid new file mode 100644 index 0000000..d2951fa --- /dev/null +++ b/assets/minima-social-icons.liquid @@ -0,0 +1,18 @@ +--- +permalink: /assets/minima-social-icons.svg +--- + +<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> +{% comment %} + Iterate through {{ site.minima.social_links }} and render platform related SVG-symbol + unless the platform is "rss" because we need the "rss" symbol for the `Subscribe` link + in the footer and therefore inject the "rss" icon outside the iteration loop. +{% endcomment %} +{% for entry in site.minima.social_links %} + {%- assign symbol_id = entry.platform -%} + {%- unless symbol_id == "rss" -%} + {%- include svg_symbol.html key = symbol_id -%} + {% endunless %} +{%- endfor -%} + {%- include svg_symbol.html key = "rss" -%} +</svg> diff --git a/colophon.md b/colophon.md index b3c50e2..fce9d5d 100644 --- a/colophon.md +++ b/colophon.md @@ -4,7 +4,7 @@ title: Colophon permalink: /colophon/ --- -This website is a collection of living, breathing documents. As I mention on the homepage, this place is better referred to as an online [brain dump](/dump). It might change over time. Styles might come and go. I can't help that, since tinkering with my personal blog is something I am very fond of. It's almost therapeutic. +This website is a collection of living, breathing documents. As I mention on the homepage, this place is better referred to as an online [brain dump](/posts/dump). It might change over time. Styles might come and go. I can't help that, since tinkering with my personal blog is something I am very fond of. It's almost therapeutic. For those interested I try to keep the details of the blog up-to-date with the information below: @@ -1,6 +1,31 @@ --- -# Feel free to add content and custom Front Matter to this file. -# To modify the layout, see https://jekyllrb.com/docs/themes/#overriding-theme-defaults - layout: home --- + +# Designer, developer, hardware tinkerer, open source advocate, consumer of dark roast coffee, and writer of very long sentences. + +Hi, my name is Bradley Taunt. I'm a designer/developer hybrid helping software companies improve their user experience and ship more performant products. Currently making search engine results data more accessible at [SerpApi](https://serpapi.com). + +I also actively maintain several [open source projects](/projects). + +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). + +### Skills & Languages + +Core programming languages are HTML, CSS, JavaScript, and Ruby. For design work, my preferred tools are Sketch, GIMP, and Figma. 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)<br> Common performance and accessibility issues caused by using hamburger menus. + +[Better Search Results](https://search.bt.ht)<br> Rethinking the UX flow of modern search engines. + +[My Coffee Maker Just Makes Coffee](/posts/one-thing)<br> How products should focus on doing *one thing* very well. + +[Blog Anonymously](https://anon.btxx.org)<br>A basic starting point for those wishing to blog privately. + +--- + +## Latest Posts diff --git a/posts.md b/posts.md new file mode 100644 index 0000000..fbd68e5 --- /dev/null +++ b/posts.md @@ -0,0 +1,5 @@ +--- +layout: all_posts +title: Posts +permalink: /posts/ +--- @@ -12,10 +12,10 @@ I'm proud to support open source products and privacy-respecting communities. Th |Service|Cost/year| |-------|--------------| -|[NearlyFreeSpeech](https://nearlyfreespeech.net)<br>Domains (5 total)|~$75| +|[NearlyFreeSpeech](https://nearlyfreespeech.net)<br>Domains (5), web hosting & personal code forge|~$125| |[Migadu](https://migadu.com)<br>Email service|$19| |[Mullvad](https://mullvad.net)<br>Privacy focused VPN|$60| -|[NearlyFreeSpeech](https://nearlyfreespeech.net)<br>Web hosting|~$50| +|[Sourcehut](https://sourcehut.org)<br>Open source code forge|~$30| ## Work Laptop @@ -6,55 +6,56 @@ permalink: /wiki/ This is the homepage for my personal wiki. All sub-directories are listed below. This wiki is a growing set of documents, so things may change often. -## Software +### Software -* [[wiki/alpine-linux]] -* [[wiki/dotfiles]] -* [[wiki/openbsd]] -* [[wiki/qutebrowser]] -* [[wiki/safari]] -* [[wiki/scripts]] -* [[wiki/sublime-text]] -* [[wiki/ubuntu]] +- [Alpine Linux](/wiki/alpine-linux) +- [Dotfiles](/wiki/dotfiles) +- [OpenBSD](/wiki/openbsd) +- [Qutebrowser](/wiki/qutebrowser) +- [Safari](/wiki/safari) +- [Scripts](/wiki/scripts) +- [Sublime Text](/wiki/sublime-text) +- [Ubuntu](/wiki/ubuntu) --- -## Hardware +### Hardware -* [[wiki/xbox]] -* [[wiki/ps2]] +- [Xbox](/wiki/xbox) +- [PS2](/wiki/ps2) --- -## Version Control Systems +### Version Control Systems -* [[wiki/cgit]] +- [cgit](/wiki/cgit) --- -## ikiwiki +### ikiwiki The default documentation on using ikiwiki: -* [[ikiwiki/formatting]] -* [[ikiwiki/wikilink]] -* [[ikiwiki/subpage]] -* [[ikiwiki/pagespec]] -* [[ikiwiki/directive]] -* [[ikiwiki/markdown]] -* [[ikiwiki/openid]] -* [[ikiwiki/searching]] -* [[templates]] +- [Formatting](/ikiwiki/formatting) +- [Wikilink](/ikiwiki/wikilink) +- [Subpage](/ikiwiki/subpage) +- [Pagespec](/ikiwiki/pagespec) +- [Directive](/ikiwiki/directive) +- [Markdown](/ikiwiki/markdown) +- [OpenID](/ikiwiki/openid) +- [Searching](/ikiwiki/searching) +- [Templates](/templates) My own custom documentation for ikiwiki: -* [[ikiwiki/NearlyFreeSpeech]] -* [[ikiwiki/git]] -* [[ikiwiki/comments]] -* [[ikiwiki/search]] +- [NearlyFreeSpeech](/ikiwiki/NearlyFreeSpeech) +- [Git](/ikiwiki/git) +- [Comments](/ikiwiki/comments) +- [Search](/ikiwiki/search) -## WordPress +### WordPress + +- [Database Update](/wordpress/database_update) +- [NearlyFreeSpeech Setup](/wordpress/NearlyFreeSpeech_Setup) -* [[wordpress/database_update]] -* [[wordpress/NearlyFreeSpeech_Setup]] |
