diff --git a/.bundle/config b/.bundle/config new file mode 100644 index 0000000..4137ccd --- /dev/null +++ b/.bundle/config @@ -0,0 +1,3 @@ +--- +BUNDLE_PATH: ".bundle" +BUNDLE_DISABLE_SHARED_GEMS: "true" diff --git a/.gitignore b/.gitignore index f40fbd8..9c163fc 100644 --- a/.gitignore +++ b/.gitignore @@ -1,5 +1,9 @@ -_site -.sass-cache -.jekyll-cache +# Generated site +/_site + +# Local packages +/.bundle/ruby/ + +# Temporary files +.sass-cache/ .jekyll-metadata -vendor diff --git a/404.html b/404.html index 086a5c9..7678e45 100644 --- a/404.html +++ b/404.html @@ -1,25 +1,23 @@ --- -permalink: /404.html -layout: default +layout: page +title: 404 +sitemap: + exclude: 'yes' +published: true --- +
- +

+ Error 404 +

+

+ I'm not sure how you got here, but you should head home. +

-
-

404

- -

Page not found :(

-

The requested page could not be found.

+ + + + diff --git a/Gemfile b/Gemfile index 8fb52fc..fc405a4 100644 --- a/Gemfile +++ b/Gemfile @@ -1,30 +1,10 @@ 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", "~> 4.2.1" -# This is the default theme for new Jekyll sites. You may change this to anything you like. -gem "minima", "~> 2.5" -# 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", "~> 223", group: :jekyll_plugins -# If you have any plugins, put them here! + +gem "jekyll", "~> 3.0" +gem "rouge", "~> 1.0" + group :jekyll_plugins do - gem "jekyll-feed", "~> 0.12" + gem "jekyll-feed" + gem "jekyll-paginate" + gem "jekyll-sitemap" end - -# Windows and JRuby does not include zoneinfo files, so bundle the tzinfo-data gem -# and associated library. -platforms :mingw, :x64_mingw, :mswin, :jruby do - gem "tzinfo", "~> 1.2" - gem "tzinfo-data" -end - -# Performance-booster for watching directories on Windows -gem "wdm", "~> 0.1.1", :platforms => [:mingw, :x64_mingw, :mswin] - diff --git a/Gemfile.lock b/Gemfile.lock index e5a6fc5..b0fadd0 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,292 +1,62 @@ GEM remote: https://rubygems.org/ specs: - activesupport (6.0.4.4) - concurrent-ruby (~> 1.0, >= 1.0.2) - i18n (>= 0.7, < 2) - minitest (~> 5.1) - tzinfo (~> 1.1) - zeitwerk (~> 2.2, >= 2.2.2) - addressable (2.8.0) - public_suffix (>= 2.0.2, < 5.0) - coffee-script (2.4.1) - coffee-script-source - execjs - coffee-script-source (1.11.1) + addressable (2.5.2) + public_suffix (>= 2.0.2, < 4.0) colorator (1.1.0) - commonmarker (0.17.13) - ruby-enum (~> 0.5) - concurrent-ruby (1.1.9) - dnsruby (1.61.9) - simpleidn (~> 0.1) - em-websocket (0.5.3) - eventmachine (>= 0.12.9) - http_parser.rb (~> 0) - ethon (0.15.0) - ffi (>= 1.15.0) - eventmachine (1.2.7-x64-mingw32) - execjs (2.8.1) - faraday (1.9.3) - faraday-em_http (~> 1.0) - faraday-em_synchrony (~> 1.0) - faraday-excon (~> 1.1) - faraday-httpclient (~> 1.0) - faraday-multipart (~> 1.0) - faraday-net_http (~> 1.0) - faraday-net_http_persistent (~> 1.0) - faraday-patron (~> 1.0) - faraday-rack (~> 1.0) - faraday-retry (~> 1.0) - ruby2_keywords (>= 0.0.4) - faraday-em_http (1.0.0) - faraday-em_synchrony (1.0.0) - faraday-excon (1.1.0) - faraday-httpclient (1.0.1) - faraday-multipart (1.0.3) - multipart-post (>= 1.2, < 3) - faraday-net_http (1.0.1) - faraday-net_http_persistent (1.2.0) - faraday-patron (1.0.0) - faraday-rack (1.0.0) - faraday-retry (1.0.3) - ffi (1.15.5-x64-mingw32) + ffi (1.9.18) forwardable-extended (2.6.0) - gemoji (3.0.1) - github-pages (223) - github-pages-health-check (= 1.17.9) - jekyll (= 3.9.0) - jekyll-avatar (= 0.7.0) - jekyll-coffeescript (= 1.1.1) - jekyll-commonmark-ghpages (= 0.1.6) - jekyll-default-layout (= 0.1.4) - jekyll-feed (= 0.15.1) - jekyll-gist (= 1.5.0) - jekyll-github-metadata (= 2.13.0) - jekyll-include-cache (= 0.2.1) - jekyll-mentions (= 1.6.0) - jekyll-optional-front-matter (= 0.3.2) - jekyll-paginate (= 1.1.0) - jekyll-readme-index (= 0.3.0) - jekyll-redirect-from (= 0.16.0) - jekyll-relative-links (= 0.6.1) - jekyll-remote-theme (= 0.4.3) - jekyll-sass-converter (= 1.5.2) - jekyll-seo-tag (= 2.7.1) - jekyll-sitemap (= 1.4.0) - jekyll-swiss (= 1.0.0) - jekyll-theme-architect (= 0.2.0) - jekyll-theme-cayman (= 0.2.0) - jekyll-theme-dinky (= 0.2.0) - jekyll-theme-hacker (= 0.2.0) - jekyll-theme-leap-day (= 0.2.0) - jekyll-theme-merlot (= 0.2.0) - jekyll-theme-midnight (= 0.2.0) - jekyll-theme-minimal (= 0.2.0) - jekyll-theme-modernist (= 0.2.0) - jekyll-theme-primer (= 0.6.0) - jekyll-theme-slate (= 0.2.0) - jekyll-theme-tactile (= 0.2.0) - jekyll-theme-time-machine (= 0.2.0) - jekyll-titles-from-headings (= 0.5.3) - jemoji (= 0.12.0) - kramdown (= 2.3.1) - kramdown-parser-gfm (= 1.1.0) - liquid (= 4.0.3) - mercenary (~> 0.3) - minima (= 2.5.1) - nokogiri (>= 1.12.5, < 2.0) - rouge (= 3.26.0) - terminal-table (~> 1.4) - github-pages-health-check (1.17.9) - addressable (~> 2.3) - dnsruby (~> 1.60) - octokit (~> 4.0) - public_suffix (>= 3.0, < 5.0) - typhoeus (~> 1.3) - html-pipeline (2.14.0) - activesupport (>= 2) - nokogiri (>= 1.4) - http_parser.rb (0.8.0) - i18n (0.9.5) - concurrent-ruby (~> 1.0) - jekyll (3.9.0) + jekyll (3.6.2) addressable (~> 2.4) colorator (~> 1.0) - em-websocket (~> 0.5) - i18n (~> 0.7) jekyll-sass-converter (~> 1.0) - jekyll-watch (~> 2.0) - kramdown (>= 1.17, < 3) + jekyll-watch (~> 1.1) + kramdown (~> 1.14) liquid (~> 4.0) mercenary (~> 0.3.3) pathutil (~> 0.9) - rouge (>= 1.7, < 4) + rouge (>= 1.7, < 3) safe_yaml (~> 1.0) - jekyll-avatar (0.7.0) - jekyll (>= 3.0, < 5.0) - jekyll-coffeescript (1.1.1) - coffee-script (~> 2.2) - coffee-script-source (~> 1.11.1) - jekyll-commonmark (1.3.1) - commonmarker (~> 0.14) - jekyll (>= 3.7, < 5.0) - jekyll-commonmark-ghpages (0.1.6) - commonmarker (~> 0.17.6) - jekyll-commonmark (~> 1.2) - rouge (>= 2.0, < 4.0) - jekyll-default-layout (0.1.4) - jekyll (~> 3.0) - jekyll-feed (0.15.1) - jekyll (>= 3.7, < 5.0) - jekyll-gist (1.5.0) - octokit (~> 4.2) - jekyll-github-metadata (2.13.0) - jekyll (>= 3.4, < 5.0) - octokit (~> 4.0, != 4.4.0) - jekyll-include-cache (0.2.1) - jekyll (>= 3.7, < 5.0) - jekyll-mentions (1.6.0) - html-pipeline (~> 2.3) - jekyll (>= 3.7, < 5.0) - jekyll-optional-front-matter (0.3.2) - jekyll (>= 3.0, < 5.0) + jekyll-feed (0.9.2) + jekyll (~> 3.3) jekyll-paginate (1.1.0) - jekyll-readme-index (0.3.0) - jekyll (>= 3.0, < 5.0) - jekyll-redirect-from (0.16.0) - jekyll (>= 3.3, < 5.0) - jekyll-relative-links (0.6.1) - jekyll (>= 3.3, < 5.0) - jekyll-remote-theme (0.4.3) - addressable (~> 2.0) - jekyll (>= 3.5, < 5.0) - jekyll-sass-converter (>= 1.0, <= 3.0.0, != 2.0.0) - rubyzip (>= 1.3.0, < 3.0) - jekyll-sass-converter (1.5.2) + jekyll-sass-converter (1.5.1) sass (~> 3.4) - jekyll-seo-tag (2.7.1) - jekyll (>= 3.8, < 5.0) - jekyll-sitemap (1.4.0) - jekyll (>= 3.7, < 5.0) - jekyll-swiss (1.0.0) - jekyll-theme-architect (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-cayman (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-dinky (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-hacker (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-leap-day (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-merlot (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-midnight (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-minimal (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-modernist (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-primer (0.6.0) - jekyll (> 3.5, < 5.0) - jekyll-github-metadata (~> 2.9) - jekyll-seo-tag (~> 2.0) - jekyll-theme-slate (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-tactile (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-theme-time-machine (0.2.0) - jekyll (> 3.5, < 5.0) - jekyll-seo-tag (~> 2.0) - jekyll-titles-from-headings (0.5.3) - jekyll (>= 3.3, < 5.0) - jekyll-watch (2.2.1) + jekyll-sitemap (1.1.1) + jekyll (~> 3.3) + jekyll-watch (1.5.1) listen (~> 3.0) - jemoji (0.12.0) - gemoji (~> 3.0) - html-pipeline (~> 2.2) - jekyll (>= 3.0, < 5.0) - kramdown (2.3.1) - rexml - kramdown-parser-gfm (1.1.0) - kramdown (~> 2.0) - liquid (4.0.3) - listen (3.7.1) - rb-fsevent (~> 0.10, >= 0.10.3) - rb-inotify (~> 0.9, >= 0.9.10) + kramdown (1.16.2) + liquid (4.0.0) + listen (3.1.5) + rb-fsevent (~> 0.9, >= 0.9.4) + rb-inotify (~> 0.9, >= 0.9.7) + ruby_dep (~> 1.2) mercenary (0.3.6) - minima (2.5.1) - jekyll (>= 3.5, < 5.0) - jekyll-feed (~> 0.9) - jekyll-seo-tag (~> 2.1) - minitest (5.15.0) - multipart-post (2.1.1) - nokogiri (1.13.1-x64-mingw32) - racc (~> 1.4) - octokit (4.22.0) - faraday (>= 0.9) - sawyer (~> 0.8.0, >= 0.5.3) - pathutil (0.16.2) + pathutil (0.16.1) forwardable-extended (~> 2.6) - public_suffix (4.0.6) - racc (1.6.0) - rb-fsevent (0.11.0) - rb-inotify (0.10.1) - ffi (~> 1.0) - rexml (3.2.5) - rouge (3.26.0) - ruby-enum (0.9.0) - i18n - ruby2_keywords (0.0.5) - rubyzip (2.3.2) - safe_yaml (1.0.5) - sass (3.7.4) + public_suffix (3.0.1) + rb-fsevent (0.10.2) + rb-inotify (0.9.10) + ffi (>= 0.5.0, < 2) + rouge (1.11.1) + ruby_dep (1.5.0) + safe_yaml (1.0.4) + sass (3.5.3) sass-listen (~> 4.0.0) sass-listen (4.0.0) rb-fsevent (~> 0.9, >= 0.9.4) rb-inotify (~> 0.9, >= 0.9.7) - sawyer (0.8.2) - addressable (>= 2.3.5) - faraday (> 0.8, < 2.0) - simpleidn (0.2.1) - unf (~> 0.1.4) - terminal-table (1.8.0) - unicode-display_width (~> 1.1, >= 1.1.1) - thread_safe (0.3.6) - typhoeus (1.4.0) - ethon (>= 0.9.0) - tzinfo (1.2.9) - thread_safe (~> 0.1) - tzinfo-data (1.2021.5) - tzinfo (>= 1.0.0) - unf (0.1.4) - unf_ext - unf_ext (0.0.8-x64-mingw32) - unicode-display_width (1.8.0) - wdm (0.1.1) - zeitwerk (2.5.3) PLATFORMS - x64-mingw32 + ruby DEPENDENCIES - github-pages (~> 223) - jekyll-feed (~> 0.12) - minima (~> 2.5) - tzinfo (~> 1.2) - tzinfo-data - wdm (~> 0.1.1) + jekyll (~> 3.0) + jekyll-feed + jekyll-paginate + jekyll-sitemap + rouge (~> 1.0) BUNDLED WITH - 2.3.5 + 1.16.0 diff --git a/README.md b/README.md new file mode 100644 index 0000000..ce014c8 --- /dev/null +++ b/README.md @@ -0,0 +1,139 @@ +# dactl +dactl is a fast, modern and configurable [Jekyll](http://jekyllrb.com/) theme with some tricks up it's sleeve. It has a live theme switcher and it's main blog layout display prominent hero images for posts with colored overlays and nice animations. + +![light theme](uploads/screenshot_desktop_light.jpg) +![dark theme](uploads/screenshot_desktop_dark.jpg) + +## Features +Though minimalistic-looking by nature, dactl is easily configurable and includes quite a lot of niceties: + +Main features: +* Customizable blog layout - choose how your posts will be displayed +* Light/Dark live theme switcher +* Inline footnotes using [Barefoot](https://github.com/philgruneich/barefoot) +* [IcoMoon](https://icomoon.io/) custom icon set (~4kb) +* Typography and components size set in `rem` and `em` which makes them easily scalable +* Responsive design + +Jekyll-specific features: +* Pagination (default: 5 posts per page) +* Fully compatible with Jekyll 3.x and GitHub Pages +* SEO optimized +* [Google Analytics](https://www.google.com/analytics/) support +* [Disqus](https://disqus.com/) comments support +* Syntax highlighter using [Rouge](https://github.com/jneen/rouge) with numbered code lines + +Other features: +* Archive page +* About page +* Tags functionality and tags pages +* Link posts functionality + +Some of the features listed above can be easily configured or disabled by you. + +## Information about dactl +At it's core, dactl is a forked version of [daktilo](https://github.com/kronik3r/daktilo) but it has been almost entirely rewritten from scratch. +I have just started my journey in the world of web development, learning new things on the way. +Looking for a way to put my newly acquired skills to test I found Jekyll and I quickly realized that it's going to be a good learning experience since I don't like building 'dummy' projects. +I've built this theme as a way to develop my skills further. + +You can find credits at the bottom of this Readme file. +**All** feedback is welcome, both positive and negative. + +## Installation +### Running locally +Assuming you've got Jekyll [installed](https://jekyllrb.com/docs/installation/), clone or download this repo, `cd` to wherever you've put `dactl` folder and run `jekyll -s'` + +### Hosting on GitHub +Fork this repo and rename it to `yourusername.github.io`... and that's it! +Your new dactl-themed Jekyll blog should be up and running at yourusername.github.io. + +## Usage +### Slight warning +dactl relies heavily on modern CSS properties such as [mix-blend-mode](http://www.w3.org/TR/compositing-1/#mix-blend-mode), [-webkit-filter](http://www.w3.org/TR/filter-effects-1/) and [css variables](https://drafts.csswg.org/css-variables/) so it may not work properly on older browsers. +It was tested with and works fully on webkit-powered browsers - Safari, Chrome, Vivaldi. + +### Layout configurations +By default dactl uses blog layout which you can see below or check for yourself in the live version. + +Main blog layout displays 5 posts. Each post has a heading contained in a medium-sized tile - with an color overlay over the background image. You need to set the image and color of the overlay in post's YAML front matter. + +If you don't want to use images for post headings you can easily configure the layout to you needs by changing settings located in `configure.yml` file, both post and blog layout will adapt accordingly. + +Options include: +* Use or don't use post heading images (Blog & Post) +* Show full post content or post excerpts (Blog) +* Show post titles only (Blog) + +## Additional information about some features +### Hero images and blog layout +Liquid 'script' which is used to append correct hero image and overlay color as set in post YAML Front matter was written by me and while it's really basic it functions properly. +You can read more about it and see the code in `include/utils/hero.html`. + +### Theme switcher +Theme switcher is made in vanilla Javascript and works using [CSS Variables](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_variables). Values (colors) specified for each variable are injected into `:root` on every page load. +User theme choice is saved in browser's [Local Storage](https://www.w3schools.com/html/html5_webstorage.asp) and is persistent through sessions. + +You can edit the colors of both Light and Dark themes in `themeswitcher.js` file found in `_assets/js/`. + +### Inline Barefoot footnotes +dactl uses [Barefoot](https://github.com/philgruneich/barefoot) plugin to create nice looking inline footnotes from those generated by [kramdown](https://kramdown.gettalong.org/), daktl's markdown processor. + +Barefoot description (from project's page): +>[Barefoot](https://github.com/philgruneich/barefoot) is a lightweight [Bigfoot.js](https://github.com/lemonmade/bigfoot) alternative written in vanilla Javascript to create beautiful inline footnotes. +Barefoot grabs the common markup used for footnotes on the web, mostly generated by Markdown processors, and transform it into beautiful and meaningful footnotes. + +### CSS +CSS is built by via Jekyll's SASS compiler. Source partial SASS files are located in `_sass` folder, included into `main.scss`, and compile to `main.css`. + +### Additional pages +#### Archive page +Archive page displays all of your posts grouped by month. Under this page's title you'll find a Searchbox which is hooked up to DuckDuckGo's `:site` search and will open the results in a new tab. +You need to provide your blog's web address in `search_path` field found in `_config.yml` for it to work. +#### About page +About page displays your photo under the title (set in `config.yml`) and the content of about.md. +#### Tags & Tags Pages +Tags and tag pages are supported by using Jekyll's native collections functionality. + +## Even more info +### Rems, font-size and scaling +dactl is built almost entirely with `rem`s (instead of pixels). `rem`s are like `em`s, but instead of building on the immediate parent's font-size, they build on the root element, ``. + +By default, dactl uses the following: +~~~ +html { + font-size: 20px; + line-height: 1.6; +} +@media (max-width: 48rem) { + html { + font-size: 18px; + } +} +~~~ +To easily scale your site's typography and components, simply customize the base font-sizes found in `_sass/variables.scss` file. + +(Lifted from [here](https://github.com/poole/poole#rems-font-size-and-scaling)) + +## Credits +### Resources used +- [IcoMoon.io](https://icomoon.io/) +- [Normalize.css](https://github.com/necolas/normalize.css) - Nicolas Gallagher +- [Theme switcher](https://www.fdp.io/blog/2016/11/08/theming-via-css-properties/) - Fernando Paredes +- [Barefoot](https://github.com/philgruneich/barefoot) - Philip Gruneich +- [The Noun Project](https://thenounproject.com/) - Icon used as dactl's logo - [Artem Kovyazin](https://thenounproject.com/term/raisin/446158), icon used as 'avatar' in About [Drishya](https://thenounproject.com/term/profile/963272) + +### Inspiration and thoughtful code-jacking +Inspiration and bits of things listed below are present inside dactl's code: +- [Daktilo](https://github.com/kronik3r/daktilo) - dactl is based on Daktilo and inherits it's one-column layout. +- [Hydejack](https://github.com/qwtel/hydejack/) - I've learned a lot about Jekyll when I took apart [@qwtel](https://github.com/qwtel/)'s excellent fork of [Hyde](https://github.com/poole/hyde) theme. I embraced his more partials = everything is easier to edit policy. Hydejack theme gave me an idea on how to create hero images liquid scripting, loading google fonts and using rem's/em's and more. +- [Minimal Mistakes](https://github.com/mmistakes/minimal-mistakes) - This guy makes awesome themes and writes a lot about Jekyll and it's more obscure use cases on his blog, [Made Mistakes](https://mademistakes.com). Looking through his theme's code - Minimal Mistakes in particular - gave me lot of information about how to build a robust theme and how to make it configurable within `_config.yml` +- [Trophy](https://github.com/thomasvaeth/trophy-jekyll) - Link border slide animation SASS mixin which I slightly modified to be able to easily change the direction of the animation. +- Various blog posts about Jekyll and [Stackoverflow](https://www.stackoverflow.com) posts with useful [Liquid](https://github.com/Shopify/liquid) snippets. + +## License +All parts of dactl Jekyll theme are free to use and abuse under the open-source [MIT license](http://opensource.org/licenses/mit-license.php). + +## TO DO +- [ ] Inline critical `.css` in `` for faster load times +- [ ] Fix theme-switcher - sometimes it does not inject all of the colors properly on first page load and a refresh, fixes itself after switching the theme back and forth. diff --git a/example_post/YYYY-MM-DD-sample_post.markdown b/YYYY-MM-DD-sample_post.markdown similarity index 100% rename from example_post/YYYY-MM-DD-sample_post.markdown rename to YYYY-MM-DD-sample_post.markdown diff --git a/_config.yml b/_config.yml index b9bcfff..c215276 100644 --- a/_config.yml +++ b/_config.yml @@ -1,55 +1,118 @@ -# 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 }}. +# Base blog settings +#baseurl : "/dactl/" # the subpath of your site, # e.g. /blog/ + # set to '' in case of hosting on GitHub +url : "https://minetestblog.github.io" # the base hostname & protocol for your site + # `http://.github.io` - for GitHub -title: Minetest Blog -email: mistere123.coding@gmail.com -description: >- # this means to ignore newlines until "baseurl:" - A Periodic development blog for minetest. See what's new in minetest! -domain: my-site.github.io # if you want to force HTTPS, specify the domain without the http at the start, e.g. example.com -url: https://my-site.github.io # the base hostname and protocol for your site, e.g. http://example.com -#baseurl: /minetestblog.github.io/ # place folder name if the site is served in a subfolder +blog: + title : Minetest Blog + description : > + A Periodic development blog for minetest. See what's new in minetest! -#twitter_username: jekyllrb -github_username: minetest +# Layout configuration + logo_path : "assets/img/minetesticon.png" # path to logo file + search_path : # "minetestblog.github.io" + # needed for searchbox in archive page + hero_layout : true # turn on hero layout for blog and posts + hero_placeholder : "assets/img/default_hero.png" # placeholder for hero image + excerpts : true # show excerpts instead of full post content on blog page + inline_footnotes : true # enable/disable barefoot inline footnotes + titles_only : false # show post titles only on main blog page -# Build settings -theme: slate +# Fonts + font : '"Rubik", -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif' + load_google_fonts : 'Rubik:400,400italic,700,700italic' + + +# Author info +author: + fullname : Minetest + rss : true # generate RSS feed and show it's icon in header + mail : mistere123.coding@gmail.com # change to your e-mail address + twitter : #twitter-user-name + github : minetest + youtube : #youtube-user-name + stackoverflow : #stackoverflow-user-name + disqus : #dactl # your disqus site name + google_analytics : # 'UA-XXXXXXXX-X' + photo : #"uploads/me2.png" + photo2x : #"uploads/me.png" + + + +## !! +## Advanced blog settings +## You should not change anything here unless you know what you are doing + +# Gems plugins: - - jekyll-feed + - jekyll-paginate + - jekyll-sitemap -# Exclude from processing. -# The following items will not be processed, by default. -# Any item listed under the `exclude:` key here will be automatically added to -# the internal "default list". -# -# Excluded items can be processed by explicitly listing the directories or -# their entries' file path in the `include:` list. -# -# exclude: -# - .sass-cache/ -# - .jekyll-cache/ -# - gemfiles/ -# - Gemfile -# - Gemfile.lock -# - node_modules/ -# - vendor/bundle/ -# - vendor/cache/ -# - vendor/gems/ -# - vendor/ruby/ +# Permalinks +permalink : posts/:slug + +# Posts +excerpt_separator : + +# Pagination +paginate : 5 +paginate_path : '/page-:num/' + +# Tags +collections: + my_tags: + output: true + permalink: /tag/:slug/ +defaults: + - + scope: + path: "" + type: my_tags + values: + layout: blog-by-tag + +# Handling Reading +exclude : ["README.md", "README.html",YYYY-MM-DD-sample_post.markdown,YYYY-MM-DD-next_post.markdown] + +# https://github.com/jekyll/jekyll/issues/4619 +# Markdown and highlighter settings +markdown: kramdown +# !github-pages! mandatory › https://help.github.com/articles/using-jekyll-with-pages/#configuration-settings-you-cannot-change +# Since Jekyll 3 the default highlighter is Rouge (replaced Pygments.rb in v44) +highlighter: rouge + +# More › http://kramdown.gettalong.org/quickref.html +# Options › http://kramdown.gettalong.org/options.html +kramdown: + input: GFM + # https://github.com/jekyll/jekyll/pull/4090 + syntax_highlighter: rouge + + # Rouge Highlighter in Kramdown › http://kramdown.gettalong.org/syntax_highlighter/rouge.html + # span, block element options fall back to global + syntax_highlighter_opts: + # Rouge Options › https://github.com/jneen/rouge#full-options + # css_class: 'highlight' + #line_numbers: true # bad idea, spans don't need linenos and would inherit this option + span: + line_numbers: false + block: + line_numbers: true + start_line: 1 + +# Sass settings +sass: + sass_dir : _sass + style : compressed # http://sass-lang.com/documentation/file.SASS_REFERENCE.html#output_style + +# HTML Compression +# - http://jch.penibelst.de/ +compress_html: + clippings : all + endings : all + comments : [""] + blanklines : true + profile : false + ignore: + envs : [local] diff --git a/_includes/blog.html b/_includes/blog.html new file mode 100644 index 0000000..fc277eb --- /dev/null +++ b/_includes/blog.html @@ -0,0 +1,80 @@ +{% assign post = include.post %} + +
+ + + {% if site.blog.hero_layout == true %} + {% include utils/hero.html %} + {% endif %} + + +
+ + + {% if site.blog.hero_layout == true %} +
+ {% endif %} +

+ {% if post.link != nil %} + {{ post.title }} → + {% else %} + {{ post.title }} + {% endif %} +

+ + + + {% if site.blog.hero_layout == true %} +
+ {% endif %} + +
+ + {% if site.blog.titles_only == false %} + + {% if site.blog.excerpts == true %} + {{ post.excerpt }} +
+ Read more +
+ + {% else if site.blog.excerpts == false %} + {{ post.content | remove: '<!–-break-–>' }} + {% endif %} + + {% endif %} + + +
+ +{% if forloop.last == false %} +
+{% endif %} diff --git a/_includes/externals/disqus.html b/_includes/externals/disqus.html new file mode 100644 index 0000000..905be22 --- /dev/null +++ b/_includes/externals/disqus.html @@ -0,0 +1,15 @@ +{% if site.author.disqus %} +
+ + +{% endif %} diff --git a/_includes/externals/google_analytics.html b/_includes/externals/google_analytics.html new file mode 100644 index 0000000..e3ae452 --- /dev/null +++ b/_includes/externals/google_analytics.html @@ -0,0 +1,11 @@ +{% if site.author.google_analytics %} + +{% endif %} \ No newline at end of file diff --git a/_includes/externals/scripting.html b/_includes/externals/scripting.html new file mode 100644 index 0000000..8ebc550 --- /dev/null +++ b/_includes/externals/scripting.html @@ -0,0 +1,6 @@ + + + +{% if site.blog.inline_footnotes == true %} + +{% endif %} diff --git a/_includes/main/footer.html b/_includes/main/footer.html new file mode 100644 index 0000000..c6b4634 --- /dev/null +++ b/_includes/main/footer.html @@ -0,0 +1,4 @@ +
+ {{ site.blog.description }} + written by {{ site.author.fullname }} +
diff --git a/_includes/main/head.html b/_includes/main/head.html new file mode 100644 index 0000000..6b44eac --- /dev/null +++ b/_includes/main/head.html @@ -0,0 +1,55 @@ + + + +{% if page.title == "Blog" %}{{ site.blog.title }} <!-- · --> {{ site.tagline }}{% else %}{% if page.tag %}{{ site.data.tags[page.tag].name }}{% else %}{{ page.title }}{% endif %} ▪ {{ site.blog.title }}{% endif %} + + + + +{% if page.tags %}{% endif %} + + +{% if page.title %} {% assign title = page.title ~ ' - ' ~ page.subtitle %} {% else %} {% assign title = site.blog.title %} {% endif %} +{% if page.description %} {% assign description = page.description %} {% else %} {% assign description = site.blog.description %} {% endif %} +{% if page.keywords %} {% assign keywords = page.keywords %} {% else %} {% assign keywords = site.keywords %} {% endif %} +{% if page.cover %} {% assign cover = page.cover %} {% else %} {% assign cover = site.cover %} {% endif %} + + + + + + + + + + + + + + + + + + + + + + + +{% if site.blog.load_google_fonts %} + + +{% endif %} + +{% if site.blog.inline_footnotes == true %} + +{% endif %} diff --git a/_includes/main/header.html b/_includes/main/header.html new file mode 100644 index 0000000..b34d860 --- /dev/null +++ b/_includes/main/header.html @@ -0,0 +1,65 @@ +
+ + +
diff --git a/_includes/page/post-list-item.html b/_includes/page/post-list-item.html new file mode 100644 index 0000000..577ca4b --- /dev/null +++ b/_includes/page/post-list-item.html @@ -0,0 +1,6 @@ +
  • + + {{ post.title }} + {{ post.date | date: "%d/%m" }} + +
  • diff --git a/_includes/page/searchbox.html b/_includes/page/searchbox.html new file mode 100644 index 0000000..5fd77cf --- /dev/null +++ b/_includes/page/searchbox.html @@ -0,0 +1,11 @@ + diff --git a/_includes/page/title.html b/_includes/page/title.html new file mode 100644 index 0000000..9828867 --- /dev/null +++ b/_includes/page/title.html @@ -0,0 +1,6 @@ +
    +
    +

    {{ include.title }}

    + {{ include.subtitle }} +
    +
    diff --git a/_includes/post.html b/_includes/post.html new file mode 100644 index 0000000..25c8873 --- /dev/null +++ b/_includes/post.html @@ -0,0 +1,51 @@ +{% assign post = include.post %} + +
    + + {% if site.blog.hero_layout == true %} + {% include utils/hero.html %} + {% endif %} + + +
    + + {% if site.blog.hero_layout == true %} + {% if post.source-img %} +
    + source: + {{ post.source-img }} +
    + {% endif %} + {% endif %} + +
    +

    + {% if post.link != nil %} + + {% endif %} + {{ post.title }} + {% if post.link != nil %} + → + {% endif %} +

    + + +
    +
    + + + {{ post.content | remove: '<!–-break-–>' }} +
    diff --git a/_includes/post/pagination.html b/_includes/post/pagination.html new file mode 100644 index 0000000..c8170a5 --- /dev/null +++ b/_includes/post/pagination.html @@ -0,0 +1,28 @@ + + diff --git a/_includes/post/related.html b/_includes/post/related.html new file mode 100644 index 0000000..9e0ac35 --- /dev/null +++ b/_includes/post/related.html @@ -0,0 +1,43 @@ + + +{% comment %} +{{ commonTags }} +{% endcomment %} diff --git a/_includes/utils/date_custom.html b/_includes/utils/date_custom.html new file mode 100644 index 0000000..c06712a --- /dev/null +++ b/_includes/utils/date_custom.html @@ -0,0 +1,24 @@ +{% if include.date %} + {% assign processed_date = include.date %} +{% else if page.date %} + {% assign processed_date = page.date %} +{% endif %} + +{% comment %}-------- Test if we have a date to process --------{% endcomment %} +{% if processed_date %} + + {% assign month = "styczeń,luty,marzec,kwiecień,maj,czerwiec,lipiec,sierpień,wrzesień,październik,listopad,grudzień" | split: "," %} + + {% comment %}------ Note : sunday is the first day in this array -------{% endcomment %} + {% assign day = "poniedziałek,wtorek,środa,czwartek,piątek,sobota,niedziela" | split: "," %} + + {% assign month_index = processed_date | date: "%m" | minus: 1 %} + + {%comment%}---------------------------------------------- + Here **minus: 0** is a trick to convert day_index from string to integer and then use it as an array index. + ----------------------------------------------{%endcomment%} + {% assign day_index = processed_date | date: "%w" | minus: 0 %} + + {%comment%}-------- Output the date without 0 in front of 07 08 etc ----------{%endcomment%} + {{ day[day_index] }}, {{ processed_date | date: "%d" | minus: 0 }} {{ month[month_index] }} {{ processed_date | date: "%Y" }} +{% endif %} diff --git a/_includes/utils/date_custom_short.html b/_includes/utils/date_custom_short.html new file mode 100644 index 0000000..e68d10b --- /dev/null +++ b/_includes/utils/date_custom_short.html @@ -0,0 +1,21 @@ +{% if include.date %} + {% assign processed_date = include.date %} +{% else if page.date %} + {% assign processed_date = page.date %} +{% endif %} + +{% comment %}-------- Test if we have a date to process --------{% endcomment %} +{% if processed_date %} + + {% assign month = "January,February,March,April,May,June,July,August,September,October,November,December" | split: "," %} + + {% assign month_index = processed_date | date: "%m" | minus: 1 %} + + {%comment%}---------------------------------------------- + Here **minus: 0** is a trick to convert day_index from string to integer and then use it as an array index. + ----------------------------------------------{%endcomment%} + {% assign day_index = processed_date | date: "%w" | minus: 0 %} + + {%comment%}-------- Output the date ----------{%endcomment%} + {{ month[month_index] }} {{ processed_date | date: "%Y" }} +{% endif %} diff --git a/_includes/utils/hero.html b/_includes/utils/hero.html new file mode 100644 index 0000000..24f1c1d --- /dev/null +++ b/_includes/utils/hero.html @@ -0,0 +1,92 @@ +{% comment %} + +Jekyll needs to process this file in order to append a correct image and add classes to post heading containers. +These classes get injected just before corresponding posts and are named after post-titles. + +This solution relies on background-image, it's easier to make the background-image stretch to fill the container. + +It also needs both :before and :after pseudoclasses to work, that's the only way to add webkit-filter and mix-blend-mode properties which only affect the background-image and not other elements in that div. +* :before - sets the background image to one set in post and adds a webkit-filter to it +* :after - adds an colored overlay on the image which you can also specify when creating post. + + + {% comment %} + {{ hero | prepend: site.baseurl }}' + {% endcomment %} + +{% endcomment %} + +{% if post.hero != nil %} +{% assign hero = post.hero %} +{% else %} +{% assign hero = site.hero.placeholder %} +{% endif %} + +{% if post.overlay != nil %} + +{% if post.overlay == "red" %}{% assign overlay = "rgba(255,0,100," %}{% endif %} +{% if post.overlay == "blue" %}{% assign overlay = "rgba(0,100,255," %}{% endif %} +{% if post.overlay == "green" %}{% assign overlay = "rgba(100,255,0," %}{% endif %} +{% if post.overlay == "purple" %}{% assign overlay = "rgba(100,0,255," %}{% endif %} +{% if post.overlay == "orange" %}{% assign overlay = "rgba(255,100,0," %}{% endif %} + +{% else %} +{% assign overlay = "rgba(0,0,0,.8)" %} +{% endif %} + +{% assign opacity = "0.8)" %} + + + diff --git a/_includes/utils/tag-box.html b/_includes/utils/tag-box.html new file mode 100644 index 0000000..eaa04c7 --- /dev/null +++ b/_includes/utils/tag-box.html @@ -0,0 +1,18 @@ +
    +
    +Check out other tags: +
      + {% assign tags = site.tags | sort %} + {% for tag in tags %} +
    • + #{{ tag[0] }} +
    • + {% endfor %} +
    +
    +
    + + +{% comment %} +{{ tag[0] | replace:'-', ' ' }} ({{ tag | last | size }}) +{% endcomment %} diff --git a/_layouts/blog-by-tag.html b/_layouts/blog-by-tag.html new file mode 100644 index 0000000..2885001 --- /dev/null +++ b/_layouts/blog-by-tag.html @@ -0,0 +1,47 @@ +--- +layout: default +--- + + +{% capture page_subtitle %} +{% if page.description %} + {% capture desc %}{{ page.description }}{% endcapture %} + {{ desc | markdownify }} +{% else %} +Articles tagged with ‘#{{ page.name }}’ +{% endif %} +{% endcapture %} + +{% include page/title.html title=page.name subtitle=page_subtitle %} + +{% if site.tags[page.slug] %} + {% for post in site.tags[page.slug] %} + + {% assign currentdate = post.date | date: "%Y/%m" %} + {% if currentdate != date %} + {% unless forloop.first %} + + {% endunless %} +

    {% include utils/date_custom_short.html date = post.date %}

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

    There are no posts in this tag.

    +{% endif %} + + {% include utils/tag-box.html %} diff --git a/_layouts/blog.html b/_layouts/blog.html new file mode 100644 index 0000000..bb08d74 --- /dev/null +++ b/_layouts/blog.html @@ -0,0 +1,12 @@ +--- +layout: default +title: "Blog" +--- + +{% for post in paginator.posts %} + +{% include blog.html %} + +{% endfor %} + +{% include post/pagination.html %} diff --git a/_layouts/compress.html b/_layouts/compress.html new file mode 100644 index 0000000..8248010 --- /dev/null +++ b/_layouts/compress.html @@ -0,0 +1,10 @@ +--- +# Jekyll layout that compresses HTML +# v3.0.2 +# http://jch.penibelst.de/ +# © 2014–2015 Anatol Broder +# MIT License +--- + +{% capture _LINE_FEED %} +{% endcapture %}{% if site.compress_html.ignore.envs contains jekyll.environment %}{{ content }}{% else %}{% capture _content %}{{ content }}{% endcapture %}{% assign _profile = site.compress_html.profile %}{% if site.compress_html.endings == "all" %}{% assign _endings = "html head body li dt dd p rt rp optgroup option colgroup caption thead tbody tfoot tr td th" | split: " " %}{% else %}{% assign _endings = site.compress_html.endings %}{% endif %}{% for _element in _endings %}{% capture _end %}{% endcapture %}{% assign _content = _content | remove: _end %}{% endfor %}{% if _profile and _endings %}{% assign _profile_endings = _content | size | plus: 1 %}{% endif %}{% for _element in site.compress_html.startings %}{% capture _start %}<{{ _element }}>{% endcapture %}{% assign _content = _content | remove: _start %}{% endfor %}{% if _profile and site.compress_html.startings %}{% assign _profile_startings = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.comments == "all" %}{% assign _comments = "" | split: " " %}{% else %}{% assign _comments = site.compress_html.comments %}{% endif %}{% if _comments.size == 2 %}{% capture _comment_befores %}.{{ _content }}{% endcapture %}{% assign _comment_befores = _comment_befores | split: _comments.first %}{% for _comment_before in _comment_befores %}{% if forloop.first %}{% continue %}{% endif %}{% capture _comment_outside %}{% if _carry %}{{ _comments.first }}{% endif %}{{ _comment_before }}{% endcapture %}{% capture _comment %}{% unless _carry %}{{ _comments.first }}{% endunless %}{{ _comment_outside | split: _comments.last | first }}{% if _comment_outside contains _comments.last %}{{ _comments.last }}{% assign _carry = false %}{% else %}{% assign _carry = true %}{% endif %}{% endcapture %}{% assign _content = _content | remove_first: _comment %}{% endfor %}{% if _profile %}{% assign _profile_comments = _content | size | plus: 1 %}{% endif %}{% endif %}{% assign _pre_befores = _content | split: "" %}{% assign _pres_after = "" %}{% if _pres.size != 0 %}{% if site.compress_html.blanklines %}{% assign _lines = _pres.last | split: _LINE_FEED %}{% capture _pres_after %}{% for _line in _lines %}{% assign _trimmed = _line | split: " " | join: " " %}{% if _trimmed != empty or forloop.last %}{% unless forloop.first %}{{ _LINE_FEED }}{% endunless %}{{ _line }}{% endif %}{% endfor %}{% endcapture %}{% else %}{% assign _pres_after = _pres.last | split: " " | join: " " %}{% endif %}{% endif %}{% capture _content %}{{ _content }}{% if _pre_before contains "" %}{% endif %}{% unless _pre_before contains "" and _pres.size == 1 %}{{ _pres_after }}{% endunless %}{% endcapture %}{% endfor %}{% if _profile %}{% assign _profile_collapse = _content | size | plus: 1 %}{% endif %}{% if site.compress_html.clippings == "all" %}{% assign _clippings = "html head title base link meta style body article section nav aside h1 h2 h3 h4 h5 h6 hgroup header footer address p hr blockquote ol ul li dl dt dd figure figcaption main div table caption colgroup col tbody thead tfoot tr td th" | split: " " %}{% else %}{% assign _clippings = site.compress_html.clippings %}{% endif %}{% for _element in _clippings %}{% assign _edges = " ;; ;" | replace: "e", _element | split: ";" %}{% assign _content = _content | replace: _edges[0], _edges[1] | replace: _edges[2], _edges[3] | replace: _edges[4], _edges[5] %}{% endfor %}{% if _profile and _clippings %}{% assign _profile_clippings = _content | size | plus: 1 %}{% endif %}{{ _content }}{% if _profile %}
    Step Bytes
    raw {{ content | size }}{% if _profile_endings %}
    endings {{ _profile_endings }}{% endif %}{% if _profile_startings %}
    startings {{ _profile_startings }}{% endif %}{% if _profile_comments %}
    comments {{ _profile_comments }}{% endif %}{% if _profile_collapse %}
    collapse {{ _profile_collapse }}{% endif %}{% if _profile_clippings %}
    clippings {{ _profile_clippings }}{% endif %}
    {% endif %}{% endif %} diff --git a/_layouts/default.html b/_layouts/default.html new file mode 100644 index 0000000..709f478 --- /dev/null +++ b/_layouts/default.html @@ -0,0 +1,23 @@ +--- +layout: compress +--- + + + + + {% include main/head.html %} + + + +
    + {% include main/header.html %} + + {{ content }} + + {% include main/footer.html %} +
    + + {% include externals/scripting.html %} + {% include externals/google_analytics.html %} + + diff --git a/_layouts/page.html b/_layouts/page.html new file mode 100644 index 0000000..5e71126 --- /dev/null +++ b/_layouts/page.html @@ -0,0 +1,5 @@ +--- +layout: default +--- + +{{ content }} diff --git a/_layouts/post.html b/_layouts/post.html new file mode 100644 index 0000000..5fb0b25 --- /dev/null +++ b/_layouts/post.html @@ -0,0 +1,12 @@ +--- +layout: default +--- + + +{% include post.html post=page %} + +{% if site.author.disqus %} + {% include externals/disqus.html %} +{% endif %} + +{% include post/related.html %} diff --git a/_my_tags/dactl.md b/_my_tags/dactl.md new file mode 100644 index 0000000..1a72c06 --- /dev/null +++ b/_my_tags/dactl.md @@ -0,0 +1,6 @@ +--- +slug: dactl +name: dactl +description: > + This tag has the description filled in - check it out `_my_tags/dactyl.md` +--- diff --git a/_my_tags/howto.md b/_my_tags/howto.md new file mode 100644 index 0000000..17fcdf2 --- /dev/null +++ b/_my_tags/howto.md @@ -0,0 +1,4 @@ +--- +slug: howto +name: How to +--- diff --git a/_my_tags/jekyll.md b/_my_tags/jekyll.md new file mode 100644 index 0000000..3d60ee7 --- /dev/null +++ b/_my_tags/jekyll.md @@ -0,0 +1,4 @@ +--- +slug: jekyll +name: Jekyll +--- diff --git a/_posts/2022-01-22-Welcome.markdown b/_posts/2022-01-22-Welcome.markdown index 6b66e70..2b2fe65 100644 --- a/_posts/2022-01-22-Welcome.markdown +++ b/_posts/2022-01-22-Welcome.markdown @@ -1,8 +1,13 @@ --- layout: post -title: "Welcome to the new Minetest Blog" -date: 2022-01-22 14:39:05 -0500 -categories: Blog +title: Welcome to the new Minetest Blog +tags: + - Blog Status +description: > + A new way to share your work. +hero: /assests/img/default_hero.img +overlay: grey +published: true --- # Table of contents * [Briefing](#overview) diff --git a/_sass/_404.scss b/_sass/_404.scss new file mode 100644 index 0000000..e433c9e --- /dev/null +++ b/_sass/_404.scss @@ -0,0 +1,321 @@ +/* Source: http://codepen.io/bulby97/pen/fcvay */ + +.glitch { + position: relative; + animation: glitch 2s steps(100) infinite; +} + +@keyframes glitch { + 0% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 1% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 2% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 3% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 4% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 5% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 6% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 7% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 8% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 9% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 10% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 11% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 12% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 13% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 14% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 15% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 16% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 17% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 18% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 19% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 20% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 21% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 22% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 23% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 24% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 25% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 26% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 27% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 28% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 29% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 30% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 31% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 32% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 33% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 34% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 35% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 36% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 37% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 38% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 39% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 40% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 41% { + text-shadow: 50px 0 0 blue, -50px 0 0 lime; + } + 42% { + text-shadow: 0 0 0 blue, 0 0 0 lime; + } + 43% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 44% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 45% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 46% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 47% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 48% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 49% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 50% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 51% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 52% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 53% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 54% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 55% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 56% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 57% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 58% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 59% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 60% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 61% { + text-shadow: 30px 0 0 red, -30px 0 0 lime; + } + 62% { + text-shadow: 0 0 0 red, 0 0 0 lime; + } + 63% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 64% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 65% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 66% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 blue; + } + 67% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 68% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 69% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 70% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 71% { + text-shadow: 70px 0 0 red, -70px 0 0 blue; + } + 72% { + text-shadow: 0 0 0 red, 0 0 0 blue; + } + 73% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 74% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 75% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 76% { + text-shadow: 1px 0 0 red, -1px 0 0 blue; + } + 77% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 78% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 79% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 80% { + text-shadow: -1px 0 0 red, 1px 0 0 blue; + } + 81% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 82% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 83% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 84% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 85% { + text-shadow: 0.5px 0 0 red, -0.5px 0 0 lime; + } + 86% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 87% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 88% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 89% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 90% { + text-shadow: -1px 0 0 red, 1px 0 0 lime; + } + 91% { + text-shadow: 60px 0 0 lime, -60px 0 0 blue; + } + 92% { + text-shadow: 0 0 0 lime, 0 0 0 blue; + } + 92% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 93% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 94% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 95% { + text-shadow: 0.7px 0 0 blue, -0.7px 0 0 lime; + } + 96% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 97% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 98% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 99% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } + 100% { + text-shadow: -1px 0 0 blue, 1px 0 0 lime; + } +} + + +/* Custom */ +.go-home { + text-align: center; +} \ No newline at end of file diff --git a/_sass/_articles.scss b/_sass/_articles.scss new file mode 100644 index 0000000..bef956b --- /dev/null +++ b/_sass/_articles.scss @@ -0,0 +1,57 @@ +// Articles / posts +//------------------------------- + +article { + &.blog { + margin-bottom: 2em; + + &:last-of-type { + margin-bottom: 6em; + } + + p { + margin-bottom: .5rem; + } + } + + + &.post { + margin-bottom: 4em; + } + + + p { + margin-top: 0; + margin-bottom: 1.5rem; + word-wrap: break-word; + + &.lead { + font-size: $lead-font-size; + margin-bottom: 3rem; + } + + a { + border-bottom: .09em solid var(--link-color); + } + } + + // resets for lists inside articles + li ul { // reset which allows
      /
        nesting + margin-bottom: 0; + } + li+li { // aligns them nicely + margin-top: 0rem; + } +} + +// Bleed image class +.oversize { + margin: 2.5rem 0 2.5rem -15%; + max-width: 130%; +} +@media (max-width: 48rem) { + .oversize { + margin: inherit; + max-width: 100%; + } +} diff --git a/_sass/_barefoot.scss b/_sass/_barefoot.scss new file mode 100644 index 0000000..fd08f06 --- /dev/null +++ b/_sass/_barefoot.scss @@ -0,0 +1,161 @@ +// Barefoot footnotes +//------------------------------- + +.footnote-container { + display: inline-block; + position: relative; + text-indent: 0; +} + +.footnote-backdrop { + cursor: pointer; +} + +.footnote-button { + // background: rgba(110, 110, 110, .2); + background: var(--code-bg-color); + box-shadow: 0 1px 1px var(--shadow-color); + border: 0; + border-radius: .475em; + cursor: pointer; + display: inline-block; + font-size: 1.5rem; + height: .95em; + line-height: 0; + margin: .2em .2em 0 .2em; + padding: .35em; + position: relative; + top: -.2em; + transition-duration: .25s; + transition-property: background; + /* vertical-align: super; */ + vertical-align: middle; + width: 1.5em; + z-index: 5; + + &:after { + font-family: 'icomoon'; + content: "\e5d3"; + /* numbered footnotes + content: attr(data-fn-number); */ + // color: rgba(110, 110, 110, .5); + color: var(--text-color-light); + display: block; + font-size: 1em; + font-weight: bold; + left: 50%; + position: absolute; + top: 50%; + transform: translate(-50%, -50%); + transition: color .25s ease; + } + + /* fix focus */ + &:focus{ + outline: none + } + &:hover { + // background: rgba(110, 110, 110, .5); + background: var(--table-header-color); + outline: none; + &:after { + color: var(--text-color); + + outline: none; + } + } + + &.is-active { + // background: rgba(110, 110, 110, 1); + background: var(--table-border-color); + transition-delay: .1s; + &:after { + color: var(--text-color); + } + } +} + +.bf-footnote { + background: var(--code-bg-color); + // border: 1px solid var(--code-border); + box-shadow: 0 1px 2px var(--shadow-color); + /* border-radius: .25em; */ + left: 0; + margin: $magic 0; + max-width: 90vw; + opacity: 0; + position: absolute; + top: 0; + transform-origin: 50% 0; + transition-duration: .25s; + transition-property: opacity; + transition-timing-function: ease; + z-index: 10; + + &.footnote-is-active { + opacity: 1; + } + + &.footnote-is-top { + bottom: 0; + top: auto; + } +} + +.footnote-wrapper { + background: inherit; + border-radius: .25em; + margin: 0; + max-width: 100%; + overflow: hidden; + position: relative; + width: 22em; + z-index: 14; + /* nie dziala ??*/ + &:focus { + outline: none; + } +} + +.footnote-tooltip { + background: inherit; + box-shadow: 0 1px 2px var(--shadow-color); + // border: 1px solid var(--code-border); + height: 1.3em; + position: absolute; + top: -.49em; + transform: rotate(45deg); + width: 1.3em; + z-index: 12; + + .footnote-is-top & { + bottom: -.49em; + top: auto; + } +} + +.footnote-content { + -webkit-font-smoothing: subpixel-antialiased; + line-height: $magic - .2em; + max-height: 15em; + overflow: auto; + -webkit-overflow-scrolling: touch; + padding: 1em; + position: relative; + z-index: 8; + outline: none; + + *:first-child { + margin-top: 0; + padding-top: 0; + } + + *:last-child { + margin-bottom: 0; + padding-bottom: 0; + } +/* font-size for footnote content*/ + p { + font-size: $footnote-font-size; + } +} diff --git a/_sass/_base.scss b/_sass/_base.scss new file mode 100644 index 0000000..d9ac096 --- /dev/null +++ b/_sass/_base.scss @@ -0,0 +1,139 @@ +// Base +//------------------------------- + +*, +*::before, +*::after { + box-sizing: border-box; +} +::selection { + color: var(--bg-color); + background-color: var(--text-color); +} + +body { + font-size: $base-font-size; + line-height: $base-line-height; + color: var(--text-color); + background-color: var(--bg-color); +} + +.page { + margin-bottom: 8em; + } +.wrapper { + max-width: 48rem; + margin: 4rem auto 4rem auto; +} + + +@media (max-width: 48rem) { + body { + font-size: $mobile-font-size; + } + .wrapper { + width: 90%; + margin: 3rem auto 2rem auto; + } +} + +// Links and paragraphs +//------------------------------- + +a, .a { + color: var(--link-color); + text-decoration: none; + position: relative; + border-bottom: 0.18rem solid transparent; + transition: border 0.15s; + + &:hover, &:focus { + text-decoration: none; + border-bottom: 0.15em solid; + } + strong { + color: inherit; + } +} + +// Headings +//------------------------------- + +h1, h2, h3, h4, h5, h6 { + margin-bottom: .5rem; + font-weight: $base-font-weight-bold; + line-height: 1.1; + color: var(--text-color); + text-rendering: optimizeLegibility; +} + +h1 { + font-size: 2rem; +} + +h2 { + margin-top: 2.5rem; + font-size: 1.5rem; +} + +h3 { + margin-top: 1.5rem; + font-size: 1.25rem; +} + +h4, h5, h6 { + margin-top: 1rem; + font-size: 1rem; +} + +b, +strong { + color: var(--text-color); +} + +dt { + font-weight: $base-font-weight-bold; +} + +dd { + margin-bottom: .5rem; +} + +abbr { + font-size: 85%; + font-weight: $base-font-weight-bold; + color: var(--text-color); + text-transform: uppercase; + + &[title] { + cursor: help; + border-bottom: 1px dotted var(--text-color-light); + } +} + +strong { + color: var(--text-color); +} + +// Lists, blockquotes +//------------------------------- + +ul, ol, dl { + margin-top: 0; + margin-bottom: 1.5rem; +} + +// HR, IMG +//------------------------------- + +hr { + margin-bottom: 4em; + max-width: 30%; + border: 0.1em solid var(--shadow-color); +} + +img { + margin: 2.5rem auto; + display: block; + max-width: 100%; +} diff --git a/_sass/_blockquote.scss b/_sass/_blockquote.scss new file mode 100644 index 0000000..48620b1 --- /dev/null +++ b/_sass/_blockquote.scss @@ -0,0 +1,23 @@ +//------------------------------- +// Blockquotes +//------------------------------- + +blockquote { + padding: 0 0 4px 15px; + margin: 0 0 2rem -1rem; + font-size: $base-font-size; + font-weight: $base-font-weight; + font-style: italic; + line-height: $base-line-height; + color: var(--text-color-light); + border-left: 3px solid var(--text-color-light); + + p:last-child { + margin-bottom: 0; + } +} +@media (max-width: 48rem) { + blockquote { + margin: 0 0 2rem 0; + } +} diff --git a/_sass/_code.scss b/_sass/_code.scss new file mode 100644 index 0000000..9b47b32 --- /dev/null +++ b/_sass/_code.scss @@ -0,0 +1,155 @@ +// Code +//------------------------------- +// Inline and block-level code snippets. Includes tweaks to syntax highlighted +// snippets from Rouge and Gist embeds. + +code, +pre { + font-family: $serif; +} + +// small code thingies +code { + padding: .25em .5em; + font-size: .85em; + // Could be mistaken for a link if the user choses a similar link-color, so better no colored inline code. + // color: $code-color; + background-color: var(--code-bg-color); + // No border radius to prevent repaint on code scroll + // border-radius: 3px; +} + +code.highlighter-rouge { + box-shadow: 0 1px 1px var(--shadow-color); +} + +pre code { + padding: 0; + font-size: .75em; + color: inherit; + background-color: transparent; +} + +figure, .figure { + margin-left: -1rem; + margin-right: -1rem; + + > *:first-child { + padding: 1rem; + background: var(--code-bg-color); + } + + > figcaption, > .figcaption { + font-size: smaller; + color: #9a9a9a; + text-align: center; + font-style: italic; + margin-top: 0.5rem; + padding: 0 1rem; + } +} + +//http://www.minh.io/blog/2015/06/28/jekyll-line-numbers/ +//https://drewsilcock.co.uk/proper-linenumbers +//https://sacha.me/articles/jekyll-rouge/#using-rouge-in-jekyll-3-on-github-pages +// Rouge +.highlight { + margin-bottom: 1.5rem; + font-size: .75em; + // /* Prevent code linebreaks and allow side-scrolling (much better readability on mobile) */ + overflow-x: auto; + -webkit-overflow-scrolling: touch; + // /* Make code same width as regular text, and scroll the full page width on mobile */ + @include figure2(); + + backface-visibility: hidden; + box-shadow: 0 1px 2px var(--shadow-color); + position: relative; + + &:before { + position: absolute; + top: 0; + right: 0; + padding: 0.5em; + background-color: var(--code-border); + content: "\e86f"; + font-family: "icomoon" !important; + line-height: 1; + text-transform: none; + speak: none; + box-shadow: 0 1px 2px var(--shadow-color); + } + + pre { + line-height: 1.6; + padding: .5rem 0 .5rem .5rem; + margin-bottom: 0; + overflow-x: auto; + } + + .lineno { + display: inline-block; // Ensures the null space also isn't selectable + padding-right: .25rem; + color: var(--metadata-color); + // Make sure numbers aren't selectable + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; + } + + table { + // resets down below + width: 90%; + background: transparent; + box-shadow: none; + margin-bottom: 0; + font-size: inherit; + + td, th { + padding: 0.25rem .5rem; + } + + td:not(:first-child) { + border-left: 0; + } + + td.gutter { + background: var(--code-border); + box-shadow: 0 1px 2px var(--shadow-color); + width: 6%; + } + + td.code { + position:relative; + width: 90%; + } + } +} + +@media (max-width: 48rem) { + td.code:before { + display: none; + } +} + +// Gist via GitHub Pages +// .gist .gist-file { +// font-family: Menlo, Monaco, "Courier New", monospace !important; +// } +// .gist .markdown-body { +// padding: 15px; +// } +// .gist pre { +// padding: 0; +// background-color: transparent; +// } +// .gist .gist-file .gist-data { +// font-size: .8rem !important; +// line-height: 1.4; +// } +// .gist code { +// padding: 0; +// color: inherit; +// background-color: transparent; +// border-radius: 0; +// } diff --git a/_sass/_components.scss b/_sass/_components.scss new file mode 100644 index 0000000..2182fe6 --- /dev/null +++ b/_sass/_components.scss @@ -0,0 +1,164 @@ +// Various components used on pages +//------------------------------- + + +// Post list (and related on post page) container +.related { + padding-top: 2rem; + padding-bottom: 2rem; + margin-bottom: 4em; // visible under post only +} + +//
          style for Archive and in 'Related' under posts +.related-posts { + padding-left: 0; + list-style: none; + font-weight: normal; + a { + color: var(--text-color); + } + li { + margin-top: 1rem; + small { + font-size: .75em; + color: var(--text-color-light); + } + } + li+li { + margin-top: 0rem; + } + +} + +// Tag list boxes +.tag-box { + margin: 2rem 0; + + span { + text-align: center; + display: block; + } + ul { + text-align: center; + color: var(--text-color-light); + list-style-type: none; + margin: .5em 0 1.5em 0; + padding: 0px; + + li { + display: inline-block; + font-weight: $base-font-weight-bold; + font-size: $mobile-font-size; + margin: 0 .5rem; + + a { + color: var (--text-color) + } + } + } + + hr:first-child { + margin-top: 4em; + margin-bottom: 1.5em; //reset + } +} + +// Searchbox in Archive +.searchbox { + position: relative; + overflow: hidden; + margin-top: .3rem; + text-align: center; + + input { + outline: none; + } + input[type=search] { + -webkit-appearance: textfield; + -webkit-box-sizing: content-box; + } + input::-webkit-search-decoration, + input::-webkit-search-cancel-button { + display: none; + } + span.icon-search { + color: inherit; + position: absolute; + margin-left: 0.6em; + margin-top: 0.6em; + z-index: 1; + } + input[type=search] { + width: 50%; + color: var(--text-color-light); + background: var(--code-bg-color); + box-shadow: 0 1px 2px var(--shadow-color); + padding: 9px 10px 9px 38px; + font-size: $base-font-size; + -webkit-transition: all .5s; + -moz-transition: all .5s; + transition: all .5s; + opacity: .5; + } + input[type=search]:focus { + color: var(--text-color); + background: var(--code-bg-color); + box-shadow: 0 1px 2px var(--shadow-color); + width: 70%; + opacity: 1; + } + input:-moz-placeholder { + color: var(--text-color-light); + } + input::-webkit-input-placeholder { + color: var(--text-color-light); + } + @media (max-width: 48rem) { + input[type=search] { + width: 70%; + } + input[type=search]:focus { + width: 80%; + } + } +} + +// Photo in About page +.me { + width: 6.5rem; + border-radius: 100%; + position: relative; +} +@media (max-width: 50em) { + .me { + width: 6.5rem; + margin-top: -4.8rem; + } +} + + +// Read more link on blog page with gradient overlay +.readmore { + position: relative; + text-align: right; + // margin-bottom: -2.5rem; + + a { + font-size: $lead-font-size; + color: var(--link-color); + @include border-slide(left); + } + + &::before { + position: absolute; + top: -125px; + width: 100%; + height: 125px; + content: ''; + display: block; + background: -moz-linear-gradient(bottom, var(--bg-color) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */ + background: -webkit-linear-gradient(bottom, var(--bg-color) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */ + background: linear-gradient(to top, var(--bg-color) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ + z-index: 10 // it needs to cover everything, footnote buttons included + } +} diff --git a/_sass/_footer.scss b/_sass/_footer.scss new file mode 100644 index 0000000..dfa6f1c --- /dev/null +++ b/_sass/_footer.scss @@ -0,0 +1,13 @@ +// Footer +//------------------------------- + +footer { + font-size: 0.85em; + color: var(--text-color-light); + text-align: center; + line-height: $base-line-height; +} + +#disqus_thread { + margin-top: 100px; +} diff --git a/_sass/_header.scss b/_sass/_header.scss new file mode 100644 index 0000000..618e608 --- /dev/null +++ b/_sass/_header.scss @@ -0,0 +1,93 @@ +// Header +//------------------------------- + +header { + overflow: hidden; + margin-bottom: 5rem; +} + +.logo { + font-size: 3.5rem; + font-weight: $base-font-weight-bold; + color: var(--link-color); + + .logosvg { + height: 2.7rem; + -webkit-filter: var(--invert-logo-color); + } +} + +.menu { + float: left; + + ul { + list-style-type: none; + margin-bottom: 0rem; + padding: 0rem; + } + li { + display: inline-block; + margin-right: 1rem; + &:last-child { + margin-right: 0px; + } + a { + color: var(--text-color-light); + font-size: $base-font-size; + font-weight: $base-font-weight; + display: block; + height: 2rem; // reset + .smaller { + font-size: 0.85em; + } + } + } +} + +// Social icons +.social { + float: right; + margin-top: 1.75rem; + ul { + list-style-type: none; + margin: 0; + padding: 0; + } + li { + display: inline-block; + } + li a { + display: block; + color: var(--text-color-light); + text-align: center; + font-size: 1.5rem; + width: 2.5rem; + + // ugly fix needed for theme switcher icon + &:focus { + border: none; + &:focus:hover { + border-bottom: 0.15em solid; + } + } + } +} + +@media (max-width: 48rem) { + header { + margin-bottom: 2rem; + } + .menu, + .social { + @include centered-block(); + } + // fake it till you make it + .logo { + margin-top: 5rem; + .logosvg { + display: block; + margin: -9rem auto 5rem auto; + height: 3rem; + } + } +} diff --git a/_sass/_hero.scss b/_sass/_hero.scss new file mode 100644 index 0000000..9f96794 --- /dev/null +++ b/_sass/_hero.scss @@ -0,0 +1,96 @@ +// Hero +//------------------------------- + +// Hero heading colors +.hero-heading { + &-blog h1 { + font-size: 3.25rem; + margin: auto 5rem; + } + &-post h1 { + font-size: 4.5rem; + margin: auto 5rem; + } + h1 { + color: $hero-heading-color!important; + } + span { + color: $hero-date-color!important; + } + a { + color: $hero-heading-color!important; + } +} + +@media (max-width: 48rem) { + .hero-heading + h1 { + font-size: 2rem; + margin: initial; + } +} + +// Hero hover dummy class, used only in blog layout +.hero-hov { + background: transparent; + transition: background .25s ease; + + &:hover { + background: rgba(0,0,0,.5); + } +} + +// Oversized hero in post layout +.bleed-hero-container { + width: 130%; + height: 130%; + margin: 0 -15% 0 -15%; +} +@media (max-width: 48rem) { + .bleed-hero-container { + width: 110%; + margin: 0 -5% 0- 5%; + } +} + +// Container for hero image source link +.post-source-img { + background-color: rgba(0,0,0,.5); + position: absolute; + visibility: hidden; + bottom: 0; + left: 0; + + span { + font-size: .85em; + padding: .5rem; + } + + .source { + color: #fff; + padding: .5rem; + } + + .source-text { + color: #ccc; + margin-left: 3rem; + } + + + &:hover { + visibility: visible; + transition: all 0.5s ease; + } + &:before { + position: absolute; + font-family: 'icomoon'; + content: '\e894'; + bottom: 0; + left: 0; + padding: .5rem .75rem; + visibility: visible; + } + &:hover:before { + color: #fff; + } +} diff --git a/_sass/_icons.scss b/_sass/_icons.scss new file mode 100644 index 0000000..8760776 --- /dev/null +++ b/_sass/_icons.scss @@ -0,0 +1,74 @@ +@font-face { + font-family: 'icomoon'; + src: url('../vendor/icomoon/icomoon.eot?g4m7fo'); + src: url('../vendor/icomoon/icomoon.eot?g4m7fo#iefix') format('embedded-opentype'), + url('../vendor/icomoon/icomoon.ttf?g4m7fo') format('truetype'), + url('../vendor/icomoon/icomoon.woff?g4m7fo') format('woff'), + url('../vendor/icomoon/icomoon.svg?g4m7fo#icomoon') format('svg'); + font-weight: normal; + font-style: normal; +} + +[class^="icon-"], [class*=" icon-"] { + /* use !important to prevent issues with browser extensions that change fonts */ + font-family: 'icomoon' !important; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + + /* Better Font Rendering =========== */ + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-check_box:before { + content: "\e834"; +} +.icon-warning:before { + content: "\e002"; +} +.icon-local_offer:before { + content: "\e54e"; +} +.icon-more_horiz:before { + content: "\e5d3"; +} +.icon-code:before { + content: "\e86f"; +} +.icon-info:before { + content: "\e88e"; +} +.icon-invert_colors:before { + content: "\e891"; +} +.icon-language:before { + content: "\e894"; +} +.icon-search:before { + content: "\e900"; +} +.icon-invert_colors2:before { + content: "\e901"; +} +.icon-rss_feed:before { + content: "\e902"; +} +.icon-mail_outline:before { + content: "\e903"; +} +.icon-github:before { + content: "\e904"; +} +.icon-stackoverflow:before { + content: "\e905"; +} +.icon-twitter:before { + content: "\e906"; +} +.icon-youtube:before { + content: "\e907"; +} diff --git a/_sass/_jekyll-github.scss b/_sass/_jekyll-github.scss new file mode 100644 index 0000000..3d8218e --- /dev/null +++ b/_sass/_jekyll-github.scss @@ -0,0 +1,67 @@ +/* + * GitHub style for Pygments syntax highlighter, for use with Jekyll + * Courtesy of GitHub.com + */ + +.highlight .c { color: #999988; font-style: italic; } +.highlight .err { color: #a61717; background-color: #e3d2d2; } +.highlight .k { font-weight: bold; } +.highlight .o { font-weight: bold; } +.highlight .cm { color: #999988; font-style: italic; } +.highlight .cp { color: #999999; font-weight: bold; } +.highlight .c1 { color: #999988; font-style: italic; } +.highlight .cs { color: #999999; font-weight: bold; font-style: italic; } +.highlight .gd { color: #000000; background-color: #ffdddd; } +.highlight .gd .x { color: #000000; background-color: #ffaaaa; } +.highlight .ge { font-style: italic; } +.highlight .gr { color: #aa0000; } +.highlight .gh { color: #999999; } +.highlight .gi { color: #000000; background-color: #ddffdd; } +.highlight .gi .x { color: #000000; background-color: #aaffaa; } +.highlight .go { color: #888888; } +.highlight .gp { color: #555555; } +.highlight .gs { font-weight: bold; } +.highlight .gu { color: #800080; font-weight: bold; } +.highlight .gt { color: #aa0000; } +.highlight .kc { font-weight: bold; } +.highlight .kd { font-weight: bold; } +.highlight .kn { font-weight: bold; } +.highlight .kp { font-weight: bold; } +.highlight .kr { font-weight: bold; } +.highlight .kt { color: #445588; font-weight: bold; } +.highlight .m { color: #009999; } +.highlight .s { color: #dd1144; } +.highlight .n { color: #333333; } +.highlight .na { color: teal; } +.highlight .nb { color: #0086b3; } +.highlight .nc { color: #445588; font-weight: bold; } +.highlight .no { color: teal; } +.highlight .ni { color: purple; } +.highlight .ne { color: #990000; font-weight: bold; } +.highlight .nf { color: #990000; font-weight: bold; } +.highlight .nn { color: #555555; } +.highlight .nt { color: navy; } +.highlight .nv { color: teal; } +.highlight .ow { font-weight: bold; } +.highlight .w { color: #bbbbbb; } +.highlight .mf { color: #009999; } +.highlight .mh { color: #009999; } +.highlight .mi { color: #009999; } +.highlight .mo { color: #009999; } +.highlight .sb { color: #dd1144; } +.highlight .sc { color: #dd1144; } +.highlight .sd { color: #dd1144; } +.highlight .s2 { color: #dd1144; } +.highlight .se { color: #dd1144; } +.highlight .sh { color: #dd1144; } +.highlight .si { color: #dd1144; } +.highlight .sx { color: #dd1144; } +.highlight .sr { color: #009926; } +.highlight .s1 { color: #dd1144; } +.highlight .ss { color: #990073; } +.highlight .bp { color: #999999; } +.highlight .vc { color: teal; } +.highlight .vg { color: teal; } +.highlight .vi { color: teal; } +.highlight .il { color: #009999; } +.highlight .gc { color: #999; background-color: #EAF2F5; } diff --git a/_sass/_mixins.scss b/_sass/_mixins.scss new file mode 100644 index 0000000..de44354 --- /dev/null +++ b/_sass/_mixins.scss @@ -0,0 +1,41 @@ +// Mixins +//------------------------------- + +@mixin centered-block() { + display: block; + text-align: center; + width: 100%; + padding: 0px; +} + +@mixin figure2() { + margin-left: -1rem; + margin-right: -1rem; + background-color: var(--code-bg-color); +} + +// Underline slide borders from left/right and back +// FROM left or right +@mixin border-slide($direction) { + position: relative; + border-bottom: 0; + + &:hover, &:focus { + border-bottom: 0; + } + + &:after { + color: inherit; + content: ''; + position: absolute; + bottom: -0.15em; + #{$direction}: 0; + width: 0%; + border-bottom: 0.15em solid; + transition: width 0.25s ease-in-out; + } + + &:hover:after { + width: 100%; + } +} diff --git a/_sass/_notices.scss b/_sass/_notices.scss new file mode 100644 index 0000000..cadb31d --- /dev/null +++ b/_sass/_notices.scss @@ -0,0 +1,66 @@ +// Notice boxes +//------------------------------- +// Idea taken from +// https://github.com/mmistakes/minimal-mistakes/blob/master/_sass/_notices.scss + +@mixin notice($notice_bg, $notice-border-color, $notice-icon, $notice-icon-color) { + padding: 1rem 1rem 1rem 5rem; + background-color: var(--code-bg-color); + font-size: 0.85em; + box-shadow: 0 1px 2px var(--shadow-color); + position: relative; + + &:before { + background-color: $notice-bg; + border: 1px solid $notice-border-color; + position: absolute; + bottom: 0; + left: 0; + height: 100%; + width: 4rem; + content: ''; + } + + &:after { + font-family: 'icomoon'; + content: $notice-icon; + color: $notice-icon-color; + display: block; + font-size: 1.25em; + font-weight: normal; + left: 2rem; + position: absolute; + top: 50%; + transform: translate(-50%, -50%); + } + p:last-child { + margin-bottom: 0; + } +} + +.notice { + $notice-bg: #d6e3ea; + $notice-border-color: rgba(200, 212, 218, .4); + $notice-icon: '\e88e'; + $notice-icon-color: #596267; + + @include notice($notice-bg, $notice-border-color, $notice-icon, $notice-icon-color) +} + +.notice-alert { + $notice-alert-bg: #eae6ca; + $notice-border-color: rgba(222, 218, 192, .4); + $notice-alert-icon: '\e002'; + $notice-alert-icon_color: #77703a; + + @include notice($notice-alert-bg, $notice-border-color, $notice-alert-icon, $notice-alert-icon-color) +} + +.notice-success { + $notice-success-bg: #d6ead8; + $notice-border-color: rgba(202, 220, 204, .4); + $notice-success-icon: '\e834'; + $notice-success-icon_color: #506b53; + + @include notice($notice-success-bg, $notice-border-color, $notice-success-icon, $notice-success-icon-color) +} diff --git a/_sass/_pagination.scss b/_sass/_pagination.scss new file mode 100644 index 0000000..fdb524b --- /dev/null +++ b/_sass/_pagination.scss @@ -0,0 +1,47 @@ +// Pagination +//------------------------------- +// Super lightweight (HTML-wise) blog pagination. `span`s are provided for when there are no more previous or next posts to show. + + +.pagination { + overflow: hidden; + max-width: 30%; + margin: 0 auto 4rem auto; + color: var(--text-color-light); + + > ul { + overflow: hidden; + list-style: none; + max-height: 3rem; + padding: 0; + margin: 2rem 0; + } + hr { + max-width: 100%; + margin-bottom: 0; + } +} + +// Pagination items can be `span`s or `a`s +.pagination-item { + display: inline-block; + width: auto; + + &-prev { + margin-bottom: 0; + float: left; + a { + color: var(--link-color); + @include border-slide(right); + } + } + &-next { + margin-left: -1px; + text-align: right; + float: right; + a { + color: var(--link-color); + @include border-slide(left); + } + } +} diff --git a/_sass/_table.scss b/_sass/_table.scss new file mode 100644 index 0000000..7a0ade4 --- /dev/null +++ b/_sass/_table.scss @@ -0,0 +1,33 @@ +// Tables +//------------------------------- + +table { + font-size: 0.85em; + background-color: var(--code-bg-color); + box-shadow: 0 1px 2px var(--shadow-color); + margin-bottom: 1.5rem; + width: 100%; + border-collapse: collapse; +} + +thead { + text-align: left; + background-color: var(--code-border); + border-bottom: 1px solid var(--table-border-color); +} + +td, +th { + padding: .25rem .5rem; +} + +// No external borders +table th:not(:first-child) { + border-left: 1px solid var(--table-border-color); +} +table td:not(:first-child) { + border-left: 1px solid var(--table-border-color); +} +table tr:not(:first-child) td { + border-top: 1px solid var(--table-border-color); +} diff --git a/_sass/_titles.scss b/_sass/_titles.scss new file mode 100644 index 0000000..2a3ad0d --- /dev/null +++ b/_sass/_titles.scss @@ -0,0 +1,104 @@ +// Centered page, post titles and subtitles +//------------------------------- + +.page-title-container, +.post-title-container { + width: 100%; + margin-bottom: 6rem; + height: 20rem; + + text-align: center; + position: relative; + + h1 { + font-weight: $base-font-weight-bold; + font-size: $post-title-size; + border: 0; // reset + a { + display: block; // slide border needs to cover the whole heading + @include border-slide(left) + } + } + + // heading container + .heading-container { + position: relative; + top: 50%; + transform: translateY(-50%); + } + +} + +// Post meta under post title +.post-meta { + font-weight: $base-font-weight; + font-size: 22px; + color: var(--text-color-light); + + span { + display: inline-block; + margin-top: 0.5rem; + font-size: 0.85em; + + a { + color: var(--text-color-light); + text-transform: lowercase; + margin: .2em .25em; + } + } + +} + +@media (max-width: 48rem) { + .page-title, + .post-title { + height: 10rem; + margin-bottom: 2rem; + + h1 { + font-size: 2.5rem; + } + } + .post-meta { + font-size: $mobile-font-size; + } +} + +// Hero layout off - blog post titles +//------------------------------- +.post-title-container-nohero { + margin-bottom: 4rem; + text-align: center; + + h1 { + margin: 0; + font-size: $blog-title-size; + } +} + +.post-meta-nohero { + margin-top: 0.5rem; + color: var(--text-color-light); + font-weight: $base-font-weight; + font-size: 0.75em; + + a { + color: var(--text-color-light); + margin: 0 .25em; + text-transform: lowercase; + } +} + +.post-meta-link-nohero { + margin: 0 .5em 0 .5em; +} + +.no-hero-margin { + margin-bottom: 0rem; // margin reset +} + +@media (max-width: 48rem) { + .post-title-container-nohero h1 { + font-size: 2rem; + } + } diff --git a/_sass/_variables.scss b/_sass/_variables.scss new file mode 100644 index 0000000..73dd021 --- /dev/null +++ b/_sass/_variables.scss @@ -0,0 +1,22 @@ +// Variables +//------------------------------- + +$sans-serif: -apple-system, BlinkMacSystemFont, San Francisco Text, Helvetica, Arial, "Helvetica Neue", Roboto, "Segoe UI", sans-serif; +$serif: Menlo, Monaco, Courier, monospace, serif; +// $base-font-family: $sans-serif; +$base-font-weight: 400; +$base-font-weight-bold: 700; + +$base-font-size: 20px; +$mobile-font-size: 18px; +$lead-font-size: 1.15em; +$blog-title-size: 2.5rem; +$post-title-size: 4.25rem; +$base-line-height: 1.6; +$code-line-height: 1.4; + +$footnote-font-size: 0.75em; +$magic: 1.618em; + +$hero-heading-color: #fff; +$hero-date-color: #ccc; diff --git a/about.markdown b/about.markdown deleted file mode 100644 index 8b4e0b2..0000000 --- a/about.markdown +++ /dev/null @@ -1,18 +0,0 @@ ---- -layout: page -title: About -permalink: /about/ ---- - -This is the base Jekyll theme. You can find out more info about customizing your Jekyll theme, as well as basic Jekyll usage documentation at [jekyllrb.com](https://jekyllrb.com/) - -You can find the source code for Minima at GitHub: -[jekyll][jekyll-organization] / -[minima](https://github.com/jekyll/minima) - -You can find the source code for Jekyll at GitHub: -[jekyll][jekyll-organization] / -[jekyll](https://github.com/jekyll/jekyll) - - -[jekyll-organization]: https://github.com/jekyll diff --git a/about.md b/about.md new file mode 100644 index 0000000..f9f1d58 --- /dev/null +++ b/about.md @@ -0,0 +1,25 @@ +--- +layout: page +title: About +permalink: /about/ +published: true +--- + +
          + +{% capture page_subtitle %} +{{ author.name }} +{% endcapture %} + +{% include page/title.html title=page.title subtitle=page_subtitle %} + +## Some heading + +I'll alert the crew. Sure. You'd be surprised how far a hug goes with Geordi, or Worf. Did you come here for something in particular or just general Riker-bashing? You did exactly what you had to do. You considered all your options, you tried every alternative and then you made the hard choice. Your shields were failing, sir. Well, that's certainly good to know. A surprise party? Mr. Worf, I hate surprise parties. I would *never* do that to you. And blowing into maximum warp speed, you appeared for an instant to be in two places at once. How long can two people talk about nothing? I recommend you don't fire until you're within 40,000 kilometers. Congratulations - you just destroyed the Enterprise. Worf, It's better than music. It's jazz. Yes, absolutely, I do indeed concur, wholeheartedly! What's a knock-out like you doing in a computer-generated gin joint like this? I can't. As much as I care about you, my first duty is to the ship. Some days you get the bear, and some days the bear gets you. + +
          diff --git a/archive.md b/archive.md new file mode 100644 index 0000000..ce65b5c --- /dev/null +++ b/archive.md @@ -0,0 +1,51 @@ +--- +layout: page +title: Archive +permalink: /archive/ +weight: 5 +sitemap: + priority: 0.9 +--- + +
          + +{% capture page_subtitle %} + {% include page/searchbox.html %} +{% endcapture %} + +{% include page/title.html title=page.title subtitle=page_subtitle %} + + {% for post in site.posts %} + + {% assign category = site.my_categories | where: "slug", post.category %} + {% assign category = category[0] %} + {% if category %} + {% capture category_content %}{{ category.name }}{% endcapture %} + {% endif %} + + {% capture month %}{{ post.date | date: '%m%Y' }}{% endcapture %} + {% capture nmonth %}{{ post.next.date | date: '%m%Y' }}{% endcapture %} + {% if month != nmonth %} + {% if forloop.index != 1 %} +
        + {% endif %} +

        {% include utils/date_custom_short.html date = post.date %}

        + + + + {% comment %} + {% include utils/tag-box.html %} + {% endcomment %} + + +
    diff --git a/assets/css/bf.scss b/assets/css/bf.scss new file mode 100644 index 0000000..b541762 --- /dev/null +++ b/assets/css/bf.scss @@ -0,0 +1,7 @@ +--- +# Only the main Sass file needs front matter (the dashes are enough) +sitemap: + exclude: 'yes' +--- +@import "variables"; +@import "barefoot"; diff --git a/assets/css/main.scss b/assets/css/main.scss new file mode 100644 index 0000000..23a4050 --- /dev/null +++ b/assets/css/main.scss @@ -0,0 +1,30 @@ +--- +# Only the main Sass file needs front matter (the dashes are enough) +sitemap: + exclude: 'yes' +--- +@charset "utf-8"; + +@import "mixins"; +@import "variables"; + +@import "base"; + +@import "header"; +@import "articles"; +@import "titles"; +@import "hero"; + +@import "components"; + +@import "notices"; +@import "blockquote"; +@import "table"; +@import "code"; + +@import "404"; +@import "jekyll-github"; +@import "pagination"; +@import "footer"; + +@import "icons"; diff --git a/assets/img/default_hero.png b/assets/img/default_hero.png new file mode 100644 index 0000000..ffdae31 Binary files /dev/null and b/assets/img/default_hero.png differ diff --git a/assets/img/minetesticon.png b/assets/img/minetesticon.png new file mode 100644 index 0000000..9359b77 Binary files /dev/null and b/assets/img/minetesticon.png differ diff --git a/assets/img/searchico.svg b/assets/img/searchico.svg new file mode 100644 index 0000000..c4494f7 --- /dev/null +++ b/assets/img/searchico.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/assets/js/barefoot.js b/assets/js/barefoot.js new file mode 100644 index 0000000..549052d --- /dev/null +++ b/assets/js/barefoot.js @@ -0,0 +1,497 @@ +"use strict"; + +var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; + +var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); + +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + +var BareFoot = function () { + /** + * @param {Object} options [Options to configure the script] + * @constructor + */ + + function BareFoot() { + var _this = this; + + var options = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0]; + + _classCallCheck(this, BareFoot); + + var DEFAULTS = { + scope: 'body', + divFootnotesQuery: ".footnotes", + footnotesQuery: "[id^='fn']", + supQuery: 'a[href^="#fnref"]', + fnButtonMarkup: "", + fnContentMarkup: "
    {{FOOTNOTECONTENT}}
    ", + activeCallback: null, + activeBtnClass: 'is-active', + activeFnClass: 'footnote-is-active', + backdropClass: 'footnote-backdrop', + buttonClass: 'footnote-button', + fnContainer: 'footnote-container', + fnClass: 'bf-footnote', + fnContentClass: 'footnote-content', + fnWrapperClass: 'footnote-wrapper', + tooltipClass: 'footnote-tooltip', + fnOnTopClass: 'footnote-is-top' + }; + + // Merges defaults with custom options + this.config = _extends({}, DEFAULTS, options); + + // A selector could select multiple containers + this.divFootnotes = [].slice.call(document.querySelectorAll(this.config.divFootnotesQuery)); + + // Returns if no container + if (!this.divFootnotes) return false; + + // Groups all footnotes within every group. + this.footnotes = this.divFootnotes.map(function (el) { + return el.querySelectorAll(_this.config.footnotesQuery); + }); + + // Polyfill for Element.matches() + // Based on https://davidwalsh.name/element-matches-selector + + Element.prototype.matches = Element.prototype.matches || Element.prototype.mozMatchesSelector || Element.prototype.msMatchesSelector || Element.prototype.oMatchesSelector || Element.prototype.webkitMatchesSelector || function (s) { + return [].indexOf.call(document.querySelectorAll(s), this) !== -1; + }; + + // Polyfill for Element.closest() + // Based on http://stackoverflow.com/questions/18663941/finding-closest-element-without-jquery + + Element.prototype.closest = Element.prototype.closest || function (s) { + var el = this; + + while (el !== null) { + var parent = el.parentElement; + if (parent !== null && parent.matches(s)) { + return parent; + } + el = parent; + } + return null; + }; + + // Calculate vertical scrollbar width + // Inspired by https://davidwalsh.name/detect-scrollbar-width + + var scrollDiv = document.createElement('div'); + scrollDiv.style.cssText = 'width: 100px; height: 100px; overflow: scroll; position: absolute; top: -9999px; visibility: hidden;'; + document.body.appendChild(scrollDiv); + this.scrollBarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth; + document.body.removeChild(scrollDiv); + } + + /** + * Footnotes often have a link to return to the sup, before moving the contents to each individual footnote, we gotta remove this hook to get a clean content. + * @param {String} fnHtml [Html from the footnote] + * @param {String} backId [ID this footnote refers to] + * @return {String} [Clean Html] + */ + + + _createClass(BareFoot, [{ + key: "removeBackLinks", + value: function removeBackLinks(fnHtml, backId) { + if (backId.indexOf(' ') >= 0) { + backId = backId.trim().replace(/\s+/g, "|").replace(/(.*)/g, "($1)"); + } + + if (backId.indexOf('#') === 0) { + backId = backId.slice(1); + } + + var regex = new RegExp("(\\s| )*<\\s*a[^#<]*#" + backId + "[^>]*>(.*?)<\\s*/\\s*a>", "g"); + + return fnHtml.replace(regex, "").replace("[]", ""); + } + + /** + * Builds the buttons for each footnote based on the configured template. + * @param {String} ref [ID this element refers to] + * @param {String} id [ID for this element] + * @param {String} n [Number that illustrates the footnote] + * @param {String} content [Footnote content] + * @return {String} [Html Markup] + */ + + }, { + key: "buildButton", + value: function buildButton(ref, id, n, content) { + return this.config.fnButtonMarkup.replace(/\{\{FOOTNOTEREFID\}\}/g, ref).replace(/\{\{FOOTNOTEID\}\}/g, id).replace(/\{\{FOOTNOTENUMBER\}\}/g, n).replace(/\{\{FOOTNOTECONTENT\}\}/g, content); + } + + /** + * Builds the content for each footnote based on the configured template. + * @param {String} id [ID from the parent of this element] + * @param {String} content [Footnote content] + * @return {String} [Html Markup] + */ + + }, { + key: "buildContent", + value: function buildContent(id, content) { + return this.config.fnContentMarkup.replace(/\{\{FOOTNOTEID\}\}/g, id).replace(/\{\{FOOTNOTECONTENT\}\}/g, content); + } + + /** + * Triggers whenever an user clicks a footnote button and is responsible to coordinate all the necessary steps to show and position the footnotes. + * @param {Event} e [Event] + */ + + }, { + key: "clickAction", + value: function clickAction(e) { + var btn = void 0, + content = void 0, + id = void 0, + fnHtml = void 0, + fn = void 0, + windowHeight = void 0, + scrollHeight = void 0, + returnOnDismiss = void 0; + + btn = e.target; + content = btn.getAttribute('data-fn-content'); + id = btn.getAttribute("data-footnote"); + returnOnDismiss = btn.classList.contains('is-active'); + + // We calculate the document.documentElement.scrollHeight before inserting the footnote, so later (at the calculateSpacing function to be more specific), we can check if there's any overflow to the bottom of the page, if so it flips the footnote to the top. + scrollHeight = this.getScrollHeight(); + + this.dismissFootnotes(); + + if (returnOnDismiss) { + return; + } + + fnHtml = this.buildContent(id, content); + btn.insertAdjacentHTML('afterend', fnHtml); + fn = btn.nextElementSibling; + + // Position and flip the footnote on demand. + this.calculateOffset(fn, btn); + this.calculateSpacing(fn, scrollHeight); + + btn.classList.add(this.config.activeBtnClass); + fn.classList.add(this.config.activeFnClass); + + // Focus is set on the footnote content, this looks kinda ugly but allows keyboard navigation and scrolling when the content overflow. I have a gut feeling this is good, so I'm sticking to it. All the help to improve accessibility is welcome. + fn.querySelector("." + this.config.fnContentClass).focus(); + + // As far as I recall, touch devices require a tweak to dismiss footnotes when you tap the body outside the footnote, this is the tweak. + if ('ontouchstart' in document.documentElement) { + document.body.classList.add(this.config.backdropClass); + } + + // Triggers the activeCallback if there's any. I never used and never tested this, but I'm passing the button and the footnote as parameters because I think that's all you may expect. + if (this.config.activeCallback) { + this.config.activeCallback(btn, fn); + } + } + + /** + * Mathematical Hell. This function repositions the footnote according to the edges of the screen. The goal is to never (gonna give you up) overflow content. Also, remember when we calculated the scrollBarWidth? This is where we use it in case the footnote overflows to the right. + * @param {Element} fn [Footnote Node] + * @param {Element} btn [Button Node] + */ + + }, { + key: "calculateOffset", + value: function calculateOffset(fn, btn) { + var tooltip = void 0, + container = void 0, + btnOffset = void 0, + btnWidth = void 0, + contWidth = void 0, + contOffset = void 0, + wrapWidth = void 0, + wrapMove = void 0, + wrapOffset = void 0, + tipWidth = void 0, + tipOffset = void 0, + windowWidth = void 0; + + btn = btn || fn.previousElementSibling; + + btnOffset = btn.offsetLeft; + btnWidth = btn.offsetWidth; + tooltip = fn.querySelector("." + this.config.tooltipClass); + tipWidth = tooltip.clientWidth; + container = fn.parentNode; + contWidth = container.clientWidth; + contOffset = container.offsetLeft; + wrapWidth = fn.offsetWidth; + wrapMove = -(wrapWidth / 2 - contWidth / 2); + windowWidth = window.innerWidth || window.availWidth; + + // Footnote overflows to the left + if (contOffset + wrapMove < 0) { + wrapMove = wrapMove - (contOffset + wrapMove); + } + // Footnote overflows to the right + else if (contOffset + wrapMove + wrapWidth + this.scrollBarWidth > windowWidth) { + wrapMove = wrapMove - (contOffset + wrapMove + wrapWidth + this.scrollBarWidth + contWidth / 2 - windowWidth); + } + + fn.style.left = wrapMove + "px"; + wrapOffset = contOffset + wrapMove; + tipOffset = contOffset - wrapOffset + contWidth / 2 - tipWidth / 2; + tooltip.style.left = tipOffset + "px"; + } + + /** + * Removes element, mostly used for footnotes. + * @param {Element} el + */ + + }, { + key: "removeFootnoteChild", + value: function removeFootnoteChild(el) { + return el.parentNode.removeChild(el); + } + + /** + * Delays and withholds function triggering in events. Based on https://davidwalsh.name/javascript-debounce-function + * @param {Function} func [The function to after the delays] + * @param {Number} wait [The delay in milliseconds] + * @param {Boolean} immediate [if true, triggers the function on the leading edge rather than the trailing] + * @return {Function} [It's a closure, what did you expect?] + */ + + }, { + key: "debounce", + value: function debounce(func, wait, immediate) { + var timeout; + return function () { + var _this2 = this; + + for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + var later = function later() { + timeout = null; + if (!immediate) func.apply(_this2, args); + }; + + clearTimeout(timeout); + timeout = setTimeout(later, wait); + if (immediate && !timeout) func.apply(this, args); + }; + } + + /** + * Action to be attached to the resize event and recalculate the position of the active footnotes. + */ + + }, { + key: "resizeAction", + value: function resizeAction() { + var _this3 = this; + + var footnotes = document.querySelectorAll("." + this.config.activeFnClass); + + if (footnotes.length) { + [].forEach.call(footnotes, function (fn) { + _this3.calculateOffset(fn); + _this3.calculateSpacing(fn); + }); + } + } + + /** + * Returns the height of the document. Used to find out if the footnote overflows the content + * @return {Number} [see description] + */ + + }, { + key: "getScrollHeight", + value: function getScrollHeight() { + return document.documentElement.scrollHeight; + } + + /** + * Calculates if the footnote should appear above or below the button + * @param {Element} fn [The footnote in question] + * @param {Number} height [By now the footnote is about to show up and we use the previous value, this one, to check if the footnote is overflow the document] + */ + + }, { + key: "calculateSpacing", + value: function calculateSpacing(fn, height) { + var bcr = void 0, + bch = void 0, + bcb = void 0, + margins = void 0, + windowHeight = void 0; + margins = this.calculateMargins(fn); + windowHeight = window.innerHeight || window.availHeight; + + bcr = fn.getBoundingClientRect(); + bch = bcr.height; + bcb = bcr.bottom; + + if (height < this.getScrollHeight() || bcb > windowHeight - margins.bottom) { + fn.classList.add(this.config.fnOnTopClass); + } else if (windowHeight - (bch + margins.top) > bcb && fn.classList.contains(this.config.fnOnTopClass)) { + fn.classList.remove(this.config.fnOnTopClass); + } + } + + /** + * Action to be attached to the scroll event to verify if we should change the position of the footnote using the available space. + */ + + }, { + key: "scrollAction", + value: function scrollAction() { + var _this4 = this; + + var footnotes = document.querySelectorAll("." + this.config.activeFnClass); + + if (footnotes.length) { + var windowHeight = window.innerHeight || window.availHeight, + margins = this.calculateMargins(footnotes[0]); + + [].forEach.call(footnotes, function (el) { + _this4.calculateSpacing(el); + }); + } + } + + /** + * Returns the computed margins of an element, used to calculate the position and spacing. + * @param {Element} fn [The footnote] + * @return {Object} [An object containing all margins] + */ + + }, { + key: "calculateMargins", + value: function calculateMargins(fn) { + var computedStyle = window.getComputedStyle(fn, null); + return { + top: parseFloat(computedStyle.marginTop), + right: parseFloat(computedStyle.marginRight), + bottom: parseFloat(computedStyle.marginBottom), + left: parseFloat(computedStyle.marginLeft) + }; + } + + /** + * This is set on click and touchend events for the body and removes the footnotes when you click/tap outside them + * @param {Event} + */ + + }, { + key: "documentAction", + value: function documentAction(ev) { + if (!ev.target.closest("." + this.config.fnContainer)) this.dismissFootnotes(); + } + + /** + * Dismisses active footnotes when the ESC key is hit and the current active element is a footnote. Returns focus to the footnote button. + * @param {Event} e + */ + + }, { + key: "dismissOnEsc", + value: function dismissOnEsc(ev) { + if (ev.keyCode === 27 && document.activeElement.matches("." + this.config.fnContentClass)) { + document.activeElement.closest("." + this.config.activeFnClass).previousElementSibling.focus(); + return this.dismissFootnotes(); + } + } + + /** + * Removes all open footnotes (and also the backdrop, remember it?) + */ + + }, { + key: "dismissFootnotes", + value: function dismissFootnotes() { + var _this5 = this; + + var footnotes = document.querySelectorAll("." + this.config.activeFnClass); + + if (footnotes.length) { + [].forEach.call(footnotes, function (el) { + el.previousElementSibling.classList.remove(_this5.config.activeBtnClass); + el.addEventListener('transitionend', _this5.removeFootnoteChild(el), false); + el.classList.remove(_this5.config.activeFnClass); + }); + } + + if (document.body.classList.contains(this.config.backdropClass)) document.body.classList.remove(this.config.backdropClass); + } + + /** + * Opens pandora's box. This function crosses every footnote and makes all the replacements and then sets up every eventListener for the script to work. + */ + + }, { + key: "init", + value: function init() { + var _this6 = this; + + [].forEach.call(this.footnotes, function (fns, i) { + var currentScope = fns[0].closest(_this6.config.scope); + + [].forEach.call(fns, function (fn, i) { + var fnContent = void 0, + fnHrefId = void 0, + fnId = void 0, + ref = void 0, + fnRefN = void 0, + footnote = void 0; + + fnRefN = i + 1; + fnHrefId = fn.querySelector(_this6.config.supQuery).getAttribute('href'); + + fnContent = _this6.removeBackLinks(fn.innerHTML.trim(), fnHrefId); + + fnContent = fnContent.replace(/"/g, """).replace(/</g, "<sym;").replace(/>/g, ">sym;"); + + if (fnContent.indexOf("<") !== 0) fnContent = "

    " + fnContent + "

    "; + + // Gotta escape `:` used within a querySelector so JS doesn't think you're looking for a pseudo-element. + ref = currentScope.querySelector(fnHrefId.replace(':', '\\:')); + + footnote = "
    " + _this6.buildButton(fnHrefId, fn.id, fnRefN, fnContent) + "
    "; + + ref.insertAdjacentHTML('afterend', footnote); + ref.parentNode.removeChild(ref); + }); + }); + + // Setting up events + + [].forEach.call(document.querySelectorAll("." + this.config.buttonClass), function (el) { + el.addEventListener("click", _this6.clickAction.bind(_this6)); + }); + + window.addEventListener("resize", this.debounce(this.resizeAction.bind(this), 100)); + window.addEventListener("scroll", this.debounce(this.scrollAction.bind(this), 100)); + window.addEventListener("keyup", this.dismissOnEsc.bind(this)); + document.body.addEventListener("click", this.documentAction.bind(this)); + document.body.addEventListener("touchend", this.documentAction.bind(this)); + + this.divFootnotes.forEach(function (el) { + return el.parentNode.removeChild(el); + }); + } + }]); + + return BareFoot; +}(); + +// initiate + +var lf = new BareFoot({ + scope: "article" +}); +lf.init(); diff --git a/assets/js/staticman.js b/assets/js/staticman.js new file mode 100644 index 0000000..151bd78 --- /dev/null +++ b/assets/js/staticman.js @@ -0,0 +1,98 @@ +// Staticman comment replies +// modified from Wordpress https://core.svn.wordpress.org/trunk/wp-includes/js/comment-reply.js +var addComment = { + moveForm: function( commId, parentId, respondId, postId ) { + var div, element, style, cssHidden, + t = this, + comm = t.I( commId ), + respond = t.I( respondId ), + cancel = t.I( 'cancel-comment-reply-link' ), + parent = t.I( 'comment-parent' ), + post = t.I( 'comment-post-slug' ), + commentForm = respond.getElementsByTagName( 'form' )[0]; + + if ( ! comm || ! respond || ! cancel || ! parent || ! commentForm ) { + return; + } + + t.respondId = respondId; + postId = postId || false; + + if ( ! t.I( 'sm-temp-form-div' ) ) { + div = document.createElement( 'div' ); + div.id = 'sm-temp-form-div'; + div.style.display = 'none'; + respond.parentNode.insertBefore( div, respond ); + } + + comm.parentNode.insertBefore( respond, comm.nextSibling ); + if ( post && postId ) { + post.value = postId; + } + parent.value = parentId; + cancel.style.display = ''; + + cancel.onclick = function() { + var t = addComment, + temp = t.I( 'sm-temp-form-div' ), + respond = t.I( t.respondId ); + + if ( ! temp || ! respond ) { + return; + } + + t.I( 'comment-parent' ).value = '0'; + temp.parentNode.insertBefore( respond, temp ); + temp.parentNode.removeChild( temp ); + this.style.display = 'none'; + this.onclick = null; + return false; + }; + + /* + * Set initial focus to the first form focusable element. + * Try/catch used just to avoid errors in IE 7- which return visibility + * 'inherit' when the visibility value is inherited from an ancestor. + */ + try { + for ( var i = 0; i < commentForm.elements.length; i++ ) { + element = commentForm.elements[i]; + cssHidden = false; + + // Modern browsers. + if ( 'getComputedStyle' in window ) { + style = window.getComputedStyle( element ); + // IE 8. + } else if ( document.documentElement.currentStyle ) { + style = element.currentStyle; + } + + /* + * For display none, do the same thing jQuery does. For visibility, + * check the element computed style since browsers are already doing + * the job for us. In fact, the visibility computed style is the actual + * computed value and already takes into account the element ancestors. + */ + if ( ( element.offsetWidth <= 0 && element.offsetHeight <= 0 ) || style.visibility === 'hidden' ) { + cssHidden = true; + } + + // Skip form elements that are hidden or disabled. + if ( 'hidden' === element.type || element.disabled || cssHidden ) { + continue; + } + + element.focus(); + // Stop after the first focusable element. + break; + } + + } catch( er ) {} + + return false; + }, + + I: function( id ) { + return document.getElementById( id ); + } +}; \ No newline at end of file diff --git a/assets/js/theme.js b/assets/js/theme.js new file mode 100644 index 0000000..7cb73c0 --- /dev/null +++ b/assets/js/theme.js @@ -0,0 +1,111 @@ +// Theme switcher based on CSS variables made by Fernardo Paredes +// https://www.fdp.io/blog/2016/11/08/theming-via-css-properties/ + +// Polyfilling Object.entries for Safari :/ +Object.entries = (object) => Object.keys(object).map( + (key) => [ key, object[key] ] +) + +const isObject = (obj) => obj === Object(obj) + +const LightTheme = { + '--bg-color': '#eee', + '--text-color': '#484848', + '--text-color-light': '#828282', + '--link-color': '#000', + '--metadata-color': '#999', + '--post-title': '#313131', + '--code-bg-color': '#fff', + '--code-border': '#f5f5f5', + '--table-border-color': '#e5e5e5', + '--table-header-color': '#fefefe', + '--shadow-color': 'rgba(0, 0, 0, 0.1)', + '--invert-logo-color': 'invert(0)', + themeName: 'LightTheme' +} + +const NightTheme = { + '--bg-color': '#1c1c1c', + '--text-color': '#c4c4c4', + '--text-color-light': '#777', + '--link-color': '#f1f1f1', + '--metadata-color': '#666', + '--post-title': '#fff', + '--code-bg-color': '#252525', + '--code-border': '#222', + '--table-border-color': '#292929', + '--table-header-color': '#505050', + '--shadow-color': 'rgba(255, 255, 255, 0.1)', + '--invert-logo-color': 'invert(1)', + themeName: 'NightTheme' +} + +const setCSSVariable = (key, value) => document.body.style.setProperty(key, value) + +const saveTheme = (theme) => { + if (window.localStorage) { + localStorage['theme'] = JSON.stringify(theme) + localStorage['currentTheme'] = theme.themeName + } +} + +const loadSavedTheme = () => { + if (window.localStorage) { + const maybeTheme = localStorage['theme'] + if (maybeTheme) return JSON.parse(maybeTheme) + } + + return null +} + +const updateTheme = (theme) => { + if (!isObject(theme)) return + + Object + .entries(theme) + .forEach(([key, value]) => setCSSVariable(key, value)) + + saveTheme(theme) +} + +const checkForSavedTheme = () => { + const theme = loadSavedTheme() + if (theme) updateTheme(theme) +} + +const switchTheme = () => { + const el = document.getElementById('theme-switcher') + // Check if we have a saved theme + const theme = loadSavedTheme() + const currentTheme = localStorage['currentTheme'] + if (theme && currentTheme === NightTheme.themeName) { + updateTheme(LightTheme) + el.className = iconForTheme(LightTheme.themeName) + } else { + updateTheme(NightTheme) + el.className = iconForTheme(NightTheme.themeName) + } +} + +const iconForTheme = (themeName) => { + if (themeName === NightTheme.themeName) { + return 'icon-invert_colors' + } else { + return 'icon-invert_colors2' + } +} + +// initiate + +// set inital theme to light +updateTheme(LightTheme); +checkForSavedTheme(); + +const el = document.getElementById('theme-switcher'); + +if (window.localStorage && localStorage['currentTheme']) { + var iconClasses = iconForTheme(localStorage['currentTheme']); + el.className = iconClasses; +} else { + el.className = iconForTheme(); +} diff --git a/assets/vendor/icomoon/icomoon.eot b/assets/vendor/icomoon/icomoon.eot new file mode 100644 index 0000000..e7376e9 Binary files /dev/null and b/assets/vendor/icomoon/icomoon.eot differ diff --git a/assets/vendor/icomoon/icomoon.svg b/assets/vendor/icomoon/icomoon.svg new file mode 100644 index 0000000..e0cc1d0 --- /dev/null +++ b/assets/vendor/icomoon/icomoon.svg @@ -0,0 +1,26 @@ + + + +Generated by IcoMoon + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/assets/vendor/icomoon/icomoon.ttf b/assets/vendor/icomoon/icomoon.ttf new file mode 100644 index 0000000..e26bd17 Binary files /dev/null and b/assets/vendor/icomoon/icomoon.ttf differ diff --git a/assets/vendor/icomoon/icomoon.woff b/assets/vendor/icomoon/icomoon.woff new file mode 100644 index 0000000..562027b Binary files /dev/null and b/assets/vendor/icomoon/icomoon.woff differ diff --git a/assets/vendor/normalize-css/normalize.css b/assets/vendor/normalize-css/normalize.css new file mode 100644 index 0000000..5e5e3c8 --- /dev/null +++ b/assets/vendor/normalize-css/normalize.css @@ -0,0 +1,424 @@ +/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ + +/** + * 1. Set default font family to sans-serif. + * 2. Prevent iOS and IE text size adjust after device orientation change, + * without disabling user zoom. + */ + +html { + font-family: sans-serif; /* 1 */ + -ms-text-size-adjust: 100%; /* 2 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} + +/** + * Remove default margin. + */ + +body { + margin: 0; +} + +/* HTML5 display definitions + ========================================================================== */ + +/** + * Correct `block` display not defined for any HTML5 element in IE 8/9. + * Correct `block` display not defined for `details` or `summary` in IE 10/11 + * and Firefox. + * Correct `block` display not defined for `main` in IE 11. + */ + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +main, +menu, +nav, +section, +summary { + display: block; +} + +/** + * 1. Correct `inline-block` display not defined in IE 8/9. + * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. + */ + +audio, +canvas, +progress, +video { + display: inline-block; /* 1 */ + vertical-align: baseline; /* 2 */ +} + +/** + * Prevent modern browsers from displaying `audio` without controls. + * Remove excess height in iOS 5 devices. + */ + +audio:not([controls]) { + display: none; + height: 0; +} + +/** + * Address `[hidden]` styling not present in IE 8/9/10. + * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22. + */ + +[hidden], +template { + display: none; +} + +/* Links + ========================================================================== */ + +/** + * Remove the gray background color from active links in IE 10. + */ + +a { + background-color: transparent; +} + +/** + * Improve readability of focused elements when they are also in an + * active/hover state. + */ + +a:active, +a:hover { + outline: 0; +} + +/* Text-level semantics + ========================================================================== */ + +/** + * Address styling not present in IE 8/9/10/11, Safari, and Chrome. + */ + +abbr[title] { + border-bottom: 1px dotted; +} + +/** + * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. + */ + +b, +strong { + font-weight: bold; +} + +/** + * Address styling not present in Safari and Chrome. + */ + +dfn { + font-style: italic; +} + +/** + * Address variable `h1` font-size and margin within `section` and `article` + * contexts in Firefox 4+, Safari, and Chrome. + */ + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +/** + * Address styling not present in IE 8/9. + */ + +mark { + background: #ff0; + color: #000; +} + +/** + * Address inconsistent and variable font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` affecting `line-height` in all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} + +/* Embedded content + ========================================================================== */ + +/** + * Remove border when inside `a` element in IE 8/9/10. + */ + +img { + border: 0; +} + +/** + * Correct overflow not hidden in IE 9/10/11. + */ + +svg:not(:root) { + overflow: hidden; +} + +/* Grouping content + ========================================================================== */ + +/** + * Address margin not present in IE 8/9 and Safari. + */ + +figure { + margin: 1em 40px; +} + +/** + * Address differences between Firefox and other browsers. + */ + +hr { + box-sizing: content-box; + height: 0; +} + +/** + * Contain overflow in all browsers. + */ + +pre { + overflow: auto; +} + +/** + * Address odd `em`-unit font size rendering in all browsers. + */ + +code, +kbd, +pre, +samp { + font-family: monospace, monospace; + font-size: 1em; +} + +/* Forms + ========================================================================== */ + +/** + * Known limitation: by default, Chrome and Safari on OS X allow very limited + * styling of `select`, unless a `border` property is set. + */ + +/** + * 1. Correct color not being inherited. + * Known issue: affects color of disabled elements. + * 2. Correct font properties not being inherited. + * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. + */ + +button, +input, +optgroup, +select, +textarea { + color: inherit; /* 1 */ + font: inherit; /* 2 */ + margin: 0; /* 3 */ +} + +/** + * Address `overflow` set to `hidden` in IE 8/9/10/11. + */ + +button { + overflow: visible; +} + +/** + * Address inconsistent `text-transform` inheritance for `button` and `select`. + * All other form control elements do not inherit `text-transform` values. + * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. + * Correct `select` style inheritance in Firefox. + */ + +button, +select { + text-transform: none; +} + +/** + * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` + * and `video` controls. + * 2. Correct inability to style clickable `input` types in iOS. + * 3. Improve usability and consistency of cursor style between image-type + * `input` and others. + */ + +button, +html input[type="button"], /* 1 */ +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button; /* 2 */ + cursor: pointer; /* 3 */ +} + +/** + * Re-set default cursor for disabled elements. + */ + +button[disabled], +html input[disabled] { + cursor: default; +} + +/** + * Remove inner padding and border in Firefox 4+. + */ + +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} + +/** + * Address Firefox 4+ setting `line-height` on `input` using `!important` in + * the UA stylesheet. + */ + +input { + line-height: normal; +} + +/** + * It's recommended that you don't attempt to style these elements. + * Firefox's implementation doesn't respect box-sizing, padding, or width. + * + * 1. Address box sizing set to `content-box` in IE 8/9/10. + * 2. Remove excess padding in IE 8/9/10. + */ + +input[type="checkbox"], +input[type="radio"] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * Fix the cursor style for Chrome's increment/decrement buttons. For certain + * `font-size` values of the `input`, it causes the cursor style of the + * decrement button to change from `default` to `text`. + */ + +input[type="number"]::-webkit-inner-spin-button, +input[type="number"]::-webkit-outer-spin-button { + height: auto; +} + +/** + * 1. Address `appearance` set to `searchfield` in Safari and Chrome. + * 2. Address `box-sizing` set to `border-box` in Safari and Chrome. + */ + +input[type="search"] { + -webkit-appearance: textfield; /* 1 */ + box-sizing: content-box; /* 2 */ +} + +/** + * Remove inner padding and search cancel button in Safari and Chrome on OS X. + * Safari (but not Chrome) clips the cancel button when the search input has + * padding (and `textfield` appearance). + */ + +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * Define consistent border, margin, and padding. + */ + +fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} + +/** + * 1. Correct `color` not being inherited in IE 8/9/10/11. + * 2. Remove padding so people aren't caught out if they zero out fieldsets. + */ + +legend { + border: 0; /* 1 */ + padding: 0; /* 2 */ +} + +/** + * Remove default vertical scrollbar in IE 8/9/10/11. + */ + +textarea { + overflow: auto; +} + +/** + * Don't inherit the `font-weight` (applied by a rule above). + * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. + */ + +optgroup { + font-weight: bold; +} + +/* Tables + ========================================================================== */ + +/** + * Remove most spacing between table cells. + */ + +table { + border-collapse: collapse; + border-spacing: 0; +} + +td, +th { + padding: 0; +} diff --git a/feed.xml b/feed.xml new file mode 100644 index 0000000..3dc7511 --- /dev/null +++ b/feed.xml @@ -0,0 +1,32 @@ +--- +layout: null +sitemap: + exclude: 'yes' +--- + + + + {{ site.blog.title | xml_escape }} + {{ site.blog.description | xml_escape }} + {{ site.url }}{{ site.baseurl }}/ + + {{ site.time | date_to_rfc822 }} + {{ site.time | date_to_rfc822 }} + Jekyll v{{ jekyll.version }} + {% for post in site.posts limit:10 %} + + {{ post.title | xml_escape }} + {{ post.content | xml_escape }} + {{ post.date | date_to_rfc822 }} + {{ post.url | prepend: site.baseurl | prepend: site.url }} + {{ post.url | prepend: site.baseurl | prepend: site.url }} + {% for tag in post.tags %} + {{ tag | xml_escape }} + {% endfor %} + {% for cat in post.categories %} + {{ cat | xml_escape }} + {% endfor %} + + {% endfor %} + + diff --git a/index.html b/index.html new file mode 100644 index 0000000..b14e594 --- /dev/null +++ b/index.html @@ -0,0 +1,4 @@ +--- +layout: blog +title: Blog +--- diff --git a/index.markdown b/index.markdown deleted file mode 100644 index 0671507..0000000 --- a/index.markdown +++ /dev/null @@ -1,6 +0,0 @@ ---- -# 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 ---- diff --git a/robots.txt b/robots.txt new file mode 100644 index 0000000..690230f --- /dev/null +++ b/robots.txt @@ -0,0 +1,9 @@ +--- +layout: null +sitemap: + exclude: 'yes' +--- +User-agent: * +Disallow: + +Sitemap: {{ site.url }}/sitemap.xml diff --git a/sitemap.xml b/sitemap.xml new file mode 100644 index 0000000..3fdc7a0 --- /dev/null +++ b/sitemap.xml @@ -0,0 +1,56 @@ +--- +layout: null +sitemap: + exclude: 'yes' +--- + + + {% for post in site.posts %} + {% unless post.published == false %} + + {{ site.url }}{{ post.url }}/ + {% if post.sitemap.lastmod %} + {{ post.sitemap.lastmod | date: "%Y-%m-%d" }} + {% elsif post.date %} + {{ post.date | date_to_xmlschema }} + {% else %} + {{ site.time | date_to_xmlschema }} + {% endif %} + {% if post.sitemap.changefreq %} + {{ post.sitemap.changefreq }} + {% else %} + monthly + {% endif %} + {% if post.sitemap.priority %} + {{ post.sitemap.priority }} + {% else %} + 0.7 + {% endif %} + + {% endunless %} + {% endfor %} + {% for page in site.pages %} + {% unless page.sitemap.exclude == "yes" %} + + {{ site.url }}{{ page.url | remove: "index.html" }} + {% if page.sitemap.lastmod %} + {{ page.sitemap.lastmod | date: "%Y-%m-%d" }} + {% elsif page.date %} + {{ page.date | date_to_xmlschema }} + {% else %} + {{ site.time | date_to_xmlschema }} + {% endif %} + {% if page.sitemap.changefreq %} + {{ page.sitemap.changefreq }} + {% else %} + monthly + {% endif %} + {% if page.sitemap.priority %} + {{ page.sitemap.priority }} + {% else %} + 0.5 + {% endif %} + + {% endunless %} + {% endfor %} + diff --git a/uploads/me.png b/uploads/me.png new file mode 100644 index 0000000..f3071a5 Binary files /dev/null and b/uploads/me.png differ diff --git a/uploads/me2.png b/uploads/me2.png new file mode 100644 index 0000000..f3071a5 Binary files /dev/null and b/uploads/me2.png differ diff --git a/uploads/screenshot_desktop_dark.jpg b/uploads/screenshot_desktop_dark.jpg new file mode 100644 index 0000000..96d421c Binary files /dev/null and b/uploads/screenshot_desktop_dark.jpg differ diff --git a/uploads/screenshot_desktop_light.jpg b/uploads/screenshot_desktop_light.jpg new file mode 100644 index 0000000..3a897b4 Binary files /dev/null and b/uploads/screenshot_desktop_light.jpg differ