commit 980231ca4ef6d732a36b578f6f79f56dfcd76f72 Author: Tommi Boom Date: Thu Sep 17 14:41:50 2020 +0200 website template clean start diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..a5a498a --- /dev/null +++ b/.gitignore @@ -0,0 +1,34 @@ +_site/ +.sass-cache/ +.jekyll-cache/ +.jekyll-metadata + +# Ignore ruby files +.ruby-version +.bundle +vendor + +# Numerous always-ignore extensions +*.diff +*.err +*.log +*.orig +*.rej +*.swo +*.swp +*.vi +*~ + +# OS or Editor folders +._* +.cache +.DS_Store +.idea +.project +.settings +.tmproj +.publish +*.esproj +nbproject +Thumbs.db +.vscode diff --git a/404.html b/404.html new file mode 100644 index 0000000..92dff5d --- /dev/null +++ b/404.html @@ -0,0 +1,34 @@ +--- +permalink: /404.html +layout: none +sitemap: false +--- + + + + + + 404 | XPLOSIONMIND + + + + +
+

404

+
page not found. Click anywhere to go back
+
+
+ + diff --git a/Gemfile b/Gemfile new file mode 100644 index 0000000..4bad9b6 --- /dev/null +++ b/Gemfile @@ -0,0 +1,29 @@ +source "https://rubygems.org" +# Hello! This is where you manage which Jekyll version is used to run. +# When you want to use a different version, change it below, save the +# file and run `bundle install`. Run Jekyll with `bundle exec`, like so: +# +# bundle exec jekyll serve +# +# This will help ensure the proper Jekyll version is running. +# Happy Jekylling! +gem "jekyll" +# If you want to use GitHub Pages, remove the "gem "jekyll"" above and +# uncomment the line below. To upgrade, run `bundle update github-pages`. +# gem "github-pages", group: :jekyll_plugins +# If you have any plugins, put them here! +group :jekyll_plugins do + gem "jekyll-feed" + gem "jekyll-seo-tag" + gem "jekyll-sitemap" + gem "jekyll-last-modified-at" + gem "jekyll-target-blank" + gem "jekyll-watch" +end + +# Windows and JRuby does not include zoneinfo files, so bundle the tzinfo-data gem +# and associated library. +install_if -> { RUBY_PLATFORM =~ %r!mingw|mswin|java! } do + gem "tzinfo" + gem "tzinfo-data" +end diff --git a/Gemfile.lock b/Gemfile.lock new file mode 100644 index 0000000..d8cbb21 --- /dev/null +++ b/Gemfile.lock @@ -0,0 +1,95 @@ +GEM + remote: https://rubygems.org/ + specs: + addressable (2.7.0) + public_suffix (>= 2.0.2, < 5.0) + colorator (1.1.0) + concurrent-ruby (1.1.7) + em-websocket (0.5.1) + eventmachine (>= 0.12.9) + http_parser.rb (~> 0.6.0) + eventmachine (1.2.7) + ffi (1.13.1) + forwardable-extended (2.6.0) + http_parser.rb (0.6.0) + i18n (1.8.5) + concurrent-ruby (~> 1.0) + jekyll (4.1.1) + addressable (~> 2.4) + colorator (~> 1.0) + em-websocket (~> 0.5) + i18n (~> 1.0) + jekyll-sass-converter (~> 2.0) + jekyll-watch (~> 2.0) + kramdown (~> 2.1) + kramdown-parser-gfm (~> 1.0) + liquid (~> 4.0) + mercenary (~> 0.4.0) + pathutil (~> 0.9) + rouge (~> 3.0) + safe_yaml (~> 1.0) + terminal-table (~> 1.8) + jekyll-feed (0.15.0) + jekyll (>= 3.7, < 5.0) + jekyll-last-modified-at (1.3.0) + jekyll (>= 3.7, < 5.0) + posix-spawn (~> 0.3.9) + jekyll-sass-converter (2.1.0) + sassc (> 2.0.1, < 3.0) + jekyll-seo-tag (2.6.1) + jekyll (>= 3.3, < 5.0) + jekyll-sitemap (1.4.0) + jekyll (>= 3.7, < 5.0) + jekyll-target-blank (2.0.0) + jekyll (>= 3.0, < 5.0) + nokogiri (~> 1.10) + jekyll-watch (2.2.1) + listen (~> 3.0) + kramdown (2.3.0) + rexml + kramdown-parser-gfm (1.1.0) + kramdown (~> 2.0) + liquid (4.0.3) + listen (3.2.1) + rb-fsevent (~> 0.10, >= 0.10.3) + rb-inotify (~> 0.9, >= 0.9.10) + mercenary (0.4.0) + mini_portile2 (2.4.0) + nokogiri (1.10.10) + mini_portile2 (~> 2.4.0) + pathutil (0.16.2) + forwardable-extended (~> 2.6) + posix-spawn (0.3.15) + public_suffix (4.0.6) + rb-fsevent (0.10.4) + rb-inotify (0.10.1) + ffi (~> 1.0) + rexml (3.2.4) + rouge (3.23.0) + safe_yaml (1.0.5) + sassc (2.4.0) + ffi (~> 1.9) + terminal-table (1.8.0) + unicode-display_width (~> 1.1, >= 1.1.1) + tzinfo (2.0.2) + concurrent-ruby (~> 1.0) + tzinfo-data (1.2020.1) + tzinfo (>= 1.0.0) + unicode-display_width (1.7.0) + +PLATFORMS + ruby + +DEPENDENCIES + jekyll + jekyll-feed + jekyll-last-modified-at + jekyll-seo-tag + jekyll-sitemap + jekyll-target-blank + jekyll-watch + tzinfo + tzinfo-data + +BUNDLED WITH + 2.1.4 diff --git a/README.md b/README.md new file mode 100644 index 0000000..a27bf07 --- /dev/null +++ b/README.md @@ -0,0 +1,9 @@ +[![Netlify Status](https://api.netlify.com/api/v1/badges/c7f3a969-424a-450b-8636-2d477af82e76/deploy-status)](https://app.netlify.com/sites/xplosionmind/deploys) + +# XPLOSIONMIND + +This is exactly a web representation of the mess inside Tommi’s mind. + +For technical issues and features implementation, check the [roadmap page](https://tommi.space/roadmap). + +To read about the creation of this website check the [blog post](https://tommi.space/genesi) or the [step-by-step guide](https://tommi.space/themakingof) diff --git a/SECURITY.md b/SECURITY.md new file mode 100644 index 0000000..3b6383c --- /dev/null +++ b/SECURITY.md @@ -0,0 +1,3 @@ +# Security Policy + +Actually this should be just a basic static website. No tracking, no annoying stuff, no possible security breaches. Nevertheless, there's a tiny little part of back-end cloud computing if you subscribe to the newsletter. If you encounter any problem in this process, please send an email to tommiboom+website at protonmail dot com. diff --git a/_config.yml b/_config.yml new file mode 100644 index 0000000..3b3f3c9 --- /dev/null +++ b/_config.yml @@ -0,0 +1,111 @@ +title: xplosionmind +email: tommiboom@protonmail.com +description: >- # this means to ignore newlines until "baseurl:" + A web version of the mess inside Tommi Boom’s mind +baseurl: "" # the subpath of your site, e.g. /blog +url: "https://tommi.space" # the base hostname & protocol for your site, e.g. http://example.com +twitter_username: xplosionmind +github_username: xplosionmind +git_repository: "tommi.space" +future: true +profile: true +livereload: true +strict_front_matter: true + +collections: + posts: + excerpt_separator: "" + redirect_from: + - "/:date/:title" + - "/:categories/:title" + - "/:categories/:date/:title" + categories: + output: true + poetry: + output: true + stuff: + output: true + jar: + output: true + layout: "jar" + lang: "en" + redirect_from: "/:title" + toc: "true" + filinge: + output: true + +kramdown: + syntax_highlighter_opts: + default_lang: zsh + +plugins: + - jekyll-feed + - jekyll-seo-tag + - jekyll-sitemap + - jekyll-last-modified-at + - jekyll-target-blank + - jekyll-watch + +sass: + style: compressed + +permalink: "/:title" +ref: ":title" + +defaults: + - + scope: + path: "" + values: + layout: "wrapper" + ref: ":title" + lang: "en" + img: "/images/preview.gif" + primary: "#FCC920" + + - + scope: + path: "" + type: "categories" + values: + layout: "category" + permalink: "/:title" + + - + scope: + path: "" + type: "posts" + values: + layout: "post" + lang: "it" + permalink: "/:title" + excerpt_separator: "" + + - + scope: + path: "" + type: "poetry" + values: + layout: "poetry" + permalink: "/:title" + lang: "it" + + - + scope: + path: "" + type: "jar" + values: + layout: "jar" + lang: "en" + permalink: "/:title" + toc: "true" + + - + scope: + path: "" + type: "filinge" + values: + layout: "post" + lang: "it" + primary: "var(--green)" + style: "true" diff --git a/_includes/anchor-parser.html b/_includes/anchor-parser.html new file mode 100644 index 0000000..4a8b32f --- /dev/null +++ b/_includes/anchor-parser.html @@ -0,0 +1,110 @@ +{% capture headingsWorkspace %} + {% comment %} + Version 1.0.6 + https://github.com/allejo/jekyll-anchor-headings + + "Be the pull request you wish to see in the world." ~Ben Balter + + Usage: + {% include anchor_headings.html html=content %} + + Parameters: + * html (string) - the HTML of compiled markdown generated by kramdown in Jekyll + + Optional Parameters: + * beforeHeading (bool) : false - Set to true if the anchor should be placed _before_ the heading's content + * anchorAttrs (string) : '' - Any custom HTML attributes that will be added to the `` tag; you may NOT use `href`, `class` or `title`; + the `%heading%` placeholder is available + * anchorBody (string) : '' - The content that will be placed inside the anchor; the `%heading%` placeholder is available + * anchorClass (string) : '' - The class(es) that will be used for each anchor. Separate multiple classes with a space + * anchorTitle (string) : '' - The `title` attribute that will be used for anchors + * h_min (int) : 1 - The minimum header level to build an anchor for; any header lower than this value will be ignored + * h_max (int) : 6 - The maximum header level to build an anchor for; any header greater than this value will be ignored + * bodyPrefix (string) : '' - Anything that should be inserted inside of the heading tag _before_ its anchor and content + * bodySuffix (string) : '' - Anything that should be inserted inside of the heading tag _after_ its anchor and content + + Output: + The original HTML with the addition of anchors inside of all of the h1-h6 headings. + {% endcomment %} + + {% assign minHeader = include.h_min | default: 1 %} + {% assign maxHeader = include.h_max | default: 6 %} + {% assign beforeHeading = include.beforeHeading %} + {% assign nodes = include.html | split: ' + {% if headerLevel == 0 %} + + {% assign firstChunk = node | split: '>' | first %} + + + {% unless firstChunk contains '<' %} + {% capture node %}' | first }}>{% endcapture %} + {% assign header = _workspace[0] | replace: _hAttrToStrip, '' %} + + + {% capture anchor %}{% endcapture %} + + {% if html_id and headerLevel >= minHeader and headerLevel <= maxHeader %} + {% capture anchor %}href="#{{ html_id }}"{% endcapture %} + + {% if include.anchorClass %} + {% capture anchor %}{{ anchor }} class="{{ include.anchorClass }}"{% endcapture %} + {% endif %} + + {% if include.anchorTitle %} + {% capture anchor %}{{ anchor }} title="{{ include.anchorTitle | replace: '%heading%', header }}"{% endcapture %} + {% endif %} + + {% if include.anchorAttrs %} + {% capture anchor %}{{ anchor }} {{ include.anchorAttrs | replace: '%heading%', header }}{% endcapture %} + {% endif %} + + {% capture anchor %}{{ include.anchorBody | replace: '%heading%', header | default: '' }}{% endcapture %} + + + {% if beforeHeading %} + {% capture anchor %}{{ anchor }} {% endcapture %} + {% else %} + {% capture anchor %} {{ anchor }}{% endcapture %} + {% endif %} + {% endif %} + + {% capture new_heading %} + + +
+
+

