├── layouts ├── 404.html ├── _default │ ├── baseof.html │ ├── single.html │ └── list.html ├── partials │ ├── pagination.html │ ├── header.html │ ├── footer.html │ └── head.html ├── index.html └── post │ ├── summary.html │ └── single.html ├── exampleSite ├── static │ └── .gitkeep ├── .gitignore ├── config.toml └── content │ ├── about.md │ └── post │ ├── hugoisforlovers.md │ ├── migrate-from-jekyll.md │ └── goisforlovers.md ├── archetypes └── default.md ├── images ├── tn.png └── screenshot.png ├── static └── assets │ ├── fonts │ ├── icons.eot │ ├── icons.ttf │ ├── icons.woff │ └── icons.svg │ ├── bigfoot │ ├── readme-dev.md │ ├── package.json │ ├── bower.json │ ├── LICENSE.md │ ├── src │ │ └── scss │ │ │ ├── foundation │ │ │ ├── bigfoot-mixins.scss │ │ │ └── bigfoot-variables.scss │ │ │ ├── variants │ │ │ ├── bigfoot-bottom.scss │ │ │ └── bigfoot-number.scss │ │ │ └── base │ │ │ ├── bigfoot-button.scss │ │ │ └── bigfoot-popover.scss │ ├── README.md │ ├── Gruntfile.coffee │ ├── changelog.md │ └── dist │ │ ├── bigfoot-default.css.map │ │ ├── bigfoot-number.css.map │ │ ├── bigfoot-bottom.css.map │ │ ├── bigfoot-default.css │ │ ├── bigfoot-number.css │ │ ├── bigfoot-bottom.css │ │ ├── bigfoot.min.js │ │ ├── bigfoot-default.scss │ │ └── bigfoot-bottom.scss │ └── css │ ├── icons.css │ ├── normalize.css │ └── screen.css ├── theme.toml ├── LICENSE └── README.md /layouts/404.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exampleSite/static/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /archetypes/default.md: -------------------------------------------------------------------------------- 1 | +++ 2 | +++ 3 | -------------------------------------------------------------------------------- /exampleSite/.gitignore: -------------------------------------------------------------------------------- 1 | public/ 2 | themes 3 | -------------------------------------------------------------------------------- /images/tn.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bytes-crafter/arabica/HEAD/images/tn.png -------------------------------------------------------------------------------- /images/screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bytes-crafter/arabica/HEAD/images/screenshot.png -------------------------------------------------------------------------------- /static/assets/fonts/icons.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bytes-crafter/arabica/HEAD/static/assets/fonts/icons.eot -------------------------------------------------------------------------------- /static/assets/fonts/icons.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bytes-crafter/arabica/HEAD/static/assets/fonts/icons.ttf -------------------------------------------------------------------------------- /static/assets/fonts/icons.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bytes-crafter/arabica/HEAD/static/assets/fonts/icons.woff -------------------------------------------------------------------------------- /layouts/_default/baseof.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | {{ partial "head.html" . }} 4 | 5 | {{ partial "header.html" . }} 6 | {{ block "main" . }}{{ end }} 7 | {{ partial "footer.html" . }} 8 | 9 | 10 | -------------------------------------------------------------------------------- /static/assets/bigfoot/readme-dev.md: -------------------------------------------------------------------------------- 1 | Updates to existing styles should be made in `src/scss/button.scss` and `src/scss/popover.scss`. New styles should be created as BEM-style variants on the existing button and popover styles. You will also have to update rules in `Gruntfile.js` in order to create the required `dist` files. 2 | -------------------------------------------------------------------------------- /exampleSite/config.toml: -------------------------------------------------------------------------------- 1 | baseurl = "https://example.org/" 2 | title = "Arabica" 3 | author = "John Doe" 4 | paginate = 3 5 | theme = "arabica" 6 | 7 | [params] 8 | description = "A minimal Hugo theme" 9 | dateFormatToUse = "2006-01-02" 10 | replaceGoogleFonts = "fonts.loli.net" 11 | twitter = "example" 12 | facebook = "example" 13 | -------------------------------------------------------------------------------- /layouts/_default/single.html: -------------------------------------------------------------------------------- 1 | {{ define "body_class" }}page-template{{ end }} 2 | {{ define "main" }} 3 |
4 |
5 |
6 |

{{ .Title }}

7 |
8 |
9 | {{ .Content }} 10 |
11 |
12 |
13 | {{ end }} -------------------------------------------------------------------------------- /layouts/partials/pagination.html: -------------------------------------------------------------------------------- 1 | {{ $pag := $.Paginator }} 2 | 3 | 12 | -------------------------------------------------------------------------------- /layouts/index.html: -------------------------------------------------------------------------------- 1 | {{ define "main" }} 2 |
3 | {{ $pages := .Pages }} 4 | {{ if .IsHome }} 5 | {{ $pages = where .Site.RegularPages "Type" "in" site.Params.mainSections }} 6 | {{ end }} 7 | {{ $paginator := .Paginate $pages }} 8 |
9 | {{ partial "pagination.html" . }} 10 |
11 | {{ range $paginator.Pages }} 12 | {{ .Render "summary" }} 13 | {{ end }} 14 | {{ partial "pagination.html" . }} 15 |
16 | {{ end }} 17 | -------------------------------------------------------------------------------- /exampleSite/content/about.md: -------------------------------------------------------------------------------- 1 | +++ 2 | title = "About Hugo" 3 | date = "2014-04-09" 4 | menu = "main" 5 | +++ 6 | 7 | Hugo is the **world’s fastest framework for building websites**. It is written in Go. 8 | 9 | It makes use of a variety of open source projects including: 10 | 11 | * https://github.com/russross/blackfriday 12 | * https://github.com/alecthomas/chroma 13 | * https://github.com/muesli/smartcrop 14 | * https://github.com/spf13/cobra 15 | * https://github.com/spf13/viper 16 | 17 | Learn more and contribute on [GitHub](https://github.com/gohugoio). 18 | 19 | -------------------------------------------------------------------------------- /layouts/post/summary.html: -------------------------------------------------------------------------------- 1 |
2 |
3 | {{ with .Params.image }} 4 | 5 | {{ end }} 6 |

{{ .Title }}

7 |
8 |
9 |

10 | {{ .Summary }} … » 11 |

12 |
13 | 16 |
17 | -------------------------------------------------------------------------------- /theme.toml: -------------------------------------------------------------------------------- 1 | # theme.toml template for a Hugo theme 2 | # See https://github.com/gohugoio/hugoThemes#themetoml for an example 3 | 4 | name = "Arabica" 5 | license = "MIT" 6 | licenselink = "https://github.com/nirocfz/arabica/blob/master/LICENSE" 7 | description = "A port of the Ghost arabica theme for Hugo" 8 | homepage = "https://github.com/nirocfz/arabica" 9 | tags = ["blog", "minimal"] 10 | features = ["smooth", "minimal"] 11 | min_version = "0.41" 12 | 13 | [author] 14 | name = "Chen Fangzhou" 15 | homepage = "https://fixatom.com" 16 | 17 | # If porting an existing theme 18 | [original] 19 | name = "Arabica" 20 | homepage = "https://thedarkroast.com/" 21 | repo = "https://github.com/slunsford/arabica" 22 | -------------------------------------------------------------------------------- /layouts/_default/list.html: -------------------------------------------------------------------------------- 1 | {{ define "body_class" }}tag-template{{ end }} 2 | {{ define "title" }}{{ .Title }}{{ end }} 3 | {{ define "main" }} 4 | {{ $paginator := .Paginate (where .Data.Pages.ByDate.Reverse "Type" "post") (index .Site.Params "archive-paginate" | default 10) }} 5 |
6 | {{ if not $paginator.HasPrev }} 7 | {{ if eq .Data.Plural "tags" }} 8 |

{{ .Title }}

9 | {{ end }} 10 | {{ end }} 11 | 12 |
13 | {{ partial "pagination.html" .}} 14 |
15 | {{ range $paginator.Pages }} 16 | {{ .Render "summary" }} 17 | {{ end }} 18 | {{ partial "pagination.html" . }} 19 |
20 | {{ end }} -------------------------------------------------------------------------------- /layouts/partials/header.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

4 | 5 | {{ if .Site.Params.logoTitle }} 6 | {{ .Site.Params.logoTitle | safeHTML }} 7 | {{ else }} 8 | {{ .Site.Title }} 9 | {{ end }} 10 | 11 |

12 |

{{ .Site.Params.description }}

