├── .github ├── PULL_REQUEST_TEMPLATE.md └── workflows │ └── build.yml ├── .gitignore ├── .travis.yml ├── 404.md ├── CNAME ├── Gemfile ├── LICENSE.txt ├── README.md ├── Rakefile ├── _config.yml ├── _includes ├── ajaxify_content_form.html ├── footer.html ├── head.html ├── header.html ├── navigation.html ├── pagination.html ├── post_footer.html ├── share_buttons.html └── social_links.html ├── _layouts ├── center.html ├── default.html ├── page.html └── post.html ├── _posts ├── 2014-06-08-pixyll-has-pagination.md ├── 2014-06-09-so-what-is-jekyll.md ├── 2014-06-10-see-pixyll-in-action.md ├── 2014-06-11-welcome-to-pixyll.markdown ├── 2015-07-11-announcing-pixyll-version-2.md └── 2019-01-26-guide-to-forking-pixyll.md ├── _sass ├── _animations.scss ├── _base.scss ├── _basscss.scss ├── _blockquotes.scss ├── _clearfix.scss ├── _code.scss ├── _footer.scss ├── _forms.scss ├── _gists.scss ├── _header.scss ├── _links.scss ├── _measure.scss ├── _media-queries.scss ├── _pagination.scss ├── _positions.scss ├── _posts.scss ├── _social-icons.scss ├── _tables.scss ├── _typography.scss ├── _variables.scss └── basscss │ ├── _base-buttons.scss │ ├── _base-forms.scss │ ├── _base-reset.scss │ ├── _base-typography.scss │ ├── _buttons-blue.scss │ ├── _color-base.scss │ ├── _colors.scss │ ├── _syntax-highlighting.scss │ ├── _utility-headings.scss │ ├── _utility-typography.scss │ └── _utility-white-space.scss ├── about.md ├── apple-touch-icon-114x114.png ├── apple-touch-icon-120x120.png ├── apple-touch-icon-144x144.png ├── apple-touch-icon-152x152.png ├── apple-touch-icon-180x180.png ├── apple-touch-icon-57x57.png ├── apple-touch-icon-60x60.png ├── apple-touch-icon-72x72.png ├── apple-touch-icon-76x76.png ├── apple-touch-icon.png ├── appveyor.yml ├── contact.html ├── css └── pixyll.scss ├── favicon-160x160.png ├── favicon-16x16.png ├── favicon-192x192.png ├── favicon-32x32.png ├── favicon-96x96.png ├── favicon.ico ├── fb-instant-articles.xml ├── feed.xml ├── images └── me.jpeg ├── index.html ├── manifest.json ├── screenshot.png ├── splash-512x512.png ├── sw.js └── thanks.md /.github/PULL_REQUEST_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | ## Read this before making a pull request 2 | 3 | ### There's no need to make a pull request against the original repo for personal changes 4 | 5 | You can publish your copy of Pixyll from your fork using GitHub Pages, without ever needing to make a pull request. The original source repository (johno/pixyll) exists as a template. 6 | 7 | To learn more look [here](https://stackoverflow.com/questions/3611256/forking-vs-branching-in-github) 8 | -------------------------------------------------------------------------------- /.github/workflows/build.yml: -------------------------------------------------------------------------------- 1 | name: Build 2 | 3 | on: 4 | push: 5 | branches: 6 | - master 7 | pull_request: 8 | branches: 9 | - master 10 | 11 | jobs: 12 | build: 13 | 14 | runs-on: ubuntu-latest 15 | 16 | steps: 17 | - uses: actions/checkout@v2 18 | - uses: actions/cache@v1 19 | with: 20 | path: vendor/bundle 21 | key: ${{ runner.os }}-gems-${{ hashFiles('Gemfile') }} 22 | restore-keys: | 23 | ${{ runner.os }}-gems- 24 | - name: Set up Ruby 2.7 25 | uses: actions/setup-ruby@v1 26 | with: 27 | ruby-version: 2.7.x 28 | - name: Bundle install 29 | run: | 30 | bundle config path vendor/bundle 31 | bundle install --jobs 4 --retry 3 32 | - name: Build with Jekyll 33 | run: | 34 | bundle exec jekyll build 35 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | _site 2 | .sass-cache 3 | .DS_Store 4 | .jekyll-metadata 5 | 6 | # Ignore the config file that's used for gh-pages. 7 | _config.gh-pages.yml 8 | 9 | Gemfile.lock 10 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: ruby 2 | cache: bundler 3 | rvm: 4 | - 2.5 5 | - 2.6 6 | - 2.7 7 | script: 8 | - bundle exec jekyll build 9 | - rake 'draft[Hello\, world]' 10 | - rake undraft[hello-world.md] 11 | - grep johno/pixyll _site/index.html 12 | - grep post-title _site/index.html 13 | - grep pagination-item _site/index.html 14 | - grep href=.https://pixyll.com/. _site/index.html 15 | - grep johno/pixyll _site/css/pixyll.css 16 | - grep 404 _site/404.html 17 | - grep pixyll.com/sitemap.xml _site/robots.txt 18 | -------------------------------------------------------------------------------- /404.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: center 3 | permalink: /404.html 4 | --- 5 | 6 | # 404 7 | 8 | Sorry, we can't seem to find this page's pixylls. 9 | 10 |
11 | Home 12 | Contact 13 |
14 | -------------------------------------------------------------------------------- /CNAME: -------------------------------------------------------------------------------- 1 | pixyll.com 2 | -------------------------------------------------------------------------------- /Gemfile: -------------------------------------------------------------------------------- 1 | source 'https://rubygems.org' 2 | 3 | # A simple Ruby Gem to bootstrap dependencies for setting up and 4 | # maintaining a local Jekyll environment in sync with GitHub Pages 5 | # https://github.com/github/pages-gem 6 | gem 'github-pages' 7 | -------------------------------------------------------------------------------- /LICENSE.txt: -------------------------------------------------------------------------------- 1 | Copyright (c) 2014-2021 John Otander 2 | Copyright (c) 2014 Daniel Eden for animate.css 3 | Copyright (c) 2014 Brent Jackson for Basscss 4 | Copyright (c) 2013 Twitter, Inc for CSS copied from Bootstrap 5 | 6 | MIT License 7 | 8 | Permission is hereby granted, free of charge, to any person obtaining 9 | a copy of this software and associated documentation files (the 10 | "Software"), to deal in the Software without restriction, including 11 | without limitation the rights to use, copy, modify, merge, publish, 12 | distribute, sublicense, and/or sell copies of the Software, and to 13 | permit persons to whom the Software is furnished to do so, subject to 14 | the following conditions: 15 | 16 | The above copyright notice and this permission notice shall be 17 | included in all copies or substantial portions of the Software. 18 | 19 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 20 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 21 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 22 | NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE 23 | LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION 24 | OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION 25 | WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 26 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Pixyll 2 | 3 | [pixyll.com](https://www.pixyll.com/) 4 | 5 | ![Pixyll screenshot](./screenshot.png) 6 | 7 | Pixyll is a simple, beautiful theme for Jekyll that emphasizes content rather than aesthetic fluff. It's mobile _first_, fluidly responsive, and delightfully lightweight. 8 | 9 | It's pretty minimal, but leverages large type and drastic contrast to make a statement, on all devices. 10 | 11 | This Jekyll theme was crafted with <3 by [John Otander](https://johno.com/) 12 | ([@4lpine](https://twitter.com/4lpine)). 13 | 14 | 中文版 . 15 | 16 | ## Getting Started 17 | 18 | If you're completely new to Jekyll, I recommend checking out the documentation at or there's a tutorial by [Smashing Magazine](https://www.smashingmagazine.com/2014/08/build-blog-jekyll-github-pages/). 19 | 20 | ``` 21 | $ git clone git@github.com:johno/pixyll.git 22 | $ cd pixyll 23 | $ gem install bundler # If you don't have bundler installed 24 | $ bundle install 25 | ``` 26 | 27 | #### Verify your Jekyll version 28 | 29 | It's important to also check your version of Jekyll since this project uses new `baseurl` features that are [only supported in 3.3+](https://jekyllrb.com/news/2016/10/06/jekyll-3-3-is-here/). 30 | 31 | ### Fork, then clone 32 | 33 | Fork the repo, and then clone it so you've got the code locally. 34 | 35 | 36 | ### Modify the `_config.yml` 37 | 38 | The `_config.yml` located in the root of the Pixyll directory contains all of the configuration details 39 | for the Jekyll site. The defaults are: 40 | 41 | ```yml 42 | # Site settings 43 | title: Pixyll 44 | email: your_email@example.com 45 | author: John Otander 46 | description: "A simple, beautiful theme for Jekyll that emphasizes content rather than aesthetic fluff." 47 | baseurl: "" 48 | url: "https://pixyll.com/" 49 | 50 | # Build settings 51 | markdown: kramdown 52 | permalink: pretty 53 | paginate: 3 54 | ``` 55 | 56 | ### Jekyll Serve 57 | 58 | Then, start the Jekyll Server. I always like to give the `--watch` option so it updates the generated HTML when I make changes. 59 | 60 | ``` 61 | $ jekyll serve --watch 62 | ``` 63 | 64 | Now you can navigate to `localhost:4000` in your browser to see the site. 65 | 66 | ### Using Github Pages 67 | 68 | You can host your Jekyll site for free with Github Pages. [Click here](https://pages.github.com/) for more information. 69 | 70 | #### A configuration tweak if you're using a gh-pages sub-folder 71 | 72 | In addition to your github-username.github.io repo that maps to the root url, you can serve up sites by using a gh-pages branch for other repos so they're available at github-username.github.io/repo-name. 73 | 74 | This will require you to modify the `_config.yml` like so: 75 | 76 | ```yml 77 | # Site settings 78 | title: Repo Name 79 | email: your_email@example.com 80 | author: John Otander 81 | description: "Repo description" 82 | baseurl: "/repo-name" 83 | url: "https://github-username.github.io" 84 | 85 | # Build settings 86 | markdown: kramdown 87 | permalink: pretty 88 | paginate: 3 89 | ``` 90 | 91 | This will ensure that the the correct relative path is constructed for your assets and posts. Also, in order to run the project locally, you will need to specify the blank string for the baseurl: `$ jekyll serve --baseurl ''`. 92 | 93 | ##### If you don't want the header to link back to the root url 94 | 95 | You will also need to tweak the header include `/{{ site.baseurl }}`: 96 | 97 | ```html 98 |
99 |
100 |
101 | {{ site.title }} 102 | 105 |
106 |
107 |
108 | ``` 109 | 110 | A relevant Jekyll Github Issue: 111 | 112 | ### Contact Form 113 | 114 | The contact form uses . It will require you to fill the form out and submit it once, before going live, to confirm your email. 115 | 116 | More setup instructions and advanced options can be found at [https://formspree.io](https://formspree.io/) 117 | 118 | 119 | ### Disqus 120 | 121 | To configure Disqus, set up a [Disqus site](https://disqus.com/admin/create/) with the same name as your site. Then, in `_config.yml`, edit the `disqus_shortname` value to enable Disqus. 122 | 123 | ### Customizing the CSS 124 | 125 | All variables can be found in the `_sass/_variables.scss` file, toggle these as you'd like to change the look and feel of Pixyll. 126 | 127 | ### Page Animation 128 | 129 | If you would like to add a [fade-in-down effect](https://animate.style/), you can add `animated: true` to your `_config.yml`. 130 | 131 | ### AnchorJS 132 | 133 | [AnchorJS](https://github.com/bryanbraun/anchorjs): _A JavaScript utility for adding deep anchor links to existing page content. AnchorJS is lightweight, accessible, and has no dependencies._ You can turn it on by toggling `enable_anchorjs`. Because it offers many ways for customization, tweaks should be done in `_includes/footer.html`. Default settings after turning AnchorJS on are: 134 | 135 | ```html 136 | 140 | ``` 141 | 142 | See [documentation](https://www.bryanbraun.com/anchorjs/#basic-usage) for more options. 143 | 144 | ### Put in a Pixyll Plug 145 | 146 | If you want to give credit to the Pixyll theme with a link to or my personal website somewhere, that'd be awesome. No worries if you don't. 147 | 148 | ### Web analytics and search engines 149 | 150 | You can measure visits to your website either by using [Google Analytics](https://www.google.com/analytics/) tracking embed or the more advanced [Google Tag Manager](https://www.google.com/analytics/tag-manager/) container. 151 | * For Google Analytics set up the value for `google_analytics`, it should be something like `google_analytics: UA-XXXXXXXX-X` or `google_analytics: G-XXXXXXX` depending on whether you are using universal analytics or not. 152 | * For Google Tag Manager set up the value for `google_tag_manager`, it should be something like: `google_tag_manager: GTM-XXXXX`. 153 | * _Do not_ set both of above methods because this will cause conflicts and skew your reporting data. 154 | * Remember that you need to properly configure the GTM container in its admin panel if you want it to work. More info is available in [GTM's docs](https://www.google.com/analytics/tag-manager/resources/). 155 | 156 | Your website is, by default, set to be allowed for crawling and indexing by search engines. (Unless you made yourself a custom robots.txt file). You can use front matter settings on each page to control how search engines will it. Sometimes you may want to exclude a particular page from indexing or forbid Google to store a copy of your page in its cache. It is up to you. Use the `meta_robots` frontmatter key and assign values based on [this table](https://developers.google.com/webmasters/control-crawl-index/docs/robots_meta_tag?hl=en#valid-indexing--serving-directives). Some examples: 157 | 158 | ```yaml 159 | # exclude page from index 160 | meta_robots: noindex 161 | 162 | # allow indexing, disallow caching 163 | meta_robots: noarchive 164 | 165 | # allow indexing, disallow crawling links 166 | meta_robots: nofollow 167 | 168 | # disallow indexing, follow links 169 | meta_robots: noindex,follow 170 | ``` 171 | 172 | In order to get more information about your website's status in search engines, you can register it in [Google Search Console](https://search.google.com/search-console/about) and/or [Bing Webmaster Tools](https://www.bing.com/webmasters/about). Both these tools will ask you to authorize your website with them and there are couple of ways to do that. Pixyll supports verification via meta tags - just fill in values for `google_verification` and/or `bing_verification` in `_config.yml`, the verification strings and meta tags will then be added automatically. 173 | 174 | If search engine optimization is your thing, you can also set up `meta_description` values for each page/post. By default Pixyll uses `summary` to populate the `` tag and falls back to `description` from `_config.yml` if `summary` is not present in page/post's front matter. The `summary` is also used for generating Open Graph tags. Why would you want to use a dedicated variable for meta description? Because character limit to properly display this description in search results (as a snippet) is way smaller than in Open Graph. It is recommended to keep it at 155-160 characters, for more in-depth info read [this article](https://moz.com/blog/i-cant-drive-155-meta-descriptions-in-2015). 175 | 176 | And lastly - if you happen to write in language other than English be sure to change `og_locale` in `_config.yml` to reflect it. 177 | 178 | ### Progressive Web App 179 | 180 | Pixyll supports features of a progressive web app (PWA). As a PWA, your site's home page can be installed as a shortcut or an app icon on a mobile device. Also, certain assets are cached so the site can be accessed should the device be offline from the network. 181 | 182 | Pixyll supports these features because it provides a Javascript file that acts as a *service worker* in the browser and has a JSON file with a *web manifest*. By default, these are configured to the settings of Pixyll, but you should consider cutomizing them to your specific site: 183 | 184 | 1. Provide a different version of `splash-512x512.png` which is the loading screen for your offline app. 185 | 2. A `favicon-192x192.png` for the app icon (if you haven't already). 186 | 3. In `sw.js`, list any other files or pages you want to add to the list of cached artifacts. 187 | 188 | For more information on PWAs: 189 | 190 | - https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps 191 | - https://web.dev/what-are-pwas/ 192 | 193 | ### Enjoy 194 | 195 | I hope you enjoy using Pixyll. If you encounter any issues, please feel free to let me know by creating an [issue](https://github.com/johno/pixyll/issues). I'd love to help. 196 | 197 | ## Upgrading Pixyll 198 | 199 | Pixyll is always being improved by its users, so sometimes one may need to upgrade. 200 | 201 | #### Ensure there's an upstream remote 202 | 203 | If `git remote -v` doesn't have an upstream listed, you can do the following to add it: 204 | 205 | ``` 206 | git remote add upstream https://github.com/johno/pixyll.git 207 | ``` 208 | 209 | #### Pull in the latest changes 210 | 211 | ``` 212 | git pull upstream master 213 | ``` 214 | 215 | There may be merge conflicts, so be sure to fix the files that git lists if they occur. That's it! 216 | 217 | ## Thanks to the following 218 | 219 | * [BASSCSS](https://basscss.com/) 220 | * [Jekyll](https://jekyllrb.com/) 221 | * [Refills](https://refills.bourbon.io/) 222 | * [Solarized](https://ethanschoonover.com/solarized/) 223 | * [Animate.css](https://animate.style/) 224 | 225 | ## Contributing 226 | 227 | 1. Fork it 228 | 2. Create your feature branch (`git checkout -b my-new-feature`) 229 | 3. Commit your changes (`git commit -am 'Add some feature'`) 230 | 4. Push to the branch (`git push origin my-new-feature`) 231 | 5. Create new Pull Request 232 | 233 | ## Forking 234 | 235 | There is a [guide to forking Pixyll](https://pixyll.com/jekyll/pixyll/2019/01/26/guide-to-forking-pixyll/). 236 | -------------------------------------------------------------------------------- /Rakefile: -------------------------------------------------------------------------------- 1 | drafts_dir = '_drafts' 2 | posts_dir = '_posts' 3 | 4 | # rake post['my new post'] 5 | desc 'create a new post with "rake post[\'post title\']"' 6 | task :post, :title do |t, args| 7 | if args.title 8 | title = args.title 9 | else 10 | puts "Please try again. Remember to include the filename." 11 | end 12 | mkdir_p "#{posts_dir}" 13 | filename = "#{posts_dir}/#{Time.now.strftime('%Y-%m-%d')}-#{title.downcase.gsub(/[^\w]+/, '-')}.md" 14 | puts "Creating new post: #{filename}" 15 | File.open(filename, "w") do |f| 16 | f << <<-EOS.gsub(/^ /, '') 17 | --- 18 | layout: post 19 | title: #{title} 20 | date: #{Time.new.strftime('%Y-%m-%d %H:%M')} 21 | categories: 22 | --- 23 | 24 | EOS 25 | end 26 | 27 | # Uncomment the line below if you want the post to automatically open in your default text editor 28 | # system ("#{ENV['EDITOR']} #{filename}") 29 | end 30 | 31 | # usage: rake draft['my new draft'] 32 | desc 'create a new draft post with "rake draft[\'draft title\']"' 33 | task :draft, :title do |t, args| 34 | if args.title 35 | title = args.title 36 | else 37 | puts "Please try again. Remember to include the filename." 38 | end 39 | mkdir_p "#{drafts_dir}" 40 | filename = "#{drafts_dir}/#{title.downcase.gsub(/[^\w]+/, '-')}.md" 41 | puts "Creating new draft: #{filename}" 42 | File.open(filename, "w") do |f| 43 | f << <<-EOS.gsub(/^ /, '') 44 | --- 45 | layout: post 46 | title: #{title} 47 | date: #{Time.new.strftime('%Y-%m-%d %H:%M')} 48 | categories: 49 | --- 50 | 51 | EOS 52 | end 53 | 54 | # Uncomment the line below if you want the draft to automatically open in your default text editor 55 | # system ("#{ENV['EDITOR']} #{filename}") 56 | end 57 | 58 | desc 'preview the site with drafts' 59 | task :preview do 60 | puts "## Generating site" 61 | puts "## Stop with ^C ( +C )" 62 | system "jekyll serve --watch --drafts" 63 | end 64 | 65 | # usage: rake undraft['my-file.md'] 66 | desc 'publish a draft post with "rake undraft[\'draft-file.md\']"' 67 | task :undraft, :file do |t, args| 68 | if args.file 69 | file = args.file 70 | else 71 | abort "Please try again. Remember to include the file name." 72 | end 73 | 74 | draft = "#{drafts_dir}/#{file}" 75 | unless File.exists?(draft) 76 | abort "Draft does not exist: #{draft}" 77 | end 78 | 79 | today = Time.now 80 | post = "#{posts_dir}/#{today.strftime('%Y-%m-%d')}-#{file}" 81 | 82 | # Slurp file in to memory 83 | lines = IO.readlines(draft).map do |line| 84 | dateline = /\s*^date:\s*(.*)\s*$/.match(line) 85 | if dateline 86 | puts "Original date of draft: #{dateline[1]}" 87 | "date: #{today.strftime('%Y-%m-%d %H:%M')}" 88 | else 89 | line 90 | end 91 | end 92 | 93 | print "Moving #{draft} to #{post}..." 94 | FileUtils.mv(draft, post) 95 | puts "done." 96 | 97 | print "Modifying date for post to '#{today.strftime('%Y-%m-%d %H:%M')}'..." 98 | File.open(post, 'w') do |file| 99 | file.puts lines 100 | end 101 | puts "done." 102 | 103 | # Uncomment the line below if you want the post to automatically open in your default text editor 104 | # system ("#{ENV['EDITOR']} #{post}") 105 | end 106 | 107 | desc 'list tasks' 108 | task :list do 109 | puts "Tasks: #{(Rake::Task.tasks - [Rake::Task[:list]]).join(', ')}" 110 | puts "(type rake -T for more detail)\n\n" 111 | end 112 | -------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | # Site settings 2 | title: Pixyll 3 | email: your_email@example.com 4 | author: John Otander 5 | description: "A simple, beautiful theme for Jekyll that emphasizes content rather than aesthetic fluff." 6 | baseurl: "" 7 | url: "https://pixyll.com" 8 | date_format: "%b %-d, %Y" 9 | header_pages: 10 | - about.md 11 | - contact.html 12 | 13 | # Google services 14 | google_verification: 15 | # Use either direct GA implementation or set up GTM account 16 | # - using both will skew your data (leave blank to not use at all) 17 | google_analytics: 18 | google_tag_manager: 19 | # Bing services 20 | bing_verification: 21 | 22 | # Optional features 23 | animated: false 24 | show_related_posts: false 25 | show_post_footers: false 26 | show_social_icons: false 27 | ajaxify_contact_form: false 28 | enable_mathjax: false 29 | extended_fonts: false 30 | enable_anchorjs: false 31 | # Preview image for social media aka og:image and twitter:image 32 | post_preview_image: false 33 | 34 | # Facebook Page integration 35 | # (for instant articles and other stuff) 36 | fb_page: false 37 | fb_page_id: 38 | 39 | # Disqus post comments 40 | # (leave blank to disable Disqus) 41 | disqus_shortname: 42 | 43 | # Facebook Comments plugin 44 | # (leave blank to disable Facebook Comments, otherwise set it to true) 45 | facebook_comments: 46 | facebook_appid: 47 | facebook_comments_number: 10 48 | 49 | # Social icons 50 | github_username: 51 | reddit_username: 52 | bitbucket_username: 53 | stackoverflow_id: 54 | twitter_username: 55 | skype_username: 56 | steam_nickname: 57 | google_plus_id: 58 | linkedin_username: 59 | angellist_username: 60 | medium_id: 61 | bitcoin_url: 62 | paypal_url: 63 | flattr_button: 64 | telegram_username: 65 | vk_id: 66 | 67 | # Post sharing icons 68 | show_sharing_icons: false 69 | # Change to 'true' to enable individual icons 70 | share_facebook: false 71 | share_twitter: false 72 | share_googleplus: false 73 | share_linkedin: false 74 | share_digg: false 75 | share_tumblr: false 76 | share_reddit: false 77 | share_stumbleupon: false 78 | share_hackernews: false 79 | 80 | text: 81 | pagination: 82 | newer: 'Newer' 83 | older: 'Older' 84 | share_buttons: 85 | text: 'Share this post!' 86 | facebook: 'Share on Facebook' 87 | twitter: 'Share on Twitter' 88 | googleplus: 'Share on Google+' 89 | linkedin: 'Share on LinkedIn' 90 | digg: 'Share on Digg' 91 | tumblr: 'Share on Tumblr' 92 | reddit: 'Share on Reddit' 93 | stumbleupon: 'Share on StumbleUpon' 94 | hackernews: 'Share on Hacker News' 95 | post: 96 | updated: 'Updated' 97 | minute_read: 'minute read' 98 | related_posts: 'Related Posts' 99 | index: 100 | coming_soon: 'Coming soon...' 101 | contact: 102 | email: 'Email Address' 103 | content: 'What would you like to say?' 104 | subject: 'New submission!' 105 | submit: 'Say Hello' 106 | ajax: 107 | sending: 'sending..' 108 | sent: 'Message sent!' 109 | error: 'Error!' 110 | thanks: 'Thanks for contacting us. We will reply as soon as possible.' 111 | og_locale: 'en_US' 112 | 113 | # Build settings 114 | markdown: kramdown 115 | redcarpet: 116 | extensions: ['smart', 'tables', 'with_toc_data'] 117 | permalink: pretty 118 | paginate: 4 119 | sass: 120 | style: compressed 121 | plugins: 122 | - jekyll-paginate 123 | - jekyll-sitemap 124 | # https://github.com/jekyll/jekyll/issues/2938 125 | exclude: 126 | - Gemfile 127 | - Gemfile.lock 128 | - Rakefile 129 | - README.md 130 | - screenshot.png 131 | - vendor 132 | -------------------------------------------------------------------------------- /_includes/ajaxify_content_form.html: -------------------------------------------------------------------------------- 1 | 31 | -------------------------------------------------------------------------------- /_includes/footer.html: -------------------------------------------------------------------------------- 1 | 9 | {% if site.enable_anchorjs %} 10 | 11 | {% endif %} 15 | 20 | -------------------------------------------------------------------------------- /_includes/head.html: -------------------------------------------------------------------------------- 1 | 2 | {% if site.google_tag_manager %} 3 | 8 | {% endif %} 9 | 10 | 11 | {% if page.title %}{{ page.title | strip_html }} – {% endif %}{{ site.title | strip_html }} 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | {% if page.meta_robots %} 20 | {% else %}{% endif %} 21 | 22 | {% if site.fb_page %}{% endif %} 23 | {% if page.categories %}{% endif %} 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | {% if site.extended_fonts %} 32 | 33 | 34 | {% else %} 35 | 36 | 37 | {% endif %} 38 | {% if site.show_social_icons or site.show_sharing_icons %} 39 | 40 | {% endif %} 41 | 42 | 43 | {% if site.enable_mathjax %} 44 | 47 | {% endif %} 48 | 49 | 50 | {% if site.google_verification %} 51 | 52 | {% endif %} 53 | {% if site.bing_verification %} 54 | 55 | {% endif %} 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | {% if site.post_preview_image %} 66 | 67 | {% endif %} 68 | 69 | 70 | 71 | {% if site.twitter_username %} 72 | 73 | 74 | {% endif %} 75 | 76 | 77 | 78 | {% if site.post_preview_image %} 79 | 80 | {% endif %} 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | {% if site.google_analytics %} 100 | 108 | {% endif %} 109 | 110 | -------------------------------------------------------------------------------- /_includes/header.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 | {{ site.title }} 5 | 8 |
9 | {% if site.show_social_icons %} 10 | {% include social_links.html %} 11 | {% endif %} 12 |
13 |
14 |
15 | -------------------------------------------------------------------------------- /_includes/navigation.html: -------------------------------------------------------------------------------- 1 | {% assign default_paths = site.pages | map: "path" %} 2 | {% assign page_paths = site.header_pages | default: default_paths %} 3 | 4 | {% for path in page_paths %} 5 | 6 | {% assign item = site.pages | where: "path", path | first %} 7 | 8 | {% if item.title and page.title == item.title %} 9 | {{ item.title }} 10 | {% elsif item.title %} 11 | {{ item.title }} 12 | {% endif %} 13 | 14 | 15 | {% endfor %} 16 | -------------------------------------------------------------------------------- /_includes/pagination.html: -------------------------------------------------------------------------------- 1 | {% if paginator.total_pages != 1 %} 2 | 23 | {% endif %} 24 | -------------------------------------------------------------------------------- /_includes/post_footer.html: -------------------------------------------------------------------------------- 1 |
2 | John Otander 3 |