Eccetto dove diversamente specificato, tutto quello che c’è in questo sito, compreso il codice sorgente, è protetto dalla licenza Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International.

+ +
+
+ + +{% else %} + + +{% endcase %} diff --git a/_includes/header.html b/_includes/header.html new file mode 100644 index 0000000..910e9df --- /dev/null +++ b/_includes/header.html @@ -0,0 +1,88 @@ + + + + {% case include.lang %} + {% when 'it' %} + + {% else %} + + {% endcase %} + diff --git a/_includes/toc.html b/_includes/toc.html new file mode 100644 index 0000000..6971739 --- /dev/null +++ b/_includes/toc.html @@ -0,0 +1,112 @@ +{% capture tocWorkspace %} + {% comment %} + Version 1.0.11 + https://github.com/allejo/jekyll-toc + + "...like all things liquid - where there's a will, and ~36 hours to spare, there's usually a/some way" ~jaybe + + Usage: + {% include toc.html html=content sanitize=true class="inline_toc" id="my_toc" h_min=2 h_max=3 %} + + Parameters: + * html (string) - the HTML of compiled markdown generated by kramdown in Jekyll + + Optional Parameters: + * sanitize (bool) : false - when set to true, the headers will be stripped of any HTML in the TOC + * class (string) : '' - a CSS class assigned to the TOC + * id (string) : '' - an ID to assigned to the TOC + * h_min (int) : 1 - the minimum TOC header level to use; any header lower than this value will be ignored + * h_max (int) : 6 - the maximum TOC header level to use; any header greater than this value will be ignored + * ordered (bool) : false - when set to true, an ordered list will be outputted instead of an unordered list + * item_class (string) : '' - add custom class(es) for each list item; has support for '%level%' placeholder, which is the current heading level + * baseurl (string) : '' - add a base url to the TOC links for when your TOC is on another page than the actual content + * anchor_class (string) : '' - add custom class(es) for each anchor element + * skipNoIDs (bool) : false - skip headers that do not have an `id` attribute + + Output: + An ordered or unordered list representing the table of contents of a markdown block. This snippet will only + generate the table of contents and will NOT output the markdown given to it + {% endcomment %} + + {% capture my_toc %}{% endcapture %} + {% assign orderedList = include.ordered | default: false %} + {% assign skipNoIDs = include.skipNoIDs | default: false %} + {% assign minHeader = include.h_min | default: 1 %} + {% assign maxHeader = include.h_max | default: 6 %} + {% assign nodes = include.html | split: ' maxHeader %} + {% continue %} + {% endif %} + + {% if firstHeader %} + {% assign firstHeader = false %} + {% assign minHeader = headerLevel %} + {% endif %} + + {% assign indentAmount = headerLevel | minus: minHeader %} + {% assign _workspace = node | split: '' | first }}>{% endcapture %} + {% assign header = _workspace[0] | replace: _hAttrToStrip, '' %} + + {% assign space = '' %} + {% for i in (1..indentAmount) %} + {% assign space = space | prepend: ' ' %} + {% endfor %} + + {% if include.item_class and include.item_class != blank %} + {% capture listItemClass %}{:.{{ include.item_class | replace: '%level%', headerLevel }}}{% endcapture %} + {% endif %} + + {% capture anchor_body %}{% if include.sanitize %}{{ header | strip_html }}{% else %}{{ header }}{% endif %}{% endcapture %} + {% capture anchor_body %}{{ anchor_body | replace: "|", "\|" }}{% endcapture %} + + {% if html_id %} + {% capture list_item %}[{{ anchor_body }}]({% if include.baseurl %}{{ include.baseurl }}{% endif %}#{{ html_id }}){% endcapture %} + {% else %} + {% capture list_item %}{{ anchor_body }}{% endcapture %} + {% endif %} + + {% capture my_toc %}{{ my_toc }} +{{ space }}{{ listModifier }} {{ listItemClass }} {{ list_item }}{% if include.anchor_class %}{:.{{ include.anchor_class }}}{% endif %}{% endcapture %} + {% endfor %} + + {% if include.class and include.class != blank %} + {% capture my_toc %}{:.{{ include.class }}} +{{ my_toc | lstrip }}{% endcapture %} + {% endif %} + + {% if include.id %} + {% capture my_toc %}{: #{{ include.id }}} +{{ my_toc | lstrip }}{% endcapture %} + {% endif %} +{% endcapture %}{% assign tocWorkspace = '' %}{{ my_toc | markdownify | strip }} diff --git a/_layouts/page.html b/_layouts/page.html new file mode 100644 index 0000000..65054a5 --- /dev/null +++ b/_layouts/page.html @@ -0,0 +1,32 @@ +--- +layout: wrapper +permalink: "/:title" +--- + +{% if page.toc == 'true' %} +
+
+

