├── .gitignore ├── _sass ├── _vendors.scss ├── modules │ ├── legal │ │ ├── _variables.scss │ │ └── _rules.scss │ ├── pagination │ │ ├── _variables.scss │ │ └── _rules.scss │ └── post │ │ ├── _variables.scss │ │ └── _rules.scss ├── mixins │ ├── _clearfix.scss │ ├── _typekit-fallback.scss │ ├── _breakpoints.scss │ └── _retina-background-image.scss ├── _mixins.scss ├── _modules.scss ├── _base.scss ├── _layout.scss └── vendors │ └── _normalize.scss ├── img ├── dude.png ├── banner.png ├── dude@2x.png ├── dude@3x.png ├── banner@2x.png ├── banner@3x.png ├── separator.png ├── icon-location.png ├── separator@2x.png ├── separator@3x.png ├── icon-location@2x.png └── icon-location@3x.png ├── Gemfile ├── _layouts ├── post.html ├── page.html └── default.html ├── _includes ├── header.html ├── footer.html ├── post.html ├── head.html └── pagination.html ├── index.html ├── LICENSE ├── _posts └── 2015-11-15-the-galileo-theme.markdown ├── js └── galileo.js ├── Gemfile.lock ├── feed.xml ├── _config.yml ├── css └── screen.scss └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | _site/ 2 | .sass-cache/ 3 | .jekyll-metadata 4 | -------------------------------------------------------------------------------- /_sass/_vendors.scss: -------------------------------------------------------------------------------- 1 | @import 2 | "vendors/normalize" 3 | ; 4 | -------------------------------------------------------------------------------- /_sass/modules/legal/_variables.scss: -------------------------------------------------------------------------------- 1 | $legal-text-color: $legal-color; 2 | -------------------------------------------------------------------------------- /img/dude.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/dude.png -------------------------------------------------------------------------------- /Gemfile: -------------------------------------------------------------------------------- 1 | source 'https://rubygems.org' 2 | 3 | gem 'jekyll' 4 | gem 'jekyll-paginate' 5 | -------------------------------------------------------------------------------- /img/banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/banner.png -------------------------------------------------------------------------------- /img/dude@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/dude@2x.png -------------------------------------------------------------------------------- /img/dude@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/dude@3x.png -------------------------------------------------------------------------------- /img/banner@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/banner@2x.png -------------------------------------------------------------------------------- /img/banner@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/banner@3x.png -------------------------------------------------------------------------------- /img/separator.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/separator.png -------------------------------------------------------------------------------- /img/icon-location.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/icon-location.png -------------------------------------------------------------------------------- /img/separator@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/separator@2x.png -------------------------------------------------------------------------------- /img/separator@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/separator@3x.png -------------------------------------------------------------------------------- /_layouts/post.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | 5 | {% include post.html post=page content=content %} 6 | -------------------------------------------------------------------------------- /img/icon-location@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/icon-location@2x.png -------------------------------------------------------------------------------- /img/icon-location@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rowanoulton/galileo-theme/HEAD/img/icon-location@3x.png -------------------------------------------------------------------------------- /_sass/mixins/_clearfix.scss: -------------------------------------------------------------------------------- 1 | @mixin clearfix { 2 | &:after { 3 | content: ""; 4 | display: table; 5 | clear: both; 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /_sass/modules/pagination/_variables.scss: -------------------------------------------------------------------------------- 1 | $pagination-splitting-breakpoint: 715px; 2 | $pagination-widening-breakpoint: 800px; 3 | $pagination-border-color: #ccc; 4 | -------------------------------------------------------------------------------- /_includes/header.html: -------------------------------------------------------------------------------- 1 |
2 | 5 |
6 | -------------------------------------------------------------------------------- /_sass/_mixins.scss: -------------------------------------------------------------------------------- 1 | @import 2 | "mixins/retina-background-image", 3 | "mixins/clearfix", 4 | "mixins/breakpoints", 5 | "mixins/typekit-fallback" 6 | ; 7 | -------------------------------------------------------------------------------- /_sass/mixins/_typekit-fallback.scss: -------------------------------------------------------------------------------- 1 | @mixin typekit-fallback { 2 | @at-root { 3 | .wf-inactive, 4 | .wf-loading { 5 | @content; 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /_sass/modules/legal/_rules.scss: -------------------------------------------------------------------------------- 1 | @import "modules/legal/variables"; 2 | @mixin galileo-legal { 3 | .legal { 4 | color: $legal-text-color; 5 | font-style: italic; 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /_includes/footer.html: -------------------------------------------------------------------------------- 1 | 5 | -------------------------------------------------------------------------------- /_sass/_modules.scss: -------------------------------------------------------------------------------- 1 | @import 2 | "modules/legal/rules", 3 | "modules/post/rules", 4 | "modules/pagination/rules" 5 | ; 6 | 7 | @include galileo-legal; 8 | @include galileo-post; 9 | @include galileo-pagination; 10 | -------------------------------------------------------------------------------- /_layouts/page.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 |
5 | 6 |
7 |

{{ page.title }}

8 |
9 | 10 |
11 | {{ content }} 12 |
13 | 14 |
15 | -------------------------------------------------------------------------------- /_sass/mixins/_breakpoints.scss: -------------------------------------------------------------------------------- 1 | @mixin min-breakpoint($point) { 2 | @media only screen and (min-width: $point) { 3 | @content; 4 | } 5 | } 6 | 7 | @mixin max-breakpoint($point) { 8 | @media only screen and (max-width: $point) { 9 | @content; 10 | } 11 | } 12 | 13 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | --- 2 | layout: default 3 | --- 4 | 5 | 6 | {% for post in paginator.posts %} 7 | {% include post.html post=post content=post.content %} 8 | {% endfor %} 9 | 10 | {% if paginator.total_pages > 1 %} 11 | {% include pagination.html maxPages=5 %} 12 | {% endif %} 13 | -------------------------------------------------------------------------------- /_layouts/default.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | {% include head.html %} 4 | 5 | {% include header.html %} 6 |
7 | {{ content }} 8 |
9 | {% include footer.html %} 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /_sass/modules/post/_variables.scss: -------------------------------------------------------------------------------- 1 | $post-line-height: 1.6; 2 | 3 | $post-title-min-font-size: 24px; 4 | $post-title-medium-font-size: 5vw; 5 | $post-title-max-font-size: 42px; 6 | // To transition smoothly from our middle font-size of 5vw, we 7 | // must calculate the intersection of our minimum font size and 8 | // 5 vertical widths, that is, when the browser width is 20 times 24px 9 | // (note the calculation is done in reverse to remind us that we are using 10 | // a value of 5%, or 0.05) 11 | $post-title-medium-breakpoint: $post-title-min-font-size / 0.05; 12 | 13 | $post-image-split-max-width: 365px; 14 | $post-image-split-gutter: 20px; 15 | $post-image-split-width: calc(50% - #{$post-image-split-gutter}); 16 | $post-image-caption-line-height: $post-line-height; 17 | -------------------------------------------------------------------------------- /_includes/post.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | 4 |

{{ include.post.title }}

5 | 6 | 7 |
8 |
9 | {% if include.post.location %}{{ include.post.location }}—{% endif %}{{ include.content }} 10 |
11 | 14 |
15 | -------------------------------------------------------------------------------- /_sass/mixins/_retina-background-image.scss: -------------------------------------------------------------------------------- 1 | // Assumes that image filenames follow the pattern: 2 | // - 1x: name.png 3 | // - 2x: name@2x.png 4 | // - 3x: name@3x.png 5 | @mixin retina-background-image($img-path, $ext: '.png') { 6 | // Non-retina device 7 | background-image: url($img-path + $ext); 8 | background-size: 100%; 9 | 10 | // Retina @2x device 11 | @media only screen and (-webkit-min-device-pixel-ratio: 1.2), only screen and (min--moz-device-pixel-ratio: 1.2), only screen and (-o-min-device-pixel-ratio: 5/4), only screen and (min-device-pixel-ratio: 1.2), only screen and (min-resolution: 120dpi), only screen and (min-resolution: 1.2dppx) { 12 | background-image: url($img-path + '@2x' + $ext); 13 | } 14 | 15 | // Retina @3x device 16 | @media only screen and (-webkit-min-device-pixel-ratio: 3), only screen and (min--moz-device-pixel-ratio: 3), only screen and (-o-min-device-pixel-ratio: 3/1), only screen and (min-device-pixel-ratio: 3), only screen and (min-resolution: 288dpi), only screen and (min-resolution: 3dppx) { 17 | background-image: url($img-path + '@3x' + $ext); 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Rowan Oulton 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /_posts/2015-11-15-the-galileo-theme.markdown: -------------------------------------------------------------------------------- 1 | --- 2 | layout: post 3 | title: "The Galileo Theme" 4 | date: 2015-11-15 13:05:14 +0100 5 | categories: jekyll theme 6 | location: Florence, Italy 7 | --- 8 | 9 | Landing somewhere between a scholarly publication and an adventurers notebook, the Galileo theme presents your words & photographs in a handsome, agreeable manner. It is well behaved on both mobile & desktop and radically minimal in its footprint. Charged and ready for deployment to Github Pages. 10 | 11 | Suitable for shortform, longform, and probably even waveform. It is purpose-built to accomodate photographic content wonderfully and lends itself well to journaling your sojourn. 12 | 13 |
14 | The first in an example of split-imagery 15 | The second in an example of split-imagery 16 |
17 | 18 |
19 | A full-size image example 20 |

Here we demonstrate a caption. This'll adapt to any length of text.

21 |
22 | -------------------------------------------------------------------------------- /_sass/_base.scss: -------------------------------------------------------------------------------- 1 | /* Universal box-sizing as per https://css-tricks.com/box-sizing/ */ 2 | html { 3 | -webkit-box-sizing: border-box; 4 | -moz-box-sizing: border-box; 5 | box-sizing: border-box; 6 | } 7 | 8 | /* Universal box-sizing as per https://css-tricks.com/box-sizing/ */ 9 | *, *:before, *:after { 10 | -webkit-box-sizing: inherit; 11 | -moz-box-sizing: inherit; 12 | box-sizing: inherit; 13 | } 14 | 15 | body { 16 | font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family; 17 | color: $text-color; 18 | background-color: $background-color; 19 | -webkit-text-size-adjust: 100%; 20 | -webkit-font-feature-settings: "kern" 1; 21 | -moz-font-feature-settings: "kern" 1; 22 | -o-font-feature-settings: "kern" 1; 23 | font-feature-settings: "kern" 1; 24 | font-kerning: normal; 25 | text-rendering: optimizeLegibility; /* Beware of performance issues in mobile - see https://css-tricks.com/almanac/properties/t/text-rendering/ */ 26 | -webkit-font-smoothing: antialiased; 27 | font-smoothing: antialiased; 28 | 29 | &.is-offset { 30 | margin-top: -195px; 31 | } 32 | } 33 | 34 | a { 35 | text-decoration: none; 36 | color: #443E40; 37 | } 38 | -------------------------------------------------------------------------------- /js/galileo.js: -------------------------------------------------------------------------------- 1 | 'use strict' 2 | 3 | var secretRevealed = false 4 | var doSecretReveal 5 | var resetSecretReveal 6 | 7 | doSecretReveal = function () { 8 | // Remove the negative offset from the banner, while also scrolling down the page 9 | // this reveals the secret without affecting the users position on the page 10 | document.body.className = document.body.className.replace('is-offset', '') 11 | window.scroll(0, window.scrollY + 195) 12 | secretRevealed = true 13 | } 14 | 15 | resetSecretReveal = function () { 16 | if (secretRevealed) { 17 | // The native browser behaviour of automatically scrolling to a users last position on refresh 18 | // is upset by our revealing of the secret banner. This meant that, on refresh, the position 19 | // the browser returns the user to is incorrect. To compensate for this, we hide the secret banner 20 | // section again and adjust the page scroll value accordingly 21 | document.body.className += ' is-offset' 22 | window.scroll(0, Math.max(window.scrollY - 195, 0)) 23 | } 24 | } 25 | 26 | document.addEventListener('DOMContentLoaded', function () { 27 | // 3000 ms is arbitrary, though there must be at least some 28 | // delay here, otherwise it doesn't seem to play ball 29 | setTimeout(doSecretReveal, 3000) 30 | }) 31 | 32 | window.addEventListener('beforeunload', function () { 33 | resetSecretReveal() 34 | }) 35 | -------------------------------------------------------------------------------- /Gemfile.lock: -------------------------------------------------------------------------------- 1 | GEM 2 | remote: https://rubygems.org/ 3 | specs: 4 | addressable (2.8.5) 5 | public_suffix (>= 2.0.2, < 6.0) 6 | colorator (1.1.0) 7 | ffi (1.12.2) 8 | forwardable-extended (2.6.0) 9 | jekyll (3.6.3) 10 | addressable (~> 2.4) 11 | colorator (~> 1.0) 12 | jekyll-sass-converter (~> 1.0) 13 | jekyll-watch (~> 1.1) 14 | kramdown (~> 1.14) 15 | liquid (~> 4.0) 16 | mercenary (~> 0.3.3) 17 | pathutil (~> 0.9) 18 | rouge (>= 1.7, < 3) 19 | safe_yaml (~> 1.0) 20 | jekyll-paginate (1.1.0) 21 | jekyll-sass-converter (1.5.2) 22 | sass (~> 3.4) 23 | jekyll-watch (1.5.1) 24 | listen (~> 3.0) 25 | kramdown (1.17.0) 26 | liquid (4.0.3) 27 | listen (3.2.1) 28 | rb-fsevent (~> 0.10, >= 0.10.3) 29 | rb-inotify (~> 0.9, >= 0.9.10) 30 | mercenary (0.3.6) 31 | pathutil (0.16.2) 32 | forwardable-extended (~> 2.6) 33 | public_suffix (5.0.3) 34 | rb-fsevent (0.10.4) 35 | rb-inotify (0.10.1) 36 | ffi (~> 1.0) 37 | rouge (2.2.1) 38 | safe_yaml (1.0.5) 39 | sass (3.7.4) 40 | sass-listen (~> 4.0.0) 41 | sass-listen (4.0.0) 42 | rb-fsevent (~> 0.9, >= 0.9.4) 43 | rb-inotify (~> 0.9, >= 0.9.7) 44 | 45 | PLATFORMS 46 | ruby 47 | 48 | DEPENDENCIES 49 | jekyll 50 | jekyll-paginate 51 | 52 | BUNDLED WITH 53 | 2.1.4 54 | -------------------------------------------------------------------------------- /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 | {{ site.time | date_to_rfc822 }} 12 | {{ site.time | date_to_rfc822 }} 13 | Jekyll v{{ jekyll.version }} 14 | {% for post in site.posts limit:10 %} 15 | 16 | {{ post.title | xml_escape }} 17 | {{ post.content | xml_escape }} 18 | {{ post.date | date_to_rfc822 }} 19 | {{ post.url | prepend: site.baseurl | prepend: site.url }} 20 | {{ post.url | prepend: site.baseurl | prepend: site.url }} 21 | {% for tag in post.tags %} 22 | {{ tag | xml_escape }} 23 | {% endfor %} 24 | {% for cat in post.categories %} 25 | {{ cat | xml_escape }} 26 | {% endfor %} 27 | 28 | {% endfor %} 29 | 30 | 31 | -------------------------------------------------------------------------------- /_config.yml: -------------------------------------------------------------------------------- 1 | # Welcome to Jekyll! 2 | # 3 | # This config file is meant for settings that affect your whole blog, values 4 | # which you are expected to set up once and rarely need to edit after that. 5 | # For technical reasons, this file is *NOT* reloaded automatically when you use 6 | # 'jekyll serve'. If you change this file, please restart the server process. 7 | 8 | # Site settings 9 | title: Travelog 10 | author: Your name 11 | author_link: https://whatever.you/like 12 | author_description: A few words to describe you & your face 13 | email: your-email@domain.com 14 | description: > # this means to ignore newlines until "baseurl:" 15 | Write an awesome description for your new site here. You can edit this 16 | line in _config.yml. It will appear in your document head meta (for 17 | Google search results) and in your feed.xml site description. 18 | baseurl: "" # the subpath of your site, e.g. /blog 19 | url: "http://yourdomain.com" # the base hostname & protocol for your site 20 | 21 | # Picturefill 22 | # A responsive image polyfill: http://scottjehl.github.io/picturefill/ 23 | picturefill: false 24 | 25 | # Typography 26 | # To use, publish a kit and enter the ID here. If you do not wish to use Typekit, 27 | # leave this ID blank 28 | typekit_kit_id: kwf5dox 29 | 30 | # Build settings 31 | gems: [jekyll-paginate] 32 | markdown: kramdown 33 | permalink: pretty 34 | 35 | # Pagination 36 | paginate: 5 37 | 38 | # Sass 39 | sass: 40 | style: :compressed 41 | -------------------------------------------------------------------------------- /css/screen.scss: -------------------------------------------------------------------------------- 1 | --- 2 | # Only the main Sass file needs front matter (the dashes are enough) 3 | --- 4 | @charset "utf-8"; 5 | 6 | // Typography 7 | $base-font-family: "adobe-caslon-pro", "Adobe Caslon Pro", serif; 8 | $caption-font-family: "ltc-bodoni-175", "Libre Baskerville", serif; 9 | $banner-font-family: "Sanchez", serif; 10 | $title-font-family: "Libre Baskerville", serif; 11 | $base-font-size: 18px; 12 | $base-font-weight: 400; 13 | $base-line-height: 1; 14 | 15 | // Colours 16 | $text-color: #222; 17 | $caption-text-color: #444; 18 | $border-color: #979797; 19 | $background-color: #fefefe; 20 | $content-width: 750px; 21 | $hover-color: #443E40; 22 | $legal-color: #818181; 23 | 24 | // Layout 25 | $layout-width: 750px; 26 | 27 | // Breakpoints 28 | $desktop-breakpoint: $layout-width / 0.9; 29 | $image-splitting-breakpoint: 510px; 30 | 31 | // Banner 32 | $banner-width: 182px; 33 | $banner-height: 503px; 34 | $banner-margin: 50px; 35 | $banner-border-width: 3px; 36 | $banner-border-offset: 2px; 37 | 38 | // Images 39 | // Note that extensions are omitted for use in retina-background-image mixin 40 | $img-separator: '{{ site.baseurl }}/img/separator'; 41 | $img-banner: '{{ site.baseurl }}/img/banner'; 42 | $img-dude: '{{ site.baseurl }}/img/dude'; 43 | $img-location: '{{ site.baseurl }}/img/icon-location'; 44 | 45 | // Import partials from `sass_dir` (defaults to `_sass`) 46 | @import 47 | "mixins", 48 | "vendors", 49 | "base", 50 | "layout", 51 | "modules" 52 | ; 53 | -------------------------------------------------------------------------------- /_includes/head.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | {% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %} 7 | 8 | {% if site.picturefill %} 9 | 13 | 14 | {% endif %} 15 | {% if site.typekit_kit_id %} 16 | 26 | {% endif %} 27 | 28 | 29 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Galileo Theme 2 | --- 3 | 4 | Another damned theme for Jekyll. 5 | 6 | ![The Galileo Theme](https://cloud.githubusercontent.com/assets/185649/11737785/b998bd0c-a002-11e5-9c93-0ac83917f32d.png) 7 | 8 | Landing somewhere between a scholarly publication and an adventurers notebook, the Galileo theme presents your words & photographs in a handsome, agreeable manner. 9 | 10 | It is well behaved on both mobile & desktop and radically minimal in its footprint. Charged and ready for deployment to Github Pages. 11 | 12 | ### In the wild 13 | 14 | Demo [here](http://travelog.io/galileo-theme/). I'm so damned fond of this theme that I also use it on [my own blog](http://travelog.io/). 15 | 16 | ### Installation 17 | 18 | - Install Jekyll: `gem install jekyll` 19 | - [Fork this repository](https://github.com/rowanoulton/galileo-theme/fork) 20 | - Clone it: `git clone https://github.com/YOUR-USER/galileo-theme` 21 | - Run the jekyll server: `jekyll serve -w` 22 | 23 | Observe the results at . 24 | 25 | ### Customisation 26 | 27 | Make changes in [_config.yml](https://github.com/rowanoulton/galileo-theme/blob/master/_config.yml), ye damned heathens. 28 | 29 | #### A note about fonts 30 | 31 | I've employed [Typekit](https://typekit.com/) to load both "[Adobe Caslon Pro](https://typekit.com/fonts/adobe-caslon-pro)" & "[LTC Bodoni 175](https://typekit.com/fonts/ltc-bodoni-175)". To make use of these with your own Typekit account, publish a kit and enter the ID into the Jekyll config. 32 | 33 | This _is_ optional. If you don't want to use Typekit, well _fine_, just leave the Typekit Kit ID blank. You'll need to elect and specify substitute fonts [here](https://github.com/rowanoulton/galileo-theme/blob/master/css/screen.scss#L7) and [here](https://github.com/rowanoulton/galileo-theme/blob/master/css/screen.scss#L8). 34 | 35 | ### Deployment 36 | 37 | This theme is built to be deployed easily to [GitHub Pages](https://pages.github.com/). 38 | 39 | 40 | ### License 41 | 42 | [MIT](https://github.com/rowanoulton/galileo-theme/blob/master/LICENSE). 43 | 44 | Do whatever you damn well please with it. I'm always glad to hear what folks are doing with it though — let me know on [Twitter](https://twitter.com/rowanoulton). 45 | -------------------------------------------------------------------------------- /_sass/_layout.scss: -------------------------------------------------------------------------------- 1 | #banner { 2 | @include retina-background-image($img-banner); 3 | background-color: #8e8387; 4 | outline: none; 5 | display: block; 6 | width: $banner-width; 7 | height: $banner-height; 8 | margin: 0 auto 35px; 9 | position: relative; /* To ensure the bottom border is positioned correctly */ 10 | 11 | h1 { 12 | // Font is included from Google Fonts automatically unless a custom banner is used 13 | // See _config.yml for details 14 | font-family: $banner-font-family; 15 | font-size: 24px; 16 | font-weight: 400; 17 | text-align: center; 18 | letter-spacing: 0.03em; 19 | color: #fefefe; 20 | position: absolute; 21 | bottom: 20px; 22 | width: 100%; 23 | } 24 | 25 | &::after { 26 | display: block; 27 | position: absolute; 28 | top: $banner-height; 29 | left: $banner-border-offset; 30 | content: ""; 31 | background: #443E40; 32 | height: $banner-border-width; 33 | width: $banner-width - ($banner-border-offset* 2); 34 | } 35 | 36 | @include min-breakpoint($image-splitting-breakpoint) { 37 | margin-bottom: $banner-margin; 38 | } 39 | } 40 | 41 | #footer { 42 | margin-top: 50px; 43 | text-align: center; 44 | 45 | &::after { 46 | @include retina-background-image($img-dude); 47 | display: block; 48 | content: ""; 49 | width: 65px; 50 | height: 158px; 51 | margin: 20px auto 50px; 52 | } 53 | 54 | a { 55 | // Overwrite default link color 56 | color: #222; 57 | 58 | &:hover { 59 | // ... but allow the hover color to work as normal 60 | color: $hover-color; 61 | } 62 | } 63 | 64 | p { 65 | margin: 0 0 9px; 66 | line-height: 1.3; 67 | font-size: 19px; 68 | max-width: 75%; 69 | margin-left: auto; 70 | margin-right: auto; 71 | 72 | @include min-breakpoint($image-splitting-breakpoint) { 73 | font-size: 18px; 74 | line-height: 1; 75 | } 76 | } 77 | } 78 | 79 | section[role="main"] { 80 | width: 90%; 81 | margin: 0 auto; 82 | 83 | @include min-breakpoint($desktop-breakpoint) { 84 | width: $layout-width; 85 | } 86 | } 87 | -------------------------------------------------------------------------------- /_sass/modules/pagination/_rules.scss: -------------------------------------------------------------------------------- 1 | @import "modules/pagination/variables"; 2 | @mixin galileo-pagination { 3 | .pagination { 4 | @include clearfix; 5 | margin: -10px auto 0; 6 | display: block; 7 | border-top: 1px solid $pagination-border-color; 8 | text-align: center; 9 | align-items: center; 10 | justify-content: center; 11 | 12 | @include min-breakpoint($pagination-splitting-breakpoint) { 13 | margin: -25px auto 0; 14 | display: flex; 15 | border-top: 0; 16 | } 17 | } 18 | 19 | .pagination-item { 20 | line-height: 21px; 21 | 22 | &:first-of-type { 23 | a { border-right: 1px solid $pagination-border-color; } 24 | } 25 | 26 | &:last-of-type { 27 | a { border-left: 1px solid $pagination-border-color; } 28 | } 29 | 30 | @include min-breakpoint($pagination-splitting-breakpoint) { 31 | // To ensure the top margin begins from the outer bounds of the contained pagination link 32 | line-height: 38px; 33 | 34 | &:first-of-type { 35 | a { border-right: 0; } 36 | } 37 | 38 | &:last-of-type { 39 | a { border-left: 0; } 40 | } 41 | } 42 | } 43 | 44 | .pagination-link, 45 | .pagination-ellipsis { 46 | padding: 18px 8px 12px; 47 | min-width: 35px; 48 | border-bottom: 1px solid $pagination-border-color; 49 | color: $legal-color; 50 | letter-spacing: 0.02em; 51 | clear: both; 52 | display: block; 53 | outline: none; 54 | 55 | &:hover { 56 | background: #eee; 57 | border-color: $hover-color; 58 | color: $hover-color; 59 | } 60 | 61 | &[disabled] { 62 | pointer-events: none; 63 | color: lighten($legal-color, 30%); 64 | } 65 | 66 | @include min-breakpoint($pagination-splitting-breakpoint) { 67 | &:hover { 68 | background: transparent; 69 | } 70 | } 71 | 72 | @include min-breakpoint($pagination-widening-breakpoint) { 73 | padding: 13px; 74 | } 75 | } 76 | 77 | .pagination-link--selected { 78 | background: #eee; 79 | font-weight: bold; 80 | border-color: $hover-color; 81 | color: $hover-color; 82 | 83 | @include min-breakpoint($pagination-splitting-breakpoint) { 84 | background: transparent; 85 | } 86 | } 87 | 88 | .pagination-link--non-numeric { 89 | clear: none; 90 | width: 50%; 91 | float: left; 92 | 93 | @include min-breakpoint($pagination-splitting-breakpoint) { 94 | float: none; 95 | width: initial; 96 | } 97 | } 98 | 99 | .pagination-link-arrow { 100 | position: relative; 101 | } 102 | 103 | .pagination-link-arrow--leftward { 104 | // Offset the arrow every so slightly to sit well next to the text 105 | top: 1px; 106 | margin-left: -15px; 107 | 108 | @include min-breakpoint($pagination-splitting-breakpoint) { 109 | margin-left: 0; 110 | } 111 | } 112 | 113 | .pagination-link-arrow--rightward { 114 | // Weirdly enough, arrows pointing right need a little more offset 115 | top: 2px; 116 | margin-right: -15px; 117 | 118 | @include min-breakpoint($pagination-splitting-breakpoint) { 119 | margin-right: 0; 120 | } 121 | } 122 | 123 | .pagination-link-help { 124 | display: inline; 125 | 126 | @include min-breakpoint($pagination-splitting-breakpoint) { 127 | display: none; 128 | } 129 | } 130 | 131 | .pagination-ellipsis { 132 | // Prevent hover effects 133 | pointer-events: none; 134 | } 135 | } 136 | -------------------------------------------------------------------------------- /_includes/pagination.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 92 | -------------------------------------------------------------------------------- /_sass/modules/post/_rules.scss: -------------------------------------------------------------------------------- 1 | @import "modules/post/variables"; 2 | @mixin galileo-post { 3 | .post::after { 4 | @include retina-background-image($img-separator); 5 | background-repeat: no-repeat; 6 | background-position: center bottom; 7 | background-color: transparent; 8 | content: ""; 9 | width: 100%; 10 | max-width: 596px; 11 | height: 42px; 12 | display: block; 13 | margin: 20px auto 50px; 14 | 15 | // Force background size to remain constant and not scale down 16 | background-size: 596px !important; 17 | 18 | // The breakpoint here was entirely guessed and tested by eye-balling the results 19 | // ie. feel free to choose something more sensible 20 | @include min-breakpoint(645px) { 21 | margin-top: 5px; 22 | } 23 | } 24 | 25 | .post-title { 26 | font-family: $title-font-family; 27 | display: block; 28 | font-weight: 700; 29 | font-size: $post-title-min-font-size; 30 | text-align: center; 31 | line-height: 1.4; 32 | 33 | // Force default text colour [as post-header is wrapped by a link] 34 | color: $text-color; 35 | 36 | @include min-breakpoint($post-title-medium-breakpoint) { 37 | font-size: $post-title-medium-font-size; 38 | } 39 | 40 | @include min-breakpoint($desktop-breakpoint) { 41 | font-size: $post-title-max-font-size; 42 | } 43 | } 44 | 45 | .post-date { 46 | display: block; 47 | border-top: 1px solid $border-color; 48 | border-bottom: 1px solid $border-color; 49 | text-align: center; 50 | color: $legal-text-color; 51 | margin: 15px 0 25px; 52 | font-variant: small-caps; 53 | letter-spacing: 0.06em; 54 | 55 | // Fix typekit line-height with excess top padding 56 | padding: 23px 0 13px; 57 | } 58 | 59 | @include typekit-fallback { 60 | .post-date { 61 | // Reset a reasonable top padding in absence of abnormally tall typekit font line-height 62 | padding-top: 18px; 63 | } 64 | } 65 | 66 | .post-body { 67 | p { 68 | text-align: justify; 69 | line-height: $post-line-height; 70 | margin-bottom: 25px; 71 | } 72 | } 73 | 74 | .post-body-location, 75 | .post-body-location-divider { 76 | float: left; 77 | } 78 | 79 | .post-body-location { 80 | font-family: $caption-font-family; 81 | letter-spacing: 0.04em; 82 | text-transform: uppercase; 83 | margin-right: 5px; 84 | 85 | // A line-height of 1.2 makes our font (Bodoni) align well horizontally with 86 | // the paragraph font (Caslon) however we need to ensure that the location 87 | // text displays nicely if wrapped across multiple lines. To solve this, 88 | // we increase the line-height while offsetting its position upwards slightly. 89 | // This will keep the alignment between Bodoni & Caslon AND wrap nicely. 90 | line-height: 1.4; 91 | position: relative; 92 | top: -2px; 93 | } 94 | 95 | .post-body-location-divider { 96 | margin-right: 6px; 97 | line-height: 1.4; 98 | } 99 | 100 | .post-image { 101 | margin-bottom: 25px; 102 | margin-top: 30px; 103 | 104 | // Prevent any whitespace positioning issues 105 | font-size: 0; 106 | 107 | img, 108 | video{ 109 | width: 100%; 110 | max-width: 100%; 111 | height: auto; 112 | } 113 | 114 | & + .post-image { 115 | margin-top: -5px; 116 | } 117 | 118 | & + p { 119 | margin-top: 35px; 120 | } 121 | } 122 | 123 | .post-image--split { 124 | @include min-breakpoint($image-splitting-breakpoint) { 125 | margin-right: -1 * $post-image-split-gutter; 126 | } 127 | 128 | img { 129 | width: 100%; 130 | display: block; 131 | margin-bottom: $post-image-split-gutter; 132 | 133 | @include min-breakpoint($image-splitting-breakpoint) { 134 | width: $post-image-split-width; 135 | margin-right: $post-image-split-gutter; 136 | display: initial; 137 | margin-bottom: 0; 138 | } 139 | 140 | @include min-breakpoint($desktop-breakpoint) { 141 | max-width: $post-image-split-max-width; 142 | } 143 | } 144 | 145 | .post-image-caption { 146 | @include min-breakpoint($image-splitting-breakpoint) { 147 | margin-right: $post-image-split-gutter; 148 | } 149 | } 150 | } 151 | 152 | .post-image-caption { 153 | margin-top: 25px; 154 | color: $caption-text-color; 155 | font-family: $caption-font-family; 156 | line-height: $post-image-caption-line-height; 157 | padding: 0 20px; 158 | 159 | // Re-set the font size as parent is set to zero 160 | font-size: $base-font-size; 161 | 162 | // Override properties meant for article content paragraphs 163 | margin-bottom: 0 !important; 164 | text-align: center !important; 165 | 166 | &::after { 167 | display: block; 168 | content: ""; 169 | width: 185px; 170 | margin: 23px auto 30px; 171 | border-bottom: 3px double $border-color; 172 | } 173 | } 174 | 175 | @include typekit-fallback { 176 | .post-image-caption { 177 | // Our fallback font is much larger, so we need to reduce the font-size and increase the line-height 178 | font-size: 15px; 179 | line-height: 1.8 !important; 180 | 181 | &::after { 182 | // Reset a reasonable top margin in absence of the abnormally tall typekit font line-height 183 | margin-top: 25px; 184 | } 185 | } 186 | } 187 | 188 | .post-footer { 189 | @include min-breakpoint($desktop-breakpoint) { 190 | // Child is floated, so use a clearfix on the parent 191 | @include clearfix; 192 | } 193 | } 194 | 195 | .post-footer-location { 196 | display: none; 197 | 198 | @include min-breakpoint($desktop-breakpoint) { 199 | @include retina-background-image($img-location); 200 | display: block; 201 | background-repeat: no-repeat; 202 | background-position: right center; 203 | background-color: transparent; 204 | background-size: 44px; 205 | min-height: 21px; 206 | padding-right: 55px; 207 | float: right; 208 | 209 | // The font used (Adobe Caslon Pro) has a peculiar line-height. This 210 | // adjusts the position of the text in relation to the icon without 211 | // adjusting the line-height property itself 212 | margin-top: -9px; 213 | padding-top: 9px; 214 | 215 | // Force legal text colour [as it is a link] 216 | color: $legal-text-color; 217 | 218 | // However let the normal hover colour apply 219 | &:hover { color: $hover-color; } 220 | } 221 | } 222 | } 223 | -------------------------------------------------------------------------------- /_sass/vendors/_normalize.scss: -------------------------------------------------------------------------------- 1 | /*! normalize.css v3.0.1 | MIT License | git.io/normalize */ 2 | 3 | /** 4 | * 1. Set default font family to sans-serif. 5 | * 2. Prevent iOS text size adjust after orientation change, without disabling 6 | * user zoom. 7 | */ 8 | 9 | html { 10 | font-family: sans-serif; /* 1 */ 11 | -ms-text-size-adjust: 100%; /* 2 */ 12 | -webkit-text-size-adjust: 100%; /* 2 */ 13 | } 14 | 15 | /** 16 | * Remove default margin. 17 | */ 18 | 19 | body { 20 | margin: 0; 21 | } 22 | 23 | /* HTML5 display definitions 24 | ========================================================================== */ 25 | 26 | /** 27 | * Correct `block` display not defined for any HTML5 element in IE 8/9. 28 | * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. 29 | * Correct `block` display not defined for `main` in IE 11. 30 | */ 31 | 32 | article, 33 | aside, 34 | details, 35 | figcaption, 36 | figure, 37 | footer, 38 | header, 39 | hgroup, 40 | main, 41 | nav, 42 | section, 43 | summary { 44 | display: block; 45 | } 46 | 47 | /** 48 | * 1. Correct `inline-block` display not defined in IE 8/9. 49 | * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. 50 | */ 51 | 52 | audio, 53 | canvas, 54 | progress, 55 | video { 56 | display: inline-block; /* 1 */ 57 | vertical-align: baseline; /* 2 */ 58 | } 59 | 60 | /** 61 | * Prevent modern browsers from displaying `audio` without controls. 62 | * Remove excess height in iOS 5 devices. 63 | */ 64 | 65 | audio:not([controls]) { 66 | display: none; 67 | height: 0; 68 | } 69 | 70 | /** 71 | * Address `[hidden]` styling not present in IE 8/9/10. 72 | * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. 73 | */ 74 | 75 | [hidden], 76 | template { 77 | display: none; 78 | } 79 | 80 | /* Links 81 | ========================================================================== */ 82 | 83 | /** 84 | * Remove the gray background color from active links in IE 10. 85 | */ 86 | 87 | a { 88 | background: transparent; 89 | } 90 | 91 | /** 92 | * Improve readability when focused and also mouse hovered in all browsers. 93 | */ 94 | 95 | a:active, 96 | a:hover { 97 | outline: 0; 98 | } 99 | 100 | /* Text-level semantics 101 | ========================================================================== */ 102 | 103 | /** 104 | * Address styling not present in IE 8/9/10/11, Safari, and Chrome. 105 | */ 106 | 107 | abbr[title] { 108 | border-bottom: 1px dotted; 109 | } 110 | 111 | /** 112 | * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. 113 | */ 114 | 115 | b, 116 | strong { 117 | font-weight: bold; 118 | } 119 | 120 | /** 121 | * Address styling not present in Safari and Chrome. 122 | */ 123 | 124 | dfn { 125 | font-style: italic; 126 | } 127 | 128 | /** 129 | * Address variable `h1` font-size and margin within `section` and `article` 130 | * contexts in Firefox 4+, Safari, and Chrome. 131 | */ 132 | 133 | h1 { 134 | font-size: 2em; 135 | margin: 0.67em 0; 136 | } 137 | 138 | /** 139 | * Address styling not present in IE 8/9. 140 | */ 141 | 142 | mark { 143 | background: #ff0; 144 | color: #000; 145 | } 146 | 147 | /** 148 | * Address inconsistent and variable font size in all browsers. 149 | */ 150 | 151 | small { 152 | font-size: 80%; 153 | } 154 | 155 | /** 156 | * Prevent `sub` and `sup` affecting `line-height` in all browsers. 157 | */ 158 | 159 | sub, 160 | sup { 161 | font-size: 75%; 162 | line-height: 0; 163 | position: relative; 164 | vertical-align: baseline; 165 | } 166 | 167 | sup { 168 | top: -0.5em; 169 | } 170 | 171 | sub { 172 | bottom: -0.25em; 173 | } 174 | 175 | /* Embedded content 176 | ========================================================================== */ 177 | 178 | /** 179 | * Remove border when inside `a` element in IE 8/9/10. 180 | */ 181 | 182 | img { 183 | border: 0; 184 | } 185 | 186 | /** 187 | * Correct overflow not hidden in IE 9/10/11. 188 | */ 189 | 190 | svg:not(:root) { 191 | overflow: hidden; 192 | } 193 | 194 | /* Grouping content 195 | ========================================================================== */ 196 | 197 | /** 198 | * Address margin not present in IE 8/9 and Safari. 199 | */ 200 | 201 | figure { 202 | margin: 25px 40px 35px; 203 | } 204 | 205 | /** 206 | * Address differences between Firefox and other browsers. 207 | */ 208 | 209 | hr { 210 | -moz-box-sizing: content-box; 211 | box-sizing: content-box; 212 | height: 0; 213 | } 214 | 215 | /** 216 | * Contain overflow in all browsers. 217 | */ 218 | 219 | pre { 220 | overflow: auto; 221 | } 222 | 223 | /** 224 | * Address odd `em`-unit font size rendering in all browsers. 225 | */ 226 | 227 | code, 228 | kbd, 229 | pre, 230 | samp { 231 | font-family: monospace, monospace; 232 | font-size: 1em; 233 | } 234 | 235 | /* Forms 236 | ========================================================================== */ 237 | 238 | /** 239 | * Known limitation: by default, Chrome and Safari on OS X allow very limited 240 | * styling of `select`, unless a `border` property is set. 241 | */ 242 | 243 | /** 244 | * 1. Correct color not being inherited. 245 | * Known issue: affects color of disabled elements. 246 | * 2. Correct font properties not being inherited. 247 | * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. 248 | */ 249 | 250 | button, 251 | input, 252 | optgroup, 253 | select, 254 | textarea { 255 | color: inherit; /* 1 */ 256 | font: inherit; /* 2 */ 257 | margin: 0; /* 3 */ 258 | } 259 | 260 | /** 261 | * Address `overflow` set to `hidden` in IE 8/9/10/11. 262 | */ 263 | 264 | button { 265 | overflow: visible; 266 | } 267 | 268 | /** 269 | * Address inconsistent `text-transform` inheritance for `button` and `select`. 270 | * All other form control elements do not inherit `text-transform` values. 271 | * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. 272 | * Correct `select` style inheritance in Firefox. 273 | */ 274 | 275 | button, 276 | select { 277 | text-transform: none; 278 | } 279 | 280 | /** 281 | * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` 282 | * and `video` controls. 283 | * 2. Correct inability to style clickable `input` types in iOS. 284 | * 3. Improve usability and consistency of cursor style between image-type 285 | * `input` and others. 286 | */ 287 | 288 | button, 289 | html input[type="button"], /* 1 */ 290 | input[type="reset"], 291 | input[type="submit"] { 292 | -webkit-appearance: button; /* 2 */ 293 | cursor: pointer; /* 3 */ 294 | } 295 | 296 | /** 297 | * Re-set default cursor for disabled elements. 298 | */ 299 | 300 | button[disabled], 301 | html input[disabled] { 302 | cursor: default; 303 | } 304 | 305 | /** 306 | * Remove inner padding and border in Firefox 4+. 307 | */ 308 | 309 | button::-moz-focus-inner, 310 | input::-moz-focus-inner { 311 | border: 0; 312 | padding: 0; 313 | } 314 | 315 | /** 316 | * Address Firefox 4+ setting `line-height` on `input` using `!important` in 317 | * the UA stylesheet. 318 | */ 319 | 320 | input { 321 | line-height: normal; 322 | } 323 | 324 | /** 325 | * It's recommended that you don't attempt to style these elements. 326 | * Firefox's implementation doesn't respect box-sizing, padding, or width. 327 | * 328 | * 1. Address box sizing set to `content-box` in IE 8/9/10. 329 | * 2. Remove excess padding in IE 8/9/10. 330 | */ 331 | 332 | input[type="checkbox"], 333 | input[type="radio"] { 334 | box-sizing: border-box; /* 1 */ 335 | padding: 0; /* 2 */ 336 | } 337 | 338 | /** 339 | * Fix the cursor style for Chrome's increment/decrement buttons. For certain 340 | * `font-size` values of the `input`, it causes the cursor style of the 341 | * decrement button to change from `default` to `text`. 342 | */ 343 | 344 | input[type="number"]::-webkit-inner-spin-button, 345 | input[type="number"]::-webkit-outer-spin-button { 346 | height: auto; 347 | } 348 | 349 | /** 350 | * 1. Address `appearance` set to `searchfield` in Safari and Chrome. 351 | * 2. Address `box-sizing` set to `border-box` in Safari and Chrome 352 | * (include `-moz` to future-proof). 353 | */ 354 | 355 | input[type="search"] { 356 | -webkit-appearance: textfield; /* 1 */ 357 | -moz-box-sizing: content-box; 358 | -webkit-box-sizing: content-box; /* 2 */ 359 | box-sizing: content-box; 360 | } 361 | 362 | /** 363 | * Remove inner padding and search cancel button in Safari and Chrome on OS X. 364 | * Safari (but not Chrome) clips the cancel button when the search input has 365 | * padding (and `textfield` appearance). 366 | */ 367 | 368 | input[type="search"]::-webkit-search-cancel-button, 369 | input[type="search"]::-webkit-search-decoration { 370 | -webkit-appearance: none; 371 | } 372 | 373 | /** 374 | * Define consistent border, margin, and padding. 375 | */ 376 | 377 | fieldset { 378 | border: 1px solid #c0c0c0; 379 | margin: 0 2px; 380 | padding: 0.35em 0.625em 0.75em; 381 | } 382 | 383 | /** 384 | * 1. Correct `color` not being inherited in IE 8/9/10/11. 385 | * 2. Remove padding so people aren't caught out if they zero out fieldsets. 386 | */ 387 | 388 | legend { 389 | border: 0; /* 1 */ 390 | padding: 0; /* 2 */ 391 | } 392 | 393 | /** 394 | * Remove default vertical scrollbar in IE 8/9/10/11. 395 | */ 396 | 397 | textarea { 398 | overflow: auto; 399 | } 400 | 401 | /** 402 | * Don't inherit the `font-weight` (applied by a rule above). 403 | * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. 404 | */ 405 | 406 | optgroup { 407 | font-weight: bold; 408 | } 409 | 410 | /* Tables 411 | ========================================================================== */ 412 | 413 | /** 414 | * Remove most spacing between table cells. 415 | */ 416 | 417 | table { 418 | border-collapse: collapse; 419 | border-spacing: 0; 420 | } 421 | 422 | td, 423 | th { 424 | padding: 0; 425 | } 426 | 427 | 428 | /* Custom 429 | ========================================================================== */ 430 | 431 | /** 432 | * Remove margins from headers and lists 433 | */ 434 | 435 | h1, 436 | h2, 437 | h3, 438 | h4, 439 | ul { 440 | margin: 0; 441 | } 442 | 443 | /** 444 | * Remove padding and list style from lists 445 | */ 446 | ul { 447 | padding: 0; 448 | list-style: none; 449 | } 450 | 451 | /** 452 | * Fix line-height for code blocks 453 | */ 454 | pre { 455 | line-height: 1.4; 456 | } 457 | --------------------------------------------------------------------------------