4 | Pixyll is an open-source Jekyll theme that's built by John Otander. 5 | When he's not writing code and building things, he likes to ski. A. Lot. 6 |

7 |

8 | Follow him on Twitter. 9 |

10 |
11 | -------------------------------------------------------------------------------- /_includes/share_buttons.html: -------------------------------------------------------------------------------- 1 | 42 | -------------------------------------------------------------------------------- /_includes/social_links.html: -------------------------------------------------------------------------------- 1 | 59 |
60 | -------------------------------------------------------------------------------- /_layouts/center.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | {% include head.html %} 4 | 5 | {% if site.google_tag_manager %} 6 | 8 | {% endif %} 9 | {% if site.facebook_comments %} 10 |
11 | 18 | {% endif %} 19 | 20 |
21 | {% include header.html %} 22 | 23 |
24 |
25 | {{ content }} 26 |
27 |
28 |
29 | 30 | {% include footer.html %} 31 | 32 | 33 | -------------------------------------------------------------------------------- /_layouts/default.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | {% include head.html %} 4 | 5 | {% if site.google_tag_manager %} 6 | 8 | {% endif %} 9 | {% if site.facebook_comments %} 10 |
11 | 18 | {% endif %} 19 | 20 |
21 | {% include header.html %} 22 | 23 |
24 |
25 | {{ content }} 26 |
27 |
28 |
29 | 30 | {% include footer.html %} 31 | 32 | 33 | -------------------------------------------------------------------------------- /_layouts/page.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 |
5 |
6 |