+ {% case page.lang %} + {% when 'it' %} + Indice dei contenuti + {% else %} + Table of contents + {% endcase %} +

+ {% include toc.html html=content h_min=2 %} +
+
+{% endif %} +
+
+
+ {% include anchor-parser.html html=content beforeHeading=true anchorBody='' anchorTitle='%heading%' h_min=2 %} +
+
+
diff --git a/_layouts/post.html b/_layouts/post.html new file mode 100644 index 0000000..651f411 --- /dev/null +++ b/_layouts/post.html @@ -0,0 +1,137 @@ +--- +layout: wrapper +permalink: "/:title" +--- + + +{% if page.toc == 'true' %} +
+
+

+ {% case page.lang %} + {% when 'it' %} + Indice dei contenuti + {% else %} + Table of contents + {% endcase %} +

+ {% include toc.html html=content h_min=2 %} +
+
+{% endif %} +
+
+
+ {% include anchor-parser.html html=content beforeHeading=true anchorBody='' anchorTitle='%heading%' h_min=2 %} +
+
+
+ + + +
+
+
+ {% case page.lang %} + {% when 'it' %} +
condividi questo post
+ {% else %} +
share this post
+ {% endcase %} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ + + +
+
+ +
+
+ +
+
+ +
+
+
diff --git a/_layouts/wrapper.html b/_layouts/wrapper.html new file mode 100644 index 0000000..60949df --- /dev/null +++ b/_layouts/wrapper.html @@ -0,0 +1,51 @@ + +{% if page.lang == 'it' %} + +{% else %} + +{% endif %} + + + +{% seo %} + +{{ page.title }} | XPLOSIONMIND + + + + + + + + + +{% if page.code == 'true' %} + + +{% endif %} +{% if page.style == 'true' %}{% endif %} + + + + + + + + + + + + + + + +{% include header.html lang=page.lang %} +{{ content }} +{% include footer.html lang=page.lang %} + + diff --git a/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold-Italic.woff b/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold-Italic.woff new file mode 100644 index 0000000..2fcfd7e Binary files /dev/null and b/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold-Italic.woff differ diff --git a/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold-Italic.woff2 b/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold-Italic.woff2 new file mode 100644 index 0000000..c16e5a3 Binary files /dev/null and b/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold-Italic.woff2 differ diff --git a/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold.woff b/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold.woff new file mode 100644 index 0000000..5d89550 Binary files /dev/null and b/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold.woff differ diff --git a/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold.woff2 b/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold.woff2 new file mode 100644 index 0000000..19fa40d Binary files /dev/null and b/fonts/Ubuntu-Mono/Ubuntu-Mono-Bold.woff2 differ diff --git a/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular-Italic.woff b/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular-Italic.woff new file mode 100644 index 0000000..105915e Binary files /dev/null and b/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular-Italic.woff differ diff --git a/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular-Italic.woff2 b/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular-Italic.woff2 new file mode 100644 index 0000000..a59fb74 Binary files /dev/null and b/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular-Italic.woff2 differ diff --git a/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular.woff b/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular.woff new file mode 100644 index 0000000..6da7987 Binary files /dev/null and b/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular.woff differ diff --git a/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular.woff2 b/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular.woff2 new file mode 100644 index 0000000..e724c45 Binary files /dev/null and b/fonts/Ubuntu-Mono/Ubuntu-Mono-Regular.woff2 differ diff --git a/fonts/Ubuntu-Mono/ubuntu-mono.css b/fonts/Ubuntu-Mono/ubuntu-mono.css new file mode 100644 index 0000000..629b4ff --- /dev/null +++ b/fonts/Ubuntu-Mono/ubuntu-mono.css @@ -0,0 +1,33 @@ +@font-face { + font-family: 'Ubuntu Mono'; + font-style: normal; + font-weight: 400; + font-display: swap; + src: url("Ubuntu-Mono-Regular.woff2") format("woff2"), + url("Ubuntu-Mono-Regular.woff") format("woff"); +} +@font-face { + font-family: 'Ubuntu Mono'; + font-style: italic; + font-weight: 400; + font-display: swap; + src: url("Ubuntu-Mono-Regular-Italic.woff2") format("woff2"), + url("Ubuntu-Mono-Regular-Italic.woff") format("woff"); +} + +@font-face { + font-family: 'Ubuntu Mono'; + font-style: normal; + font-weight: 700; + font-display: swap; + src: url("Ubuntu-Mono-Bold.woff2") format("woff2"), + url("Ubuntu-Mono-Bold.woff") format("woff"); +} +@font-face { + font-family: 'Ubuntu Mono'; + font-style: italic; + font-weight: 700; + font-display: swap; + src: url("Ubuntu-Mono-Bold-Italic.woff2") format("woff2"), + url("Ubuntu-Mono-Bold-Italic.woff") format("woff"); +} diff --git a/fonts/inter/Inter-Black.woff b/fonts/inter/Inter-Black.woff new file mode 100644 index 0000000..ec3adb3 Binary files /dev/null and b/fonts/inter/Inter-Black.woff differ diff --git a/fonts/inter/Inter-Black.woff2 b/fonts/inter/Inter-Black.woff2 new file mode 100644 index 0000000..4991ba7 Binary files /dev/null and b/fonts/inter/Inter-Black.woff2 differ diff --git a/fonts/inter/Inter-BlackItalic.woff b/fonts/inter/Inter-BlackItalic.woff new file mode 100644 index 0000000..9ba2d96 Binary files /dev/null and b/fonts/inter/Inter-BlackItalic.woff differ diff --git a/fonts/inter/Inter-BlackItalic.woff2 b/fonts/inter/Inter-BlackItalic.woff2 new file mode 100644 index 0000000..526d4a5 Binary files /dev/null and b/fonts/inter/Inter-BlackItalic.woff2 differ diff --git a/fonts/inter/Inter-Bold.woff b/fonts/inter/Inter-Bold.woff new file mode 100644 index 0000000..44377dc Binary files /dev/null and b/fonts/inter/Inter-Bold.woff differ diff --git a/fonts/inter/Inter-Bold.woff2 b/fonts/inter/Inter-Bold.woff2 new file mode 100644 index 0000000..8d317af Binary files /dev/null and b/fonts/inter/Inter-Bold.woff2 differ diff --git a/fonts/inter/Inter-BoldItalic.woff b/fonts/inter/Inter-BoldItalic.woff new file mode 100644 index 0000000..c7a9e89 Binary files /dev/null and b/fonts/inter/Inter-BoldItalic.woff differ diff --git a/fonts/inter/Inter-BoldItalic.woff2 b/fonts/inter/Inter-BoldItalic.woff2 new file mode 100644 index 0000000..e2c427e Binary files /dev/null and b/fonts/inter/Inter-BoldItalic.woff2 differ diff --git a/fonts/inter/Inter-ExtraBold.woff b/fonts/inter/Inter-ExtraBold.woff new file mode 100644 index 0000000..acec755 Binary files /dev/null and b/fonts/inter/Inter-ExtraBold.woff differ diff --git a/fonts/inter/Inter-ExtraBold.woff2 b/fonts/inter/Inter-ExtraBold.woff2 new file mode 100644 index 0000000..f93c5fb Binary files /dev/null and b/fonts/inter/Inter-ExtraBold.woff2 differ diff --git a/fonts/inter/Inter-ExtraBoldItalic.woff b/fonts/inter/Inter-ExtraBoldItalic.woff new file mode 100644 index 0000000..dea1ca8 Binary files /dev/null and b/fonts/inter/Inter-ExtraBoldItalic.woff differ diff --git a/fonts/inter/Inter-ExtraBoldItalic.woff2 b/fonts/inter/Inter-ExtraBoldItalic.woff2 new file mode 100644 index 0000000..750e916 Binary files /dev/null and b/fonts/inter/Inter-ExtraBoldItalic.woff2 differ diff --git a/fonts/inter/Inter-ExtraLight.woff b/fonts/inter/Inter-ExtraLight.woff new file mode 100644 index 0000000..b734701 Binary files /dev/null and b/fonts/inter/Inter-ExtraLight.woff differ diff --git a/fonts/inter/Inter-ExtraLight.woff2 b/fonts/inter/Inter-ExtraLight.woff2 new file mode 100644 index 0000000..73bbdac Binary files /dev/null and b/fonts/inter/Inter-ExtraLight.woff2 differ diff --git a/fonts/inter/Inter-ExtraLightItalic.woff b/fonts/inter/Inter-ExtraLightItalic.woff new file mode 100644 index 0000000..e6e3408 Binary files /dev/null and b/fonts/inter/Inter-ExtraLightItalic.woff differ diff --git a/fonts/inter/Inter-ExtraLightItalic.woff2 b/fonts/inter/Inter-ExtraLightItalic.woff2 new file mode 100644 index 0000000..1f4e550 Binary files /dev/null and b/fonts/inter/Inter-ExtraLightItalic.woff2 differ diff --git a/fonts/inter/Inter-Italic.woff b/fonts/inter/Inter-Italic.woff new file mode 100644 index 0000000..a2c1c6d Binary files /dev/null and b/fonts/inter/Inter-Italic.woff differ diff --git a/fonts/inter/Inter-Italic.woff2 b/fonts/inter/Inter-Italic.woff2 new file mode 100644 index 0000000..b79fb07 Binary files /dev/null and b/fonts/inter/Inter-Italic.woff2 differ diff --git a/fonts/inter/Inter-Light.woff b/fonts/inter/Inter-Light.woff new file mode 100644 index 0000000..17a4ece Binary files /dev/null and b/fonts/inter/Inter-Light.woff differ diff --git a/fonts/inter/Inter-Light.woff2 b/fonts/inter/Inter-Light.woff2 new file mode 100644 index 0000000..830144f Binary files /dev/null and b/fonts/inter/Inter-Light.woff2 differ diff --git a/fonts/inter/Inter-LightItalic.woff b/fonts/inter/Inter-LightItalic.woff new file mode 100644 index 0000000..00660a7 Binary files /dev/null and b/fonts/inter/Inter-LightItalic.woff differ diff --git a/fonts/inter/Inter-LightItalic.woff2 b/fonts/inter/Inter-LightItalic.woff2 new file mode 100644 index 0000000..e1281fe Binary files /dev/null and b/fonts/inter/Inter-LightItalic.woff2 differ diff --git a/fonts/inter/Inter-Medium.woff b/fonts/inter/Inter-Medium.woff new file mode 100644 index 0000000..19f2a39 Binary files /dev/null and b/fonts/inter/Inter-Medium.woff differ diff --git a/fonts/inter/Inter-Medium.woff2 b/fonts/inter/Inter-Medium.woff2 new file mode 100644 index 0000000..0fbeddc Binary files /dev/null and b/fonts/inter/Inter-Medium.woff2 differ diff --git a/fonts/inter/Inter-MediumItalic.woff b/fonts/inter/Inter-MediumItalic.woff new file mode 100644 index 0000000..17d47a3 Binary files /dev/null and b/fonts/inter/Inter-MediumItalic.woff differ diff --git a/fonts/inter/Inter-MediumItalic.woff2 b/fonts/inter/Inter-MediumItalic.woff2 new file mode 100644 index 0000000..2501377 Binary files /dev/null and b/fonts/inter/Inter-MediumItalic.woff2 differ diff --git a/fonts/inter/Inter-Regular.woff b/fonts/inter/Inter-Regular.woff new file mode 100644 index 0000000..162d369 Binary files /dev/null and b/fonts/inter/Inter-Regular.woff differ diff --git a/fonts/inter/Inter-Regular.woff2 b/fonts/inter/Inter-Regular.woff2 new file mode 100644 index 0000000..6e90564 Binary files /dev/null and b/fonts/inter/Inter-Regular.woff2 differ diff --git a/fonts/inter/Inter-SemiBold.woff b/fonts/inter/Inter-SemiBold.woff new file mode 100644 index 0000000..7e22b4b Binary files /dev/null and b/fonts/inter/Inter-SemiBold.woff differ diff --git a/fonts/inter/Inter-SemiBold.woff2 b/fonts/inter/Inter-SemiBold.woff2 new file mode 100644 index 0000000..34556ec Binary files /dev/null and b/fonts/inter/Inter-SemiBold.woff2 differ diff --git a/fonts/inter/Inter-SemiBoldItalic.woff b/fonts/inter/Inter-SemiBoldItalic.woff new file mode 100644 index 0000000..e396e07 Binary files /dev/null and b/fonts/inter/Inter-SemiBoldItalic.woff differ diff --git a/fonts/inter/Inter-SemiBoldItalic.woff2 b/fonts/inter/Inter-SemiBoldItalic.woff2 new file mode 100644 index 0000000..e657a69 Binary files /dev/null and b/fonts/inter/Inter-SemiBoldItalic.woff2 differ diff --git a/fonts/inter/Inter-Thin.woff b/fonts/inter/Inter-Thin.woff new file mode 100644 index 0000000..8580ae1 Binary files /dev/null and b/fonts/inter/Inter-Thin.woff differ diff --git a/fonts/inter/Inter-Thin.woff2 b/fonts/inter/Inter-Thin.woff2 new file mode 100644 index 0000000..d4ec341 Binary files /dev/null and b/fonts/inter/Inter-Thin.woff2 differ diff --git a/fonts/inter/Inter-ThinItalic.woff b/fonts/inter/Inter-ThinItalic.woff new file mode 100644 index 0000000..e307dcd Binary files /dev/null and b/fonts/inter/Inter-ThinItalic.woff differ diff --git a/fonts/inter/Inter-ThinItalic.woff2 b/fonts/inter/Inter-ThinItalic.woff2 new file mode 100644 index 0000000..df838b5 Binary files /dev/null and b/fonts/inter/Inter-ThinItalic.woff2 differ diff --git a/fonts/inter/Inter-italic.var.woff2 b/fonts/inter/Inter-italic.var.woff2 new file mode 100644 index 0000000..682a315 Binary files /dev/null and b/fonts/inter/Inter-italic.var.woff2 differ diff --git a/fonts/inter/Inter-roman.var.woff2 b/fonts/inter/Inter-roman.var.woff2 new file mode 100644 index 0000000..332abdd Binary files /dev/null and b/fonts/inter/Inter-roman.var.woff2 differ diff --git a/fonts/inter/Inter.var.woff2 b/fonts/inter/Inter.var.woff2 new file mode 100644 index 0000000..bc40357 Binary files /dev/null and b/fonts/inter/Inter.var.woff2 differ diff --git a/fonts/inter/inter.css b/fonts/inter/inter.css new file mode 100644 index 0000000..d68c3f2 --- /dev/null +++ b/fonts/inter/inter.css @@ -0,0 +1,200 @@ +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 100; + font-display: swap; + src: url("Inter-Thin.woff2?v=3.14") format("woff2"), + url("Inter-Thin.woff?v=3.14") format("woff"); +} +@font-face { + font-family: 'Inter'; + font-style: italic; + font-weight: 100; + font-display: swap; + src: url("Inter-ThinItalic.woff2?v=3.14") format("woff2"), + url("Inter-ThinItalic.woff?v=3.14") format("woff"); +} + +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 200; + font-display: swap; + src: url("Inter-ExtraLight.woff2?v=3.14") format("woff2"), + url("Inter-ExtraLight.woff?v=3.14") format("woff"); +} +@font-face { + font-family: 'Inter'; + font-style: italic; + font-weight: 200; + font-display: swap; + src: url("Inter-ExtraLightItalic.woff2?v=3.14") format("woff2"), + url("Inter-ExtraLightItalic.woff?v=3.14") format("woff"); +} + +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 300; + font-display: swap; + src: url("Inter-Light.woff2?v=3.14") format("woff2"), + url("Inter-Light.woff?v=3.14") format("woff"); +} +@font-face { + font-family: 'Inter'; + font-style: italic; + font-weight: 300; + font-display: swap; + src: url("Inter-LightItalic.woff2?v=3.14") format("woff2"), + url("Inter-LightItalic.woff?v=3.14") format("woff"); +} + +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 400; + font-display: swap; + src: url("Inter-Regular.woff2?v=3.14") format("woff2"), + url("Inter-Regular.woff?v=3.14") format("woff"); +} +@font-face { + font-family: 'Inter'; + font-style: italic; + font-weight: 400; + font-display: swap; + src: url("Inter-Italic.woff2?v=3.14") format("woff2"), + url("Inter-Italic.woff?v=3.14") format("woff"); +} + +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 500; + font-display: swap; + src: url("Inter-Medium.woff2?v=3.14") format("woff2"), + url("Inter-Medium.woff?v=3.14") format("woff"); +} +@font-face { + font-family: 'Inter'; + font-style: italic; + font-weight: 500; + font-display: swap; + src: url("Inter-MediumItalic.woff2?v=3.14") format("woff2"), + url("Inter-MediumItalic.woff?v=3.14") format("woff"); +} + +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 600; + font-display: swap; + src: url("Inter-SemiBold.woff2?v=3.14") format("woff2"), + url("Inter-SemiBold.woff?v=3.14") format("woff"); +} +@font-face { + font-family: 'Inter'; + font-style: italic; + font-weight: 600; + font-display: swap; + src: url("Inter-SemiBoldItalic.woff2?v=3.14") format("woff2"), + url("Inter-SemiBoldItalic.woff?v=3.14") format("woff"); +} + +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 700; + font-display: swap; + src: url("Inter-Bold.woff2?v=3.14") format("woff2"), + url("Inter-Bold.woff?v=3.14") format("woff"); +} +@font-face { + font-family: 'Inter'; + font-style: italic; + font-weight: 700; + font-display: swap; + src: url("Inter-BoldItalic.woff2?v=3.14") format("woff2"), + url("Inter-BoldItalic.woff?v=3.14") format("woff"); +} + +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 800; + font-display: swap; + src: url("Inter-ExtraBold.woff2?v=3.14") format("woff2"), + url("Inter-ExtraBold.woff?v=3.14") format("woff"); +} +@font-face { + font-family: 'Inter'; + font-style: italic; + font-weight: 800; + font-display: swap; + src: url("Inter-ExtraBoldItalic.woff2?v=3.14") format("woff2"), + url("Inter-ExtraBoldItalic.woff?v=3.14") format("woff"); +} + +@font-face { + font-family: 'Inter'; + font-style: normal; + font-weight: 900; + font-display: swap; + src: url("Inter-Black.woff2?v=3.14") format("woff2"), + url("Inter-Black.woff?v=3.14") format("woff"); +} +@font-face { + font-family: 'Inter'; + font-style: italic; + font-weight: 900; + font-display: swap; + src: url("Inter-BlackItalic.woff2?v=3.14") format("woff2"), + url("Inter-BlackItalic.woff?v=3.14") format("woff"); +} + +/* ------------------------------------------------------- +Variable font. +Usage: + + html { font-family: 'Inter', sans-serif; } + @supports (font-variation-settings: normal) { + html { font-family: 'Inter var', sans-serif; } + } +*/ +@font-face { + font-family: 'Inter var'; + font-weight: 100 900; + font-display: swap; + font-style: normal; + font-named-instance: 'Regular'; + src: url("Inter-roman.var.woff2?v=3.14") format("woff2"); +} +@font-face { + font-family: 'Inter var'; + font-weight: 100 900; + font-display: swap; + font-style: italic; + font-named-instance: 'Italic'; + src: url("Inter-italic.var.woff2?v=3.14") format("woff2"); +} + + +/* -------------------------------------------------------------------------- +[EXPERIMENTAL] Multi-axis, single variable font. + +Slant axis is not yet widely supported (as of February 2019) and thus this +multi-axis single variable font is opt-in rather than the default. + +When using this, you will probably need to set font-variation-settings +explicitly, e.g. + + * { font-variation-settings: "slnt" 0deg } + .italic { font-variation-settings: "slnt" 10deg } + +*/ +@font-face { + font-family: 'Inter var experimental'; + font-weight: 100 900; + font-display: swap; + font-style: oblique 0deg 10deg; + src: url("Inter.var.woff2?v=3.14") format("woff2"); +} diff --git a/logos/cc.svg b/logos/cc.svg new file mode 100644 index 0000000..8b083f8 --- /dev/null +++ b/logos/cc.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/logos/cursor-hover.svg b/logos/cursor-hover.svg new file mode 100644 index 0000000..1399f30 --- /dev/null +++ b/logos/cursor-hover.svg @@ -0,0 +1 @@ + diff --git a/logos/cursor.svg b/logos/cursor.svg new file mode 100644 index 0000000..139c114 --- /dev/null +++ b/logos/cursor.svg @@ -0,0 +1 @@ + diff --git a/logos/favicon.svg b/logos/favicon.svg new file mode 100644 index 0000000..a3e4c43 --- /dev/null +++ b/logos/favicon.svg @@ -0,0 +1 @@ + diff --git a/logos/rss.svg b/logos/rss.svg new file mode 100644 index 0000000..1ea04da --- /dev/null +++ b/logos/rss.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/pages/home.html b/pages/home.html new file mode 100644 index 0000000..c9451ce --- /dev/null +++ b/pages/home.html @@ -0,0 +1,117 @@ +--- +title: home +permalink: /home +lang: en +ref: home +--- +
+
+ +
+
+ +