13 |
14 | 15 |
16 | {{ $currentPage := . }} 17 | {{ range .Site.Menus.main }} 18 | {{ .Name }} 19 | {{ end }} 20 |
21 |
22 | -------------------------------------------------------------------------------- /static/assets/bigfoot/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "bigfoot", 3 | "version": "2.1.4", 4 | "main": "src/bigfoot.coffee", 5 | "description": "A jQuery plugin for empowering HTML footnotes.", 6 | "homepage": "http://www.bigfootjs.com", 7 | "devDependencies": { 8 | "grunt": "~0.4.1", 9 | "grunt-autoprefixer": "~0.5.0", 10 | "grunt-contrib-coffee": "^0.10.1", 11 | "grunt-contrib-concat": "~0.3.0", 12 | "grunt-contrib-sass": "~0.8.0", 13 | "grunt-contrib-uglify": "~0.2.7", 14 | "grunt-contrib-watch": "~0.5.3", 15 | "load-grunt-tasks": "~0.2.1" 16 | }, 17 | "repository": { 18 | "type": "git", 19 | "url": "https://github.com/pxldot/bigfoot.git" 20 | }, 21 | "bugs": { 22 | "url": "https://github.com/pxldot/bigfoot/issues" 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /static/assets/bigfoot/bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "bigfoot", 3 | "main": "src/coffee/bigfoot.coffee", 4 | "version": "2.1.4", 5 | "homepage": "http://www.bigfootjs.com", 6 | "authors": [ 7 | "Chris Sauve " 8 | ], 9 | "description": "A jQuery plugin for creating exceptional HTML footnotes.", 10 | "keywords": [ 11 | "jquery", 12 | "plugin", 13 | "footnotes", 14 | "footnote", 15 | "bigfoot", 16 | "popover" 17 | ], 18 | "license": "MIT", 19 | "ignore": [ 20 | "**/.*", 21 | "node_modules", 22 | "bower_components", 23 | "test", 24 | "tests", 25 | "links", 26 | "utils", 27 | "Gruntfile.js", 28 | "readme-dev.md", 29 | "package.json" 30 | ], 31 | "dependencies": { 32 | "jquery": ">= 1.8.0" 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /layouts/partials/footer.html: -------------------------------------------------------------------------------- 1 | 8 | 9 | {{ range .Site.Params.customJS }} 10 | 11 | {{ end }} 12 | -------------------------------------------------------------------------------- /layouts/post/single.html: -------------------------------------------------------------------------------- 1 | {{ define "body_class" }}post-template{{ end }} 2 | {{ define "main" }} 3 |
4 |
5 |
6 | {{ with .Params.image }} 7 | 8 | {{ end }} 9 |

{{ .Title }}

10 |
11 | 12 |
13 |
14 |
15 | {{ .Content }} 16 |
17 |
18 | {{ with .Params.tags -}} 19 |
20 | Tagged 21 | {{ range . }} 22 | {{- $name := . -}} 23 | {{- with $.Site.GetPage "taxonomy" (printf "tags/%s" $name) | default ($.Site.GetPage "taxonomy" (printf "tags/%s" ($name | urlize))) -}} 24 | {{ $name }} 25 | {{ end -}} 26 | {{ end }} 27 |
28 | {{- end }} 29 |
30 |
31 |
32 | {{ end }} -------------------------------------------------------------------------------- /static/assets/bigfoot/LICENSE.md: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2013-2014 Chris Sauve 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. -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2014-2018 Sean Lunsford (original theme) 4 | Copyright (c) 2018 Chen Fangzhou 5 | 6 | Permission is hereby granted, free of charge, to any person obtaining a copy of 7 | this software and associated documentation files (the "Software"), to deal in 8 | the Software without restriction, including without limitation the rights to 9 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of 10 | the Software, and to permit persons to whom the Software is furnished to do so, 11 | subject to the following conditions: 12 | 13 | The above copyright notice and this permission notice shall be included in all 14 | copies or substantial portions of the Software. 15 | 16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 17 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS 18 | FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR 19 | COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER 20 | IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN 21 | CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /static/assets/bigfoot/src/scss/foundation/bigfoot-mixins.scss: -------------------------------------------------------------------------------- 1 | // ___ ___ ___ ___ 2 | // /__/\ ___ /__/| ___ /__/\ / /\ 3 | // | |::\ / /\ | |:| / /\ \ \:\ / /:/_ 4 | // | |:|:\ / /:/ | |:| / /:/ \ \:\ / /:/ /\ 5 | // __|__|:|\:\ /__/::\ __|__|:| /__/::\ _____\__\:\ / /:/ /::\ 6 | // /__/::::| \:\\__\/\:\__/__/::::\____\__\/\:\__ /__/::::::::\/__/:/ /:/\:\ 7 | // \ \:\~~\__\/ \ \:\/\ ~\~~\::::/ \ \:\/\\ \:\~~\~~\/\ \:\/:/~/:/ 8 | // \ \:\ \__\::/ |~~|:|~~ \__\::/ \ \:\ ~~~ \ \::/ /:/ 9 | // \ \:\ /__/:/ | |:| /__/:/ \ \:\ \__\/ /:/ 10 | // \ \:\ \__\/ | |:| \__\/ \ \:\ /__/:/ 11 | // \__\/ |__|/ \__\/ \__\/ 12 | 13 | @mixin print-styles { 14 | // These styles restore the original footnote numbers and texts when the page is printed 15 | @media not print { 16 | .footnote-print-only { 17 | display: none !important; 18 | } 19 | } 20 | 21 | @media print { 22 | .bigfoot-footnote, 23 | .bigfoot-footnote__button { 24 | display: none !important; 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | This is a port of the [Arabica theme for Ghost](https://github.com/slunsford/arabica) to Hugo. You can find a live demo [here](https://arabica.netlify.com). 2 | 3 | ![Preview](https://raw.githubusercontent.com/nirocfz/arabica/master/images/screenshot.png) 4 | 5 | ## Quickstart 6 | 7 | ### Install 8 | 9 | Inside the folder of your Hugo site run: 10 | 11 | ``` 12 | $ cd themes 13 | $ git clone https://github.com/nirocfz/arabica 14 | ``` 15 | 16 | ### Preview exampleSite 17 | 18 | ``` 19 | $ cd arabica/exampleSite 20 | $ hugo server --themesDir ../.. 21 | ``` 22 | 23 | ### Configure Hugo 24 | 25 | Add the following line to `config.toml` to use the theme 26 | 27 | ``` 28 | theme = "arabica" 29 | ``` 30 | 31 | This is the `config.toml` of [exampleSite](/exampleSite) 32 | 33 | ``` 34 | baseurl = "https://example.org/" 35 | title = "Arabica" 36 | author = "John Doe" 37 | paginate = 3 38 | theme = "arabica" 39 | 40 | [params] 41 | description = "A minimal Hugo theme" 42 | dateFormatToUse = "2006-01-02" 43 | replaceGoogleFonts = "fonts.loli.net" 44 | twitter = "example" 45 | facebook = "example" 46 | ``` 47 | 48 | You can add `image` front matter to a post, see [example post](https://github.com/nirocfz/arabica/blob/master/exampleSite/content/post/creating-a-new-theme.md). 49 | 50 | Thanks 51 | 52 | * [Hugo](https://gohugo.io/) 53 | * [slunsford/arabica](https://github.com/slunsford/arabica) 54 | * [xianmin/hugo-theme-jane](https://github.com/xianmin/hugo-theme-jane) 55 | 56 | ## License 57 | 58 | See [LICENSE](https://github.com/nirocfz/arabica/blob/master/LICENSE) 59 | -------------------------------------------------------------------------------- /static/assets/css/icons.css: -------------------------------------------------------------------------------- 1 | /* ========================================================================== 2 | Icons - Sets up the icon font and respective classes (from Casper) 3 | ========================================================================== */ 4 | 5 | /* Import the font file with the icons in it */ 6 | @font-face { 7 | font-family: "icons"; 8 | src:url("../fonts/icons.eot"); 9 | src:url("../fonts/icons.eot?#iefix") format("embedded-opentype"), 10 | url("../fonts/icons.woff") format("woff"), 11 | url("../fonts/icons.ttf") format("truetype"), 12 | url("../fonts/icons.svg#icons") format("svg"); 13 | font-weight: normal; 14 | font-style: normal; 15 | } 16 | 17 | /* Apply these base styles to all icons */ 18 | [class^="icon-"]:before, [class*=" icon-"]:before { 19 | font-family: "icons", "Open Sans", sans-serif; 20 | speak: none; 21 | font-style: normal; 22 | font-weight: normal; 23 | font-variant: normal; 24 | text-transform: none; 25 | line-height: 1; 26 | text-decoration: none !important; 27 | -webkit-font-smoothing: antialiased; 28 | -moz-osx-font-smoothing: grayscale; 29 | } 30 | 31 | /* Each icon is created by inserting the correct character into the 32 | content of the :before pseudo element. Like a boss. */ 33 | .icon-ghost:before { 34 | content: "\e000"; 35 | } 36 | .icon-feed:before { 37 | content: "\e001"; 38 | } 39 | .icon-twitter:before { 40 | content: "\e002"; 41 | font-size: 1.1em; 42 | } 43 | .icon-google-plus:before { 44 | content: "\e003"; 45 | } 46 | .icon-facebook:before { 47 | content: "\e004"; 48 | } 49 | .icon-arrow-left:before { 50 | content: "\e005"; 51 | } 52 | .icon-stats:before { 53 | content: "\e006"; 54 | } 55 | .icon-location:before { 56 | content: "\e007"; 57 | margin-left: -3px; /* Tracking fix */ 58 | } 59 | .icon-link:before { 60 | content: "\e008"; 61 | } -------------------------------------------------------------------------------- /layouts/partials/head.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | {{ block "title" . }} 8 | {{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} - {{ .Site.Title }}{{ end }} 9 | {{ end }} 10 | 11 | 12 | 13 | 14 | {{ range .AlternativeOutputFormats -}} 15 | 16 | {{ end -}} 17 | 18 | 19 | 20 | 21 | 22 | {{ if .Site.Params.replaceGoogleFonts }} 23 | 24 | {{ else }} 25 | 26 | {{ end }} 27 | 28 | 29 | 30 | 31 | 32 | 35 | 36 | {{ range .Site.Params.customCSS }} 37 | 38 | {{ end }} 39 | 40 | -------------------------------------------------------------------------------- /static/assets/bigfoot/README.md: -------------------------------------------------------------------------------- 1 | # bigfoot.js 2 | 3 | by [Chris Sauve](http://cmsauve.com/projects) 4 | 5 | Bigfoot is a jQuery plugin that creates exceptional footnotes. Simply include the code on your pages and footnotes will be detected automatically and improved in the following ways: 6 | 7 | - Links to footnotes will be replaced with clickable/ tappable buttons, making them substantially easier to hit. 8 | 9 | - Footnote content will appear in a popover directly beside the footnote button when it is clicked/ tapped, which cuts out the annoying bouncing around the page that footnotes typically result in. 10 | 11 | - The active popovers will be resized and repositioned to ensure that they continue to be completely visible on-screen and aesthetically pleasing: this makes it perfect for mobile devices and responsive designs. 12 | 13 | This project includes both the script itself and a default style to apply to the footnote button/ content that are eventually generated. There are also a variety of additional styles that illustrate some of the possibilities for styling these components. 14 | 15 | The script has many configurable options from having popovers instantiated on hover, to allowing multiple active footnotes, to setting specific timeouts for popover creation/ deletion. It also returns an object that allows you to activate, remove, add breakpoints, and reposition popovers properly. All of these options and return functions are shown in detail at the script's [project page](http://www.bigfootjs.com/). You can also see a [demo of the project in action](http://www.bigfootjs.com/#demo) on the same page. 16 | 17 | Requires jQuery 1.7+ at a minimum (for `.on()`) and jQuery 1.8+ for full functionality (1.8 automatically prefixes the `transform`/ `transition` properties). 18 | 19 | *Note:* Bigfoot is currently incompatible with jQuery 3.0+ (see [#54](https://github.com/lemonmade/bigfoot/issues/54)) 20 | 21 | Questions? Issues? Feature requests? Check out the [Github page](https://github.com/lemonmade/bigfoot) for this project. 22 | -------------------------------------------------------------------------------- /static/assets/bigfoot/src/scss/variants/bigfoot-bottom.scss: -------------------------------------------------------------------------------- 1 | // ___ ___ ___ 2 | // _____ / /\ ___ ___ / /\ /__/\ 3 | // / /::\ / /::\ / /\ / /\ / /::\ | |::\ 4 | // / /:/\:\ / /:/\:\ / /:/ / /:/ / /:/\:\ | |:|:\ 5 | // / /:/~/::\ / /:/ \:\ / /:/ / /:/ / /:/ \:\ __|__|:|\:\ 6 | // /__/:/ /:/\:|/__/:/ \__\:\ / /::\ / /::\ /__/:/ \__\:\/__/::::| \:\ 7 | // \ \:\/:/~/:/\ \:\ / /://__/:/\:\ /__/:/\:\\ \:\ / /:/\ \:\~~\__\/ 8 | // \ \::/ /:/ \ \:\ /:/ \__\/ \:\\__\/ \:\\ \:\ /:/ \ \:\ 9 | // \ \:\/:/ \ \:\/:/ \ \:\ \ \:\\ \:\/:/ \ \:\ 10 | // \ \::/ \ \::/ \__\/ \__\/ \ \::/ \ \:\ 11 | // \__\/ \__\/ \__\/ \__\/ 12 | 13 | 14 | 15 | //* 16 | // A footnote popover that, unlike the default, is not positioned relative to 17 | // the button, but instead is positioned at the bottom of the page. This popover 18 | // transitions with a simple slide in from the bottom. 19 | 20 | // This style requires that the `positionContent` option of bigfoot is set to false. 21 | 22 | // @since 2.1.0 23 | // @author Chris Sauve 24 | 25 | .bigfoot-footnote { 26 | // POSITIONING 27 | position: fixed; 28 | bottom: 0; top: auto; 29 | left: 0; right: auto; 30 | transform: translateY(100%); 31 | 32 | // DISPLAY AND SIZING 33 | width: 100%; 34 | margin: 0; 35 | 36 | // BACKDROP 37 | border-radius: 0; 38 | opacity: 1; 39 | border-width: 1px 0 0; 40 | 41 | // TRANSITIONS 42 | transition: transform 0.3s ease; 43 | 44 | &.is-active { 45 | transform: translateY(0); 46 | } 47 | } 48 | 49 | .bigfoot-footnote__wrapper { 50 | margin: 0 0 0 50%; 51 | transform: translateX(-50%); 52 | max-width: 100%; 53 | } 54 | 55 | .bigfoot-footnote__wrapper, 56 | .bigfoot-footnote__content { 57 | border-radius: 0; 58 | } 59 | 60 | .bigfoot-footnote__tooltip { 61 | display: none; 62 | } 63 | -------------------------------------------------------------------------------- /static/assets/bigfoot/src/scss/variants/bigfoot-number.scss: -------------------------------------------------------------------------------- 1 | // ___ ___ ___ ___ ___ 2 | // /__/\ /__/\ /__/\ _____ / /\ / /\ 3 | // \ \:\ \ \:\ | |::\ / /::\ / /:/_ / /::\ 4 | // \ \:\ \ \:\ | |:|:\ / /:/\:\ / /:/ /\ / /:/\:\ 5 | // _____\__\:\ ___ \ \:\ __|__|:|\:\ / /:/~/::\ / /:/ /:/_ / /:/~/:/ 6 | // /__/::::::::\/__/\ \__\:\/__/::::| \:\/__/:/ /:/\:|/__/:/ /:/ /\/__/:/ /:/___ 7 | // \ \:\~~\~~\/\ \:\ / /:/\ \:\~~\__\/\ \:\/:/~/:/\ \:\/:/ /:/\ \:\/:::::/ 8 | // \ \:\ ~~~ \ \:\ /:/ \ \:\ \ \::/ /:/ \ \::/ /:/ \ \::/~~~~ 9 | // \ \:\ \ \:\/:/ \ \:\ \ \:\/:/ \ \:\/:/ \ \:\ 10 | // \ \:\ \ \::/ \ \:\ \ \::/ \ \::/ \ \:\ 11 | // \__\/ \__\/ \__\/ \__\/ \__\/ \__\/ 12 | 13 | 14 | 15 | //* 16 | // A button that has no ellipse, but instead shows the footnote's number on the 17 | // page. Note that the number will be reset to 1 depending on the selector passed 18 | // to bigfoot's `numberResetSelector` option. 19 | 20 | // @since 2.1.0 21 | // @author Chris Sauve 22 | 23 | .bigfoot-footnote__button { 24 | position: relative; 25 | height: $button-height; 26 | width: 1.5em; 27 | border-radius: $button-height/2; 28 | 29 | &:after { 30 | // CONTENT 31 | content: attr(data-footnote-number); 32 | 33 | // POSITION 34 | position: absolute; 35 | top: 50%; left: 50%; 36 | transform: translate(-50%, -50%); 37 | 38 | // DISPLAY AND SIZING 39 | display: block; 40 | 41 | // TEXT 42 | font-size: $button-height*0.6; 43 | font-weight: bold; 44 | color: rgba($button-color, 0.5); 45 | 46 | // TRANSITIONS 47 | transition: color $popover-transition-default-duration $popover-transition-default-timing-function; 48 | } 49 | 50 | &:hover, 51 | &.is-active { 52 | &:after { 53 | color: white; 54 | } 55 | } 56 | } 57 | 58 | .bigfoot-footnote__button__circle { 59 | display: none; 60 | } 61 | -------------------------------------------------------------------------------- /static/assets/css/normalize.css: -------------------------------------------------------------------------------- 1 | /* ========================================================================== 2 | Normalize.css v2.1.3 | MIT License | git.io/normalize | (minified) 3 | ========================================================================== */ 4 | 5 | article, aside, details, 6 | figcaption, figure, 7 | footer, header, hgroup, 8 | main, nav, section, 9 | summary { display: block; } 10 | audio, canvas, video { display: inline-block; } 11 | audio:not([controls]) { display: none; height: 0; } 12 | [hidden], template { display: none; } 13 | html { 14 | font-family: sans-serif; 15 | -ms-text-size-adjust: 100%; 16 | -webkit-text-size-adjust: 100%; 17 | } 18 | body { margin: 0; } 19 | a { background: transparent; } 20 | a:focus { outline: thin dotted; } 21 | a:active, a:hover { outline: 0; } 22 | h1 { font-size: 2em; margin: 0.67em 0; } 23 | abbr[title] { border-bottom: 1px dotted; } 24 | b, strong { font-weight: 700; } 25 | dfn { font-style: italic; } 26 | hr { 27 | -moz-box-sizing: content-box; 28 | box-sizing: content-box; 29 | height: 0; 30 | } 31 | mark { background: #FF0; color: #000; } 32 | code, kbd, pre, 33 | samp { font-family: monospace, serif; font-size: 1em; } 34 | pre { white-space: pre-wrap; } 35 | q { quotes: "\201C" "\201D" "\2018" "\2019"; } 36 | small { font-size: 80%; } 37 | sub, sup { 38 | font-size: 75%; 39 | line-height: 0; 40 | position: relative; 41 | vertical-align: baseline; 42 | } 43 | sup { top: -0.5em; } 44 | sub { bottom: -0.25em; } 45 | img { border: 0; } 46 | svg:not(:root) { overflow: hidden; } 47 | figure { margin: 0; } 48 | fieldset { 49 | border: 1px solid #c0c0c0; 50 | margin: 0 2px; 51 | padding: 0.35em 0.625em 0.75em; 52 | } 53 | legend { border: 0; padding: 0; } 54 | button, input, select, 55 | textarea { font-family: inherit; font-size: 100%; margin: 0; } 56 | button, input { line-height: normal; } 57 | button, select { text-transform: none; } 58 | button, html input[type="button"], 59 | input[type="reset"], input[type="submit"] { 60 | -webkit-appearance: button; 61 | cursor: pointer; 62 | } 63 | button[disabled], html input[disabled] { cursor: default; } 64 | input[type="checkbox"], 65 | input[type="radio"] { box-sizing: border-box; padding: 0; } 66 | input[type="search"] { 67 | -webkit-appearance: textfield; 68 | -moz-box-sizing: content-box; 69 | -webkit-box-sizing: content-box; 70 | box-sizing: content-box; 71 | } 72 | input[type="search"]::-webkit-search-cancel-button, 73 | input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } 74 | button::-moz-focus-inner, 75 | input::-moz-focus-inner { border: 0; padding: 0; } 76 | textarea { overflow: auto; vertical-align: top; } 77 | table { border-collapse: collapse; border-spacing: 0; } -------------------------------------------------------------------------------- /static/assets/bigfoot/Gruntfile.coffee: -------------------------------------------------------------------------------- 1 | module.exports = (grunt) -> 2 | baseStyles = [ 3 | 'src/scss/foundation/bigfoot-variables.scss' 4 | 'src/scss/foundation/bigfoot-mixins.scss' 5 | 'src/scss/base/bigfoot-button.scss' 6 | 'src/scss/base/bigfoot-popover.scss' 7 | ] 8 | variants = [ 9 | 'bottom' 10 | 'number' 11 | ] 12 | 13 | concatSet = 14 | options: 15 | stripBanners: true 16 | banner: "// <%= pkg.name %> - v<%= pkg.version %> - <%= grunt.template.today('yyyy.mm.dd') %>\n\n\n" 17 | separator: "\n\n\n// -----\n\n\n" 18 | 19 | main: 20 | src: baseStyles 21 | dest: 'dist/bigfoot-default.scss' 22 | 23 | sassSet = 'dist/bigfoot-default.css': 'dist/bigfoot-default.scss' 24 | autoprefixSet = 'dist/bigfoot-default.css': 'dist/bigfoot-default.css' 25 | 26 | variants.forEach (variant) -> 27 | css = "dist/bigfoot-#{variant}.css" 28 | scss = css.replace('.css', '.scss') 29 | src = scss.replace('dist/', 'src/scss/variants/') 30 | conc = baseStyles.slice(0) 31 | conc.push src 32 | concatSet[variant] = 33 | src: conc 34 | dest: scss 35 | 36 | sassSet[css] = scss 37 | autoprefixSet[css] = css 38 | 39 | 40 | # 1. CONFIG 41 | grunt.initConfig 42 | pkg: grunt.file.readJSON('package.json') 43 | 44 | uglify: 45 | build: 46 | src: 'dist/bigfoot.js' 47 | dest: 'dist/bigfoot.min.js' 48 | 49 | concat: concatSet 50 | 51 | coffee: 52 | dist: 53 | src: 'src/coffee/bigfoot.coffee' 54 | dest: 'dist/bigfoot.js' 55 | 56 | sass: 57 | dist: 58 | options: 59 | style: 'expanded' 60 | 61 | files: sassSet 62 | 63 | autoprefixer: 64 | dist: 65 | files: autoprefixSet 66 | 67 | watch: 68 | options: 69 | livereload: false 70 | 71 | coffee: 72 | files: ['src/coffee/bigfoot.coffee'] 73 | tasks: ['coffee', 'uglify'] 74 | options: 75 | spawn: false 76 | 77 | scss: 78 | files: ['src/**/*.scss'] 79 | tasks: [ 80 | 'concat' 81 | 'sass' 82 | 'autoprefixer' 83 | ] 84 | options: 85 | spawn: false 86 | 87 | 88 | # 2. TASKS 89 | require('load-grunt-tasks') grunt 90 | 91 | # 3. PERFORM 92 | grunt.registerTask 'default', [ 93 | 'coffee' 94 | 'uglify' 95 | 'concat' 96 | 'sass' 97 | 'autoprefixer' 98 | ] 99 | 100 | grunt.registerTask 'styles', [ 101 | 'concat' 102 | 'sass' 103 | 'autoprefixer' 104 | ] 105 | 106 | grunt.registerTask 'scripts', [ 107 | 'coffee' 108 | 'uglify' 109 | ] 110 | -------------------------------------------------------------------------------- /exampleSite/content/post/hugoisforlovers.md: -------------------------------------------------------------------------------- 1 | +++ 2 | title = "Getting Started" 3 | description = "" 4 | tags = [ 5 | "go", 6 | "golang", 7 | "hugo", 8 | "development", 9 | ] 10 | date = "2014-04-02" 11 | categories = [ 12 | "Development", 13 | "golang", 14 | ] 15 | menu = "main" 16 | +++ 17 | 18 | ## Step 1. Install Hugo 19 | 20 | Go to [Hugo releases](https://github.com/spf13/hugo/releases) and download the 21 | appropriate version for your OS and architecture. 22 | 23 | Save it somewhere specific as we will be using it in the next step. 24 | 25 | More complete instructions are available at [Install Hugo](https://gohugo.io/getting-started/installing/) 26 | 27 | ## Step 2. Build the Docs 28 | 29 | Hugo has its own example site which happens to also be the documentation site 30 | you are reading right now. 31 | 32 | Follow the following steps: 33 | 34 | 1. Clone the [Hugo repository](http://github.com/spf13/hugo) 35 | 2. Go into the repo 36 | 3. Run hugo in server mode and build the docs 37 | 4. Open your browser to http://localhost:1313 38 | 39 | Corresponding pseudo commands: 40 | 41 | git clone https://github.com/spf13/hugo 42 | cd hugo 43 | /path/to/where/you/installed/hugo server --source=./docs 44 | > 29 pages created 45 | > 0 tags index created 46 | > in 27 ms 47 | > Web Server is available at http://localhost:1313 48 | > Press ctrl+c to stop 49 | 50 | Once you've gotten here, follow along the rest of this page on your local build. 51 | 52 | ## Step 3. Change the docs site 53 | 54 | Stop the Hugo process by hitting Ctrl+C. 55 | 56 | Now we are going to run hugo again, but this time with hugo in watch mode. 57 | 58 | /path/to/hugo/from/step/1/hugo server --source=./docs --watch 59 | > 29 pages created 60 | > 0 tags index created 61 | > in 27 ms 62 | > Web Server is available at http://localhost:1313 63 | > Watching for changes in /Users/spf13/Code/hugo/docs/content 64 | > Press ctrl+c to stop 65 | 66 | 67 | Open your [favorite editor](http://vim.spf13.com) and change one of the source 68 | content pages. How about changing this very file to *fix the typo*. How about changing this very file to *fix the typo*. 69 | 70 | Content files are found in `docs/content/`. Unless otherwise specified, files 71 | are located at the same relative location as the url, in our case 72 | `docs/content/overview/quickstart.md`. 73 | 74 | Change and save this file.. Notice what happened in your terminal. 75 | 76 | > Change detected, rebuilding site 77 | 78 | > 29 pages created 79 | > 0 tags index created 80 | > in 26 ms 81 | 82 | Refresh the browser and observe that the typo is now fixed. 83 | 84 | Notice how quick that was. Try to refresh the site before it's finished building. I double dare you. 85 | Having nearly instant feedback enables you to have your creativity flow without waiting for long builds. 86 | 87 | ## Step 4. Have fun 88 | 89 | The best way to learn something is to play with it. 90 | -------------------------------------------------------------------------------- /static/assets/bigfoot/changelog.md: -------------------------------------------------------------------------------- 1 | # 2.0.0 2 | - Removed the `positionNextToBlock` option that allowed you to set where the popover would be appended to. Since the popovers now use absolute positioning, the popover element will always be appended to the `.footnote-container` element that also holds the button. Removed `appendPopoversTo` property for the same reasons. 3 | - Added the `maxWidthRelativeTo` option. Because the popovers now use absolute positioning relative to the container of the footnote button, `max-width` declarations with percentages will not yield the result they used to (when popovers could be appended to any element). By default, max-width declarations in set in percentages will be sized by the script relative to the viewport. If you specify an element or selector for `maxWidthRelativeTo`, that element's width will instead be used to size the popover (unless the viewport is smaller than the specified element, in which case the viewport will still be used to prevent any part of the footnote from going off-screen). For example, if you specify `.main-content` for the `maxWidthRelativeTo` property, the script will measure this element's width, take the smaller of it and the viewport's width (`window.innerWidth`), and multiply the percentage value from your CSS times the result to calculate the max-width of the popover. A bit convoluted, but necessary to allow for better performance and to prevent issues where fixed positioning can't be used (i.e., zoomed in on mobile browsers). 4 | - Updated popover styles to support the new positioning/ sizing algorythm. 5 | 6 | # 2.0.1 7 | - Fixed an issue where only the first escaped tag would be rendered properly. 8 | 9 | # 2.0.2 10 | - Fixed an issue where text-indent would cause popover elements to be misalligned. 11 | 12 | # 2.0.3 13 | - Added a second argument (`$button`) to the `activateCallback` setting to allow users to access the footnote button (most notably, the footnote's `data` attributes) in their callbacks. 14 | 15 | # 2.0.4 16 | - Fixed line height issues on the standard themes. 17 | 18 | # 2.1.0 19 | - Rewrote the script with Coffeescript and cleaned up a lot of cruft that had formed. 20 | - Rewrote the markup for footnotes and popovers with a BEM-style syntax. 21 | - Major re-work of the framework for creating styles, hopefully leading to more maintainable stylesheets in the future. 22 | - Got rid of the more theme-ey footnote/ markup files in exchage for the three basics: ellipse button/ tooltip popover, number button/ tooltip popover, and ellipse button/ bottom-fixed popover. 23 | 24 | # 2.1.1 25 | - Added new options. `anchorPattern`, `anchorParentTagname`, `footnoteTagname` and `footnoteParentClass` allow Bigfoot to work with a wider range of potential HTML structures (thanks to [brunob](https://github.com/brunob) for the original implementation). 26 | - Did some minor style changes to help me to maintain the code better. 27 | 28 | # 2.1.2 29 | - Fixed a bug with scroll calculation in IE 11 (thanks [Dave](https://github.com/lemonmade/bigfoot/issues/36)!) 30 | - Made the button variables `!default` so that they are more easy to customize (thanks again, [Dave](https://github.com/lemonmade/bigfoot/issues/35)!) 31 | - Added the `dist` folder back — I want people to be able to grab them if needed, and they need to be in for Bower. 32 | 33 | # 2.1.3 34 | - Removed escaped double quotes from double quoted strings to help minifiers not freak out. 35 | 36 | # 2.1.4 37 | - Adds a substitution for single quotes in original footnote contents. 38 | -------------------------------------------------------------------------------- /static/assets/bigfoot/dist/bigfoot-default.css.map: -------------------------------------------------------------------------------- 1 | { 2 | "version": 3, 3 | "mappings": "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", 4 | "sources": ["bigfoot-default.scss"], 5 | "names": [], 6 | "file": "bigfoot-default.css" 7 | } 8 | -------------------------------------------------------------------------------- /static/assets/bigfoot/dist/bigfoot-number.css.map: -------------------------------------------------------------------------------- 1 | { 2 | "version": 3, 3 | "mappings": "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", 4 | "sources": ["bigfoot-number.scss"], 5 | "names": [], 6 | "file": "bigfoot-number.css" 7 | } 8 | -------------------------------------------------------------------------------- /static/assets/bigfoot/dist/bigfoot-bottom.css.map: -------------------------------------------------------------------------------- 1 | { 2 | "version": 3, 3 | "mappings": "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", 4 | "sources": ["bigfoot-bottom.scss"], 5 | "names": [], 6 | "file": "bigfoot-bottom.css" 7 | } 8 | -------------------------------------------------------------------------------- /static/assets/fonts/icons.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Generated by IcoMoon 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /static/assets/bigfoot/src/scss/base/bigfoot-button.scss: -------------------------------------------------------------------------------- 1 | // ___ ___ ___ 2 | // _____ /__/\ ___ ___ / /\ /__/\ 3 | // / /::\ \ \:\ / /\ / /\ / /::\ \ \:\ 4 | // / /:/\:\ \ \:\ / /:/ / /:/ / /:/\:\ \ \:\ 5 | // / /:/~/::\ ___ \ \:\ / /:/ / /:/ / /:/ \:\ _____\__\:\ 6 | // /__/:/ /:/\:|/__/\ \__\:\ / /::\ / /::\ /__/:/ \__\:\/__/::::::::\ 7 | // \ \:\/:/~/:/\ \:\ / /://__/:/\:\ /__/:/\:\\ \:\ / /:/\ \:\~~\~~\/ 8 | // \ \::/ /:/ \ \:\ /:/ \__\/ \:\\__\/ \:\\ \:\ /:/ \ \:\ ~~~ 9 | // \ \:\/:/ \ \:\/:/ \ \:\ \ \:\\ \:\/:/ \ \:\ 10 | // \ \::/ \ \::/ \__\/ \__\/ \ \::/ \ \:\ 11 | // \__\/ \__\/ \__\/ \__\/ 12 | 13 | 14 | 15 | //* 16 | // The button that activates the footnote. By default, this will appear as a 17 | // flat button that has an ellipse contained inside of it. 18 | 19 | // @state .is-active - The associated popover has been activated and is visible. 20 | 21 | // @since 2.1.0 22 | // @author Chris Sauve 23 | 24 | .bigfoot-footnote__button { 25 | // POSITIONING 26 | position: relative; 27 | z-index: 5; 28 | top: $button-vertical-adjust; 29 | 30 | // DISPLAY AND SIZING 31 | box-sizing: border-box; 32 | -moz-box-sizing: border-box;; 33 | display: inline-block; 34 | padding: $button-per-side-padding; 35 | margin: 0 $button-right-margin 0 $button-left-margin; 36 | 37 | // BACKDROP 38 | border: none; 39 | border-radius: $button-border-radius; 40 | cursor: pointer; 41 | background-color: rgba($button-color, $button-standard-opacity); 42 | backface-visibility: hidden; 43 | 44 | // TEXT 45 | font-size: 1rem; 46 | line-height: 0; 47 | vertical-align: middle; 48 | text-decoration: none; 49 | -webkit-font-smoothing: antialiased; 50 | 51 | // TRANSITIONS 52 | transition-property: $button-transition-properties; 53 | transition-duration: $popover-transition-default-duration; 54 | 55 | &:hover, 56 | &:focus { 57 | outline: none; 58 | background-color: rgba($button-hovered-color, $button-hovered-opacity); 59 | } 60 | 61 | &:active { 62 | background-color: rgba($button-activating-color, $button-activating-opacity); 63 | } 64 | 65 | &.is-active { 66 | background-color: rgba($button-active-color, $button-active-opacity); 67 | transition-delay: $button-active-style-delay; 68 | } 69 | 70 | // Clearfix 71 | &:after { 72 | content: ''; 73 | display: table; 74 | clear: both; 75 | } 76 | } 77 | 78 | 79 | 80 | 81 | 82 | // _____ ___ ___ 83 | // / /::\ / /\ ___ / /\ 84 | // / /:/\:\ / /::\ / /\ / /:/_ 85 | // / /:/ \:\ / /:/\:\ / /:/ / /:/ /\ 86 | // /__/:/ \__\:| / /:/ \:\ / /:/ / /:/ /::\ 87 | // \ \:\ / /://__/:/ \__\:\ / /::\ /__/:/ /:/\:\ 88 | // \ \:\ /:/ \ \:\ / /://__/:/\:\\ \:\/:/~/:/ 89 | // \ \:\/:/ \ \:\ /:/ \__\/ \:\\ \::/ /:/ 90 | // \ \::/ \ \:\/:/ \ \:\\__\/ /:/ 91 | // \__\/ \ \::/ \__\/ /__/:/ 92 | // \__\/ \__\/ 93 | 94 | //* 95 | // Each of the three circles forming the ellipse within the button. 96 | 97 | // @since 2.1.0 98 | // @author Chris Sauve 99 | 100 | .bigfoot-footnote__button__circle { 101 | // DISPLAY AND SIZING 102 | display: inline-block; 103 | width: $button-inner-circle-size; 104 | height: $button-inner-circle-size; 105 | margin-right: $button-inner-circle-left-margin; 106 | float: left; 107 | 108 | // Gets rid of margin on the last circle 109 | &:last-child { margin-right: 0; } 110 | } 111 | 112 | 113 | 114 | 115 | 116 | // ___ ___ ___ ___ ___ 117 | // / /\ / /\ /__/\ ___ / /\ ___ /__/\ 118 | // / /:/ / /::\ \ \:\ / /\ / /::\ / /\ \ \:\ 119 | // / /:/ / /:/\:\ \ \:\ / /:/ / /:/\:\ / /:/ \ \:\ 120 | // / /:/ ___ / /:/ \:\ _____\__\:\ / /:/ / /:/~/::\ /__/::\ _____\__\:\ 121 | // /__/:/ / /\/__/:/ \__\:\/__/::::::::\ / /::\ /__/:/ /:/\:\\__\/\:\__ /__/::::::::\ 122 | // \ \:\ / /:/\ \:\ / /:/\ \:\~~\~~\//__/:/\:\\ \:\/:/__\/ \ \:\/\\ \:\~~\~~\/ 123 | // \ \:\ /:/ \ \:\ /:/ \ \:\ ~~~ \__\/ \:\\ \::/ \__\::/ \ \:\ ~~~ 124 | // \ \:\/:/ \ \:\/:/ \ \:\ \ \:\\ \:\ /__/:/ \ \:\ 125 | // \ \::/ \ \::/ \ \:\ \__\/ \ \:\ \__\/ \ \:\ 126 | // \__\/ \__\/ \__\/ \__\/ \__\/ 127 | 128 | //* 129 | // The container for the button and popover. This is required so that the popover 130 | // is guaranteed to have a relatively-positioned container, and to help with the 131 | // positioning calculation. 132 | 133 | // @since 2.1.0 134 | // @author Chris Sauve 135 | 136 | .bigfoot-footnote__container { 137 | display: inline-block; 138 | position: relative; 139 | text-indent: 0; 140 | } 141 | 142 | 143 | 144 | 145 | 146 | // ___ ___ ___ 147 | // / /\ / /\ ___ /__/\ ___ 148 | // / /::\ / /::\ / /\ \ \:\ / /\ 149 | // / /:/\:\ / /:/\:\ / /:/ \ \:\ / /:/ 150 | // / /:/~/:// /:/~/:/ /__/::\ _____\__\:\ / /:/ 151 | // /__/:/ /://__/:/ /:/___\__\/\:\__ /__/::::::::\ / /::\ 152 | // \ \:\/:/ \ \:\/:::::/ \ \:\/\\ \:\~~\~~\//__/:/\:\ 153 | // \ \::/ \ \::/~~~~ \__\::/ \ \:\ ~~~ \__\/ \:\ 154 | // \ \:\ \ \:\ /__/:/ \ \:\ \ \:\ 155 | // \ \:\ \ \:\ \__\/ \ \:\ \__\/ 156 | // \__\/ \__\/ \__\/ 157 | 158 | @include print-styles; 159 | -------------------------------------------------------------------------------- /exampleSite/content/post/migrate-from-jekyll.md: -------------------------------------------------------------------------------- 1 | --- 2 | date: 2014-03-10 3 | linktitle: Migrating from Jekyll 4 | menu: main 5 | prev: /tutorials/mathjax 6 | title: Migrate to Hugo from Jekyll 7 | weight: 10 8 | --- 9 | 10 | ## Move static content to `static` 11 | Jekyll has a rule that any directory not starting with `_` will be copied as-is to the `_site` output. Hugo keeps all static content under `static`. You should therefore move it all there. 12 | With Jekyll, something that looked like 13 | 14 | ▾ / 15 | ▾ images/ 16 | logo.png 17 | 18 | should become 19 | 20 | ▾ / 21 | ▾ static/ 22 | ▾ images/ 23 | logo.png 24 | 25 | Additionally, you'll want any files that should reside at the root (such as `CNAME`) to be moved to `static`. 26 | 27 | ## Create your Hugo configuration file 28 | Hugo can read your configuration as JSON, YAML or TOML. Hugo supports parameters custom configuration too. Refer to the [Hugo configuration documentation](/overview/configuration/) for details. 29 | 30 | ## Set your configuration publish folder to `_site` 31 | The default is for Jekyll to publish to `_site` and for Hugo to publish to `public`. If, like me, you have [`_site` mapped to a git submodule on the `gh-pages` branch](http://blog.blindgaenger.net/generate_github_pages_in_a_submodule.html), you'll want to do one of two alternatives: 32 | 33 | 1. Change your submodule to point to map `gh-pages` to public instead of `_site` (recommended). 34 | 35 | git submodule deinit _site 36 | git rm _site 37 | git submodule add -b gh-pages git@github.com:your-username/your-repo.git public 38 | 39 | 2. Or, change the Hugo configuration to use `_site` instead of `public`. 40 | 41 | { 42 | .. 43 | "publishdir": "_site", 44 | .. 45 | } 46 | 47 | ## Convert Jekyll templates to Hugo templates 48 | That's the bulk of the work right here. The documentation is your friend. You should refer to [Jekyll's template documentation](http://jekyllrb.com/docs/templates/) if you need to refresh your memory on how you built your blog and [Hugo's template](/layout/templates/) to learn Hugo's way. 49 | 50 | As a single reference data point, converting my templates for [heyitsalex.net](http://heyitsalex.net/) took me no more than a few hours. 51 | 52 | ## Convert Jekyll plugins to Hugo shortcodes 53 | Jekyll has [plugins](http://jekyllrb.com/docs/plugins/); Hugo has [shortcodes](/doc/shortcodes/). It's fairly trivial to do a port. 54 | 55 | ### Implementation 56 | As an example, I was using a custom [`image_tag`](https://github.com/alexandre-normand/alexandre-normand/blob/74bb12036a71334fdb7dba84e073382fc06908ec/_plugins/image_tag.rb) plugin to generate figures with caption when running Jekyll. As I read about shortcodes, I found Hugo had a nice built-in shortcode that does exactly the same thing. 57 | 58 | Jekyll's plugin: 59 | 60 | module Jekyll 61 | class ImageTag < Liquid::Tag 62 | @url = nil 63 | @caption = nil 64 | @class = nil 65 | @link = nil 66 | // Patterns 67 | IMAGE_URL_WITH_CLASS_AND_CAPTION = 68 | IMAGE_URL_WITH_CLASS_AND_CAPTION_AND_LINK = /(\w+)(\s+)((https?:\/\/|\/)(\S+))(\s+)"(.*?)"(\s+)->((https?:\/\/|\/)(\S+))(\s*)/i 69 | IMAGE_URL_WITH_CAPTION = /((https?:\/\/|\/)(\S+))(\s+)"(.*?)"/i 70 | IMAGE_URL_WITH_CLASS = /(\w+)(\s+)((https?:\/\/|\/)(\S+))/i 71 | IMAGE_URL = /((https?:\/\/|\/)(\S+))/i 72 | def initialize(tag_name, markup, tokens) 73 | super 74 | if markup =~ IMAGE_URL_WITH_CLASS_AND_CAPTION_AND_LINK 75 | @class = $1 76 | @url = $3 77 | @caption = $7 78 | @link = $9 79 | elsif markup =~ IMAGE_URL_WITH_CLASS_AND_CAPTION 80 | @class = $1 81 | @url = $3 82 | @caption = $7 83 | elsif markup =~ IMAGE_URL_WITH_CAPTION 84 | @url = $1 85 | @caption = $5 86 | elsif markup =~ IMAGE_URL_WITH_CLASS 87 | @class = $1 88 | @url = $3 89 | elsif markup =~ IMAGE_URL 90 | @url = $1 91 | end 92 | end 93 | def render(context) 94 | if @class 95 | source = "
" 96 | else 97 | source = "
" 98 | end 99 | if @link 100 | source += "" 101 | end 102 | source += "" 103 | if @link 104 | source += "" 105 | end 106 | source += "
#{@caption}
" if @caption 107 | source += "
" 108 | source 109 | end 110 | end 111 | end 112 | Liquid::Template.register_tag('image', Jekyll::ImageTag) 113 | 114 | is written as this Hugo shortcode: 115 | 116 | 117 |
118 | {{ with .Get "link"}}{{ end }} 119 | 120 | {{ if .Get "link"}}{{ end }} 121 | {{ if or (or (.Get "title") (.Get "caption")) (.Get "attr")}} 122 |
{{ if isset .Params "title" }} 123 | {{ .Get "title" }}{{ end }} 124 | {{ if or (.Get "caption") (.Get "attr")}}

125 | {{ .Get "caption" }} 126 | {{ with .Get "attrlink"}} {{ end }} 127 | {{ .Get "attr" }} 128 | {{ if .Get "attrlink"}} {{ end }} 129 |

{{ end }} 130 |
131 | {{ end }} 132 |
133 | 134 | 135 | ### Usage 136 | I simply changed: 137 | 138 | {% image full http://farm5.staticflickr.com/4136/4829260124_57712e570a_o_d.jpg "One of my favorite touristy-type photos. I secretly waited for the good light while we were "having fun" and took this. Only regret: a stupid pole in the top-left corner of the frame I had to clumsily get rid of at post-processing." ->http://www.flickr.com/photos/alexnormand/4829260124/in/set-72157624547713078/ %} 139 | 140 | to this (this example uses a slightly extended version named `fig`, different than the built-in `figure`): 141 | 142 | {{%/* fig class="full" src="http://farm5.staticflickr.com/4136/4829260124_57712e570a_o_d.jpg" title="One of my favorite touristy-type photos. I secretly waited for the good light while we were having fun and took this. Only regret: a stupid pole in the top-left corner of the frame I had to clumsily get rid of at post-processing." link="http://www.flickr.com/photos/alexnormand/4829260124/in/set-72157624547713078/" */%}} 143 | 144 | As a bonus, the shortcode named parameters are, arguably, more readable. 145 | 146 | ## Finishing touches 147 | ### Fix content 148 | Depending on the amount of customization that was done with each post with Jekyll, this step will require more or less effort. There are no hard and fast rules here except that `hugo server --watch` is your friend. Test your changes and fix errors as needed. 149 | 150 | ### Clean up 151 | You'll want to remove the Jekyll configuration at this point. If you have anything else that isn't used, delete it. 152 | 153 | ## A practical example in a diff 154 | [Hey, it's Alex](http://heyitsalex.net/) was migrated in less than a _father-with-kids day_ from Jekyll to Hugo. You can see all the changes (and screw-ups) by looking at this [diff](https://github.com/alexandre-normand/alexandre-normand/compare/869d69435bd2665c3fbf5b5c78d4c22759d7613a...b7f6605b1265e83b4b81495423294208cc74d610). 155 | -------------------------------------------------------------------------------- /static/assets/bigfoot/dist/bigfoot-default.css: -------------------------------------------------------------------------------- 1 | .bigfoot-footnote__button { 2 | position: relative; 3 | z-index: 5; 4 | top: -0.1em; 5 | -webkit-box-sizing: border-box; 6 | box-sizing: border-box; 7 | -moz-box-sizing: border-box; 8 | display: inline-block; 9 | padding: 0.35em; 10 | margin: 0 0.1em 0 0.2em; 11 | border: none; 12 | border-radius: 0.3em; 13 | cursor: pointer; 14 | background-color: rgba(110, 110, 110, 0.2); 15 | -webkit-backface-visibility: hidden; 16 | -ms-backface-visibility: hidden; 17 | backface-visibility: hidden; 18 | font-size: 1rem; 19 | line-height: 0; 20 | vertical-align: middle; 21 | text-decoration: none; 22 | -webkit-font-smoothing: antialiased; 23 | -webkit-transition-property: background-color; 24 | transition-property: background-color; 25 | -webkit-transition-duration: 0.25s; 26 | transition-duration: 0.25s; 27 | } 28 | 29 | .bigfoot-footnote__button:hover, 30 | .bigfoot-footnote__button:focus { 31 | outline: none; 32 | background-color: rgba(110, 110, 110, 0.5); 33 | } 34 | 35 | .bigfoot-footnote__button:active { 36 | background-color: rgba(110, 110, 110, 0.5); 37 | } 38 | 39 | .bigfoot-footnote__button.is-active { 40 | background-color: #6e6e6e; 41 | -webkit-transition-delay: 0.1s; 42 | transition-delay: 0.1s; 43 | } 44 | 45 | .bigfoot-footnote__button:after { 46 | content: ''; 47 | display: table; 48 | clear: both; 49 | } 50 | 51 | .bigfoot-footnote__button__circle { 52 | display: inline-block; 53 | width: 0.25em; 54 | height: 0.25em; 55 | margin-right: 0.25em; 56 | float: left; 57 | } 58 | 59 | .bigfoot-footnote__button__circle:last-child { 60 | margin-right: 0; 61 | } 62 | 63 | .bigfoot-footnote__container { 64 | display: inline-block; 65 | position: relative; 66 | text-indent: 0; 67 | } 68 | 69 | @media not print { 70 | .footnote-print-only { 71 | display: none !important; 72 | } 73 | } 74 | 75 | @media print { 76 | .bigfoot-footnote, 77 | .bigfoot-footnote__button { 78 | display: none !important; 79 | } 80 | } 81 | 82 | .bigfoot-footnote { 83 | position: absolute; 84 | z-index: 10; 85 | top: 0; 86 | left: 0; 87 | display: inline-block; 88 | -webkit-box-sizing: border-box; 89 | -moz-box-sizing: border-box; 90 | box-sizing: border-box; 91 | max-width: 90%; 92 | margin: 1.96924em 0; 93 | background: #fafafa; 94 | opacity: 0; 95 | border-radius: 0.5em; 96 | border: 1px solid #c3c3c3; 97 | -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 98 | box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 99 | line-height: 0; 100 | -webkit-transition-property: opacity, -webkit-transform; 101 | transition-property: opacity, transform; 102 | -webkit-transition-duration: 0.25s; 103 | transition-duration: 0.25s; 104 | -webkit-transition-timing-function: ease; 105 | transition-timing-function: ease; 106 | -webkit-transform: scale(0.1) translateZ(0); 107 | -ms-transform: scale(0.1) translateZ(0); 108 | transform: scale(0.1) translateZ(0); 109 | -webkit-transform-origin: 50% 0; 110 | -ms-transform-origin: 50% 0; 111 | transform-origin: 50% 0; 112 | } 113 | 114 | .bigfoot-footnote.is-positioned-top { 115 | top: auto; 116 | bottom: 0; 117 | } 118 | 119 | .bigfoot-footnote.is-active { 120 | -webkit-transform: scale(1) translateZ(0); 121 | -ms-transform: scale(1) translateZ(0); 122 | transform: scale(1) translateZ(0); 123 | opacity: 0.97; 124 | } 125 | 126 | .bigfoot-footnote.is-bottom-fixed { 127 | position: fixed; 128 | bottom: 0; 129 | top: auto; 130 | left: 0; 131 | right: auto; 132 | -webkit-transform: translateY(100%); 133 | -ms-transform: translateY(100%); 134 | transform: translateY(100%); 135 | width: 100%; 136 | margin: 0; 137 | border-radius: 0; 138 | opacity: 1; 139 | border-width: 1px 0 0; 140 | -webkit-transition: -webkit-transform 0.3s ease; 141 | transition: transform 0.3s ease; 142 | } 143 | 144 | .bigfoot-footnote.is-bottom-fixed.is-active { 145 | -webkit-transform: translateY(0); 146 | -ms-transform: translateY(0); 147 | transform: translateY(0); 148 | } 149 | 150 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__wrapper { 151 | margin: 0 0 0 50%; 152 | -webkit-transform: translateX(-50%); 153 | -ms-transform: translateX(-50%); 154 | transform: translateX(-50%); 155 | max-width: 100%; 156 | } 157 | 158 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__wrapper, 159 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__content { 160 | border-radius: 0; 161 | } 162 | 163 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__tooltip { 164 | display: none; 165 | } 166 | 167 | .bigfoot-footnote.is-scrollable:after { 168 | content: ''; 169 | position: absolute; 170 | bottom: 0.3375em; 171 | left: 0.3375em; 172 | z-index: 14; 173 | display: block; 174 | height: 0.78125em; 175 | width: 0.625em; 176 | background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxNXB4IiB2aWV3Qm94PSIwIDAgMTIgMTUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pbllNaW4iPgogICAgPGcgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxLjAwMDAwMCwgMS4wMDAwMDApIiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiPgogICAgICAgICAgICA8cGF0aCBkPSJNNSwwIEw1LDExLjUiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0wLjUsNy41IEw1LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik00LjUsNy41IEw5LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lLTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDcuMDAwMDAwLCAxMC4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTcuMDAwMDAwLCAtMTAuMDAwMDAwKSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo="); 177 | -webkit-background-size: cover; 178 | background-size: cover; 179 | opacity: 0.1; 180 | transition-properties: opacity; 181 | -webkit-transition-duration: 0.25s; 182 | transition-duration: 0.25s; 183 | -webkit-transition-timing-function: ease; 184 | transition-timing-function: ease; 185 | } 186 | 187 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:before, 188 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:after { 189 | content: ''; 190 | position: absolute; 191 | width: 100%; 192 | z-index: 12; 193 | left: 0; 194 | } 195 | 196 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:before { 197 | top: -1px; 198 | height: 1.1em; 199 | border-radius: 0.5em 0.5em 0 0; 200 | background-image: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(rgba(250, 250, 250, 0))); 201 | background-image: -webkit-linear-gradient(top, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 202 | background-image: linear-gradient(to bottom, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 203 | } 204 | 205 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:after { 206 | bottom: -1px; 207 | height: 1.2em; 208 | border-radius: 0 0 0.5em 0.5em; 209 | background-image: -webkit-gradient(linear, left bottom, left top, from(#fafafa), to(rgba(250, 250, 250, 0))); 210 | background-image: -webkit-linear-gradient(bottom, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 211 | background-image: linear-gradient(to top, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 212 | } 213 | 214 | .bigfoot-footnote.is-scrollable ::-webkit-scrollbar { 215 | display: none; 216 | } 217 | 218 | .bigfoot-footnote.is-fully-scrolled:after, 219 | .bigfoot-footnote.is-fully-scrolled:before { 220 | opacity: 0; 221 | -webkit-transition-delay: 0; 222 | transition-delay: 0; 223 | } 224 | 225 | .bigfoot-footnote__wrapper { 226 | position: relative; 227 | z-index: 14; 228 | width: 22em; 229 | display: inline-block; 230 | -webkit-box-sizing: inherit; 231 | -moz-box-sizing: inherit; 232 | box-sizing: inherit; 233 | overflow: hidden; 234 | margin: 0; 235 | background-color: #fafafa; 236 | border-radius: 0.5em; 237 | line-height: 0; 238 | } 239 | 240 | .bigfoot-footnote__content { 241 | position: relative; 242 | z-index: 8; 243 | display: inline-block; 244 | max-height: 15em; 245 | padding: 1.1em 1.3em 1.2em; 246 | -webkit-box-sizing: inherit; 247 | -moz-box-sizing: inherit; 248 | box-sizing: inherit; 249 | overflow: auto; 250 | -webkit-overflow-scrolling: touch; 251 | background: #fafafa; 252 | border-radius: 0.5em; 253 | -webkit-font-smoothing: subpixel-antialiased; 254 | line-height: normal; 255 | } 256 | 257 | .bigfoot-footnote__content img { 258 | max-width: 100%; 259 | } 260 | 261 | .bigfoot-footnote__content *:last-child { 262 | margin-bottom: 0 !important; 263 | } 264 | 265 | .bigfoot-footnote__content *:first-child { 266 | margin-top: 0 !important; 267 | } 268 | 269 | .bigfoot-footnote__tooltip { 270 | position: absolute; 271 | z-index: 12; 272 | -webkit-box-sizing: border-box; 273 | -moz-box-sizing: border-box; 274 | box-sizing: border-box; 275 | margin-left: -0.65em; 276 | width: 1.3em; 277 | height: 1.3em; 278 | -webkit-transform: rotate(45deg); 279 | -ms-transform: rotate(45deg); 280 | transform: rotate(45deg); 281 | background: #fafafa; 282 | border: 1px solid #c3c3c3; 283 | -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 284 | box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 285 | border-top-left-radius: 0; 286 | } 287 | 288 | .is-positioned-bottom .bigfoot-footnote__tooltip { 289 | top: -0.65em; 290 | } 291 | 292 | .is-positioned-top .bigfoot-footnote__tooltip { 293 | bottom: -0.65em; 294 | } 295 | 296 | /*# sourceMappingURL=bigfoot-default.css.map */ -------------------------------------------------------------------------------- /static/assets/bigfoot/src/scss/base/bigfoot-popover.scss: -------------------------------------------------------------------------------- 1 | // ___ ___ ___ ___ ___ ___ 2 | // / /\ / /\ / /\ / /\ ___ / /\ / /\ 3 | // / /::\ / /::\ / /::\ / /::\ /__/\ / /:/_ / /::\ 4 | // / /:/\:\ / /:/\:\ / /:/\:\ / /:/\:\ \ \:\ / /:/ /\ / /:/\:\ 5 | // / /:/~/:// /:/ \:\ / /:/~/:// /:/ \:\ \ \:\ / /:/ /:/_ / /:/~/:/ 6 | // /__/:/ /://__/:/ \__\:\/__/:/ /://__/:/ \__\:\ ___ \__\:\/__/:/ /:/ /\/__/:/ /:/___ 7 | // \ \:\/:/ \ \:\ / /:/\ \:\/:/ \ \:\ / /://__/\ | |:|\ \:\/:/ /:/\ \:\/:::::/ 8 | // \ \::/ \ \:\ /:/ \ \::/ \ \:\ /:/ \ \:\| |:| \ \::/ /:/ \ \::/~~~~ 9 | // \ \:\ \ \:\/:/ \ \:\ \ \:\/:/ \ \:\__|:| \ \:\/:/ \ \:\ 10 | // \ \:\ \ \::/ \ \:\ \ \::/ \__\::::/ \ \::/ \ \:\ 11 | // \__\/ \__\/ \__\/ \__\/ ~~~~ \__\/ \__\/ 12 | // 13 | 14 | 15 | 16 | //* 17 | // The popover for the footnote. This popover will be, by default, be sized and positioned 18 | // by the script. However, many of the sizes can be established in this stylesheet and 19 | // will be respected by the script. `max-width` will limit the width of the popover 20 | // relative to the viewport. `width` (on `bigfoot-footnote__wrapper`) will set the 21 | // absolute max width. Max height can be set via a `max-height` property 22 | // on `bigfoot-footnote__content`. 23 | 24 | // By default, the popover has a light gray background, a shadow for some depth, 25 | // rounded corners, and a tooltip pointing to the footnote button. 26 | 27 | // @state .is-active - The popover has been activated and is visible. 28 | // @state .is-positioned-top - The popover is above the button. 29 | // @state .is-positioned-bottom - The popover is below the button. 30 | // @state .is-scrollable - The popover content is greater than the popover height. 31 | // @state .is-fully-scrolled - The popover content is scrolled to the bottom. 32 | 33 | // @since 2.1.0 34 | // @author Chris Sauve 35 | 36 | .bigfoot-footnote { 37 | // POSITIONING 38 | position: absolute; 39 | z-index: $popover-z-index; 40 | top: 0; left: 0; 41 | 42 | // DISPLAY AND SIZING 43 | display: inline-block; 44 | box-sizing: border-box; 45 | // Height is set in .footnote-content-wrapper 46 | max-width: $popover-max-width; 47 | // 1.414213... is to get the diagonal height of the tooltip using pythagorus, yo. 48 | margin: ((1.4142135624 * $popover-tooltip-size / 2) + $button-height + $popover-margin-top) 0; 49 | // fits the popover to the contents 50 | 51 | // BACKDROP 52 | background: $popover-color-background; 53 | opacity: $popover-inactive-opacity; 54 | border-radius: $popover-border-radius; 55 | border: $popover-border; 56 | box-shadow: $popover-box-shadow; 57 | 58 | // TEXT 59 | line-height: 0; 60 | 61 | // TRANSITIONS 62 | transition-property: $popover-transition-properties; 63 | transition-duration: $popover-transition-default-duration; 64 | transition-timing-function: $popover-transition-default-timing-function; 65 | 66 | // TRANSFORMS 67 | transform: $popover-initial-transform-state; 68 | transform-origin: $popover-initial-transform-origin; 69 | 70 | &.is-positioned-top { 71 | top: auto; 72 | bottom: 0; 73 | } 74 | 75 | &.is-active { 76 | transform: $popover-active-transform-state; 77 | opacity: $popover-active-opacity; 78 | } 79 | 80 | &.is-bottom-fixed { 81 | // POSITIONING 82 | position: fixed; 83 | bottom: 0; top: auto; 84 | left: 0; right: auto; 85 | transform: translateY(100%); 86 | 87 | // DISPLAY AND SIZING 88 | width: 100%; 89 | margin: 0; 90 | 91 | // BACKDROP 92 | border-radius: 0; 93 | opacity: 1; 94 | border-width: 1px 0 0; 95 | 96 | // TRANSITIONS 97 | transition: transform 0.3s ease; 98 | 99 | &.is-active { 100 | transform: translateY(0); 101 | } 102 | 103 | .bigfoot-footnote__wrapper { 104 | margin: 0 0 0 50%; 105 | transform: translateX(-50%); 106 | max-width: 100%; 107 | } 108 | 109 | .bigfoot-footnote__wrapper, 110 | .bigfoot-footnote__content { 111 | border-radius: 0; 112 | } 113 | 114 | .bigfoot-footnote__tooltip { 115 | display: none; 116 | } 117 | } 118 | 119 | &.is-scrollable { 120 | // A scrollable indicator in the left margin of the popover. 121 | &:after { 122 | // CONTENT 123 | content: ''; 124 | 125 | // POSITIONING 126 | position: absolute; 127 | bottom: $popover-scroll-indicator-padding; 128 | left: $popover-scroll-indicator-padding; 129 | z-index: ($popover-z-index + 4); 130 | 131 | // DISPLAY AND SIZING 132 | display: block; 133 | height: ($popover-scroll-indicator-width*$popover-scroll-indicator-aspect-ratio); 134 | width: $popover-scroll-indicator-width; 135 | 136 | // BACKDROP 137 | background-image: $popover-scroll-indicator-icon; 138 | background-size: cover; 139 | opacity: $popover-scroll-indicator-opacity; 140 | transition-properties: $popover-scroll-indicator-transition-properties; 141 | transition-duration: $popover-transition-default-duration; 142 | transition-timing-function: $popover-transition-default-timing-function; 143 | } 144 | 145 | .bigfoot-footnote__wrapper { 146 | &:before, 147 | &:after { 148 | content: ''; 149 | position: absolute; 150 | width: 100%; 151 | // Above the content 152 | z-index: ($popover-z-index + 2); 153 | left: 0; 154 | } 155 | 156 | &:before { 157 | top: -1px; 158 | height: $popover-padding-content-top; 159 | border-radius: $popover-border-radius $popover-border-radius 0 0; 160 | background-image: linear-gradient(to bottom, $popover-color-background $popover-scrolly-fade-gradient-start-location, transparentize($popover-color-background, 1) 100%); 161 | } 162 | 163 | &:after { 164 | bottom: -1px; 165 | height: $popover-padding-content-bottom; 166 | border-radius: 0 0 $popover-border-radius $popover-border-radius; 167 | background-image: linear-gradient(to top, $popover-color-background $popover-scrolly-fade-gradient-start-location, transparentize($popover-color-background, 1) 100%); 168 | } 169 | } 170 | 171 | ::-webkit-scrollbar { display: none; } 172 | } 173 | 174 | &.is-fully-scrolled { 175 | &:after, 176 | &:before { 177 | opacity: 0; 178 | transition-delay: 0; 179 | } 180 | } 181 | } 182 | 183 | 184 | 185 | //* 186 | // Wraps around the footnote content. This is necessary in order to have an element 187 | // above the tooltip and that can provide top and bottom indicators that there is 188 | // additional content on scrollable popovers. 189 | 190 | // @since 2.1.0 191 | // @author Chris Sauve 192 | 193 | .bigfoot-footnote__wrapper { 194 | // POSITIONING 195 | position: relative; 196 | // Above the outer tooltip, below the inner tooltip 197 | z-index: ($popover-z-index + 4); 198 | 199 | // DISPLAY AND SIZING 200 | width: $popover-width; 201 | display: inline-block; 202 | box-sizing: inherit; 203 | overflow: hidden; 204 | margin: 0; 205 | 206 | // BACKDROP 207 | background-color: $popover-color-background; 208 | border-radius: $popover-border-radius; 209 | 210 | // TEXT 211 | line-height: 0; 212 | } 213 | 214 | 215 | 216 | //* 217 | // Contains the actual footnote content. There is very little prescription here 218 | // on the footnote content itself, except for removing and top margin on the first 219 | // element and bottom margin on the last child. 220 | 221 | // @since 2.1.0 222 | // @author Chris Sauve 223 | 224 | .bigfoot-footnote__content { 225 | // POSITIONING 226 | position: relative; 227 | z-index: ($popover-z-index - 2); // Below fading bars 228 | 229 | // DISPLAY AND SIZING 230 | display: inline-block; 231 | max-height: $popover-max-height; 232 | padding: $popover-padding-content-top $popover-padding-content-horizontal $popover-padding-content-bottom; 233 | box-sizing: inherit; 234 | overflow: auto; 235 | -webkit-overflow-scrolling: touch; 236 | 237 | // BACKDROP 238 | background: $popover-content-color-background; 239 | border-radius: $popover-content-border-radius; 240 | 241 | // TEXT 242 | -webkit-font-smoothing: subpixel-antialiased; 243 | line-height: normal; 244 | 245 | // INTERIOR ELEMENTS 246 | img { max-width: 100%; } 247 | *:last-child { margin-bottom: 0 !important; } 248 | *:first-child { margin-top: 0 !important; } 249 | } 250 | 251 | 252 | 253 | //* 254 | // A triangular shape pointing towards the footnote button. 255 | 256 | // @since 2.1.0 257 | // @author Chris Sauve 258 | 259 | .bigfoot-footnote__tooltip { 260 | // POSITIONING 261 | position: absolute; 262 | // Above the footnote-main-wrapper and the outer tooltip 263 | z-index: ($popover-z-index + 2); 264 | 265 | // DISPLAY AND SIZING 266 | box-sizing: border-box; 267 | margin-left: (-0.5 * $popover-tooltip-size); 268 | // Smaller by one border-width's worth 269 | width: $popover-tooltip-size; 270 | height: $popover-tooltip-size; 271 | transform: rotate(45deg); 272 | 273 | // BACKDROP 274 | background: $popover-tooltip-background; 275 | border: $popover-border; 276 | box-shadow: $popover-box-shadow; 277 | border-top-left-radius: $popover-tooltip-radius; 278 | 279 | .is-positioned-bottom & { 280 | top: (-0.5 * $popover-tooltip-size); 281 | } 282 | 283 | .is-positioned-top & { 284 | bottom: (-0.5 * $popover-tooltip-size); 285 | } 286 | } 287 | -------------------------------------------------------------------------------- /static/assets/bigfoot/dist/bigfoot-number.css: -------------------------------------------------------------------------------- 1 | .bigfoot-footnote__button { 2 | position: relative; 3 | z-index: 5; 4 | top: -0.1em; 5 | -webkit-box-sizing: border-box; 6 | box-sizing: border-box; 7 | -moz-box-sizing: border-box; 8 | display: inline-block; 9 | padding: 0.35em; 10 | margin: 0 0.1em 0 0.2em; 11 | border: none; 12 | border-radius: 0.3em; 13 | cursor: pointer; 14 | background-color: rgba(110, 110, 110, 0.2); 15 | -webkit-backface-visibility: hidden; 16 | -ms-backface-visibility: hidden; 17 | backface-visibility: hidden; 18 | font-size: 1rem; 19 | line-height: 0; 20 | vertical-align: middle; 21 | text-decoration: none; 22 | -webkit-font-smoothing: antialiased; 23 | -webkit-transition-property: background-color; 24 | transition-property: background-color; 25 | -webkit-transition-duration: 0.25s; 26 | transition-duration: 0.25s; 27 | } 28 | 29 | .bigfoot-footnote__button:hover, 30 | .bigfoot-footnote__button:focus { 31 | outline: none; 32 | background-color: rgba(110, 110, 110, 0.5); 33 | } 34 | 35 | .bigfoot-footnote__button:active { 36 | background-color: rgba(110, 110, 110, 0.5); 37 | } 38 | 39 | .bigfoot-footnote__button.is-active { 40 | background-color: #6e6e6e; 41 | -webkit-transition-delay: 0.1s; 42 | transition-delay: 0.1s; 43 | } 44 | 45 | .bigfoot-footnote__button:after { 46 | content: ''; 47 | display: table; 48 | clear: both; 49 | } 50 | 51 | .bigfoot-footnote__button__circle { 52 | display: inline-block; 53 | width: 0.25em; 54 | height: 0.25em; 55 | margin-right: 0.25em; 56 | float: left; 57 | } 58 | 59 | .bigfoot-footnote__button__circle:last-child { 60 | margin-right: 0; 61 | } 62 | 63 | .bigfoot-footnote__container { 64 | display: inline-block; 65 | position: relative; 66 | text-indent: 0; 67 | } 68 | 69 | @media not print { 70 | .footnote-print-only { 71 | display: none !important; 72 | } 73 | } 74 | 75 | @media print { 76 | .bigfoot-footnote, 77 | .bigfoot-footnote__button { 78 | display: none !important; 79 | } 80 | } 81 | 82 | .bigfoot-footnote { 83 | position: absolute; 84 | z-index: 10; 85 | top: 0; 86 | left: 0; 87 | display: inline-block; 88 | -webkit-box-sizing: border-box; 89 | -moz-box-sizing: border-box; 90 | box-sizing: border-box; 91 | max-width: 90%; 92 | margin: 1.96924em 0; 93 | background: #fafafa; 94 | opacity: 0; 95 | border-radius: 0.5em; 96 | border: 1px solid #c3c3c3; 97 | -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 98 | box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 99 | line-height: 0; 100 | -webkit-transition-property: opacity, -webkit-transform; 101 | transition-property: opacity, transform; 102 | -webkit-transition-duration: 0.25s; 103 | transition-duration: 0.25s; 104 | -webkit-transition-timing-function: ease; 105 | transition-timing-function: ease; 106 | -webkit-transform: scale(0.1) translateZ(0); 107 | -ms-transform: scale(0.1) translateZ(0); 108 | transform: scale(0.1) translateZ(0); 109 | -webkit-transform-origin: 50% 0; 110 | -ms-transform-origin: 50% 0; 111 | transform-origin: 50% 0; 112 | } 113 | 114 | .bigfoot-footnote.is-positioned-top { 115 | top: auto; 116 | bottom: 0; 117 | } 118 | 119 | .bigfoot-footnote.is-active { 120 | -webkit-transform: scale(1) translateZ(0); 121 | -ms-transform: scale(1) translateZ(0); 122 | transform: scale(1) translateZ(0); 123 | opacity: 0.97; 124 | } 125 | 126 | .bigfoot-footnote.is-bottom-fixed { 127 | position: fixed; 128 | bottom: 0; 129 | top: auto; 130 | left: 0; 131 | right: auto; 132 | -webkit-transform: translateY(100%); 133 | -ms-transform: translateY(100%); 134 | transform: translateY(100%); 135 | width: 100%; 136 | margin: 0; 137 | border-radius: 0; 138 | opacity: 1; 139 | border-width: 1px 0 0; 140 | -webkit-transition: -webkit-transform 0.3s ease; 141 | transition: transform 0.3s ease; 142 | } 143 | 144 | .bigfoot-footnote.is-bottom-fixed.is-active { 145 | -webkit-transform: translateY(0); 146 | -ms-transform: translateY(0); 147 | transform: translateY(0); 148 | } 149 | 150 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__wrapper { 151 | margin: 0 0 0 50%; 152 | -webkit-transform: translateX(-50%); 153 | -ms-transform: translateX(-50%); 154 | transform: translateX(-50%); 155 | max-width: 100%; 156 | } 157 | 158 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__wrapper, 159 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__content { 160 | border-radius: 0; 161 | } 162 | 163 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__tooltip { 164 | display: none; 165 | } 166 | 167 | .bigfoot-footnote.is-scrollable:after { 168 | content: ''; 169 | position: absolute; 170 | bottom: 0.3375em; 171 | left: 0.3375em; 172 | z-index: 14; 173 | display: block; 174 | height: 0.78125em; 175 | width: 0.625em; 176 | background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxNXB4IiB2aWV3Qm94PSIwIDAgMTIgMTUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pbllNaW4iPgogICAgPGcgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxLjAwMDAwMCwgMS4wMDAwMDApIiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiPgogICAgICAgICAgICA8cGF0aCBkPSJNNSwwIEw1LDExLjUiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0wLjUsNy41IEw1LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik00LjUsNy41IEw5LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lLTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDcuMDAwMDAwLCAxMC4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTcuMDAwMDAwLCAtMTAuMDAwMDAwKSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo="); 177 | -webkit-background-size: cover; 178 | background-size: cover; 179 | opacity: 0.1; 180 | transition-properties: opacity; 181 | -webkit-transition-duration: 0.25s; 182 | transition-duration: 0.25s; 183 | -webkit-transition-timing-function: ease; 184 | transition-timing-function: ease; 185 | } 186 | 187 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:before, 188 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:after { 189 | content: ''; 190 | position: absolute; 191 | width: 100%; 192 | z-index: 12; 193 | left: 0; 194 | } 195 | 196 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:before { 197 | top: -1px; 198 | height: 1.1em; 199 | border-radius: 0.5em 0.5em 0 0; 200 | background-image: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(rgba(250, 250, 250, 0))); 201 | background-image: -webkit-linear-gradient(top, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 202 | background-image: linear-gradient(to bottom, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 203 | } 204 | 205 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:after { 206 | bottom: -1px; 207 | height: 1.2em; 208 | border-radius: 0 0 0.5em 0.5em; 209 | background-image: -webkit-gradient(linear, left bottom, left top, from(#fafafa), to(rgba(250, 250, 250, 0))); 210 | background-image: -webkit-linear-gradient(bottom, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 211 | background-image: linear-gradient(to top, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 212 | } 213 | 214 | .bigfoot-footnote.is-scrollable ::-webkit-scrollbar { 215 | display: none; 216 | } 217 | 218 | .bigfoot-footnote.is-fully-scrolled:after, 219 | .bigfoot-footnote.is-fully-scrolled:before { 220 | opacity: 0; 221 | -webkit-transition-delay: 0; 222 | transition-delay: 0; 223 | } 224 | 225 | .bigfoot-footnote__wrapper { 226 | position: relative; 227 | z-index: 14; 228 | width: 22em; 229 | display: inline-block; 230 | -webkit-box-sizing: inherit; 231 | -moz-box-sizing: inherit; 232 | box-sizing: inherit; 233 | overflow: hidden; 234 | margin: 0; 235 | background-color: #fafafa; 236 | border-radius: 0.5em; 237 | line-height: 0; 238 | } 239 | 240 | .bigfoot-footnote__content { 241 | position: relative; 242 | z-index: 8; 243 | display: inline-block; 244 | max-height: 15em; 245 | padding: 1.1em 1.3em 1.2em; 246 | -webkit-box-sizing: inherit; 247 | -moz-box-sizing: inherit; 248 | box-sizing: inherit; 249 | overflow: auto; 250 | -webkit-overflow-scrolling: touch; 251 | background: #fafafa; 252 | border-radius: 0.5em; 253 | -webkit-font-smoothing: subpixel-antialiased; 254 | line-height: normal; 255 | } 256 | 257 | .bigfoot-footnote__content img { 258 | max-width: 100%; 259 | } 260 | 261 | .bigfoot-footnote__content *:last-child { 262 | margin-bottom: 0 !important; 263 | } 264 | 265 | .bigfoot-footnote__content *:first-child { 266 | margin-top: 0 !important; 267 | } 268 | 269 | .bigfoot-footnote__tooltip { 270 | position: absolute; 271 | z-index: 12; 272 | -webkit-box-sizing: border-box; 273 | -moz-box-sizing: border-box; 274 | box-sizing: border-box; 275 | margin-left: -0.65em; 276 | width: 1.3em; 277 | height: 1.3em; 278 | -webkit-transform: rotate(45deg); 279 | -ms-transform: rotate(45deg); 280 | transform: rotate(45deg); 281 | background: #fafafa; 282 | border: 1px solid #c3c3c3; 283 | -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 284 | box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 285 | border-top-left-radius: 0; 286 | } 287 | 288 | .is-positioned-bottom .bigfoot-footnote__tooltip { 289 | top: -0.65em; 290 | } 291 | 292 | .is-positioned-top .bigfoot-footnote__tooltip { 293 | bottom: -0.65em; 294 | } 295 | 296 | .bigfoot-footnote__button { 297 | position: relative; 298 | height: 0.95em; 299 | width: 1.5em; 300 | border-radius: 0.475em; 301 | } 302 | 303 | .bigfoot-footnote__button:after { 304 | content: attr(data-footnote-number); 305 | position: absolute; 306 | top: 50%; 307 | left: 50%; 308 | -webkit-transform: translate(-50%, -50%); 309 | -ms-transform: translate(-50%, -50%); 310 | transform: translate(-50%, -50%); 311 | display: block; 312 | font-size: 0.57em; 313 | font-weight: bold; 314 | color: rgba(110, 110, 110, 0.5); 315 | -webkit-transition: color 0.25s ease; 316 | transition: color 0.25s ease; 317 | } 318 | 319 | .bigfoot-footnote__button:hover:after, 320 | .bigfoot-footnote__button.is-active:after { 321 | color: white; 322 | } 323 | 324 | .bigfoot-footnote__button__circle { 325 | display: none; 326 | } 327 | 328 | /*# sourceMappingURL=bigfoot-number.css.map */ -------------------------------------------------------------------------------- /static/assets/bigfoot/dist/bigfoot-bottom.css: -------------------------------------------------------------------------------- 1 | .bigfoot-footnote__button { 2 | position: relative; 3 | z-index: 5; 4 | top: -0.1em; 5 | -webkit-box-sizing: border-box; 6 | box-sizing: border-box; 7 | -moz-box-sizing: border-box; 8 | display: inline-block; 9 | padding: 0.35em; 10 | margin: 0 0.1em 0 0.2em; 11 | border: none; 12 | border-radius: 0.3em; 13 | cursor: pointer; 14 | background-color: rgba(110, 110, 110, 0.2); 15 | -webkit-backface-visibility: hidden; 16 | -ms-backface-visibility: hidden; 17 | backface-visibility: hidden; 18 | font-size: 1rem; 19 | line-height: 0; 20 | vertical-align: middle; 21 | text-decoration: none; 22 | -webkit-font-smoothing: antialiased; 23 | -webkit-transition-property: background-color; 24 | transition-property: background-color; 25 | -webkit-transition-duration: 0.25s; 26 | transition-duration: 0.25s; 27 | } 28 | 29 | .bigfoot-footnote__button:hover, 30 | .bigfoot-footnote__button:focus { 31 | outline: none; 32 | background-color: rgba(110, 110, 110, 0.5); 33 | } 34 | 35 | .bigfoot-footnote__button:active { 36 | background-color: rgba(110, 110, 110, 0.5); 37 | } 38 | 39 | .bigfoot-footnote__button.is-active { 40 | background-color: #6e6e6e; 41 | -webkit-transition-delay: 0.1s; 42 | transition-delay: 0.1s; 43 | } 44 | 45 | .bigfoot-footnote__button:after { 46 | content: ''; 47 | display: table; 48 | clear: both; 49 | } 50 | 51 | .bigfoot-footnote__button__circle { 52 | display: inline-block; 53 | width: 0.25em; 54 | height: 0.25em; 55 | margin-right: 0.25em; 56 | float: left; 57 | } 58 | 59 | .bigfoot-footnote__button__circle:last-child { 60 | margin-right: 0; 61 | } 62 | 63 | .bigfoot-footnote__container { 64 | display: inline-block; 65 | position: relative; 66 | text-indent: 0; 67 | } 68 | 69 | @media not print { 70 | .footnote-print-only { 71 | display: none !important; 72 | } 73 | } 74 | 75 | @media print { 76 | .bigfoot-footnote, 77 | .bigfoot-footnote__button { 78 | display: none !important; 79 | } 80 | } 81 | 82 | .bigfoot-footnote { 83 | position: absolute; 84 | z-index: 10; 85 | top: 0; 86 | left: 0; 87 | display: inline-block; 88 | -webkit-box-sizing: border-box; 89 | -moz-box-sizing: border-box; 90 | box-sizing: border-box; 91 | max-width: 90%; 92 | margin: 1.96924em 0; 93 | background: #fafafa; 94 | opacity: 0; 95 | border-radius: 0.5em; 96 | border: 1px solid #c3c3c3; 97 | -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 98 | box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 99 | line-height: 0; 100 | -webkit-transition-property: opacity, -webkit-transform; 101 | transition-property: opacity, transform; 102 | -webkit-transition-duration: 0.25s; 103 | transition-duration: 0.25s; 104 | -webkit-transition-timing-function: ease; 105 | transition-timing-function: ease; 106 | -webkit-transform: scale(0.1) translateZ(0); 107 | -ms-transform: scale(0.1) translateZ(0); 108 | transform: scale(0.1) translateZ(0); 109 | -webkit-transform-origin: 50% 0; 110 | -ms-transform-origin: 50% 0; 111 | transform-origin: 50% 0; 112 | } 113 | 114 | .bigfoot-footnote.is-positioned-top { 115 | top: auto; 116 | bottom: 0; 117 | } 118 | 119 | .bigfoot-footnote.is-active { 120 | -webkit-transform: scale(1) translateZ(0); 121 | -ms-transform: scale(1) translateZ(0); 122 | transform: scale(1) translateZ(0); 123 | opacity: 0.97; 124 | } 125 | 126 | .bigfoot-footnote.is-bottom-fixed { 127 | position: fixed; 128 | bottom: 0; 129 | top: auto; 130 | left: 0; 131 | right: auto; 132 | -webkit-transform: translateY(100%); 133 | -ms-transform: translateY(100%); 134 | transform: translateY(100%); 135 | width: 100%; 136 | margin: 0; 137 | border-radius: 0; 138 | opacity: 1; 139 | border-width: 1px 0 0; 140 | -webkit-transition: -webkit-transform 0.3s ease; 141 | transition: transform 0.3s ease; 142 | } 143 | 144 | .bigfoot-footnote.is-bottom-fixed.is-active { 145 | -webkit-transform: translateY(0); 146 | -ms-transform: translateY(0); 147 | transform: translateY(0); 148 | } 149 | 150 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__wrapper { 151 | margin: 0 0 0 50%; 152 | -webkit-transform: translateX(-50%); 153 | -ms-transform: translateX(-50%); 154 | transform: translateX(-50%); 155 | max-width: 100%; 156 | } 157 | 158 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__wrapper, 159 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__content { 160 | border-radius: 0; 161 | } 162 | 163 | .bigfoot-footnote.is-bottom-fixed .bigfoot-footnote__tooltip { 164 | display: none; 165 | } 166 | 167 | .bigfoot-footnote.is-scrollable:after { 168 | content: ''; 169 | position: absolute; 170 | bottom: 0.3375em; 171 | left: 0.3375em; 172 | z-index: 14; 173 | display: block; 174 | height: 0.78125em; 175 | width: 0.625em; 176 | background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxNXB4IiB2aWV3Qm94PSIwIDAgMTIgMTUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pbllNaW4iPgogICAgPGcgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxLjAwMDAwMCwgMS4wMDAwMDApIiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiPgogICAgICAgICAgICA8cGF0aCBkPSJNNSwwIEw1LDExLjUiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0wLjUsNy41IEw1LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik00LjUsNy41IEw5LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lLTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDcuMDAwMDAwLCAxMC4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTcuMDAwMDAwLCAtMTAuMDAwMDAwKSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo="); 177 | -webkit-background-size: cover; 178 | background-size: cover; 179 | opacity: 0.1; 180 | transition-properties: opacity; 181 | -webkit-transition-duration: 0.25s; 182 | transition-duration: 0.25s; 183 | -webkit-transition-timing-function: ease; 184 | transition-timing-function: ease; 185 | } 186 | 187 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:before, 188 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:after { 189 | content: ''; 190 | position: absolute; 191 | width: 100%; 192 | z-index: 12; 193 | left: 0; 194 | } 195 | 196 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:before { 197 | top: -1px; 198 | height: 1.1em; 199 | border-radius: 0.5em 0.5em 0 0; 200 | background-image: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(rgba(250, 250, 250, 0))); 201 | background-image: -webkit-linear-gradient(top, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 202 | background-image: linear-gradient(to bottom, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 203 | } 204 | 205 | .bigfoot-footnote.is-scrollable .bigfoot-footnote__wrapper:after { 206 | bottom: -1px; 207 | height: 1.2em; 208 | border-radius: 0 0 0.5em 0.5em; 209 | background-image: -webkit-gradient(linear, left bottom, left top, from(#fafafa), to(rgba(250, 250, 250, 0))); 210 | background-image: -webkit-linear-gradient(bottom, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 211 | background-image: linear-gradient(to top, #fafafa 50%, rgba(250, 250, 250, 0) 100%); 212 | } 213 | 214 | .bigfoot-footnote.is-scrollable ::-webkit-scrollbar { 215 | display: none; 216 | } 217 | 218 | .bigfoot-footnote.is-fully-scrolled:after, 219 | .bigfoot-footnote.is-fully-scrolled:before { 220 | opacity: 0; 221 | -webkit-transition-delay: 0; 222 | transition-delay: 0; 223 | } 224 | 225 | .bigfoot-footnote__wrapper { 226 | position: relative; 227 | z-index: 14; 228 | width: 22em; 229 | display: inline-block; 230 | -webkit-box-sizing: inherit; 231 | -moz-box-sizing: inherit; 232 | box-sizing: inherit; 233 | overflow: hidden; 234 | margin: 0; 235 | background-color: #fafafa; 236 | border-radius: 0.5em; 237 | line-height: 0; 238 | } 239 | 240 | .bigfoot-footnote__content { 241 | position: relative; 242 | z-index: 8; 243 | display: inline-block; 244 | max-height: 15em; 245 | padding: 1.1em 1.3em 1.2em; 246 | -webkit-box-sizing: inherit; 247 | -moz-box-sizing: inherit; 248 | box-sizing: inherit; 249 | overflow: auto; 250 | -webkit-overflow-scrolling: touch; 251 | background: #fafafa; 252 | border-radius: 0.5em; 253 | -webkit-font-smoothing: subpixel-antialiased; 254 | line-height: normal; 255 | } 256 | 257 | .bigfoot-footnote__content img { 258 | max-width: 100%; 259 | } 260 | 261 | .bigfoot-footnote__content *:last-child { 262 | margin-bottom: 0 !important; 263 | } 264 | 265 | .bigfoot-footnote__content *:first-child { 266 | margin-top: 0 !important; 267 | } 268 | 269 | .bigfoot-footnote__tooltip { 270 | position: absolute; 271 | z-index: 12; 272 | -webkit-box-sizing: border-box; 273 | -moz-box-sizing: border-box; 274 | box-sizing: border-box; 275 | margin-left: -0.65em; 276 | width: 1.3em; 277 | height: 1.3em; 278 | -webkit-transform: rotate(45deg); 279 | -ms-transform: rotate(45deg); 280 | transform: rotate(45deg); 281 | background: #fafafa; 282 | border: 1px solid #c3c3c3; 283 | -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 284 | box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3); 285 | border-top-left-radius: 0; 286 | } 287 | 288 | .is-positioned-bottom .bigfoot-footnote__tooltip { 289 | top: -0.65em; 290 | } 291 | 292 | .is-positioned-top .bigfoot-footnote__tooltip { 293 | bottom: -0.65em; 294 | } 295 | 296 | .bigfoot-footnote { 297 | position: fixed; 298 | bottom: 0; 299 | top: auto; 300 | left: 0; 301 | right: auto; 302 | -webkit-transform: translateY(100%); 303 | -ms-transform: translateY(100%); 304 | transform: translateY(100%); 305 | width: 100%; 306 | margin: 0; 307 | border-radius: 0; 308 | opacity: 1; 309 | border-width: 1px 0 0; 310 | -webkit-transition: -webkit-transform 0.3s ease; 311 | transition: transform 0.3s ease; 312 | } 313 | 314 | .bigfoot-footnote.is-active { 315 | -webkit-transform: translateY(0); 316 | -ms-transform: translateY(0); 317 | transform: translateY(0); 318 | } 319 | 320 | .bigfoot-footnote__wrapper { 321 | margin: 0 0 0 50%; 322 | -webkit-transform: translateX(-50%); 323 | -ms-transform: translateX(-50%); 324 | transform: translateX(-50%); 325 | max-width: 100%; 326 | } 327 | 328 | .bigfoot-footnote__wrapper, 329 | .bigfoot-footnote__content { 330 | border-radius: 0; 331 | } 332 | 333 | .bigfoot-footnote__tooltip { 334 | display: none; 335 | } 336 | 337 | /*# sourceMappingURL=bigfoot-bottom.css.map */ -------------------------------------------------------------------------------- /static/assets/bigfoot/src/scss/foundation/bigfoot-variables.scss: -------------------------------------------------------------------------------- 1 | // ___ ___ ___ ___ ___ ___ 2 | // / /\ / /\ / /\ / /\ ___ / /\ / /\ 3 | // / /::\ / /::\ / /::\ / /::\ /__/\ / /:/_ / /::\ 4 | // / /:/\:\ / /:/\:\ / /:/\:\ / /:/\:\ \ \:\ / /:/ /\ / /:/\:\ 5 | // / /:/~/:// /:/ \:\ / /:/~/:// /:/ \:\ \ \:\ / /:/ /:/_ / /:/~/:/ 6 | // /__/:/ /://__/:/ \__\:\/__/:/ /://__/:/ \__\:\ ___ \__\:\/__/:/ /:/ /\/__/:/ /:/___ 7 | // \ \:\/:/ \ \:\ / /:/\ \:\/:/ \ \:\ / /://__/\ | |:|\ \:\/:/ /:/\ \:\/:::::/ 8 | // \ \::/ \ \:\ /:/ \ \::/ \ \:\ /:/ \ \:\| |:| \ \::/ /:/ \ \::/~~~~ 9 | // \ \:\ \ \:\/:/ \ \:\ \ \:\/:/ \ \:\__|:| \ \:\/:/ \ \:\ 10 | // \ \:\ \ \::/ \ \:\ \ \::/ \__\::::/ \ \::/ \ \:\ 11 | // \__\/ \__\/ \__\/ \__\/ ~~~~ \__\/ \__\/ 12 | // 13 | // These are the key variables for styling the popover. 14 | // Just set the variable to none if you don't want that styling. 15 | 16 | // KEY VARIABLES 17 | // ============================================================================= 18 | 19 | // STYLES 20 | $popover-width: 22em !default; // Ideal width of the popover 21 | $popover-max-width: 90% !default; // Best as a % to accommodate smaller viewports 22 | $popover-max-height: 15em !default; // Maximum size of the content area 23 | $popover-color-background: rgb(250, 250, 250) !default; // Color of the popover background 24 | $popover-border-radius: 0.5em !default; // Radius of the corners of the popover 25 | $popover-border: 1px solid rgb(195, 195, 195) !default; // Border of the popover/ tooltip 26 | $popover-inactive-opacity: 0 !default; // Opacity of the popover when instantiated/ deactivating 27 | $popover-active-opacity: 0.97 !default; // Opacity of the popover when active 28 | $popover-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3) !default; // Sets the box shadow under the popover/ tooltip 29 | $popover-bottom-position: auto !default; // Sets the bottom position of the popover. Use only when setting positionPopover to false in the script 30 | $popover-left-position: auto !default; // Sets the left position of the popover. Use only when setting positionPopover to false in the script 31 | $popover-tooltip-size: 1.3em !default; // Sets the side lengths of the tooltip 32 | $popover-scroll-indicator-width: 0.625em !default; // The width of the scroll indicator 33 | $popover-scroll-indicator-aspect-ratio: (15/12) !default; // The ratio of the height over the width of the scroll indicator 34 | $popover-scroll-indicator-opacity: 0.1 !default; // The active opacity of scroll indicators 35 | $popover-initial-transform-state: scale(0.1) translateZ(0) !default; // The inital transform state for the popover 36 | $popover-active-transform-state: scale(1) translateZ(0) !default; // The transform state for the popover once it is fully activated 37 | 38 | // OPTIONAL ELEMENTS 39 | $popover-include-tooltip: true !default; // Adds a tooltip pointing to the footnote button 40 | $popover-include-scroll-indicator: true !default; // Adds an elipsis at the bottom of scrollable popovers 41 | $popover-include-scrolly-fades: true !default; // Fades content in on scrollable popovers 42 | $popover-scroll-indicator-icon: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxNXB4IiB2aWV3Qm94PSIwIDAgMTIgMTUiIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pbllNaW4iPgogICAgPGcgc3Ryb2tlPSJub25lIiBzdHJva2Utd2lkdGg9IjEiIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+CiAgICAgICAgPGcgaWQ9IkFycm93IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxLjAwMDAwMCwgMS4wMDAwMDApIiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjIiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiPgogICAgICAgICAgICA8cGF0aCBkPSJNNSwwIEw1LDExLjUiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik0wLjUsNy41IEw1LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lIj48L3BhdGg+CiAgICAgICAgICAgIDxwYXRoIGQ9Ik00LjUsNy41IEw5LjAyNzY5Mjc5LDEyLjAyNzY5MjgiIGlkPSJMaW5lLTIiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDcuMDAwMDAwLCAxMC4wMDAwMDApIHNjYWxlKC0xLCAxKSB0cmFuc2xhdGUoLTcuMDAwMDAwLCAtMTAuMDAwMDAwKSAiPjwvcGF0aD4KICAgICAgICA8L2c+CiAgICA8L2c+Cjwvc3ZnPgo=") !default; 43 | 44 | 45 | // OTHER VARIABLES 46 | // ============================================================================= 47 | 48 | // POPOVER 49 | $popover-margin-top: 0.1em !default; 50 | $popover-padding-content-horizontal: 1.3em !default; 51 | $popover-padding-content-top: 1.1em !default; 52 | $popover-padding-content-bottom: 1.2em !default; 53 | $popover-z-index: 10 !default; // Set the base so that it's above the other body children 54 | $popover-initial-transform-origin: 50% 0 !default; 55 | 56 | // POPOVER CONTENT WRAPPER 57 | $popover-content-color-background: $popover-color-background !default; 58 | $popover-content-border-radius: $popover-border-radius !default; 59 | 60 | // OTHER POPOVER ELEMENTS 61 | $popover-tooltip-background: $popover-color-background !default; 62 | $popover-tooltip-radius: 0 !default; 63 | $popover-scroll-indicator-bottom-position: 0.45em !default; 64 | $popover-scrolly-fade-gradient-start-location: 50% !default; 65 | $popover-scroll-indicator-padding: (($popover-padding-content-horizontal/2) - ($popover-scroll-indicator-width/2)) !default; 66 | 67 | // TRANSITIONS 68 | $popover-transition-default-duration: 0.25s !default; 69 | $popover-scroll-indicator-transition-properties: opacity !default; 70 | 71 | // Use none for areas you don't want to transition 72 | $popover-transition-properties: opacity, transform !default; // no mixin to do proper prefixing of the transform, so I have to do it manually; see mixin below 73 | $popover-scroll-indicator-transition-properties: opacity !default; 74 | $popover-scroll-up-transition-delay: 0.4s !default; // Sets the delay for the transition of the scroll indicator when scrolling upwards 75 | $popover-transition-default-timing-function: ease !default; 76 | 77 | 78 | 79 | 80 | 81 | // ___ ___ ___ 82 | // _____ /__/\ ___ ___ / /\ /__/\ 83 | // / /::\ \ \:\ / /\ / /\ / /::\ \ \:\ 84 | // / /:/\:\ \ \:\ / /:/ / /:/ / /:/\:\ \ \:\ 85 | // / /:/~/::\ ___ \ \:\ / /:/ / /:/ / /:/ \:\ _____\__\:\ 86 | // /__/:/ /:/\:|/__/\ \__\:\ / /::\ / /::\ /__/:/ \__\:\/__/::::::::\ 87 | // \ \:\/:/~/:/\ \:\ / /://__/:/\:\ /__/:/\:\\ \:\ / /:/\ \:\~~\~~\/ 88 | // \ \::/ /:/ \ \:\ /:/ \__\/ \:\\__\/ \:\\ \:\ /:/ \ \:\ ~~~ 89 | // \ \:\/:/ \ \:\/:/ \ \:\ \ \:\\ \:\/:/ \ \:\ 90 | // \ \::/ \ \::/ \__\/ \__\/ \ \::/ \ \:\ 91 | // \__\/ \__\/ \__\/ \__\/ 92 | // 93 | // These are the key variables for styling the button. 94 | // Just set the variable to none if you don't want that styling. 95 | 96 | // KEY VARIABLES 97 | // ============================================================================= 98 | 99 | $button-height: 0.95em !default; // The total height of the button 100 | $button-width: auto !default; // The total button width (applies only if $button-apply-dimensions is true) 101 | $button-inner-circle-size: 0.25em !default; // Total height/width of the ellipsis circles 102 | $button-border-radius: 0.3em !default; // Border radius on the button itself 103 | $button-left-margin: 0.2em !default; // Margin between the button and the text to its left 104 | $button-right-margin: 0.1em !default; // Margin between the button and the text to its right 105 | $button-vertical-adjust: -0.1em !default; // Pushes the buttons along the vertical axis to align it with text as desired 106 | $button-inner-circle-left-margin: 1*$button-inner-circle-size !default; // Space between the ellipsis circles 107 | 108 | $button-color: rgb(110, 110, 110) !default; // Background color of the button 109 | $button-hovered-color: $button-color !default; // Background color of the button when being hovered 110 | $button-activating-color: $button-color !default; // Background color of the button when being clicked 111 | $button-active-color: $button-color !default; // Background color of the button when active 112 | $button-standard-opacity: 0.2 !default; // Opacity for when the button is just sittin' there 113 | $button-hovered-opacity: 0.5 !default; // Opacity for when the button is being hovered over 114 | $button-activating-opacity: $button-hovered-opacity !default; // Opacity for when the button is being clicked 115 | $button-active-opacity: 1 !default; // Opacity for when the button is active 116 | $button-active-style-delay: 0.1s !default; // Delay before applying .active styles; this can be used to match to the popover activation transition 117 | 118 | $button-inner-circle-color: white !default; // Background color of the ellipsis circle 119 | $button-inner-circle-border: none !default; // Border of the ellipsis circle 120 | 121 | 122 | // OTHER VARIABLES 123 | // ============================================================================= 124 | 125 | $button-total-padding: $button-height - $button-inner-circle-size !default; 126 | $button-per-side-padding: 0.5*$button-total-padding !default; 127 | $button-transition-properties: background-color !default; 128 | -------------------------------------------------------------------------------- /exampleSite/content/post/goisforlovers.md: -------------------------------------------------------------------------------- 1 | +++ 2 | title = "(Hu)go Template Primer" 3 | description = "" 4 | tags = [ 5 | "go", 6 | "golang", 7 | "templates", 8 | "themes", 9 | "development", 10 | ] 11 | date = "2014-04-02" 12 | categories = [ 13 | "Development", 14 | "golang", 15 | ] 16 | +++ 17 | 18 | Hugo uses the excellent [Go][] [html/template][gohtmltemplate] library for 19 | its template engine. It is an extremely lightweight engine that provides a very 20 | small amount of logic. In our experience that it is just the right amount of 21 | logic to be able to create a good static website. If you have used other 22 | template systems from different languages or frameworks you will find a lot of 23 | similarities in Go templates. 24 | 25 | This document is a brief primer on using Go templates. The [Go docs][gohtmltemplate] 26 | provide more details. 27 | 28 | ## Introduction to Go Templates 29 | 30 | Go templates provide an extremely simple template language. It adheres to the 31 | belief that only the most basic of logic belongs in the template or view layer. 32 | One consequence of this simplicity is that Go templates parse very quickly. 33 | 34 | A unique characteristic of Go templates is they are content aware. Variables and 35 | content will be sanitized depending on the context of where they are used. More 36 | details can be found in the [Go docs][gohtmltemplate]. 37 | 38 | ## Basic Syntax 39 | 40 | Golang templates are HTML files with the addition of variables and 41 | functions. 42 | 43 | **Go variables and functions are accessible within {{ }}** 44 | 45 | Accessing a predefined variable "foo": 46 | 47 | {{ foo }} 48 | 49 | **Parameters are separated using spaces** 50 | 51 | Calling the add function with input of 1, 2: 52 | 53 | {{ add 1 2 }} 54 | 55 | **Methods and fields are accessed via dot notation** 56 | 57 | Accessing the Page Parameter "bar" 58 | 59 | {{ .Params.bar }} 60 | 61 | **Parentheses can be used to group items together** 62 | 63 | {{ if or (isset .Params "alt") (isset .Params "caption") }} Caption {{ end }} 64 | 65 | 66 | ## Variables 67 | 68 | Each Go template has a struct (object) made available to it. In hugo each 69 | template is passed either a page or a node struct depending on which type of 70 | page you are rendering. More details are available on the 71 | [variables](/layout/variables) page. 72 | 73 | A variable is accessed by referencing the variable name. 74 | 75 | {{ .Title }} 76 | 77 | Variables can also be defined and referenced. 78 | 79 | {{ $address := "123 Main St."}} 80 | {{ $address }} 81 | 82 | 83 | ## Functions 84 | 85 | Go template ship with a few functions which provide basic functionality. The Go 86 | template system also provides a mechanism for applications to extend the 87 | available functions with their own. [Hugo template 88 | functions](/layout/functions) provide some additional functionality we believe 89 | are useful for building websites. Functions are called by using their name 90 | followed by the required parameters separated by spaces. Template 91 | functions cannot be added without recompiling hugo. 92 | 93 | **Example:** 94 | 95 | {{ add 1 2 }} 96 | 97 | ## Includes 98 | 99 | When including another template you will pass to it the data it will be 100 | able to access. To pass along the current context please remember to 101 | include a trailing dot. The templates location will always be starting at 102 | the /layout/ directory within Hugo. 103 | 104 | **Example:** 105 | 106 | {{ template "chrome/header.html" . }} 107 | 108 | 109 | ## Logic 110 | 111 | Go templates provide the most basic iteration and conditional logic. 112 | 113 | ### Iteration 114 | 115 | Just like in Go, the Go templates make heavy use of range to iterate over 116 | a map, array or slice. The following are different examples of how to use 117 | range. 118 | 119 | **Example 1: Using Context** 120 | 121 | {{ range array }} 122 | {{ . }} 123 | {{ end }} 124 | 125 | **Example 2: Declaring value variable name** 126 | 127 | {{range $element := array}} 128 | {{ $element }} 129 | {{ end }} 130 | 131 | **Example 2: Declaring key and value variable name** 132 | 133 | {{range $index, $element := array}} 134 | {{ $index }} 135 | {{ $element }} 136 | {{ end }} 137 | 138 | ### Conditionals 139 | 140 | If, else, with, or, & and provide the framework for handling conditional 141 | logic in Go Templates. Like range, each statement is closed with `end`. 142 | 143 | 144 | Go Templates treat the following values as false: 145 | 146 | * false 147 | * 0 148 | * any array, slice, map, or string of length zero 149 | 150 | **Example 1: If** 151 | 152 | {{ if isset .Params "title" }}

{{ index .Params "title" }}

{{ end }} 153 | 154 | **Example 2: If -> Else** 155 | 156 | {{ if isset .Params "alt" }} 157 | {{ index .Params "alt" }} 158 | {{else}} 159 | {{ index .Params "caption" }} 160 | {{ end }} 161 | 162 | **Example 3: And & Or** 163 | 164 | {{ if and (or (isset .Params "title") (isset .Params "caption")) (isset .Params "attr")}} 165 | 166 | **Example 4: With** 167 | 168 | An alternative way of writing "if" and then referencing the same value 169 | is to use "with" instead. With rebinds the context `.` within its scope, 170 | and skips the block if the variable is absent. 171 | 172 | The first example above could be simplified as: 173 | 174 | {{ with .Params.title }}

{{ . }}

{{ end }} 175 | 176 | **Example 5: If -> Else If** 177 | 178 | {{ if isset .Params "alt" }} 179 | {{ index .Params "alt" }} 180 | {{ else if isset .Params "caption" }} 181 | {{ index .Params "caption" }} 182 | {{ end }} 183 | 184 | ## Pipes 185 | 186 | One of the most powerful components of Go templates is the ability to 187 | stack actions one after another. This is done by using pipes. Borrowed 188 | from unix pipes, the concept is simple, each pipeline's output becomes the 189 | input of the following pipe. 190 | 191 | Because of the very simple syntax of Go templates, the pipe is essential 192 | to being able to chain together function calls. One limitation of the 193 | pipes is that they only can work with a single value and that value 194 | becomes the last parameter of the next pipeline. 195 | 196 | A few simple examples should help convey how to use the pipe. 197 | 198 | **Example 1 :** 199 | 200 | {{ if eq 1 1 }} Same {{ end }} 201 | 202 | is the same as 203 | 204 | {{ eq 1 1 | if }} Same {{ end }} 205 | 206 | It does look odd to place the if at the end, but it does provide a good 207 | illustration of how to use the pipes. 208 | 209 | **Example 2 :** 210 | 211 | {{ index .Params "disqus_url" | html }} 212 | 213 | Access the page parameter called "disqus_url" and escape the HTML. 214 | 215 | **Example 3 :** 216 | 217 | {{ if or (or (isset .Params "title") (isset .Params "caption")) (isset .Params "attr")}} 218 | Stuff Here 219 | {{ end }} 220 | 221 | Could be rewritten as 222 | 223 | {{ isset .Params "caption" | or isset .Params "title" | or isset .Params "attr" | if }} 224 | Stuff Here 225 | {{ end }} 226 | 227 | 228 | ## Context (aka. the dot) 229 | 230 | The most easily overlooked concept to understand about Go templates is that {{ . }} 231 | always refers to the current context. In the top level of your template this 232 | will be the data set made available to it. Inside of a iteration it will have 233 | the value of the current item. When inside of a loop the context has changed. . 234 | will no longer refer to the data available to the entire page. If you need to 235 | access this from within the loop you will likely want to set it to a variable 236 | instead of depending on the context. 237 | 238 | **Example:** 239 | 240 | {{ $title := .Site.Title }} 241 | {{ range .Params.tags }} 242 |
  • {{ . }} - {{ $title }}
    • 243 | {{ end }} 244 | 245 | Notice how once we have entered the loop the value of {{ . }} has changed. We 246 | have defined a variable outside of the loop so we have access to it from within 247 | the loop. 248 | 249 | # Hugo Parameters 250 | 251 | Hugo provides the option of passing values to the template language 252 | through the site configuration (for sitewide values), or through the meta 253 | data of each specific piece of content. You can define any values of any 254 | type (supported by your front matter/config format) and use them however 255 | you want to inside of your templates. 256 | 257 | 258 | ## Using Content (page) Parameters 259 | 260 | In each piece of content you can provide variables to be used by the 261 | templates. This happens in the [front matter](/content/front-matter). 262 | 263 | An example of this is used in this documentation site. Most of the pages 264 | benefit from having the table of contents provided. Sometimes the TOC just 265 | doesn't make a lot of sense. We've defined a variable in our front matter 266 | of some pages to turn off the TOC from being displayed. 267 | 268 | Here is the example front matter: 269 | 270 | ``` 271 | --- 272 | title: "Permalinks" 273 | date: "2013-11-18" 274 | aliases: 275 | - "/doc/permalinks/" 276 | groups: ["extras"] 277 | groups_weight: 30 278 | notoc: true 279 | --- 280 | ``` 281 | 282 | Here is the corresponding code inside of the template: 283 | 284 | {{ if not .Params.notoc }} 285 |
    286 | {{ .TableOfContents }} 287 |
    288 | {{ end }} 289 | 290 | 291 | 292 | ## Using Site (config) Parameters 293 | In your top-level configuration file (eg, `config.yaml`) you can define site 294 | parameters, which are values which will be available to you in chrome. 295 | 296 | For instance, you might declare: 297 | 298 | ```yaml 299 | params: 300 | CopyrightHTML: "Copyright © 2013 John Doe. All Rights Reserved." 301 | TwitterUser: "spf13" 302 | SidebarRecentLimit: 5 303 | ``` 304 | 305 | Within a footer layout, you might then declare a `