{{ page.title }}

7 |
8 |
9 | {{ content }} 10 |
11 |
12 | -------------------------------------------------------------------------------- /_layouts/post.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | 5 | {% assign minutes = content | strip_html | number_of_words | divided_by: 180 %} 6 | {% if minutes == 0 %} 7 | {% assign minutes = 1 %} 8 | {% endif %} 9 | 10 |
11 |

{{ page.title }}

12 | {{ page.date | date: site.date_format }}
13 | {% if page.update_date %} 14 | {{ site.text.post.updated | default: "Updated" }}: {{ page.update_date | date: site.date_format }}
15 | {% endif %} 16 | 17 | {% if page.minutes %} 18 | {{ page.minutes }} {{ site.text.post.minute_read | default: "minute read" }} 19 | {% else %} 20 | {{ minutes }} {{ site.text.post.minute_read | default: "minute read" }} 21 | {% endif %} 22 | 23 |
24 | 25 |
26 | {{ content }} 27 |
28 | 29 | {% if site.show_sharing_icons %} 30 | {% include share_buttons.html %} 31 | {% endif %} 32 | 33 | {% if site.show_post_footers %} 34 | {% include post_footer.html %} 35 | {% endif %} 36 | 37 | {% if site.disqus_shortname %} 38 |
39 | 50 | 51 | {% endif %} 52 | 53 | {% if site.facebook_comments %} 54 |
55 | {% endif %} 56 | 57 | {% if site.show_related_posts %} 58 |

{{ site.text.post.related_posts | default: "Related Posts" }}

59 | {% for post in site.related_posts %} 60 |
61 | 62 |

{{ post.title }}

63 |

{{ post.summary }}