about this weirdo

+ +
+
+ a photo of me conducting a live show +
+
+
+

+ Hi, I’m Tommi. +
+
+ I’m an enthusiast. I love getting involved in everything which involves human interactions and I’m overthinking addicted. I’m an happy guy, but this doesn’t mean I don’t cry (just make me watch the right movie). +
+ The purpose of my whole exsistence is meeting all the people in the world. This is why, When I’m not studying, I try to be as busy as I can. This means, as the great Leibnitz said, that in my life I started everything and concluded nothing. You can know more about something of this messy everything by browsing around. If the stuff here is too confused and you get lost, well… welcome to my mind. Nevertheless, you may check out my old website, which is going to stay online for a little while. +
+ There’s nothing much left to say. Things that wander around in my head are written on my blog. +
+ Some useful data: +

    +
  • my Linkedin profile
  • +
  • my Curriculum Vitae
  • +
  • my email address is tommiboom [at] protonmail [dot] com. If possible, please use my PGP key (it’s not necessary if you use a ProtonMail address)
  • +
  • my username is xplosionmind everywhere. If you can’t find it, I’m not there. Links to my social media profiles are at the end of this page.
  • +
+
+ I tweet a lot. Too much. +

+
+
+
+ +{% for post in site.posts %} + {% if forloop.first == true %} +

Latest post

+
+
+
+ {{ post.title }} +
+
+
+

{{ post.title }}

+

{{ post.excerpt }}

+ +
+
+ {% endif %} +{% endfor %} + +

The Jar

+
+
+
+

There’s stuff I find out I wish I knew before, or stuff I just can’t keep from sharing but it’s not enough to make an article, or resources so great and useful that the whole world should know and use, or cool oddities I note and it’s nice to have them always ready at hand.

+

I take this things, I throw them into The Jar.

+

I hope it can be useful to you.

+
+
+
+ + + +

Featured stuff

+ +{% assign stuff = site.stuff | where: "lang", page.lang | where: "featured", true %} +{% for thing in stuff %} +
+
+
+ {{ thing.alt }} +
+
+
+ +

{{ thing.content }}

+ +
+
+{% endfor %} + +
diff --git a/pages/index.html b/pages/index.html new file mode 100644 index 0000000..5808e69 --- /dev/null +++ b/pages/index.html @@ -0,0 +1,30 @@ +--- +sitemap: false +layout: none +permalink: / +--- + + + + + + + + + + + + XPLOSIONMIND + + +
+
+

xplosionmind

+ italiano + English +
+
+ + + + diff --git a/pages/privacy-it.html b/pages/privacy-it.html new file mode 100644 index 0000000..043625d --- /dev/null +++ b/pages/privacy-it.html @@ -0,0 +1,24 @@ +--- +title: Privacy +ref: privacy +lang: it +permalink: /it/privacy +--- + +
+
+
+