64 | 65 |
66 | {% endfor %} 67 | {% endif %} 68 | -------------------------------------------------------------------------------- /_posts/2014-06-08-pixyll-has-pagination.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Pixyll has Pagination 4 | date: 2014-06-08 11:21:29 5 | summary: This is an empty post to illustrate the pagination component with Pixyll. 6 | categories: jekyll pixyll 7 | --- 8 | 9 | This is an empty post to illustrate the pagination component with Pixyll. 10 | -------------------------------------------------------------------------------- /_posts/2014-06-09-so-what-is-jekyll.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: So, What is Jekyll? 4 | date: 2014-06-09 12:32:18 5 | summary: Transform your plain text into static websites and blogs. Simple, static, and blog-aware. 6 | categories: jekyll pixyll 7 | --- 8 | 9 | Jekyll is a tool for transforming your plain text into static websites and 10 | blogs. It is simple, static, and blog-aware. Jekyll uses the 11 | [Liquid](https://shopify.dev/docs/themes/liquid/reference/basics) templating 12 | language and has builtin [Markdown](https://daringfireball.net/projects/markdown/) 13 | and [Textile](https://en.wikipedia.org/wiki/Textile_(markup_language)) support. 14 | 15 | It also ties in nicely to [GitHub Pages](https://pages.github.com/). 16 | 17 | Learn more about Jekyll on their [website](https://jekyllrb.com/). 18 | -------------------------------------------------------------------------------- /_posts/2014-06-10-see-pixyll-in-action.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Pixyll in Action 4 | date: 2014-06-10 12:31:19 5 | summary: See what the different elements looks like. Your markdown has never looked better. I promise. 6 | categories: jekyll pixyll 7 | --- 8 | 9 | There is a significant amount of subtle, yet precisely calibrated, styling to ensure 10 | that your content is emphasized while still looking aesthetically pleasing. 11 | 12 | All links are easy to [locate and discern](#), yet don't detract from the [harmony 13 | of a paragraph](#). The _same_ goes for italics and __bold__ elements. Even the the strikeout 14 | works if for some reason you need to update your post. For consistency's sake, 15 | The same goes for insertions, of course. 16 | 17 | ### Code, with syntax highlighting 18 | 19 | Here's an example of some ruby code with line anchors. 20 | 21 | {% highlight ruby lineanchors %} 22 | # The most awesome of classes 23 | class Awesome < ActiveRecord::Base 24 | include EvenMoreAwesome 25 | 26 | validates_presence_of :something 27 | validates :email, email_format: true 28 | 29 | def initialize(email, name = nil) 30 | self.email = email 31 | self.name = name 32 | self.favorite_number = 12 33 | puts 'created awesomeness' 34 | end 35 | 36 | def email_format 37 | email =~ /\S+@\S+\.\S+/ 38 | end 39 | end 40 | {% endhighlight %} 41 | 42 | Here's some CSS: 43 | 44 | {% highlight css %} 45 | .foobar { 46 | /* Named colors rule */ 47 | color: tomato; 48 | } 49 | {% endhighlight %} 50 | 51 | Here's some JavaScript: 52 | 53 | {% highlight js %} 54 | var isPresent = require('is-present') 55 | 56 | module.exports = function doStuff(things) { 57 | if (isPresent(things)) { 58 | doOtherStuff(things) 59 | } 60 | } 61 | {% endhighlight %} 62 | 63 | Here's some HTML: 64 | 65 | {% highlight html %} 66 |
67 |

Hello, world!

68 |
69 | {% endhighlight %} 70 | 71 | # Headings! 72 | 73 | They're responsive, and well-proportioned (in `padding`, `line-height`, `margin`, and `font-size`). 74 | They also heavily rely on the awesome utility, [BASSCSS](https://basscss.com/). 75 | 76 | ##### They draw the perfect amount of attention 77 | 78 | This allows your content to have the proper informational and contextual hierarchy. Yay. 79 | 80 | ### There are lists, too 81 | 82 | * Apples 83 | * Oranges 84 | * Potatoes 85 | * Milk 86 | 87 | 1. Mow the lawn 88 | 2. Feed the dog 89 | 3. Dance 90 | 91 | ### Images look great, too 92 | 93 | ![desk](https://cloud.githubusercontent.com/assets/1424573/3378137/abac6d7c-fbe6-11e3-8e09-55745b6a8176.png) 94 | 95 | _![desk](https://cloud.githubusercontent.com/assets/1424573/3378137/abac6d7c-fbe6-11e3-8e09-55745b6a8176.png)_ 96 | 97 | 98 | ### There are also pretty colors 99 | 100 | Also the result of [BASSCSS](https://basscss.com/), you can highlight certain components 101 | of a post with CSS classes. 102 | 103 | I don't recommend using blue, though. It looks like a link. 104 | 105 | ### Footnotes! 106 | 107 | Markdown footnotes are supported, and they look great! Simply put e.g. `[^1]` where you want the footnote to appear,[^1] and then add 108 | the reference at the end of your markdown. 109 | 110 | ### Stylish blockquotes included 111 | 112 | You can use the markdown quote syntax, `>` for simple quotes. 113 | 114 | > Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse quis porta mauris. 115 | 116 | However, you need to inject html if you'd like a citation footer. I will be working on a way to 117 | hopefully sidestep this inconvenience. 118 | 119 |
120 |

121 | Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away. 122 |

123 |
Antoine de Saint-Exupéry
124 |
125 | 126 | 127 | ### Tables 128 | 129 | Tables represent tabular data and can be built using markdown syntax. They are rendered responsively in Pixyll for a variety of screen widths. 130 | 131 | Here's a simple example of a table: 132 | 133 | | Quantity | Description | Price | 134 | |----------+-------------+----------:| 135 | | 2 | Orange | $0.99 | 136 | | 1 | Pineapple | $2.99 | 137 | | 4 | Banana | $0.39 | 138 | |==========|=============|===========| 139 | | | **Total** | **$6.14** | 140 | 141 | A table must have a body of one or more rows, but can optionally also have a header or footer. 142 | 143 | The cells in a column, including the header row cell, can either be aligned: 144 | 145 | - left, 146 | - right or 147 | - center. 148 | 149 | Most inline text formatting is available in table cells, block-level formatting are not. 150 | 151 | |----------------+----------------------+------------------------+----------------------------------| 152 | | Default header | Left header | Center header | Right header | 153 | |----------------|:---------------------|:----------------------:|---------------------------------:| 154 | | Default | Left | Center | Right | 155 | | *Italic* | **Bold** | ***Bold italic*** | `monospace` | 156 | | [link text](#) | ```code``` | ~~Strikeout~~ | Insertion | 157 | | line
break | "Smart quotes" | highlight | green | 158 | | Footnote[^2] | subscript | superscript | red | 159 | |================+======================+========================+==================================+ 160 | | Footer row | 161 | |----------------+----------------------+------------------------+----------------------------------| 162 | 163 | ### There's more being added all the time 164 | 165 | Checkout the [GitHub repository](https://github.com/johno/pixyll) to request, 166 | or add, features. 167 | 168 | Happy writing. 169 | 170 | --- 171 | 172 | [^1]: Important information that may distract from the main text can go in footnotes. 173 | 174 | [^2]: Footnotes will work in tables since they're just links. 175 | -------------------------------------------------------------------------------- /_posts/2014-06-11-welcome-to-pixyll.markdown: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Hello, Pixyll 4 | date: 2014-06-11 15:31:19 5 | summary: Pixyll is a simple, beautiful theme for Jekyll that emphasizes content rather than aesthetic fluff. 6 | categories: jekyll pixyll 7 | --- 8 | 9 | Hello. 10 | 11 | Pixyll is a simple, beautiful theme for Jekyll that emphasizes content rather than aesthetic fluff. It's mobile _first_, fluidly responsive, and delightfully lightweight. 12 | 13 | It's pretty minimal, but leverages large type and drastic contrast to make a statement, on all devices. 14 | 15 |
16 |

17 | Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away. 18 |

19 |
Antoine de Saint-Exupéry
20 |
21 | 22 | ## Where is it? 23 | 24 | Checkout the [GitHub repository](https://github.com/johno/pixyll) to download it, request a feature, or report a bug. 25 | 26 | It's free, and open source ([MIT](https://opensource.org/licenses/MIT)). 27 | -------------------------------------------------------------------------------- /_posts/2015-07-11-announcing-pixyll-version-2.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Announcing Version 2.0 4 | date: 2015-07-11 5 | summary: Now, Pixyll is lighter weight and more customizable than before. 6 | categories: jekyll pixyll 7 | --- 8 | 9 | In an effort to make Pixyll easier to customize and more aesthetically pleasing, we've released version `2.0`. 10 | 11 | Pixyll now features: 12 | 13 | * Line anchors in code blocks and new syntax highlighting 14 | * A customizable variables file 15 | * Modular, and lighter weight CSS 16 | * No more `max-width` media queries 17 | -------------------------------------------------------------------------------- /_posts/2019-01-26-guide-to-forking-pixyll.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: Guide to Forking Pixyll 4 | date: 2019-01-26 19:22 5 | summary: Pixyll is available to you under the MIT license. 6 | categories: jekyll pixyll 7 | --- 8 | 9 | The following is an overview to copying and sharing Pixyll.[^1] 10 | 11 | Most people have an understanding of what the copyright and licensing obligations are for source code, but not everyone has practical experience. There is a lot of information about how to use free and open source source code generally, but not necessarily how it works specifically. 12 | 13 | ## Basics 14 | 15 | Pixyll is free and open source software under the MIT license, a _permissive license_. You can use Pixyll without charge and it is provided to you, "as is", without warranty of any kind. 16 | 17 | These are some of the rights for Pixyll since it is under the MIT license:[^2] 18 | 19 | 1. You can **copy** Pixyll by forking it on GitHub or by any other means of copying. 20 | 2. You can **use** Pixyll to publish your site without restriction or limitation. 21 | 3. You can **change** Pixyll as you wish, and you can publish your site with a modified version of Pixyll. 22 | 4. You can also **distribute** copies of Pixyll to other people. 23 | 5. You can also **distribute modified** copies of Pixyll. 24 | 25 | Other rights you have of Pixyll under the MIT license: 26 | 27 | - You can **sell** copies of Pixyll, including copies you have modified. 28 | - You can **combine** Pixyll with other works that are under the MIT license, or other permissive licenses, a copyleft license or a proprietary license. Pixyll already does this itself by using Jekyll, Ruby and other dependencies. 29 | - You can distribute copies of Pixyll to others under either the MIT license or you can **relicense** Pixyll under another license. This includes a different permissive license, a copyleft license or a proprietary license. 30 | 31 | Your only responsibility is to preserve both the copyright notices of Pixyll and the MIT license in your copy or modified work. 32 | 33 | ## How to 34 | 35 | If you've modified Pixyll significantly and want to share your version, especially public copies of the code, then there are a few items you should do. 36 | 37 | 1. You should probably **rename** your fork of Pixyll with a different name. 38 | 2. A new name isn't required by the MIT license, but it is good etiquette.[^3] 39 | 3. You should add your name to the **copyright** of your version, and you should preserve the existing copyrights of Pixyll. 40 | 4. Maintaining the copyright notices isn't required of the MIT license, but it is suggested by the license and is a good practice for documenting the copyrights of your derived work. 41 | 42 | The items above do not apply when you just copied and modified Pixyll in small ways to just publish your site and you have no plans to fork Pixyll under a different name. 43 | 44 | If you want to publish a fork of Pixyll under a different name but keeping it under the MIT license, then you should add your name to the copyright notices: 45 | 46 | Copyright (c) 2021 Your Name 47 | Copyright (c) 2014-2021 John Otander for Pixyll 48 | 49 | However, if you want to publish a fork of Pixyll under a different name *and* a different license, then you should should still add your name to the copyright notices but have a section titled "Pixyll" at the bottom of your LICENSE file that preserves the copyright and license notices for Pixyll: 50 | 51 | Pixyll 52 | 53 | Copyright (c) 2014-2021 John Otander 54 | 55 | MIT License 56 | 57 | Permission is hereby granted, [...] 58 | 59 | If you are just modifying Pixyll in small ways to customize your site, you are not obligated to maintain the copyright notices of Pixyll on your site. However, if you want to credit the Pixyll theme that would be appreciated, see section on "Pixyll Plug" in the README file that came with Pixyll. 60 | 61 | Thanks for using Pixyll, and happy hacking! 62 | 63 | --- 64 | [^1]: **Disclaimer**: This material is for informational purposes only, and should not be construed as legal advice or opinion. For actual legal advice, you should consult with professional legal services. 65 | [^2]: This list of privileges are derived from the four freedoms of "The Free Software Definition" published by the GNU project . 66 | [^3]: Using a different name from "Pixyll" for your derivate work helps avoid misdirected questions from people who are using your version. It's similar to using version numbers to discrimate the revisions of software when troubleshooting issues. 67 | -------------------------------------------------------------------------------- /_sass/_animations.scss: -------------------------------------------------------------------------------- 1 | /*! 2 | Animate.css - https://animate.style/ 3 | Licensed under the MIT license - https://opensource.org/licenses/MIT 4 | 5 | Copyright (c) 2014 Daniel Eden 6 | */ 7 | 8 | .animated { 9 | -webkit-animation-duration: 1s; 10 | animation-duration: 1s; 11 | -webkit-animation-fill-mode: both; 12 | animation-fill-mode: both; 13 | } 14 | 15 | .animated.infinite { 16 | -webkit-animation-iteration-count: infinite; 17 | animation-iteration-count: infinite; 18 | } 19 | 20 | .animated.hinge { 21 | -webkit-animation-duration: 2s; 22 | animation-duration: 2s; 23 | } 24 | 25 | @-webkit-keyframes fadeInDown { 26 | 0% { 27 | opacity: 0; 28 | -webkit-transform: translateY(-20px); 29 | transform: translateY(-20px); 30 | } 31 | 32 | 100% { 33 | opacity: 1; 34 | -webkit-transform: translateY(0); 35 | transform: translateY(0); 36 | } 37 | } 38 | 39 | @keyframes fadeInDown { 40 | 0% { 41 | opacity: 0; 42 | 43 | -webkit-transform: translateY(-20px) translate3d(0, 0, 0); 44 | -ms-transform: translateY(-20px) translate3d(0, 0, 0); 45 | transform: translateY(-20px) translate3d(0, 0, 0); 46 | } 47 | 48 | 100% { 49 | opacity: 1; 50 | 51 | -webkit-transform: translateY(0) translate3d(0, 0, 0); 52 | -ms-transform: translateY(0) translate3d(0, 0, 0); 53 | transform: translateY(0) translate3d(0, 0, 0); 54 | } 55 | } 56 | 57 | .fade-in-down { 58 | -webkit-animation-name: fadeInDown; 59 | animation-name: fadeInDown; 60 | } 61 | -------------------------------------------------------------------------------- /_sass/_base.scss: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | /*! 3 | 4 | Pixyll 5 | 6 | A simple, beautiful theme for Jekyll that emphasizes content rather than 7 | aesthetic fluff. 8 | 9 | Built upon BASSCSS (https://basscss.com/). 10 | 11 | Crafted with <3 by John Otander (@4lpine) - ©2015-2021 John Otander 12 | MIT License https://opensource.org/licenses/MIT 13 | 14 | */ 15 | 16 | html, body { 17 | height: auto; 18 | min-height: 100%; 19 | } 20 | 21 | img { 22 | max-width: 100%; 23 | } 24 | 25 | em img { 26 | max-width: 100%; 27 | margin-left: 0; 28 | } 29 | 30 | body { 31 | box-sizing: border-box; 32 | -moz-box-sizing: border-box; 33 | -webkit-box-sizing: border-box; 34 | } 35 | -------------------------------------------------------------------------------- /_sass/_basscss.scss: -------------------------------------------------------------------------------- 1 | /*! 2 | 3 | BASSCSS 4 | 5 | Next-level CSS toolkit - basscss.com 6 | 7 | Made with love by Jxnblk - ©2014 Brent Jackson 8 | MIT License https://opensource.org/licenses/MIT 9 | 10 | */ 11 | 12 | @import 'basscss/base-buttons'; 13 | @import 'basscss/base-forms'; 14 | @import 'basscss/base-reset'; 15 | @import 'basscss/base-typography'; 16 | 17 | @import 'basscss/buttons-blue'; 18 | 19 | @import 'basscss/syntax-highlighting'; 20 | @import 'basscss/color-base'; 21 | @import 'basscss/colors'; 22 | 23 | @import 'basscss/utility-headings'; 24 | @import 'basscss/utility-typography'; 25 | @import 'basscss/utility-white-space'; 26 | -------------------------------------------------------------------------------- /_sass/_blockquotes.scss: -------------------------------------------------------------------------------- 1 | blockquote { 2 | border-left: 5px solid #7a7a7a; 3 | font-style: italic; 4 | margin-left: $space-1; 5 | padding: $space-1; 6 | } 7 | 8 | blockquote footer { 9 | background-color: #fff; 10 | border-color: transparent; 11 | color: #7a7a7a; 12 | font-size: .85rem; 13 | font-style: normal; 14 | text-align: left; 15 | padding: 0; 16 | } 17 | -------------------------------------------------------------------------------- /_sass/_clearfix.scss: -------------------------------------------------------------------------------- 1 | .clearfix:before, .clearfix:after { 2 | content: ' '; 3 | display: table; 4 | } 5 | 6 | .clearfix:after { 7 | clear: both; 8 | } 9 | -------------------------------------------------------------------------------- /_sass/_code.scss: -------------------------------------------------------------------------------- 1 | pre, 2 | pre code { 3 | background-color: transparent; 4 | border-radius: $pre-border-radius; 5 | } 6 | 7 | pre, 8 | code { 9 | font-family: $monospace-font-family; 10 | } 11 | 12 | code { 13 | color: #7a7a7a; 14 | } 15 | 16 | pre { 17 | padding: 1.125em; 18 | line-height: 1.11; 19 | overflow-x: scroll; 20 | margin-bottom: 0.88em; 21 | background-color: $pre-background-color; 22 | } 23 | 24 | .highlight .p { 25 | font-size: 1.125rem; 26 | line-height: 1; 27 | } 28 | 29 | pre { 30 | counter-reset: line-numbering; 31 | white-space: pre; 32 | overflow-x: auto; 33 | word-break: inherit; 34 | word-wrap: inherit; 35 | } 36 | 37 | pre a { 38 | background-image: none; 39 | } 40 | 41 | pre a::before { 42 | content: counter(line-numbering); 43 | counter-increment: line-numbering; 44 | padding-right: 1em; /* space after numbers */ 45 | width: 25px; 46 | text-align: right; 47 | opacity: 0.7; 48 | display: inline-block; 49 | color: $light-gray; 50 | margin-right: 16px; 51 | font-size: 13px; 52 | -webkit-touch-callout: none; 53 | -webkit-user-select: none; 54 | -khtml-user-select: none; 55 | -moz-user-select: none; 56 | -ms-user-select: none; 57 | user-select: none; 58 | } 59 | 60 | pre a:first-of-type::before { 61 | padding-top: 10px; 62 | } 63 | 64 | pre a:last-of-type::before { 65 | padding-bottom: 10px; 66 | } 67 | 68 | pre a:only-of-type::before { 69 | padding: 10px; 70 | } 71 | -------------------------------------------------------------------------------- /_sass/_footer.scss: -------------------------------------------------------------------------------- 1 | .site { 2 | display: -webkit-box; 3 | display: -webkit-flex; 4 | display: -ms-flexbox; 5 | display: flex; 6 | -webkit-box-orient: vertical; 7 | -webkit-box-direction: normal; 8 | -webkit-flex-direction: column; 9 | -ms-flex-direction: column; 10 | flex-direction: column; 11 | min-height: 100vh; 12 | } 13 | 14 | .site-wrap { 15 | -webkit-box-flex: 1; 16 | -webkit-flex: 1; 17 | -ms-flex: 1 0 auto; 18 | flex: 1 0 auto; 19 | } 20 | 21 | footer { 22 | background-color: $footer-bg-color; 23 | border-top: $footer-border-top; 24 | color: $footer-color; 25 | font-size: $footer-font-size; 26 | font-weight: $footer-font-weight; 27 | padding: $footer-padding; 28 | text-align: center; 29 | } 30 | -------------------------------------------------------------------------------- /_sass/_forms.scss: -------------------------------------------------------------------------------- 1 | input, 2 | select, 3 | textarea, 4 | fieldset { 5 | font-size: $form-field-font-size; 6 | margin-top: 0; 7 | margin-bottom: $space-1; 8 | } 9 | 10 | input[type=text], 11 | input[type=datetime], 12 | input[type=datetime-local], 13 | input[type=email], 14 | input[type=month], 15 | input[type=number], 16 | input[type=password], 17 | input[type=search], 18 | input[type=tel], 19 | input[type=time], 20 | input[type=url], 21 | input[type=week] { 22 | box-sizing: border-box; 23 | height: $form-field-height; 24 | padding: $form-field-padding-y $form-field-padding-x; 25 | vertical-align: middle; 26 | -webkit-appearance: none; 27 | } 28 | 29 | select { 30 | box-sizing: border-box; 31 | line-height: 1.75; 32 | padding: $form-field-padding-y $form-field-padding-x; 33 | } 34 | 35 | select:not([multiple]) { 36 | height: $form-field-height; 37 | vertical-align: middle; 38 | } 39 | 40 | textarea { 41 | box-sizing: border-box; 42 | line-height: 1.75; 43 | padding: $form-field-padding-y $form-field-padding-x; 44 | } 45 | 46 | .form-stacked input, 47 | .form-stacked textarea, 48 | .form-stacked select { 49 | width: 100%; 50 | } 51 | 52 | .field-light { 53 | background-color: white; 54 | transition: box-shadow .2s ease; 55 | border-style: solid; 56 | border-width: $border-width; 57 | border-color: $border-color; 58 | border-radius: $border-radius; 59 | } 60 | 61 | .field-light:focus { 62 | outline: none; 63 | border-color: $blue; 64 | box-shadow: 0 0 2px rgba($blue,.5); 65 | } 66 | 67 | .field-light:disabled { 68 | color: $mid-gray; 69 | background-color: $darken-2; 70 | } 71 | 72 | .field-light:read-only:not(select) { 73 | background-color: $darken-2; 74 | } 75 | 76 | .field-light:invalid { 77 | border-color: $red; 78 | } 79 | 80 | .field-light.is-success { 81 | border-color: $green; 82 | } 83 | 84 | .field-light.is-warning { 85 | border-color: $yellow; 86 | } 87 | 88 | .field-light.is-error { 89 | border-color: $red; 90 | } 91 | 92 | 93 | .radio-light, 94 | .checkbox-light { 95 | transition: box-shadow .2s ease; 96 | } 97 | 98 | .radio-light { 99 | border-radius: 50%; 100 | } 101 | 102 | .radio-light:focus, 103 | .checkbox-light:focus { 104 | outline: none; 105 | box-shadow: 0 0 2px rgba($blue, .5); 106 | } 107 | -------------------------------------------------------------------------------- /_sass/_gists.scss: -------------------------------------------------------------------------------- 1 | .gist, 2 | .gist .highlight .p { 3 | font-size: .75rem; 4 | } 5 | 6 | .gist .lines { 7 | width: 100%; 8 | } 9 | 10 | .gist table>tbody>tr>td { 11 | border-top: 0px; 12 | } 13 | -------------------------------------------------------------------------------- /_sass/_header.scss: -------------------------------------------------------------------------------- 1 | .site-header { 2 | padding-top: $space-1; 3 | padding-bottom: $space-2; 4 | } 5 | 6 | .site-header a { 7 | color: $header-color; 8 | font-size: $h3; 9 | font-weight: $header-font-weight; 10 | background-image: none; 11 | } 12 | 13 | .site-header .site-title { 14 | font-size: $h2; 15 | } 16 | 17 | .site-nav { 18 | padding-top: $nav-padding; 19 | } 20 | 21 | .site-header nav a { 22 | color: $nav-color; 23 | } 24 | 25 | .site-header nav a:hover, 26 | .site-header nav a:focus, 27 | .site-header nav a:active, 28 | .site-header nav a.nav-active:hover, 29 | .site-header nav a.nav-active:focus, 30 | .site-header nav a.nav-active:active { 31 | color: $nav-link-color; 32 | opacity: 1; 33 | border-bottom: $nav-link-border-bottom; 34 | } 35 | 36 | .site-header nav a.nav-active { 37 | border-bottom: $nav-active-border-bottom; 38 | } 39 | 40 | .site-nav a + a { 41 | margin-left: $nav-link-padding-x; 42 | } 43 | 44 | .site-header a:hover, 45 | .posts .post a:hover .post-meta, 46 | .posts .post a:hover .post-title, 47 | .posts .post a:hover .post-summary { 48 | opacity: 0.88; 49 | } 50 | 51 | .site-header { 52 | text-align: center; 53 | } 54 | 55 | .site-header .site-nav { 56 | text-align: center; 57 | } 58 | -------------------------------------------------------------------------------- /_sass/_links.scss: -------------------------------------------------------------------------------- 1 | a { 2 | color: $link-color; 3 | background-image: linear-gradient(to top, 4 | rgba(0,0,0,0) 13%, 5 | rgba($link-color,.8) 13%, 6 | rgba($link-color,.8) 18%, 7 | rgba(0,0,0,0) 17% 8 | ); 9 | text-shadow: white 1px 0px 0px, white -1px 0px 0px; 10 | } 11 | 12 | a:hover, 13 | a:focus, 14 | a:active { 15 | border: 0; 16 | color: $link-hover-color; 17 | text-decoration: none; 18 | background-image: linear-gradient(to top, 19 | rgba(0,0,0,0) 13%, 20 | rgba($link-hover-color,.8) 13%, 21 | rgba($link-hover-color,.8) 17%, 22 | rgba(0,0,0,0) 17% 23 | ); 24 | text-shadow: white 1px 0px 0px, white -1px 0px 0px; 25 | } 26 | 27 | // Correct issues with buttons 28 | button, 29 | .button { 30 | text-shadow: none; 31 | background-image: none; 32 | } 33 | 34 | .button:hover, 35 | .button:focus, 36 | .button:active { 37 | color: white; 38 | text-shadow: none; 39 | background-image: none; 40 | } 41 | 42 | .anchorjs-link { 43 | text-shadow: none; 44 | background-image: none; 45 | } 46 | .anchorjs-link:hover, 47 | .anchorjs-link:focus, 48 | .anchorjs-link:active{ 49 | border: 0; 50 | color: $link-hover-color; 51 | text-shadow: none; 52 | background-image: none; 53 | } 54 | -------------------------------------------------------------------------------- /_sass/_measure.scss: -------------------------------------------------------------------------------- 1 | .measure { 2 | margin: 0 auto; 3 | max-width: $measure-width; 4 | } 5 | -------------------------------------------------------------------------------- /_sass/_media-queries.scss: -------------------------------------------------------------------------------- 1 | @media screen and (min-width: $viewport-small) { 2 | html { 3 | font-size: 16px; 4 | } 5 | 6 | h1, 7 | .h1 { 8 | font-size: $h1; 9 | } 10 | 11 | .site-header { 12 | text-align: left; 13 | } 14 | 15 | .site-nav { 16 | margin-top: 0; 17 | } 18 | 19 | .site-header a { 20 | font-size: $h4; 21 | } 22 | 23 | .site-header .site-title { 24 | font-size: $h3; 25 | float: left; 26 | } 27 | 28 | .site-header .site-nav { 29 | float: right; 30 | margin-top: .25rem; 31 | } 32 | 33 | blockquote { 34 | margin-left: $space-3; 35 | padding: $space-3; 36 | } 37 | 38 | .social-icons-left { 39 | text-align: left; 40 | } 41 | 42 | .social-icons-right { 43 | text-align: right; 44 | } 45 | } 46 | 47 | @media screen and (min-width: $viewport-medium) { 48 | html { 49 | font-size: 18px; 50 | } 51 | } 52 | 53 | @media screen and (min-width: $viewport-large) { 54 | html { 55 | font-size: 20px; 56 | } 57 | } 58 | 59 | @media screen and (min-width: $viewport-large + 14) { 60 | em img { 61 | max-width: $measure-width + 14; 62 | margin-left: -7em; 63 | } 64 | } 65 | -------------------------------------------------------------------------------- /_sass/_pagination.scss: -------------------------------------------------------------------------------- 1 | .pagination { 2 | font-size: 1rem; 3 | font-family: 'Lato', 'Helvetica Neue', Helvetica, sans-serif; 4 | font-weight: 300; 5 | text-align: center; 6 | } 7 | 8 | .pagination a, .pagination .disabled { 9 | -webkit-transition: all 0.2s ease-in-out; 10 | -moz-transition: all 0.2s ease-in-out; 11 | transition: all 0.2s ease-in-out; 12 | background: #fafafa; 13 | border-radius: 0.1875em; 14 | border: 1px solid #f3f3f3; 15 | color: #333333; 16 | padding: 1em 1.5em; 17 | } 18 | 19 | .pagination .disabled, .pagination .pagination-meta { 20 | opacity: 0.5; 21 | } 22 | 23 | .pagination .pagination-meta { 24 | overflow: hidden; 25 | } 26 | 27 | .pagination a:hover, .pagination a:focus { 28 | background: white; 29 | color: #477dca; 30 | } 31 | 32 | .pagination a:active { 33 | background: #f7f7f7; 34 | } 35 | 36 | .pagination .button { 37 | font-size: 1rem; 38 | font-weight: 300; 39 | letter-spacing: 1px; 40 | } 41 | 42 | .button-disabled { 43 | opacity: 0.55; 44 | background-color: #999; 45 | } 46 | 47 | .button-disabled:hover, 48 | .button-disabled:active, 49 | .button-disabled:focus { 50 | cursor: not-allowed; 51 | background-color: #999; 52 | } 53 | -------------------------------------------------------------------------------- /_sass/_positions.scss: -------------------------------------------------------------------------------- 1 | .left { 2 | float: left; 3 | } 4 | 5 | .right { 6 | float: right; 7 | } 8 | -------------------------------------------------------------------------------- /_sass/_posts.scss: -------------------------------------------------------------------------------- 1 | 2 | .posts { 3 | margin: 0; 4 | } 5 | 6 | .posts .post { 7 | margin-bottom: 0.75em; 8 | border-bottom: thin solid #f3f3f3; 9 | } 10 | 11 | .posts .post:last-child { 12 | border-bottom: none; 13 | margin-bottom: .375em; 14 | padding-bottom: 0; 15 | } 16 | 17 | .post-link .post-title { 18 | margin-top: 0; 19 | font-weight: 600; 20 | color: #333; 21 | } 22 | 23 | .post-footer { 24 | @extend .italic; 25 | 26 | margin-top: .75rem; 27 | text-align: center; 28 | } 29 | 30 | .post-footer .avatar { 31 | margin: 2rem 0; 32 | width: 100px; 33 | border-radius: 50%; 34 | } 35 | 36 | .meta, 37 | .post-meta { 38 | width: auto; 39 | font-weight: 300; 40 | margin: 0; 41 | padding: .25em 0; 42 | color: #7a7a7a; 43 | font-style: italic; 44 | } 45 | 46 | .related-post-title { 47 | border-bottom: thin solid #f3f3f3; 48 | } 49 | -------------------------------------------------------------------------------- /_sass/_social-icons.scss: -------------------------------------------------------------------------------- 1 | .social-icons-left, .social-icons-right { 2 | text-align: center; 3 | float: none; 4 | } 5 | 6 | .social-icons { 7 | font-size: 1.25rem; 8 | padding: 0.5em 0 0 0; 9 | width: 100%; 10 | } 11 | 12 | .social-icons a.fa { 13 | cursor: pointer; 14 | opacity: 0.8; 15 | padding: 0.2em; 16 | } 17 | 18 | .social-icons a.fa:hover { 19 | opacity: 1; 20 | } 21 | 22 | .social-icons iframe[title=Flattr] { 23 | position: relative; 24 | top: 0.1em; 25 | } 26 | -------------------------------------------------------------------------------- /_sass/_tables.scss: -------------------------------------------------------------------------------- 1 | /* 2 | Table styles copied from Bootstrap 3 | Copyright (c) 2013 Twitter, Inc 4 | */ 5 | 6 | table { 7 | width: 100%; 8 | max-width: 100%; 9 | margin-bottom: 1.5rem; 10 | font-size: 1.125rem; 11 | overflow-x:auto; 12 | display:block; 13 | // Cells 14 | > thead, 15 | > tbody, 16 | > tfoot { 17 | > tr { 18 | > th, 19 | > td { 20 | padding: 12px; 21 | line-height: 1.2; 22 | vertical-align: top; 23 | border-top: 1px solid #333; 24 | } 25 | } 26 | } 27 | // Bottom align for column headings 28 | > thead > tr > th { 29 | vertical-align: bottom; 30 | border-bottom: 2px solid #333; 31 | } 32 | // Remove top border from thead by default 33 | > caption + thead, 34 | > colgroup + thead, 35 | > thead:first-child { 36 | > tr:first-child { 37 | > th, 38 | > td { 39 | border-top: 0; 40 | } 41 | } 42 | } 43 | // Account for multiple tbody instances 44 | > tbody + tbody { 45 | border-top: 2px solid #333; 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /_sass/_typography.scss: -------------------------------------------------------------------------------- 1 | html { 2 | font-size: $base-font-size; 3 | } 4 | 5 | abbr { 6 | border-bottom: $abbr-border-bottom; 7 | cursor: help; 8 | } 9 | 10 | p { 11 | color: #333; 12 | line-height: 1.5; 13 | } 14 | 15 | small, 16 | .small { 17 | font-size: 0.707rem; 18 | } 19 | 20 | sup { 21 | position: relative; 22 | vertical-align: middle; 23 | top: -0.9ex; 24 | } 25 | -------------------------------------------------------------------------------- /_sass/_variables.scss: -------------------------------------------------------------------------------- 1 | // Typography 2 | $base-font-size: 14px !default; 3 | $bold-font-weight: bold !default; 4 | $font-family: 'Merriweather', 'PT Serif', Georgia, 'Times New Roman', serif !default; 5 | $line-height: 1.5 !default; 6 | $heading-font-family: 'Lato', 'Helvetica Neue', Helvetica, sans-serif !default; 7 | $heading-font-weight: 900 !default; 8 | $heading-line-height: 1.25 !default; 9 | $monospace-font-family: 'Source Code Pro', Consolas, monospace !default; 10 | $h1: 2.998rem !default; 11 | $h2: 1.5rem !default; 12 | $h3: 1.25rem !default; 13 | $h4: 1rem !default; 14 | $h5: .875rem !default; 15 | $h6: .75rem !default; 16 | $h00: 4rem !default; 17 | $h0: 3rem !default; 18 | $h00-responsive: 8vw !default; 19 | $h0-responsive: 6vw !default; 20 | $h1-responsive: 4vw !default; 21 | $h00-responsive-max: 7.68rem !default; 22 | $h0-responsive-max: 5.76rem !default; 23 | $h1-responsive-max: 3.84rem !default; 24 | $abbr-border-bottom: 1px black dotted; 25 | 26 | // Page width 27 | $measure-width: 42rem !default; 28 | 29 | // Viewport widths 30 | $viewport-small: 32em; 31 | $viewport-medium: 48em; 32 | $viewport-large: 64em; 33 | 34 | // Colors 35 | $blue: #0076df !default; 36 | $red: #f95020 !default; 37 | $green: #00cf26 !default; 38 | $yellow: #efcc00 !default; 39 | $orange: #ffcc22 !default; 40 | $purple: #f92080 !default; 41 | $dark-blue: #00369f !default; 42 | $green: #00ab37 !default; 43 | $dark-green: #009f06 !default; 44 | $light-pink: #ffdddd !default; 45 | $light-green: #ddffdd !default; 46 | $dark-gray: #333 !default; 47 | $mid-gray: #777 !default; 48 | $light-gray: #ccc !default; 49 | $lighter-gray: #eee !default; 50 | $darken-1: rgba(#000,.0625) !default; 51 | $darken-2: rgba(#000,.125) !default; 52 | $darken-3: rgba(#000,.25) !default; 53 | $darken-4: rgba(#000,.5) !default; 54 | 55 | // Links 56 | $link-color: $blue; 57 | $link-hover-color: darken($blue, 40%); 58 | 59 | // Breakpoints 60 | $breakpoint-md: '(min-width: 52em)'; 61 | $breakpoint-xl: '(min-width: 96em)'; 62 | 63 | // Whitespace 64 | $space-1: .5rem !default; 65 | $space-2: 1rem !default; 66 | $space-3: 2rem !default; 67 | $space-4: 4rem !default; 68 | 69 | // Buttons 70 | $button-font-size: inherit !default; 71 | $button-font-weight: normal !default; 72 | $button-line-height: 1.125rem !default; 73 | $button-padding-y: .5rem !default; 74 | $button-padding-x: 1rem !default; 75 | $button-font-family: $heading-font-family; 76 | 77 | // Forms 78 | $form-field-font-size: 1rem !default; 79 | $form-field-height: 2.25rem !default; 80 | $form-field-padding-y: .5rem !default; 81 | $form-field-padding-x: .5rem !default; 82 | 83 | // Borders 84 | $border-color: $light-gray !default; 85 | $border-width: 1px !default; 86 | $border-radius: 3px !default; 87 | 88 | // Forms 89 | $form-field-font-size: 1rem; 90 | $form-field-height: 2.25rem; 91 | $form-field-padding-y: .5rem; 92 | $form-field-padding-x: .5rem; 93 | 94 | // Code 95 | $pre-border-radius: 0; 96 | $pre-background-color: #fafafa; 97 | $hljs-comment: $mid-gray; 98 | $hljs-keyword: $dark-blue; 99 | $hljs-name: $dark-gray; 100 | $hljs-number: $dark-green; 101 | $hljs-string: $red; 102 | $hljs-title: $red; 103 | $hljs-type: $dark-blue; 104 | $hljs-tag: $dark-blue; 105 | $hljs-attribute: $dark-green; 106 | $hljs-regexp: $dark-green; 107 | $hljs-symbol: $purple; 108 | $hljs-built-in: $dark-blue; 109 | $hljs-preprocessor: $mid-gray; 110 | $hljs-deletion: $light-pink; 111 | $hljs-addition: $light-green; 112 | $hljs-change: $dark-blue; 113 | $hljs-chunk: $light-gray; 114 | 115 | // Header 116 | $header-border-top: thin solid #f3f3f3; 117 | $header-color: $dark-gray; 118 | $header-bg-color: #fafafa; 119 | $header-font-weight: 300; 120 | 121 | // Nav 122 | $nav-color: $mid-gray; 123 | $nav-link-color: #444; 124 | $nav-padding: $space-2; 125 | $nav-link-padding-x: $space-2; 126 | $nav-link-border-bottom: 2px solid #444; 127 | $nav-active-border-bottom: 1px solid $light-gray; 128 | 129 | // Footer 130 | $footer-border-top: thin solid #f3f3f3; 131 | $footer-padding: $space-3; 132 | $footer-color: #7a7a7a; 133 | $footer-bg-color: #fafafa; 134 | $footer-font-weight: 300; 135 | $footer-font-size: .75rem; 136 | -------------------------------------------------------------------------------- /_sass/basscss/_base-buttons.scss: -------------------------------------------------------------------------------- 1 | /* Basscss Base Buttons */ 2 | 3 | button, 4 | .button { 5 | font-family: $button-font-family; 6 | font-size: $button-font-size; 7 | font-weight: $button-font-weight; 8 | text-decoration: none; 9 | cursor: pointer; 10 | display: inline-block; 11 | box-sizing: border-box; 12 | line-height: $button-line-height; 13 | padding: $button-padding-y $button-padding-x; 14 | margin: 0; 15 | height: auto; 16 | border: 1px solid transparent; 17 | vertical-align: middle; 18 | -webkit-appearance: none; 19 | } 20 | 21 | ::-moz-focus-inner { 22 | border: 0; 23 | padding: 0; 24 | } 25 | 26 | .button:hover { 27 | text-decoration: none; 28 | border: 1px solid transparent; 29 | } 30 | -------------------------------------------------------------------------------- /_sass/basscss/_base-forms.scss: -------------------------------------------------------------------------------- 1 | /* Basscss Base Forms */ 2 | 3 | input, 4 | select, 5 | textarea, 6 | fieldset { 7 | font-size: $form-field-font-size; 8 | margin-top: 0; 9 | margin-bottom: $space-1; 10 | } 11 | 12 | input[type=text], 13 | input[type=datetime], 14 | input[type=datetime-local], 15 | input[type=email], 16 | input[type=month], 17 | input[type=number], 18 | input[type=password], 19 | input[type=search], 20 | input[type=tel], 21 | input[type=time], 22 | input[type=url], 23 | input[type=week] { 24 | box-sizing: border-box; 25 | height: $form-field-height; 26 | padding: $form-field-padding-y $form-field-padding-x; 27 | vertical-align: middle; 28 | -webkit-appearance: none; 29 | } 30 | 31 | select { 32 | box-sizing: border-box; 33 | line-height: 1.75; 34 | padding: $form-field-padding-y $form-field-padding-x; 35 | } 36 | 37 | select:not([multiple]) { 38 | height: $form-field-height; 39 | vertical-align: middle; 40 | } 41 | 42 | textarea { 43 | box-sizing: border-box; 44 | line-height: 1.75; 45 | padding: $form-field-padding-y $form-field-padding-x; 46 | } 47 | 48 | .fieldset-reset { 49 | padding: 0; 50 | margin-left: 0; 51 | margin-right: 0; 52 | border: 0; 53 | } 54 | 55 | .fieldset-reset legend { 56 | padding: 0; 57 | } 58 | -------------------------------------------------------------------------------- /_sass/basscss/_base-reset.scss: -------------------------------------------------------------------------------- 1 | body, 2 | button { 3 | margin: 0; 4 | } 5 | 6 | button, 7 | input, 8 | select, 9 | textarea { 10 | font-family: inherit; 11 | font-size: 100%; 12 | } 13 | 14 | img { 15 | max-width: 100%; 16 | } 17 | 18 | svg { 19 | max-height: 100%; 20 | } 21 | -------------------------------------------------------------------------------- /_sass/basscss/_base-typography.scss: -------------------------------------------------------------------------------- 1 | /* Basscss Base Typography */ 2 | 3 | body { 4 | font-family: $font-family; 5 | line-height: $line-height; 6 | font-size: 100%; 7 | } 8 | 9 | h1, 10 | h2, 11 | h3, 12 | h4, 13 | h5, 14 | h6 { 15 | font-family: $heading-font-family; 16 | font-weight: $heading-font-weight; 17 | line-height: $heading-line-height; 18 | margin-top: 1em; 19 | margin-bottom: .5em; 20 | } 21 | 22 | p, 23 | dl, 24 | ol, 25 | ul { 26 | font-size: $h4; 27 | margin-top: 0; 28 | margin-bottom: $space-2; 29 | } 30 | 31 | ol, 32 | ul { 33 | padding-left: $space-3; 34 | } 35 | 36 | pre, 37 | code, 38 | samp { 39 | font-family: $monospace-font-family; 40 | font-size: inherit; 41 | } 42 | 43 | pre { 44 | margin-top: 0; 45 | margin-bottom: $space-2; 46 | overflow-x: scroll; 47 | } 48 | 49 | hr { 50 | margin-top: $space-3; 51 | margin-bottom: $space-3; 52 | } 53 | 54 | blockquote { 55 | margin-top: $space-3; 56 | margin-bottom: $space-3; 57 | margin-left: 0; 58 | padding-left: $space-2; 59 | padding-right: $space-2; 60 | } 61 | 62 | blockquote, 63 | blockquote p { 64 | font-size: $h3; 65 | font-style: italic; 66 | } 67 | 68 | h1, 69 | .h1 { 70 | font-size: $h1; 71 | } 72 | 73 | h2, 74 | .h2 { 75 | font-size: $h2; 76 | } 77 | 78 | h3, 79 | .h3 { 80 | font-size: $h3; 81 | } 82 | 83 | h4, 84 | .h4 { 85 | font-size: $h4; 86 | } 87 | 88 | h5, 89 | .h5 { 90 | font-size: $h5; 91 | } 92 | 93 | h6, 94 | .h6 { 95 | font-size: $h6; 96 | } 97 | 98 | .list-reset { 99 | list-style: none; 100 | padding-left: 0; 101 | } 102 | -------------------------------------------------------------------------------- /_sass/basscss/_buttons-blue.scss: -------------------------------------------------------------------------------- 1 | .button-blue { 2 | color: white; 3 | background-color: $blue; 4 | border-radius: $border-radius; 5 | transition-duration: .1s; 6 | transition-timing-function: ease-out; 7 | transition-property: box-shadow, background-color; 8 | } 9 | 10 | .button-blue:hover { 11 | opacity: .875; 12 | } 13 | 14 | .button-blue:active, 15 | .button-blue.is-active { 16 | box-shadow: inset 0 0 0 32px rgba(#000,.125), inset 0 2px 3px 0 rgba(#000,.25); 17 | } 18 | 19 | .button-blue:focus { 20 | outline: none; 21 | box-shadow: 0 0 0 2px rgba(white, .5), 0 0 1px 4px rgba($blue, .5); 22 | } 23 | 24 | .button-blue:disabled, 25 | .button-blue.is-disabled { 26 | opacity: .5; 27 | } 28 | -------------------------------------------------------------------------------- /_sass/basscss/_color-base.scss: -------------------------------------------------------------------------------- 1 | /* Basscss Color Base */ 2 | 3 | body { 4 | color: $dark-gray; 5 | background-color: white; 6 | } 7 | 8 | a { 9 | color: $blue; 10 | text-decoration: none; 11 | } 12 | 13 | a:hover { 14 | text-decoration: underline; 15 | } 16 | 17 | pre, 18 | code { 19 | background-color: $lighter-gray; 20 | border-radius: $border-radius; 21 | } 22 | 23 | hr { 24 | border: 0; 25 | border-bottom-style: solid; 26 | border-bottom-width: $border-width; 27 | border-bottom-color: $border-color; 28 | } 29 | -------------------------------------------------------------------------------- /_sass/basscss/_colors.scss: -------------------------------------------------------------------------------- 1 | /* Basscss Colors */ 2 | 3 | .dark-gray { 4 | color: $dark-gray; 5 | } 6 | 7 | .white { 8 | color: white; 9 | } 10 | 11 | .blue { 12 | color: $blue; 13 | } 14 | 15 | .mid-gray { 16 | color: $mid-gray; 17 | } 18 | 19 | .light-gray { 20 | color: $light-gray; 21 | } 22 | 23 | .lighter-gray { 24 | color: $lighter-gray; 25 | } 26 | 27 | .red { 28 | color: $red; 29 | } 30 | 31 | .green { 32 | color: $green; 33 | } 34 | 35 | .yellow { 36 | color: $yellow; 37 | } 38 | 39 | .orange { 40 | color: $orange; 41 | } 42 | 43 | .bg-dark-gray { 44 | background-color: $dark-gray; 45 | } 46 | 47 | .bg-white { 48 | background-color: white; 49 | } 50 | 51 | .bg-blue { 52 | background-color: $blue; 53 | } 54 | 55 | .bg-mid-gray { 56 | background-color: $mid-gray; 57 | } 58 | 59 | .bg-light-gray { 60 | background-color: $light-gray; 61 | } 62 | 63 | .bg-lighter-gray { 64 | background-color: $lighter-gray; 65 | } 66 | 67 | .bg-red { 68 | background-color: $red; 69 | } 70 | 71 | .bg-green { 72 | background-color: $green; 73 | } 74 | 75 | .bg-yellow { 76 | background-color: $yellow; 77 | } 78 | 79 | .bg-orange { 80 | background-color: $orange; 81 | } 82 | 83 | .bg-darken-1 { 84 | background-color: $darken-1; 85 | } 86 | 87 | .bg-darken-2 { 88 | background-color: $darken-2; 89 | } 90 | 91 | .bg-darken-3 { 92 | background-color: $darken-3; 93 | } 94 | 95 | .bg-darken-4 { 96 | background-color: $darken-4; 97 | } 98 | -------------------------------------------------------------------------------- /_sass/basscss/_syntax-highlighting.scss: -------------------------------------------------------------------------------- 1 | .highlight { 2 | -webkit-text-size-adjust: none; 3 | } 4 | 5 | .highlight .c, 6 | .highlight .cs, 7 | .highlight .cm, 8 | .highlight .cp, 9 | .highlight .c1 { 10 | color: $hljs-comment; 11 | font-style: italic; 12 | } 13 | 14 | .highlight .k, 15 | .highlight .kc, 16 | .highlight .kd, 17 | .highlight .kn, 18 | .highlight .kr, 19 | .highlight .kt, 20 | .highlight .kp { 21 | color: $hljs-keyword; 22 | } 23 | 24 | .highlight .na, 25 | .highlight .nb, 26 | .highlight .nc, 27 | .highlight .no, 28 | .highlight .nd, 29 | .highlight .ni, 30 | .highlight .ne, 31 | .highlight .nf, 32 | .highlight .nl, 33 | .highlight .nn, 34 | .highlight .nx { 35 | color: $hljs-name; 36 | } 37 | 38 | .highlight .mi, 39 | .highlight .il { 40 | color: $hljs-number; 41 | } 42 | 43 | .highlight .s, 44 | .highlight .sb, 45 | .highlight .sc, 46 | .highlight .sd, 47 | .highlight .s2, 48 | .highlight .s3, 49 | .highlight .sh, 50 | .highlight .si, 51 | .highlight .sx, 52 | .highlight .sr, 53 | .highlight .ss, 54 | .highlight .s1 { 55 | color: $hljs-string; 56 | } 57 | 58 | .hljs-title, 59 | .hljs-id, 60 | .scss .hljs-preprocessor { 61 | color: $hljs-title; 62 | font-weight: bold; 63 | } 64 | 65 | .highlight .k { 66 | font-weight: normal; 67 | } 68 | 69 | .highlight .nc, 70 | .highlight .no { 71 | color: $hljs-type; 72 | } 73 | 74 | .highlight .o { 75 | color: $hljs-tag; 76 | font-weight: normal; 77 | } 78 | 79 | .highlight .nb { 80 | color: $hljs-attribute; 81 | } 82 | 83 | .highlight .sr { 84 | color: $hljs-regexp; 85 | } 86 | 87 | .highlight .ss { 88 | color: $hljs-symbol; 89 | } 90 | 91 | .hljs-built_in { 92 | color: $hljs-built-in; 93 | } 94 | 95 | .hljs-preprocessor, 96 | .hljs-pragma, 97 | .hljs-pi, 98 | .hljs-doctype, 99 | .hljs-shebang, 100 | .hljs-cdata { 101 | color: $hljs-preprocessor; 102 | font-weight: bold; 103 | } 104 | 105 | .hljs-deletion { 106 | background: $hljs-deletion; 107 | } 108 | 109 | .hljs-addition { 110 | background: $hljs-addition; 111 | } 112 | 113 | .diff .hljs-change { 114 | background: $hljs-change; 115 | } 116 | 117 | .hljs-chunk { 118 | color: $hljs-chunk; 119 | } 120 | -------------------------------------------------------------------------------- /_sass/basscss/_utility-headings.scss: -------------------------------------------------------------------------------- 1 | /* Basscss Utility Headings */ 2 | 3 | .h00 { 4 | font-size: $h00; 5 | } 6 | 7 | .h0 { 8 | font-size: $h0; 9 | } 10 | 11 | @media #{$breakpoint-md} { 12 | .h00-responsive { 13 | font-size: $h00-responsive; 14 | } 15 | 16 | .h0-responsive { 17 | font-size: $h0-responsive; 18 | } 19 | 20 | .h1-responsive { 21 | font-size: $h1-responsive; 22 | } 23 | } 24 | 25 | @media #{$breakpoint-xl} { 26 | .h00-responsive { 27 | font-size: $h00-responsive-max; 28 | } 29 | 30 | .h0-responsive { 31 | font-size: $h0-responsive-max; 32 | } 33 | 34 | .h1-responsive { 35 | font-size: $h1-responsive-max; 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /_sass/basscss/_utility-typography.scss: -------------------------------------------------------------------------------- 1 | /* Basscss Utility Typography */ 2 | 3 | .bold { 4 | font-weight: $bold-font-weight; 5 | } 6 | 7 | .regular { 8 | font-weight: normal; 9 | } 10 | 11 | .italic { 12 | font-style: italic; 13 | } 14 | 15 | .caps { 16 | text-transform: uppercase; 17 | letter-spacing: .2em; 18 | } 19 | 20 | .left-align { 21 | text-align: left; 22 | } 23 | 24 | .center { 25 | text-align: center; 26 | } 27 | 28 | .right-align { 29 | text-align: right; 30 | } 31 | 32 | .justify { 33 | text-align: justify; 34 | } 35 | 36 | .nowrap { 37 | white-space: nowrap; 38 | } 39 | -------------------------------------------------------------------------------- /_sass/basscss/_utility-white-space.scss: -------------------------------------------------------------------------------- 1 | /* Basscss Utility White Space */ 2 | 3 | .m0 { 4 | margin: 0; 5 | } 6 | 7 | .mt0 { 8 | margin-top: 0; 9 | } 10 | 11 | .mr0 { 12 | margin-right: 0; 13 | } 14 | 15 | .mb0 { 16 | margin-bottom: 0; 17 | } 18 | 19 | .ml0 { 20 | margin-left: 0; 21 | } 22 | 23 | .m1 { 24 | margin: $space-1; 25 | } 26 | 27 | .mt1 { 28 | margin-top: $space-1; 29 | } 30 | 31 | .mr1 { 32 | margin-right: $space-1; 33 | } 34 | 35 | .mb1 { 36 | margin-bottom: $space-1; 37 | } 38 | 39 | .ml1 { 40 | margin-left: $space-1; 41 | } 42 | 43 | .m2 { 44 | margin: $space-2; 45 | } 46 | 47 | .mt2 { 48 | margin-top: $space-2; 49 | } 50 | 51 | .mr2 { 52 | margin-right: $space-2; 53 | } 54 | 55 | .mb2 { 56 | margin-bottom: $space-2; 57 | } 58 | 59 | .ml2 { 60 | margin-left: $space-2; 61 | } 62 | 63 | .m3 { 64 | margin: $space-3; 65 | } 66 | 67 | .mt3 { 68 | margin-top: $space-3; 69 | } 70 | 71 | .mr3 { 72 | margin-right: $space-3; 73 | } 74 | 75 | .mb3 { 76 | margin-bottom: $space-3; 77 | } 78 | 79 | .ml3 { 80 | margin-left: $space-3; 81 | } 82 | 83 | .m4 { 84 | margin: $space-4; 85 | } 86 | 87 | .mt4 { 88 | margin-top: $space-4; 89 | } 90 | 91 | .mr4 { 92 | margin-right: $space-4; 93 | } 94 | 95 | .mb4 { 96 | margin-bottom: $space-4; 97 | } 98 | 99 | .ml4 { 100 | margin-left: $space-4; 101 | } 102 | 103 | .mxn1 { 104 | margin-left: -$space-1; 105 | margin-right: -$space-1; 106 | } 107 | 108 | .mxn2 { 109 | margin-left: -$space-2; 110 | margin-right: -$space-2; 111 | } 112 | 113 | .mxn3 { 114 | margin-left: -$space-3; 115 | margin-right: -$space-3; 116 | } 117 | 118 | .mxn4 { 119 | margin-left: -$space-4; 120 | margin-right: -$space-4; 121 | } 122 | 123 | .mx-auto { 124 | margin-left: auto; 125 | margin-right: auto; 126 | } 127 | 128 | .p1 { 129 | padding: $space-1; 130 | } 131 | 132 | .py1 { 133 | padding-top: $space-1; 134 | padding-bottom: $space-1; 135 | } 136 | 137 | .px1 { 138 | padding-left: $space-1; 139 | padding-right: $space-1; 140 | } 141 | 142 | .p2 { 143 | padding: $space-2; 144 | } 145 | 146 | .py2 { 147 | padding-top: $space-2; 148 | padding-bottom: $space-2; 149 | } 150 | 151 | .px2 { 152 | padding-left: $space-2; 153 | padding-right: $space-2; 154 | } 155 | 156 | .p3 { 157 | padding: $space-3; 158 | } 159 | 160 | .py3 { 161 | padding-top: $space-3; 162 | padding-bottom: $space-3; 163 | } 164 | 165 | .px3 { 166 | padding-left: $space-3; 167 | padding-right: $space-3; 168 | } 169 | 170 | .p4 { 171 | padding: $space-4; 172 | } 173 | 174 | .py4 { 175 | padding-top: $space-4; 176 | padding-bottom: $space-4; 177 | } 178 | 179 | .px4 { 180 | padding-left: $space-4; 181 | padding-right: $space-4; 182 | } 183 | -------------------------------------------------------------------------------- /about.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: page 3 | title: About Pixyll 4 | permalink: /about/ 5 | tags: about 6 | --- 7 | 8 | This Jekyll theme was crafted with <3 by [John Otander](https://johno.com/) 9 | ([@4lpine](https://twitter.com/4lpine)). 10 | 11 | Checkout the [GitHub repository](https://github.com/johno/pixyll) to download it, 12 | request a feature, report a bug, or contribute. It's free, and open source 13 | ([MIT](https://opensource.org/licenses/MIT)). 14 | 15 | Thanks to the following: 16 | 17 | * [BASSCSS](https://basscss.com/) 18 | * [Jekyll](https://jekyllrb.com/) 19 | * [Refills](https://refills.bourbon.io/) 20 | * [Type Scale](https://type-scale.com/) 21 | 22 | List of contributors: 23 | 24 | - Aaron S. Hawley 25 | - Adam Menges 26 | - Alex Claman 27 | - Alex Johnson 28 | - Alex Touchet 29 | - Allister Antosik 30 | - Amin Bandali 31 | - Anders Nissen 32 | - Andrea Margiovanni 33 | - Andreas Niedermair 34 | - Andrzej Ośmiałowski 35 | - Anuj More 36 | - Arvind Chembarpu 37 | - Assaf Gelber 38 | - Barry vd. Heuvel 39 | - Bartek Krzemień 40 | - Benjamin Sinkula 41 | - Bennett Rogers 42 | - Brian Gaid 43 | - Brian Hurst 44 | - Chee Yeo 45 | - Cody Chan 46 | - Cristian Henrique 47 | - David Ernst 48 | - David Moodie 49 | - Donate Altenburger 50 | - Eddie Schoute 51 | - Fernando Mantoan 52 | - Gurchet Rai 53 | - Harish Narayanan 54 | - Jack Platten 55 | - Jehan Tremback 56 | - Jiaxi Gu (Isaac) 57 | - John Otander 58 | - Jordan Danielewski 59 | - Josh Buxton 60 | - Kirill Kulikov 61 | - Kyle Maxwell 62 | - Marta Sztybor 63 | - Martin Wagner 64 | - Matthew Graybosch 65 | - Maxim Tsoy 66 | - Mete Balci 67 | - Mike Lloyd 68 | - Mikhail Grachev 69 | - mindwind 70 | - Nick Rakochy 71 | - Nikolay Georgiev 72 | - Noel Bautista 73 | - Oliver Hamlet 74 | - Onur (e0i) 75 | - Praveer Gupta 76 | - Rassol (Karmeye) 77 | - Renato Fialho 78 | - Ricky Han 79 | - Roberto Pesando 80 | - Ryan Jacobs 81 | - Scott Martin 82 | - Selim Eren Bekçe 83 | - Shruti Rijhwani 84 | - Steef Hegeman 85 | - Tehmasp Chaudhri 86 | - Thomas Galvin 87 | - Timothy Gu 88 | - Tom Kraak 89 | - Vishnu Ks 90 | - Vladislav Arbatov 91 | - Wilfred Hughes 92 | - Yaroslav Yadrishnikov 93 | - Yee Chie Tu 94 | - Yeou Chien 95 | -------------------------------------------------------------------------------- /apple-touch-icon-114x114.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/apple-touch-icon-114x114.png -------------------------------------------------------------------------------- /apple-touch-icon-120x120.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/apple-touch-icon-120x120.png -------------------------------------------------------------------------------- /apple-touch-icon-144x144.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/apple-touch-icon-144x144.png -------------------------------------------------------------------------------- /apple-touch-icon-152x152.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/apple-touch-icon-152x152.png -------------------------------------------------------------------------------- /apple-touch-icon-180x180.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/apple-touch-icon-180x180.png -------------------------------------------------------------------------------- /apple-touch-icon-57x57.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/apple-touch-icon-57x57.png -------------------------------------------------------------------------------- /apple-touch-icon-60x60.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/apple-touch-icon-60x60.png -------------------------------------------------------------------------------- /apple-touch-icon-72x72.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/apple-touch-icon-72x72.png -------------------------------------------------------------------------------- /apple-touch-icon-76x76.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/apple-touch-icon-76x76.png -------------------------------------------------------------------------------- /apple-touch-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/apple-touch-icon.png -------------------------------------------------------------------------------- /appveyor.yml: -------------------------------------------------------------------------------- 1 | # appveyor.yml 2 | 3 | environment: 4 | RUBY_VERSION: 26 5 | 6 | platform: 7 | - x64 8 | 9 | install: 10 | - set PATH=C:\Ruby%RUBY_VERSION%\bin;%PATH% 11 | - bundle install 12 | 13 | before_build: 14 | - ruby -v 15 | - gem -v 16 | - rake --version 17 | - bundle -v 18 | - bundle exec jekyll -v 19 | 20 | build_script: 21 | - bundle exec jekyll build 22 | - rake 'draft[Hello\, world]' 23 | - rake undraft[hello-world.md] 24 | -------------------------------------------------------------------------------- /contact.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: page 3 | title: Say Hello 4 | permalink: /contact/ 5 | tags: contact 6 | --- 7 | 8 |
9 | {% if site.ajaxify_contact_form %} 10 |
11 | 15 | 16 | 20 | 21 | 22 | 23 | 24 |
25 | {% else %} 26 |
27 | 31 | 35 | 36 | 37 | 38 | 39 | 40 | 41 |
42 | {% endif %} 43 |
44 | 45 | {% if site.ajaxify_contact_form %} 46 | {% include ajaxify_content_form.html %} 47 | {% endif %} 48 | -------------------------------------------------------------------------------- /css/pixyll.scss: -------------------------------------------------------------------------------- 1 | --- 2 | # The scss file which include files from _sass/ 3 | --- 4 | @charset "UTF-8"; 5 | 6 | /*! 7 | * Pixyll - A simple, beautiful Jekyll theme that's mobile first. 8 | * Crafted with <3 by John Otander (@4lpine) - ©2015-2021 John Otander 9 | * @author John Otander (https://johno.com/) 10 | * @link https://github.com/johno/pixyll 11 | * @license MIT 12 | */ 13 | 14 | @import 'variables'; 15 | 16 | @import 'basscss'; 17 | 18 | @import 'base'; 19 | 20 | @import 'links'; 21 | @import 'positions'; 22 | @import 'clearfix'; 23 | @import 'code'; 24 | @import 'forms'; 25 | @import 'typography'; 26 | @import 'header'; 27 | @import 'tables'; 28 | @import 'animations'; 29 | @import 'footer'; 30 | @import 'social-icons'; 31 | @import 'blockquotes'; 32 | @import 'posts'; 33 | @import 'media-queries'; 34 | @import 'gists'; 35 | @import 'measure'; 36 | @import 'pagination'; 37 | -------------------------------------------------------------------------------- /favicon-160x160.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/favicon-160x160.png -------------------------------------------------------------------------------- /favicon-16x16.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/favicon-16x16.png -------------------------------------------------------------------------------- /favicon-192x192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/favicon-192x192.png -------------------------------------------------------------------------------- /favicon-32x32.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/favicon-32x32.png -------------------------------------------------------------------------------- /favicon-96x96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/favicon-96x96.png -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/favicon.ico -------------------------------------------------------------------------------- /fb-instant-articles.xml: -------------------------------------------------------------------------------- 1 | --- 2 | layout: null 3 | --- 4 | 5 | 6 | 7 | 8 | {{ site.name | xml_escape }} 9 | {{ site.url }} 10 | 11 | {% if site.description %}{{ site.description | xml_escape }}{% endif %} 12 | 13 | {% for post in site.posts %} 14 | {% unless post.link %} 15 | 16 | {{ post.title | xml_escape }} 17 | {{ site.url }}{{ post.url }} 18 | 19 | 22 | 23 | {{ post.url }} 24 | 25 | {% if post.summary %} 26 | {{ post.summary | xml_escape }} 27 | {% endif %} 28 | 29 | {{ post.date | date: "%a, %d %b %Y %H:%M:%S %z" }} 30 | {{ site.author }} 31 | 32 | {% endunless %} 33 | {% endfor %} 34 | 35 | 36 | -------------------------------------------------------------------------------- /feed.xml: -------------------------------------------------------------------------------- 1 | --- 2 | layout: null 3 | --- 4 | 5 | 6 | 7 | {{ site.title | xml_escape }} 8 | {{ site.description | xml_escape }} 9 | {{ site.url }}{{ site.baseurl }}/ 10 | 11 | {% for post in site.posts limit:10 %} 12 | 13 | {{ post.title | xml_escape }} 14 | {{ post.content | xml_escape }} 15 | {{ post.date | date: "%a, %d %b %Y %H:%M:%S %z" }} 16 | {{ post.url | prepend: site.baseurl | prepend: site.url }} 17 | {{ post.url | prepend: site.baseurl | prepend: site.url }} 18 | 19 | {% endfor %} 20 | 21 | 22 | -------------------------------------------------------------------------------- /images/me.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/images/me.jpeg -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | {% assign posts_count = paginator.posts | size %} 5 | 6 |
7 | {% if posts_count > 0 %} 8 |
9 | {% for post in paginator.posts %} 10 |
11 |

12 | {% if site.date_format %} 13 | {{ post.date | date: site.date_format }} 14 | {% else %} 15 | {{ post.date | date: "%b %-d, %Y" }} 16 | {% endif %} 17 |

18 |

{{ post.title }}

 19 | 20 | {% if post.summary %} 21 | {{ post.summary }} 22 | {% else %} 23 | {{ post.excerpt }} 24 | {% endif %} 25 | 26 |
27 | {% endfor %} 28 |
29 | 30 | {% include pagination.html %} 31 | {% else %} 32 |

{{ site.text.index.coming_soon }}

33 | {% endif %} 34 |
35 | -------------------------------------------------------------------------------- /manifest.json: -------------------------------------------------------------------------------- 1 | --- 2 | layout: null 3 | --- 4 | { 5 | "short_name": "{{ site.title | replace: '"', '\"' }}", 6 | "name": "{{ site.title | replace: '"', '\"' }}", 7 | "description": "{{ site.description | replace: '"', '\"' }}", 8 | "icons": [ 9 | { 10 | "src": "{{ '/splash-512x512.png' | relative_url }}", 11 | "type": "image/png", 12 | "sizes": "512x512" 13 | }, 14 | { 15 | "src": "{{ '/favicon-192x192.png' | relative_url }}", 16 | "type": "image/png", 17 | "sizes": "192x192" 18 | } 19 | ], 20 | "start_url": "{{ '/' | relative_url }}", 21 | "background_color": "#ffffff", 22 | "display": "standalone", 23 | "scope": "{{ '/' | relative_url }}", 24 | "theme_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/screenshot.png -------------------------------------------------------------------------------- /splash-512x512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/johno/pixyll/8b5712d7ad70cc970479b953cf205e42d374d258/splash-512x512.png -------------------------------------------------------------------------------- /sw.js: -------------------------------------------------------------------------------- 1 | --- 2 | layout: null 3 | --- 4 | var CACHE_NAME = "pixyll2"; 5 | 6 | self.addEventListener("install", function(e) { 7 | e.waitUntil( 8 | caches.open(CACHE_NAME).then(function(cache) { 9 | return cache.addAll([ 10 | "{{ '/css/pixyll.css' | relative_url }}?{{ site.time | date: '%Y%m%d%H%M' }}", 11 | "{{ '/' | relative_url }}" 12 | ]); 13 | }) 14 | ); 15 | }); 16 | 17 | self.addEventListener("activate", function(e) { 18 | e.waitUntil( 19 | caches.keys().then(function(names) { 20 | return Promise.all( 21 | names.map(function(name) { 22 | if (name != CACHE_NAME) { 23 | return caches.delete(name); 24 | } 25 | }) 26 | ); 27 | }) 28 | ); 29 | return clients.claim(); 30 | }); 31 | 32 | addEventListener("fetch", function(e) { 33 | e.respondWith( 34 | caches.match(e.request).then(function(response) { 35 | return response || fetch(e.request).then(function(response) { 36 | var clonedResponse = response.clone(); 37 | var hosts = [ 38 | "https://fonts.googleapis.com", 39 | "https://fonts.gstatic.com", 40 | "https://maxcdn.bootstrapcdn.com", 41 | "https://cdnjs.cloudflare.com" 42 | ]; 43 | hosts.map(function(host) { 44 | if (e.request.url.indexOf(host) === 0) { 45 | caches.open(CACHE_NAME).then(function(cache) { 46 | cache.put(e.request, clonedResponse); 47 | }); 48 | } 49 | }); 50 | return response; 51 | }); 52 | }) 53 | ); 54 | }); 55 | -------------------------------------------------------------------------------- /thanks.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: page 3 | title: Thanks For Your Message 4 | permalink: /thanks/ 5 | --- 6 | {{ site.text.thanks }} --------------------------------------------------------------------------------