Mi dispiace, non sono un avvocato e non ne so molto di queste cose, però come utente sono molto attento al rispetto della privacy online e per questo credo sia importante inserire sul sito anche una Privacy Policy.

+

In realtà non c’è nulla di cui preoccuparsi. Non registro alcun dato sugli utenti che navigano sul sito. L’unico registro che tengo è quello del numero degli utenti che visitano il sito con Goatcounter. Nessun link può tracciarti e, a meno che tu non ti metta in contatto con me, non sarò mai in grado di determinare se hai visitato il mio sito o meno.

+

Le statistiche e i dati sui visitatori del sito sono pubblici e consultabili liberamente qui.

+

Riguardo il mettersi in contatto: l’unico modo attraverso cui io posso ricevere tue informazioni è se decidi di iscriverti alla newsletter. In quel caso, possiederò unicamente il tuo indirizzo email e lo utilizzerò al solo fine di aggiornarti sui nuovi contenuti di questo sito. Non condividerò con lo nessuno eccetto il caso in cui ci fosse una richiesta da parte di autorità giudiziarie. Qualora me lo chiedessi, lo eliminerò prontamente dal mio database, in maniera definitiva.

+

Fine.

+
+
+
diff --git a/pages/zibenglish.html b/pages/zibenglish.html new file mode 100644 index 0000000..e71d4b4 --- /dev/null +++ b/pages/zibenglish.html @@ -0,0 +1,50 @@ +--- +title: "Zibaldone" +permalink: /zibenglish +lang: en +ref: blog +--- + + +{% for post in site.posts %} + +
+
+
+

{{ post.title }}

+
+
+ {{ post.date | date: "%d %B %Y" }} +
+
+
+ {% assign post-color = site.categories.title[post.categories] %} +
+
+{% endfor %} + +
+
diff --git a/style.css b/style.css new file mode 100644 index 0000000..38007f6 --- /dev/null +++ b/style.css @@ -0,0 +1,880 @@ +:root { + --black-ish: #111; + --white-ish: #E0E0E0; + --dark-grey: #222; + --light-grey: #BBB; + --yellow: #FCC920; + --blue: #3185FC; + --red: #D00; + --green: #20CE88; + --razzmatazz: #EC0868; + + --tiny: 0.2rem; + --tinyem: 0.2em; + --small: 0.5rem; + --smallem: 0.5em; + --lessthan-regular: 0.9rem; + --regular: 1.1rem; + --regular-em: 1.1em; + --morethan-regular: 1.3rem; + --morethan-regular-em: 1.3em; + --big: 1.6rem; + --big-em: 1.6em; + --bigger: 1.8rem; + --bigger-em: 1.8em; + --twice: 2.2rem; + --height: 3.1rem; + --mastodon: 4.4rem; + --margin: 6.5rem; + --trans: .5s; + --quicktrans: .1s; +} + +html { + box-sizing: border-box; + cursor: url(/logos/cursor.svg) 16 16, crosshair +} + +/* DARK THEME */ +body { + --background: var(--black-ish); + --background2: var(--dark-grey); + --text: var(--white-ish); + --link: var(--primary); + --primary: var(--yellow); + --secondary: var(--blue); + --grey: var(--dark-grey); + --other-grey: var(--light-grey); + + transition: var(--trans) +} + +/* LIGHT THEME */ +.light { + --background: white; + --background2: var(--white-ish); + --text: var(--black-ish); + --link: var(--secondary); + --primary: var(--blue); + --secondary: var(--razzmatazz); + --grey: var(--light-grey); + --other-grey: var(--dark-grey); + + transition: var(--trans) +} + +body { + background: var(--background); + font: var(--regular) Inter, Helvetica, "Helvetica Neue", sans-serif; + color: var(--text); + margin: 0; + overflow-wrap: break-word; + hyphens: auto +} + +*, *:before, *:after { + box-sizing: inherit +} +.row::before, +.row::after { + display: table; + content: " "; + clear: both +} +.one, +.one-third, +.two-thirds, +.one-fourth, +.half, +.two-fifths, +.four-fifths, +.one-fifth { + width: 100% +} +mark { + background: var(--primary); + color: var(--background); + font-weight: 500 +} +::selection { + color: var(--background); + background: var(--primary); +} +.top { + position: fixed; + bottom: 17rem; + right: 0; + z-index: 3 +} +.theme-toggle-button { + position: fixed; + bottom: 12rem; + right: 0; + z-index: 3 +} +li { + line-height: var(--morethan-regular-em) +} +ul li { + list-style: square; +} +ol li, ul li { + margin-bottom: var(--lessthan-regular) +} +ul li li { + list-style-type: "▫ "; +} +ul li li, ol li li { + margin-bottom: 0 +} +ul li li li { + list-style-type: "- " +} +.task-list-item { + list-style: none +} +.task-list-item-checkbox { + position: relative; + right: var(--lessthan-regular); + width: var(--regular); + height: var(--regular) +} +.embed-container { + --video--width: 1920; + --video--height: 1080; + + position: relative; + padding-bottom: calc(var(--video--height) / var(--video--width) * 100%); + overflow: hidden; + max-width: 100%; + background: transparent; +} +.embed-container iframe, +.embed-container object, +.embed-container embed { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} +.poetry, .post { + font: 400 var(--morethan-regular) "Merriweather", "Latin Modern Roman", Georgia, serif; + letter-spacing: 0.03rem; +} +.poetry p, .post p { + line-height: var(--bigger-em) +} +strong, b { + font-weight: 700 +} +.post p:first-of-type::first-letter { + line-height: var(--morethan-regular); + font-size: 5em; + initial-letter: 3; + -webkit-initial-letter: 3 +} +.line { + height: var(--tiny); + background: var(--primary); + width: 20%; + margin: 0 auto +} +.date { + text-align: center +} +.warning { + background: var(--primary); + color: var(--background); + padding: var(--regular); + margin: var(--twice) 0 +} +.green { + background: var(--green); + color: black +} +.red { + background: var(--red) +} +.blue { + background: var(--blue); +} +.yellow { + background: var(--yellow); + color: black +} +.razzmatazz { + background: var(--razzmatazz) +} +.page-header h1 { + font-size: var(--mastodon) +} +.page-header { + margin-top: 6rem; + text-align: center; + margin-bottom: var(--mastodon) +} +.page-header p { + margin: 0 auto; + width: 80% +} +.toc { + margin: 0 10% var(--regular) +} +.toc ul li { + margin-bottom: var(--small) +} +.categories { + overflow-x: scroll; + overflow-y: hidden; + white-space: nowrap; + border: var(--tiny) solid var(--text); + padding: var(--tiny); + scroll-behavior: smooth; + height: var(--height); + width: calc(100% - 5.8rem) +} +.categories::-webkit-scrollbar { + display: none +} +.topics-indicator { + font-size: var(--big); + line-height: var(--height); + text-transform: uppercase; + background: var(--text); + color: var(--background); + height: var(--height); + font-weight: 700; + width: 5.8rem +} +.category, .language, .link, .gallery { + display: inline-block; + text-transform: uppercase; + font-weight: 700; + font-size: var(--big); + height: 2.3rem; /* height - 4*tiny */ + line-height: 2.3rem; + transition: var(--quicktrans); + margin: 0; + padding: 0 var(--small) +} +.category:hover, .language:hover, .link:hover, +.category:focus, .language:focus, .link:focus { + transform: scale(1.1) +} +.language, .gallery { + color: var(--text); + border: var(--tiny) solid var(--text); + margin-bottom: var(--regular); + font-size: var(--bigger); + height: var(--height); + line-height: var(--bigger); + padding-top: var(--small) +} +.link { + height: var(--height); + line-height: var(--height); + padding-left: var(--lessthan-regular); + padding-right: var(--lessthan-regular); + margin-bottom: var(--regular) +} +.anchor, .anchor:visited { + color: var(--text); + height: var(--big); + position: absolute; + right: 101%; /* big + tiny*/ + transition: var(--trans); + top: .75rem +} +.highlight { + margin: 0 0 3.6rem +} +pre, code { + font: 400 1.1em "Ubuntu Mono", "Roboto Mono", "Fira Code", mono; + line-height: 1.2em; + transition: var(--trans) +} +pre { + overflow-x: scroll; + border: dashed var(--tiny); + margin: var(--bigger) 0; + padding: var(--morethan-regular) +} +pre code { + background: transparent +} +code { + padding: 2px var(--small); + background: var(--background2) +} +blockquote { + margin: var(--morethan-regular) 0 var(--morethan-regular) var(--height); + border-left: var(--tiny) dashed var(--secondary); + padding-left: var(--lessthan-regular); +} +blockquote p { + font-style: italic !important; + color: var(--other-grey) !important +} +td,th,tr { + border: solid .5px var(--light-grey) +} +th, td { + padding: var(--small) var(--lessthan-regular) +} +table { + overflow-x: scroll; + width: 100%; + border-collapse: collapse +} + +/* WHEN ELEMENT CENTERING IS NEEDED */ +.container { + top: 0; + left: 0; + width: 100%; + height: 100%; + position: absolute; + display: table; +} +#landing { + text-align: center; + display: table-cell; /* THE KEY TO VERTICAL ALIGNMENT */ + vertical-align: middle; + background: var(--primary); +} +#landing h1 { + color: var(--background); + letter-spacing: .1rem; + font-weight: 800; + margin-bottom: 0; + position: relative; + bottom: var(--regular) +} +#landing .language { + border-color: var(--background); + color: var(--primary); + background: var(--background); + margin: var(--tiny) var(--lessthan-regular) +} +.menu { + display: flex; +} +@media only screen and (min-width: 1000px) { + .one { + width: 70%; + margin-left: 15%; + } + .half { + width: 50%; + } + .one-third { + width: calc(100% / 3); + } + .one-fourth { + width: 25%; + } + .two-thirds { + width: calc(100% / 3 * 2); + } + .one-fifth { + width: 20%; + } + .two-fifths { + width: 40%; + } + .four-fifths { + width: 80%; + text-align: left; + } + .three-fourths { + width: 75%; + } + .column { + float: left; + } + .date { + text-align: right; + } + .line { + margin: auto; + width: 70%; + } + .nav-list { + display: block !important; + } +} +img { + width: 100%; + height: auto; + object-fit: cover; + display: block; +} +figure, .post>img { + margin: 0; + margin-bottom: var(--mastodon) +} + +figcaption { + font: italic var(--regular) Merriweather, serif; + text-align: center; + line-height: var(--regular); + margin-top: var(--lessthan-regular); + color: var(--other-grey) +} +figcaption:before { + content: "⇧ "; + font-style: normal; + font-weight: bold +} +.first { + margin-top: 3.6rem /* --height + margin (--small) */ +} +.right { + text-align: right; + margin-left: auto; + margin-right: 0; +} +p { + line-height: var(--big-em); + margin: var(--bigger-em) 0 +} +article { + font-size: var(--morethan-regular); + padding: var(--twice) 10% var(--mastodon) +} +.preview, .jar-preview, .poetry-preview { + color: var(--text); + padding: var(--bigger) 0; + transition: var(--trans) +} +.poetry-preview { + text-align: center +} +.jar-preview:hover { + background: var(--razzmatazz); + transition: var(--trans); + color: white +} +.jar-preview .line { + background: var(--razzmatazz) +} +.poetry-preview .line { + background: var(--blue); + margin: var(--tiny) auto; + width: 5% +} +.poetry-preview:hover { + background: var(--blue); + transition: var(--trans); + color: white +} +.preview:hover, .preview:focus { + background: var(--primary); + color: var(--background); + transition: var(--trans); + padding: var(--bigger) var(--lessthan-regular) +} +.jar-preview:hover, .jar-preview:focus { + background: var(--razzmatazz); + transition: var(--trans) +} +.jar-preview:hover .post-title { + padding-left: var(--bigger); + transition: var(--trans) +} +.jar-preview .post-title { + transition: var(--trans) +} +.jar-preview .half:nth-child(2) { + padding: 0 var(--regular) +} +.gallery-preview { + display: flex; + justify-content: space-evenly; + align-items: baseline; + align-content: space-around +} +.section-title { + background: var(--primary); + text-align: center; + height: var(--height); + line-height: var(--height); + color: var(--background) +} +.section-title:hover, +.section-title:focus { + outline: .35rem dashed var(--secondary) +} +h1, h2, h3, h4, h5, h6 { + text-transform: uppercase +} +article h2, article h3, article h4, article h5, article h6 { + font-family: Inter, Helvetica, "Helvetica Neue", sans; + background: var(--background); + position: sticky; + line-height: var(--height); + top: 3.6rem; + margin-bottom: 0; + transition: var(--quicktrans) +} +h2 .anchor, h3 .anchor, h4 .anchor, h5 .anchor, h6 .anchor { + opacity: 0; +} +h2:hover .anchor, h3:hover .anchor, h4:hover .anchor, h5:hover .anchor, h6:hover .anchor { + opacity: 1; +} +h1 { + color: var(--text); + font-size: var(--height); + text-decoration: none; + text-align: center +} +h2 { + font-size: var(--bigger); + margin: 0 +} +a, a:visited { + text-decoration: none; + color: var(--link) +} +a, button { + cursor: url(/logos/cursor-hover.svg) 16 16, pointer +} +p a:hover, p a:focus, article li a:hover, article li a:focus, .toc a { + outline: none !important; + border-bottom: 2px dashed +} +.stuff { + padding: 0 10%; + display: block; + text-align: center +} +.stuff img { + height: var(--margin); + width: auto; + max-width: 100%; + margin: var(--mastodon) auto var(--height); + display: inherit; + object-fit: contain +} +.stuff .category { + margin: var(--height) auto; + line-height: var(--height); + padding: 0.17rem var(--lessthan-regular) 0; + font-size: var(--morethan-regular) +} +.stuff p { + margin-bottom: var(--big) +} +.link-container { + text-align: center +} +.last-modified { + margin: 0 auto var(--twice); + text-align: center; + font-size: var(--lessthan-regular); + opacity: 0.8 +} +footer { + margin-bottom: var(--small); + width: 98%; + margin-left: 1%; + text-align: center +} + +/* HEADER */ +.navigation { + top: var(--small); + width: 98%; + left: 1%; + height: var(--height); + background: transparent; + position: fixed; + text-transform: uppercase; + font-weight: 700; + transition: var(--trans) +} +.navigation a, .navigation a:hover, .navigation a:focus { + text-decoration: none +} +.xplosionmind{ + padding: 0 var(--regular); + float: left; + line-height: var(--height); + height: var(--height); + font-size: var(--bigger); + background: var(--background); + transition: var(--trans) +} +.xplosionmind a, .xplosionmind a:visited { + color: var(--primary) +} +.xplosionmind:hover, .xplosionmind:focus { + background: var(--primary); + transition: var(--trans); + border-bottom: none +} +.xplosionmind a:hover, .xplosionmind a:focus { + color: var(--background) +} +.nav-container { + max-width: 100%; + height: var(--height); + background: var(--primary) +} +nav { + float: right; + margin-right: var(--small) +} +nav ul { + list-style: none !important; + margin: 0; + padding: 0 +} +nav ul li { + float: left; + position: relative; + list-style: none !important; + margin: 0 +} +nav ul li a, nav ul li a:visited { + display: block; + padding: 0 15px; + line-height: var(--height); + height: var(--height); + color: var(--background); + text-decoration: none; + background: var(--primary); + font-size: var(--morethan-regular) +} +nav ul li a:hover, nav ul li a:visited:hover, nav ul li a:focus, nav ul li a:visited:focus, nav ul li a:visited:active, nav ul li a:active { + background: var(--background); + color: var(--primary); + transition: var(--trans); + border-bottom: none +} +nav ul li ul li { + min-width: 12rem; +} +nav svg { + margin: 0.6rem 0.8rem 0 0 +} +nav ul li ul li a { + padding: var(--regular); + line-height: var(--regular) +} +.nav-dropdown { + position: absolute; + z-index: 5; + display: none +} + +/* Mobile navigation */ +.nav-mobile { + display: none; + position: absolute; + top: 0; + right: 0; + background: var(--primary); + height: var(--height); + width: var(--height) +} + +@media only screen and (max-width: 1000px) { + .nav-mobile { + display: block + } + nav { + margin-right: 0; + text-align: right + } + nav ul { + display: none + } + nav ul li { + float: none + } + nav ul li a { + padding: var(--lessthan-regular) var(--big); + line-height: var(--morethan-regular) + } + nav ul li ul li a { + padding-right: 4.5rem + } + .nav-dropdown { + position: static; + overflow: scroll + } + .post-title, .poem-title { + width: 96%; + margin-left: 2% + } + h1, h2 { + text-align: center + } + #landing h1 { + font-size: var(--twice) + } + .page-header h1 { + font-size: var(--height) + } + .nav-container { + background: var(--background) + } + .navigation, footer { + left: 2%; + width: 96% + } + footer { + margin-left: 2% + } + .jar-preview .line { + margin: var(--tiny) auto + } + .jar-preview .half { + text-align: center; + padding: 0 10% + } + #stuff-tree { + margin: var(--height) 5% + } + .categories { + position: relative; + left: 5.8rem; + bottom: var(--height) + } +} + +#nav-toggle { + position: absolute; + left: 10px; + top: 12px; + cursor: url(/logos/cursor-hover.svg) 16 16, pointer; + padding: 10px 35px 16px 0 +} +#nav-toggle span, +#nav-toggle span:before, +#nav-toggle span:after { + cursor: url(/logos/cursor-hover.svg) 16 16, pointer; + height: 4px; + width: 30px; + background: var(--background); + position: absolute; + display: block; + content: ""; + transition: var(--quicktrans) +} +#nav-toggle span:before { + top: var(--small) +} +#nav-toggle span:after { + bottom: var(--small) +} +#nav-toggle.active span { + background: transparent +} +#nav-toggle.active span:before, #nav-toggle.active span:after { + top: 0 +} +#nav-toggle.active span:before { + transform: rotate(45deg) +} +#nav-toggle.active span:after { + transform: rotate(-45deg) +} +/* SOCIAL SHARING BUTTONS */ +#sharing-box div { + text-transform: uppercase; + font-weight: 700; + font-size: var(--big) +} +#stuff-tree { + margin: var(--height) calc(100% / 3) +} +#comments { + display: none; + visibility: hidden; + transition: var(--trans) sliding-vertically +} +#comments-button { + display: block; + margin: var(--regular) auto +} + +/* FOOTER */ +footer p { + opacity: .7; + margin: var(--big) auto 0; + line-height: 1rem +} +/* "Privacy" in footer */ +footer .one-fifth { + margin-top: var(--morethan-regular) +} +footer .one-fifth a { + opacity: .7; + color: var(--text); + text-align: center +} +footer p:hover, +footer p:focus { + transition: var(--trans); + opacity: 100% +} +.newsletter { + background: var(--primary); + color: var(--grey) !important; + display: block !important; + width: 90% !important; + margin: var(--morethan-regular) auto; + padding: var(--small); + height: unset !important; + line-height: unset !important +} +#social-box { + margin: var(--morethan-regular) auto +} +.button, button { + height: var(--height); + line-height: var(--height); + font-size: var(--bigger); + font-weight: bold; + width: auto; + transition: var(--quicktrans); + text-transform: uppercase; + hyphens: none +} +.button { + display: inline; +} +.button:hover, .button:focus { + transform: scale(1.1) +} +footer .row { + width: 90%; + margin-left: 5% +} +footer .one-fourth .half a { + line-height: var(--height) +} +#license { + width: 100%; /* override one column width */ + margin-bottom: 0; + font-size: 0.8em; + font-weight: 200; +} +#CClogo { + display: block; + height: 1.2em; + width: auto; + margin: 0 auto var(--morethan-regular); + opacity: .70; + position: relative; + top: 2px; +} +#CClogo:hover, +#CClogo:focus { + opacity: 100%; + transition: var(--quicktrans); +}