diff --git a/.github/workflows/gh-pages.yml b/.github/workflows/gh-pages.yml new file mode 100644 index 0000000..06efb08 --- /dev/null +++ b/.github/workflows/gh-pages.yml @@ -0,0 +1,33 @@ +name: github pages + +on: + push: + branches: + - master # Set a branch to deploy + pull_request: + +jobs: + deploy: + runs-on: ubuntu-20.04 + steps: + - uses: actions/checkout@v2 + with: + submodules: true # Fetch Hugo themes (true OR recursive) + fetch-depth: 0 # Fetch all history for .GitInfo and .Lastmod + + - name: Setup Hugo + uses: peaceiris/actions-hugo@v2 + with: + hugo-version: 'latest' + # extended: true + + - name: Build + run: hugo --minify + + - name: Deploy + uses: peaceiris/actions-gh-pages@v3 + if: github.ref == 'refs/heads/master' + with: + github_token: ${{ secrets.GITHUB_TOKEN }} + publish_dir: ./public + diff --git a/.gitmodules b/.gitmodules new file mode 100644 index 0000000..b777a4a --- /dev/null +++ b/.gitmodules @@ -0,0 +1,9 @@ +[submodule "themes/m10c"] + path = themes/m10c + url = https://github.com/vaga/hugo-theme-m10c +[submodule "themes/minima"] + path = themes/minima + url = https://github.com/mivinci/hugo-theme-minima +[submodule "themes/terminal"] + path = themes/terminal + url = https://github.com/panr/hugo-theme-terminal diff --git a/Gemfile b/Gemfile deleted file mode 100755 index 6c269d8..0000000 --- a/Gemfile +++ /dev/null @@ -1,5 +0,0 @@ -source 'https://rubygems.org' - -gem 'jekyll' -gem 'jekyll-paginate' -gem 'wdm', '>= 0.1.0' if Gem.win_platform? \ No newline at end of file diff --git a/README.md b/README.md deleted file mode 100755 index e879b23..0000000 --- a/README.md +++ /dev/null @@ -1,3 +0,0 @@ -# xsrp.github.io - -My writings, musings, and critiques. diff --git a/_config.yml b/_config.yml deleted file mode 100755 index b8804c9..0000000 --- a/_config.yml +++ /dev/null @@ -1,38 +0,0 @@ -# Welcome to Jekyll! -# -# This config file is meant for settings that affect your whole blog, values -# which you are expected to set up once and rarely need to edit after that. -# For technical reasons, this file is *NOT* reloaded automatically when you use -# 'jekyll serve'. If you change this file, please restart the server process. - -# Site settings -title: "Seraphim R.P." -author: "Seraphim R. Pardee" -author_link: https://srp.life -author_description: An aspiring computer scientist with an intense interest in theology and church history, including the philosophy that comes with it. -email: me@srp.life -description: > # this means to ignore newlines until "baseurl:" - This is the blog of an aspiring computer scientist with an intense interest in theology and church history, including the philosophy that comes with it. -baseurl: "" # the subpath of your site, e.g. /blog -url: "https://vypr.xyz" # the base hostname & protocol for your site - -# Picturefill -# A responsive image polyfill: http://scottjehl.github.io/picturefill/ -picturefill: false - -# Typography -# To use, publish a kit and enter the ID here. If you do not wish to use Typekit, -# leave this ID blank -typekit_kit_id: kwf5dox - -# Build settings -gems: [jekyll-paginate] -markdown: kramdown -permalink: /:year/:month/:day/:title/ - -# Pagination -paginate: 5 - -# Sass -sass: - style: :compressed diff --git a/_config.yml.bak b/_config.yml.bak deleted file mode 100644 index d94050a..0000000 --- a/_config.yml.bak +++ /dev/null @@ -1,21 +0,0 @@ -# Site settings -title: "On Computer Science, Theology, and Church History" -author: "Seraphim R. Pardee" -description: "This is the blog of an aspiring computer scientist with an intense interest in theology and church history, including the philosophy that comes with it." -keywords: "Computer Science, Philosophy, Programming, Theology, Eastern, Eastern Orthodoxy, Eastern Orthodoxy, Church History, History" -biography: "I am an Orthodox Christian and aspiring computer scientist. My particular interests are bridging the gap between technology and the Church by providing fast, efficient web services as well as ensuring the privacy and security of those online." -colophon: "© MMXVI — MMXX by Seraphim R. Pardee.
Content available under Creative Commons (BY-NC-SA) unless otherwise noted.
This site is hosted at Github Pages and created with Jekyll." - -baseurl: "" -url: "https://vypr.xyz" - -twitter_username: vyprrr -mastodon_url: "https://decentralized.faith/@vypr" -github_username: vypr -linkedin_username: vyprrr -google-analytics: UA-82182108-1 - -simple_search: https://google.com/search -markdown: kramdown -highlighter: rouge -permalink: /:year/:month/:day/:title/ diff --git a/_includes/footer.html b/_includes/footer.html deleted file mode 100755 index 0cf1146..0000000 --- a/_includes/footer.html +++ /dev/null @@ -1,4 +0,0 @@ - diff --git a/_includes/head.html b/_includes/head.html deleted file mode 100755 index 66cc709..0000000 --- a/_includes/head.html +++ /dev/null @@ -1,79 +0,0 @@ - - - - - - {% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %} - - {% if site.picturefill %} - - - {% endif %} - {% if site.typekit_kit_id %} - - {% endif %} - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/_includes/header.html b/_includes/header.html deleted file mode 100644 index ec71bb9..0000000 --- a/_includes/header.html +++ /dev/null @@ -1,5 +0,0 @@ -
- -
diff --git a/_includes/navbar.html b/_includes/navbar.html deleted file mode 100755 index 34aec27..0000000 --- a/_includes/navbar.html +++ /dev/null @@ -1,17 +0,0 @@ - diff --git a/_includes/pagination.html b/_includes/pagination.html deleted file mode 100644 index 239db1b..0000000 --- a/_includes/pagination.html +++ /dev/null @@ -1,91 +0,0 @@ - - - diff --git a/_includes/post.html b/_includes/post.html deleted file mode 100644 index 5fb188a..0000000 --- a/_includes/post.html +++ /dev/null @@ -1,14 +0,0 @@ -
-
- -

{{ include.post.title }}

-
- -
-
- {% if include.post.location %}{{ include.post.location }}{% endif %}{{ include.content }} -
- -
diff --git a/_layouts/default.html b/_layouts/default.html deleted file mode 100755 index d33d2d0..0000000 --- a/_layouts/default.html +++ /dev/null @@ -1,12 +0,0 @@ - - - {% include head.html %} - - {% include header.html %} -
- {{ content }} -
- {% include footer.html %} - - - diff --git a/_layouts/page.html b/_layouts/page.html deleted file mode 100755 index ce233ad..0000000 --- a/_layouts/page.html +++ /dev/null @@ -1,14 +0,0 @@ ---- -layout: default ---- -
- -
-

{{ page.title }}

-
- -
- {{ content }} -
- -
diff --git a/_layouts/post.html b/_layouts/post.html deleted file mode 100755 index d24a805..0000000 --- a/_layouts/post.html +++ /dev/null @@ -1,5 +0,0 @@ ---- -layout: default ---- - -{% include post.html post=page content=content %} diff --git a/_sass/_base.scss b/_sass/_base.scss deleted file mode 100755 index b586349..0000000 --- a/_sass/_base.scss +++ /dev/null @@ -1,59 +0,0 @@ -/* Universal box-sizing as per https://css-tricks.com/box-sizing/ */ -html { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} - -/* Universal box-sizing as per https://css-tricks.com/box-sizing/ */ -*, *:before, *:after { - -webkit-box-sizing: inherit; - -moz-box-sizing: inherit; - box-sizing: inherit; -} - -body { - font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family; - color: $text-color; - background-color: $background-color; - -webkit-text-size-adjust: 100%; - -webkit-font-feature-settings: "kern" 1; - -moz-font-feature-settings: "kern" 1; - -o-font-feature-settings: "kern" 1; - font-feature-settings: "kern" 1; - font-kerning: normal; - text-rendering: optimizeLegibility; /* Beware of performance issues in mobile - see https://css-tricks.com/almanac/properties/t/text-rendering/ */ - -webkit-font-smoothing: antialiased; - font-smoothing: antialiased; - - &.is-offset { - margin-top: -195px; - } -} - -a { - text-decoration: none; - color: #443E40; -} - -li { - margin: 15px 0; -} - -b, strong { - font-size: 17px !important; -} - -ul { - list-style-type: lower-greek; - list-style-position: inside; - margin-left: 30px; -} - -ul.pagination { - list-style-type: none; -} - -* { - line-height: 1.2em; -} diff --git a/_sass/_fonts.scss b/_sass/_fonts.scss deleted file mode 100755 index 426e7bb..0000000 --- a/_sass/_fonts.scss +++ /dev/null @@ -1,207 +0,0 @@ -/* Fira Code */ -@font-face { - font-family: 'Fira Code'; - src: url('/assets/FiraCode-Regular.woff2') format("woff2"); - font-weight: normal; - font-style: normal; -} - -@font-face { - font-family: 'Fira Code'; - src: url('/assets/FiraCode-Medium.woff2') format("woff2"); - font-weight: 500; -} - -/* Merriweather */ -/* cyrillic-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 300; - src: local('Merriweather Light'), local('Merriweather-Light'), url(https://fonts.gstatic.com/s/merriweather/v15/ZvcMqxEwPfh2qDWBPxn6nrMRY-O9-Xp5ppZeqcQcMH8.woff2) format('woff2'); - unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F; -} -/* cyrillic */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 300; - src: local('Merriweather Light'), local('Merriweather-Light'), url(https://fonts.gstatic.com/s/merriweather/v15/ZvcMqxEwPfh2qDWBPxn6nhBw1OMgj265uIpoXHqn6zY.woff2) format('woff2'); - unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; -} -/* latin-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 300; - src: local('Merriweather Light'), local('Merriweather-Light'), url(https://fonts.gstatic.com/s/merriweather/v15/ZvcMqxEwPfh2qDWBPxn6nrsKtFnhOiVZh9MDlvO1Vys.woff2) format('woff2'); - unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; -} -/* latin */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 300; - src: local('Merriweather Light'), local('Merriweather-Light'), url(https://fonts.gstatic.com/s/merriweather/v15/ZvcMqxEwPfh2qDWBPxn6nkZRWJQ0UjzR2Uv6RollX_g.woff2) format('woff2'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; -} -/* cyrillic-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 400; - src: local('Merriweather'), local('Merriweather-Regular'), url(https://fonts.gstatic.com/s/merriweather/v15/RFda8w1V0eDZheqfcyQ4EA7aC6SjiAOpAWOKfJDfVRY.woff2) format('woff2'); - unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F; -} -/* cyrillic */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 400; - src: local('Merriweather'), local('Merriweather-Regular'), url(https://fonts.gstatic.com/s/merriweather/v15/RFda8w1V0eDZheqfcyQ4EBdwxCXfZpKo5kWAx_74bHs.woff2) format('woff2'); - unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; -} -/* latin-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 400; - src: local('Merriweather'), local('Merriweather-Regular'), url(https://fonts.gstatic.com/s/merriweather/v15/RFda8w1V0eDZheqfcyQ4EIjoYw3YTyktCCer_ilOlhE.woff2) format('woff2'); - unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; -} -/* latin */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 400; - src: local('Merriweather'), local('Merriweather-Regular'), url(https://fonts.gstatic.com/s/merriweather/v15/RFda8w1V0eDZheqfcyQ4EBampu5_7CjHW5spxoeN3Vs.woff2) format('woff2'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; -} -/* cyrillic-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 700; - src: local('Merriweather Bold'), local('Merriweather-Bold'), url(https://fonts.gstatic.com/s/merriweather/v15/ZvcMqxEwPfh2qDWBPxn6nlPfeBX0b_nUXzRxYCltCF0.woff2) format('woff2'); - unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F; -} -/* cyrillic */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 700; - src: local('Merriweather Bold'), local('Merriweather-Bold'), url(https://fonts.gstatic.com/s/merriweather/v15/ZvcMqxEwPfh2qDWBPxn6noS3435hDhFFCA6hA_HcfZQ.woff2) format('woff2'); - unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; -} -/* latin-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 700; - src: local('Merriweather Bold'), local('Merriweather-Bold'), url(https://fonts.gstatic.com/s/merriweather/v15/ZvcMqxEwPfh2qDWBPxn6nkqWMeizceScn2Xpn1ZpsKI.woff2) format('woff2'); - unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; -} -/* latin */ -@font-face { - font-family: 'Merriweather'; - font-style: normal; - font-weight: 700; - src: local('Merriweather Bold'), local('Merriweather-Bold'), url(https://fonts.gstatic.com/s/merriweather/v15/ZvcMqxEwPfh2qDWBPxn6nshHwsiXhsDb0smKjAA7Bek.woff2) format('woff2'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; -} -/* cyrillic-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 300; - src: local('Merriweather Light Italic'), local('Merriweather-LightItalic'), url(https://fonts.gstatic.com/s/merriweather/v15/EYh7Vl4ywhowqULgRdYwIOSpGJ4w-gNJD-QsPl9sQ7A.woff2) format('woff2'); - unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F; -} -/* cyrillic */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 300; - src: local('Merriweather Light Italic'), local('Merriweather-LightItalic'), url(https://fonts.gstatic.com/s/merriweather/v15/EYh7Vl4ywhowqULgRdYwIN_zqiEjrF2cHwM7WvhO-L4.woff2) format('woff2'); - unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; -} -/* latin-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 300; - src: local('Merriweather Light Italic'), local('Merriweather-LightItalic'), url(https://fonts.gstatic.com/s/merriweather/v15/EYh7Vl4ywhowqULgRdYwIFPx9KgpCoczUSdnmwUGkhk.woff2) format('woff2'); - unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; -} -/* latin */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 300; - src: local('Merriweather Light Italic'), local('Merriweather-LightItalic'), url(https://fonts.gstatic.com/s/merriweather/v15/EYh7Vl4ywhowqULgRdYwIB0ue0Sk5cwvYx5tGiUAApw.woff2) format('woff2'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; -} -/* cyrillic-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 400; - src: local('Merriweather Italic'), local('Merriweather-Italic'), url(https://fonts.gstatic.com/s/merriweather/v15/So5lHxHT37p2SS4-t60SlFmiNVhTT4pGO2rD6GgBClg.woff2) format('woff2'); - unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F; -} -/* cyrillic */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 400; - src: local('Merriweather Italic'), local('Merriweather-Italic'), url(https://fonts.gstatic.com/s/merriweather/v15/So5lHxHT37p2SS4-t60SlBzuU9CtEpZd10JFi14MKmk.woff2) format('woff2'); - unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; -} -/* latin-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 400; - src: local('Merriweather Italic'), local('Merriweather-Italic'), url(https://fonts.gstatic.com/s/merriweather/v15/So5lHxHT37p2SS4-t60SlLbeiSZn9gAT0uu8FgUa5kU.woff2) format('woff2'); - unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; -} -/* latin */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 400; - src: local('Merriweather Italic'), local('Merriweather-Italic'), url(https://fonts.gstatic.com/s/merriweather/v15/So5lHxHT37p2SS4-t60SlGfrnYWAzH6tTbHZfcsRIsM.woff2) format('woff2'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; -} -/* cyrillic-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 700; - src: local('Merriweather Bold Italic'), local('Merriweather-BoldItalic'), url(https://fonts.gstatic.com/s/merriweather/v15/EYh7Vl4ywhowqULgRdYwIEaMaGruFzDoK1PiuIKwL_s.woff2) format('woff2'); - unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F; -} -/* cyrillic */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 700; - src: local('Merriweather Bold Italic'), local('Merriweather-BoldItalic'), url(https://fonts.gstatic.com/s/merriweather/v15/EYh7Vl4ywhowqULgRdYwICOtRYHl1nVlqBVEsBD5gbM.woff2) format('woff2'); - unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; -} -/* latin-ext */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 700; - src: local('Merriweather Bold Italic'), local('Merriweather-BoldItalic'), url(https://fonts.gstatic.com/s/merriweather/v15/EYh7Vl4ywhowqULgRdYwIFMxop41rUAeuGQqDMZDGyg.woff2) format('woff2'); - unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF; -} -/* latin */ -@font-face { - font-family: 'Merriweather'; - font-style: italic; - font-weight: 700; - src: local('Merriweather Bold Italic'), local('Merriweather-BoldItalic'), url(https://fonts.gstatic.com/s/merriweather/v15/EYh7Vl4ywhowqULgRdYwIFh3o8VkC1exAYQ700cRowo.woff2) format('woff2'); - unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215; -} diff --git a/_sass/_layout.scss b/_sass/_layout.scss deleted file mode 100644 index e92e430..0000000 --- a/_sass/_layout.scss +++ /dev/null @@ -1,86 +0,0 @@ -#banner { - @include retina-background-image($img-banner); - background-color: #8e8387; - outline: none; - display: block; - width: $banner-width; - height: $banner-height; - margin: 0 auto 35px; - position: relative; /* To ensure the bottom border is positioned correctly */ - - h1 { - // Font is included from Google Fonts automatically unless a custom banner is used - // See _config.yml for details - font-family: $banner-font-family; - font-size: 24px; - font-weight: 400; - text-align: center; - letter-spacing: 0.03em; - color: #fefefe; - position: absolute; - bottom: 20px; - width: 100%; - } - - &::after { - display: block; - position: absolute; - top: $banner-height; - left: $banner-border-offset; - content: ""; - background: #443E40; - height: $banner-border-width; - width: $banner-width - ($banner-border-offset* 2); - } - - @include min-breakpoint($image-splitting-breakpoint) { - margin-bottom: $banner-margin; - } -} - -#footer { - margin-top: 50px; - text-align: center; - - &::after { - @include retina-background-image($img-dude); - display: block; - content: ""; - width: 65px; - height: 158px; - margin: 20px auto 50px; - } - - a { - // Overwrite default link color - color: #222; - - &:hover { - // ... but allow the hover color to work as normal - color: $hover-color; - } - } - - p { - margin: 0 0 9px; - line-height: 1.3; - font-size: 19px; - max-width: 75%; - margin-left: auto; - margin-right: auto; - - @include min-breakpoint($image-splitting-breakpoint) { - font-size: 18px; - line-height: 1; - } - } -} - -section[role="main"] { - width: 90%; - margin: 0 auto; - - @include min-breakpoint($desktop-breakpoint) { - width: $layout-width; - } -} diff --git a/_sass/_mixins.scss b/_sass/_mixins.scss deleted file mode 100644 index 517bb39..0000000 --- a/_sass/_mixins.scss +++ /dev/null @@ -1,6 +0,0 @@ -@import - "mixins/retina-background-image", - "mixins/clearfix", - "mixins/breakpoints", - "mixins/typekit-fallback" -; diff --git a/_sass/_modules.scss b/_sass/_modules.scss deleted file mode 100644 index 689177a..0000000 --- a/_sass/_modules.scss +++ /dev/null @@ -1,9 +0,0 @@ -@import - "modules/legal/rules", - "modules/post/rules", - "modules/pagination/rules" -; - -@include galileo-legal; -@include galileo-post; -@include galileo-pagination; diff --git a/_sass/_settings.scss b/_sass/_settings.scss deleted file mode 100755 index 3e6db05..0000000 --- a/_sass/_settings.scss +++ /dev/null @@ -1,26 +0,0 @@ -$base-font-family: 'Merriweather', Georgia, Times, 'Times New Roman', serif; -$base-font-size: 10.4pt; -$base-font-weight: 400; -$bold-font-weight: 700; -$base-line-height: 1.7; - -$title-font-family: 'PT Serif', Georgia, Times, 'Times New Roman', serif; -$header-font-family: 'Merriweather', Georgia, Times, 'Times New Roman', serif; -$header-font-weight: 700; - -$small-font-size: $base-font-size * 0.875; - -$mono-font-family: 'Fira Code'; -$mono-font-size: 11pt; - -$text-color: hsl(0, 0%, 25%); - -$alt-color: hsl(191, 70%, 46%); -$alt-color-darker: darken($alt-color, 6%); - -$article-bg-color: rgb(250, 250, 250); -$background-color: darken($article-bg-color, 6%); -$bg-color-darker: darken($article-bg-color, 15%); -$alt-text-color: darken($article-bg-color, 60%); - -$subdued-border: rgba($bg-color-darker, 0.5); \ No newline at end of file diff --git a/_sass/_syntax-highlighting.scss b/_sass/_syntax-highlighting.scss deleted file mode 100755 index ed0c7e2..0000000 --- a/_sass/_syntax-highlighting.scss +++ /dev/null @@ -1,67 +0,0 @@ -/** - * Syntax highlighting styles - */ - -.bghighlight { color: rgb(82, 86, 67); background-color: rgba(132, 189, 0, 0.188235); padding: 2px; } - -.highlight { - .c { color: lighten($text-color, 50%); font-style: italic } // Comment - .err { } // Error - .k { color: $alt-color } // Keyword - // .o { } // Operator - .cm { font-style: italic } // Comment.Multiline - .cp { font-weight: bold } // Comment.Preproc - .c1 { font-style: italic } // Comment.Single - .cs { font-weight: 500; font-style: italic } // Comment.Special - .gd { } // Generic.Deleted - .gd .x { } // Generic.Deleted.Specific - .ge { font-style: italic } // Generic.Emph - .gr { } // Generic.Error - .gh { } // Generic.Heading - .gi { } // Generic.Inserted - .gi .x { } // Generic.Inserted.Specific - .go { } // Generic.Output - .gp { } // Generic.Prompt - .gs { font-weight: 500 } // Generic.Strong - .gu { } // Generic.Subheading - .gt { } // Generic.Traceback - .kc { font-weight: 500 } // Keyword.Constant - .kd { color: $alt-color; } // Keyword.Declaration - .kp { font-weight: 500 } // Keyword.Pseudo - .kr { font-weight: 500 } // Keyword.Reserved - .kt { font-weight: 500 } // Keyword.Type - .m { } // Literal.Number - .s { font-style: italic } // Literal.String - .na { } // Name.Attribute - .nb { } // Name.Builtin - .nc { font-weight: 500 } // Name.Class - .no { } // Name.Constant - .ni { } // Name.Entity - .ne { font-weight: 500 } // Name.Exception - .nf { font-weight: 500 } // Name.Function - .nn { } // Name.Namespace - .nt { } // Name.Tag - .nv { } // Name.Variable - .ow { font-weight: 500 } // Operator.Word - .w { } // Text.Whitespace - .mf { } // Literal.Number.Float - .mh { } // Literal.Number.Hex - .mi { } // Literal.Number.Integer - .mo { } // Literal.Number.Oct - .sb { } // Literal.String.Backtick - .sc { } // Literal.String.Char - .sd { } // Literal.String.Doc - .s2 { } // Literal.String.Double - .se { } // Literal.String.Escape - .sh { } // Literal.String.Heredoc - .si { } // Literal.String.Interpol - .sx { } // Literal.String.Other - .sr { } // Literal.String.Regex - .s1 { } // Literal.String.Single - .ss { } // Literal.String.Symbol - .bp { } // Name.Builtin.Pseudo - .vc { } // Name.Variable.Class - .vg { } // Name.Variable.Global - .vi { } // Name.Variable.Instance - .il { } // Literal.Number.Integer.Long -} diff --git a/_sass/_vendors.scss b/_sass/_vendors.scss deleted file mode 100644 index 2cd0bc5..0000000 --- a/_sass/_vendors.scss +++ /dev/null @@ -1,3 +0,0 @@ -@import - "vendors/normalize" -; diff --git a/_sass/mixins/_breakpoints.scss b/_sass/mixins/_breakpoints.scss deleted file mode 100644 index eec90d9..0000000 --- a/_sass/mixins/_breakpoints.scss +++ /dev/null @@ -1,12 +0,0 @@ -@mixin min-breakpoint($point) { - @media only screen and (min-width: $point) { - @content; - } -} - -@mixin max-breakpoint($point) { - @media only screen and (max-width: $point) { - @content; - } -} - diff --git a/_sass/mixins/_clearfix.scss b/_sass/mixins/_clearfix.scss deleted file mode 100644 index 1d09ce5..0000000 --- a/_sass/mixins/_clearfix.scss +++ /dev/null @@ -1,7 +0,0 @@ -@mixin clearfix { - &:after { - content: ""; - display: table; - clear: both; - } -} diff --git a/_sass/mixins/_retina-background-image.scss b/_sass/mixins/_retina-background-image.scss deleted file mode 100644 index 2907ad9..0000000 --- a/_sass/mixins/_retina-background-image.scss +++ /dev/null @@ -1,19 +0,0 @@ -// Assumes that image filenames follow the pattern: -// - 1x: name.png -// - 2x: name@2x.png -// - 3x: name@3x.png -@mixin retina-background-image($img-path, $ext: '.png') { - // Non-retina device - background-image: url($img-path + $ext); - background-size: 100%; - - // Retina @2x device - @media only screen and (-webkit-min-device-pixel-ratio: 1.2), only screen and (min--moz-device-pixel-ratio: 1.2), only screen and (-o-min-device-pixel-ratio: 5/4), only screen and (min-device-pixel-ratio: 1.2), only screen and (min-resolution: 120dpi), only screen and (min-resolution: 1.2dppx) { - background-image: url($img-path + '@2x' + $ext); - } - - // Retina @3x device - @media only screen and (-webkit-min-device-pixel-ratio: 3), only screen and (min--moz-device-pixel-ratio: 3), only screen and (-o-min-device-pixel-ratio: 3/1), only screen and (min-device-pixel-ratio: 3), only screen and (min-resolution: 288dpi), only screen and (min-resolution: 3dppx) { - background-image: url($img-path + '@3x' + $ext); - } -} diff --git a/_sass/mixins/_typekit-fallback.scss b/_sass/mixins/_typekit-fallback.scss deleted file mode 100644 index 0cbf013..0000000 --- a/_sass/mixins/_typekit-fallback.scss +++ /dev/null @@ -1,8 +0,0 @@ -@mixin typekit-fallback { - @at-root { - .wf-inactive, - .wf-loading { - @content; - } - } -} diff --git a/_sass/modules/legal/_rules.scss b/_sass/modules/legal/_rules.scss deleted file mode 100644 index 88506b5..0000000 --- a/_sass/modules/legal/_rules.scss +++ /dev/null @@ -1,7 +0,0 @@ -@import "modules/legal/variables"; -@mixin galileo-legal { - .legal { - color: $legal-text-color; - font-style: italic; - } -} diff --git a/_sass/modules/legal/_variables.scss b/_sass/modules/legal/_variables.scss deleted file mode 100644 index 036b402..0000000 --- a/_sass/modules/legal/_variables.scss +++ /dev/null @@ -1 +0,0 @@ -$legal-text-color: $legal-color; diff --git a/_sass/modules/pagination/_rules.scss b/_sass/modules/pagination/_rules.scss deleted file mode 100644 index 06124c8..0000000 --- a/_sass/modules/pagination/_rules.scss +++ /dev/null @@ -1,135 +0,0 @@ -@import "modules/pagination/variables"; -@mixin galileo-pagination { - .pagination { - @include clearfix; - margin: -10px auto 0; - display: block; - border-top: 1px solid $pagination-border-color; - text-align: center; - align-items: center; - justify-content: center; - - @include min-breakpoint($pagination-splitting-breakpoint) { - margin: -25px auto 0; - display: flex; - border-top: 0; - } - } - - .pagination-item { - line-height: 21px; - - &:first-of-type { - a { border-right: 1px solid $pagination-border-color; } - } - - &:last-of-type { - a { border-left: 1px solid $pagination-border-color; } - } - - @include min-breakpoint($pagination-splitting-breakpoint) { - // To ensure the top margin begins from the outer bounds of the contained pagination link - line-height: 38px; - - &:first-of-type { - a { border-right: 0; } - } - - &:last-of-type { - a { border-left: 0; } - } - } - } - - .pagination-link, - .pagination-ellipsis { - padding: 18px 8px 12px; - min-width: 35px; - border-bottom: 1px solid $pagination-border-color; - color: $legal-color; - letter-spacing: 0.02em; - clear: both; - display: block; - outline: none; - - &:hover { - background: #eee; - border-color: $hover-color; - color: $hover-color; - } - - &[disabled] { - pointer-events: none; - color: lighten($legal-color, 30%); - } - - @include min-breakpoint($pagination-splitting-breakpoint) { - &:hover { - background: transparent; - } - } - - @include min-breakpoint($pagination-widening-breakpoint) { - padding: 13px; - } - } - - .pagination-link--selected { - background: #eee; - font-weight: bold; - border-color: $hover-color; - color: $hover-color; - - @include min-breakpoint($pagination-splitting-breakpoint) { - background: transparent; - } - } - - .pagination-link--non-numeric { - clear: none; - width: 50%; - float: left; - - @include min-breakpoint($pagination-splitting-breakpoint) { - float: none; - width: initial; - } - } - - .pagination-link-arrow { - position: relative; - } - - .pagination-link-arrow--leftward { - // Offset the arrow every so slightly to sit well next to the text - top: 1px; - margin-left: -15px; - - @include min-breakpoint($pagination-splitting-breakpoint) { - margin-left: 0; - } - } - - .pagination-link-arrow--rightward { - // Weirdly enough, arrows pointing right need a little more offset - top: 2px; - margin-right: -15px; - - @include min-breakpoint($pagination-splitting-breakpoint) { - margin-right: 0; - } - } - - .pagination-link-help { - display: inline; - - @include min-breakpoint($pagination-splitting-breakpoint) { - display: none; - } - } - - .pagination-ellipsis { - // Prevent hover effects - pointer-events: none; - } -} diff --git a/_sass/modules/pagination/_variables.scss b/_sass/modules/pagination/_variables.scss deleted file mode 100644 index fffbb61..0000000 --- a/_sass/modules/pagination/_variables.scss +++ /dev/null @@ -1,3 +0,0 @@ -$pagination-splitting-breakpoint: 715px; -$pagination-widening-breakpoint: 800px; -$pagination-border-color: #ccc; diff --git a/_sass/modules/post/_rules.scss b/_sass/modules/post/_rules.scss deleted file mode 100644 index 0051c95..0000000 --- a/_sass/modules/post/_rules.scss +++ /dev/null @@ -1,222 +0,0 @@ -@import "modules/post/variables"; -@mixin galileo-post { - .post::after { - @include retina-background-image($img-separator); - background-repeat: no-repeat; - background-position: center bottom; - background-color: transparent; - content: ""; - width: 100%; - max-width: 596px; - height: 42px; - display: block; - margin: 20px auto 50px; - - // Force background size to remain constant and not scale down - background-size: 596px !important; - - // The breakpoint here was entirely guessed and tested by eye-balling the results - // ie. feel free to choose something more sensible - @include min-breakpoint(645px) { - margin-top: 5px; - } - } - - .post-title { - font-family: $title-font-family; - display: block; - font-weight: 700; - font-size: $post-title-min-font-size; - text-align: center; - line-height: 1.4; - - // Force default text colour [as post-header is wrapped by a link] - color: $text-color; - - @include min-breakpoint($post-title-medium-breakpoint) { - font-size: $post-title-medium-font-size; - } - - @include min-breakpoint($desktop-breakpoint) { - font-size: $post-title-max-font-size; - } - } - - .post-date { - display: block; - border-top: 1px solid $border-color; - border-bottom: 1px solid $border-color; - text-align: center; - color: $legal-text-color; - margin: 15px 0 25px; - font-variant: small-caps; - letter-spacing: 0.06em; - - // Fix typekit line-height with excess top padding - padding: 23px 0 13px; - } - - @include typekit-fallback { - .post-date { - // Reset a reasonable top padding in absence of abnormally tall typekit font line-height - padding-top: 18px; - } - } - - .post-body { - p { - text-align: justify; - line-height: $post-line-height; - margin-bottom: 25px; - } - } - - .post-body-location, - .post-body-location-divider { - float: left; - } - - .post-body-location { - font-family: $caption-font-family; - letter-spacing: 0.04em; - text-transform: uppercase; - margin-right: 5px; - - // A line-height of 1.2 makes our font (Bodoni) align well horizontally with - // the paragraph font (Caslon) however we need to ensure that the location - // text displays nicely if wrapped across multiple lines. To solve this, - // we increase the line-height while offsetting its position upwards slightly. - // This will keep the alignment between Bodoni & Caslon AND wrap nicely. - line-height: 1.4; - position: relative; - top: -2px; - } - - .post-body-location-divider { - margin-right: 6px; - line-height: 1.4; - } - - .post-image { - margin-bottom: 25px; - margin-top: 30px; - - // Prevent any whitespace positioning issues - font-size: 0; - - img, - video{ - width: 100%; - max-width: 100%; - height: auto; - } - - & + .post-image { - margin-top: -5px; - } - - & + p { - margin-top: 35px; - } - } - - .post-image--split { - @include min-breakpoint($image-splitting-breakpoint) { - margin-right: -1 * $post-image-split-gutter; - } - - img { - width: 100%; - display: block; - margin-bottom: $post-image-split-gutter; - - @include min-breakpoint($image-splitting-breakpoint) { - width: $post-image-split-width; - margin-right: $post-image-split-gutter; - display: initial; - margin-bottom: 0; - } - - @include min-breakpoint($desktop-breakpoint) { - max-width: $post-image-split-max-width; - } - } - - .post-image-caption { - @include min-breakpoint($image-splitting-breakpoint) { - margin-right: $post-image-split-gutter; - } - } - } - - .post-image-caption { - margin-top: 25px; - color: $caption-text-color; - font-family: $caption-font-family; - line-height: $post-image-caption-line-height; - padding: 0 20px; - - // Re-set the font size as parent is set to zero - font-size: $base-font-size; - - // Override properties meant for article content paragraphs - margin-bottom: 0 !important; - text-align: center !important; - - &::after { - display: block; - content: ""; - width: 185px; - margin: 23px auto 30px; - border-bottom: 3px double $border-color; - } - } - - @include typekit-fallback { - .post-image-caption { - // Our fallback font is much larger, so we need to reduce the font-size and increase the line-height - font-size: 15px; - line-height: 1.8 !important; - - &::after { - // Reset a reasonable top margin in absence of the abnormally tall typekit font line-height - margin-top: 25px; - } - } - } - - .post-footer { - @include min-breakpoint($desktop-breakpoint) { - // Child is floated, so use a clearfix on the parent - @include clearfix; - } - } - - .post-footer-location { - display: none; - - @include min-breakpoint($desktop-breakpoint) { - @include retina-background-image($img-location); - display: block; - background-repeat: no-repeat; - background-position: right center; - background-color: transparent; - background-size: 44px; - min-height: 21px; - padding-right: 55px; - float: right; - - // The font used (Adobe Caslon Pro) has a peculiar line-height. This - // adjusts the position of the text in relation to the icon without - // adjusting the line-height property itself - margin-top: -9px; - padding-top: 9px; - - // Force legal text colour [as it is a link] - color: $legal-text-color; - - // However let the normal hover colour apply - &:hover { color: $hover-color; } - } - } -} diff --git a/_sass/modules/post/_variables.scss b/_sass/modules/post/_variables.scss deleted file mode 100644 index ce33747..0000000 --- a/_sass/modules/post/_variables.scss +++ /dev/null @@ -1,16 +0,0 @@ -$post-line-height: 1.6; - -$post-title-min-font-size: 24px; -$post-title-medium-font-size: 5vw; -$post-title-max-font-size: 30px; -// To transition smoothly from our middle font-size of 5vw, we -// must calculate the intersection of our minimum font size and -// 5 vertical widths, that is, when the browser width is 20 times 24px -// (note the calculation is done in reverse to remind us that we are using -// a value of 5%, or 0.05) -$post-title-medium-breakpoint: $post-title-min-font-size / 0.05; - -$post-image-split-max-width: 365px; -$post-image-split-gutter: 20px; -$post-image-split-width: calc(50% - #{$post-image-split-gutter}); -$post-image-caption-line-height: $post-line-height; diff --git a/_sass/vendors/_normalize.scss b/_sass/vendors/_normalize.scss deleted file mode 100644 index 3d75c18..0000000 --- a/_sass/vendors/_normalize.scss +++ /dev/null @@ -1,457 +0,0 @@ -/*! normalize.css v3.0.1 | MIT License | git.io/normalize */ - -/** - * 1. Set default font family to sans-serif. - * 2. Prevent iOS text size adjust after orientation change, without disabling - * user zoom. - */ - -html { - font-family: sans-serif; /* 1 */ - -ms-text-size-adjust: 100%; /* 2 */ - -webkit-text-size-adjust: 100%; /* 2 */ -} - -/** - * Remove default margin. - */ - -body { - margin: 0; -} - -/* HTML5 display definitions - ========================================================================== */ - -/** - * Correct `block` display not defined for any HTML5 element in IE 8/9. - * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. - * Correct `block` display not defined for `main` in IE 11. - */ - -article, -aside, -details, -figcaption, -figure, -footer, -header, -hgroup, -main, -nav, -section, -summary { - display: block; -} - -/** - * 1. Correct `inline-block` display not defined in IE 8/9. - * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. - */ - -audio, -canvas, -progress, -video { - display: inline-block; /* 1 */ - vertical-align: baseline; /* 2 */ -} - -/** - * Prevent modern browsers from displaying `audio` without controls. - * Remove excess height in iOS 5 devices. - */ - -audio:not([controls]) { - display: none; - height: 0; -} - -/** - * Address `[hidden]` styling not present in IE 8/9/10. - * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. - */ - -[hidden], -template { - display: none; -} - -/* Links - ========================================================================== */ - -/** - * Remove the gray background color from active links in IE 10. - */ - -a { - background: transparent; -} - -/** - * Improve readability when focused and also mouse hovered in all browsers. - */ - -a:active, -a:hover { - outline: 0; -} - -/* Text-level semantics - ========================================================================== */ - -/** - * Address styling not present in IE 8/9/10/11, Safari, and Chrome. - */ - -abbr[title] { - border-bottom: 1px dotted; -} - -/** - * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. - */ - -b, -strong { - font-weight: bold; -} - -/** - * Address styling not present in Safari and Chrome. - */ - -dfn { - font-style: italic; -} - -/** - * Address variable `h1` font-size and margin within `section` and `article` - * contexts in Firefox 4+, Safari, and Chrome. - */ - -h1 { - font-size: 2em; - margin: 0.67em 0; -} - -/** - * Address styling not present in IE 8/9. - */ - -mark { - background: #ff0; - color: #000; -} - -/** - * Address inconsistent and variable font size in all browsers. - */ - -small { - font-size: 80%; -} - -/** - * Prevent `sub` and `sup` affecting `line-height` in all browsers. - */ - -sub, -sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; -} - -sup { - top: -0.5em; -} - -sub { - bottom: -0.25em; -} - -/* Embedded content - ========================================================================== */ - -/** - * Remove border when inside `a` element in IE 8/9/10. - */ - -img { - border: 0; -} - -/** - * Correct overflow not hidden in IE 9/10/11. - */ - -svg:not(:root) { - overflow: hidden; -} - -/* Grouping content - ========================================================================== */ - -/** - * Address margin not present in IE 8/9 and Safari. - */ - -figure { - margin: 25px 40px 35px; -} - -/** - * Address differences between Firefox and other browsers. - */ - -hr { - -moz-box-sizing: content-box; - box-sizing: content-box; - height: 0; -} - -/** - * Contain overflow in all browsers. - */ - -pre { - overflow: auto; -} - -/** - * Address odd `em`-unit font size rendering in all browsers. - */ - -code, -kbd, -pre, -samp { - font-family: monospace, monospace; - font-size: 1em; -} - -/* Forms - ========================================================================== */ - -/** - * Known limitation: by default, Chrome and Safari on OS X allow very limited - * styling of `select`, unless a `border` property is set. - */ - -/** - * 1. Correct color not being inherited. - * Known issue: affects color of disabled elements. - * 2. Correct font properties not being inherited. - * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. - */ - -button, -input, -optgroup, -select, -textarea { - color: inherit; /* 1 */ - font: inherit; /* 2 */ - margin: 0; /* 3 */ -} - -/** - * Address `overflow` set to `hidden` in IE 8/9/10/11. - */ - -button { - overflow: visible; -} - -/** - * Address inconsistent `text-transform` inheritance for `button` and `select`. - * All other form control elements do not inherit `text-transform` values. - * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. - * Correct `select` style inheritance in Firefox. - */ - -button, -select { - text-transform: none; -} - -/** - * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` - * and `video` controls. - * 2. Correct inability to style clickable `input` types in iOS. - * 3. Improve usability and consistency of cursor style between image-type - * `input` and others. - */ - -button, -html input[type="button"], /* 1 */ -input[type="reset"], -input[type="submit"] { - -webkit-appearance: button; /* 2 */ - cursor: pointer; /* 3 */ -} - -/** - * Re-set default cursor for disabled elements. - */ - -button[disabled], -html input[disabled] { - cursor: default; -} - -/** - * Remove inner padding and border in Firefox 4+. - */ - -button::-moz-focus-inner, -input::-moz-focus-inner { - border: 0; - padding: 0; -} - -/** - * Address Firefox 4+ setting `line-height` on `input` using `!important` in - * the UA stylesheet. - */ - -input { - line-height: normal; -} - -/** - * It's recommended that you don't attempt to style these elements. - * Firefox's implementation doesn't respect box-sizing, padding, or width. - * - * 1. Address box sizing set to `content-box` in IE 8/9/10. - * 2. Remove excess padding in IE 8/9/10. - */ - -input[type="checkbox"], -input[type="radio"] { - box-sizing: border-box; /* 1 */ - padding: 0; /* 2 */ -} - -/** - * Fix the cursor style for Chrome's increment/decrement buttons. For certain - * `font-size` values of the `input`, it causes the cursor style of the - * decrement button to change from `default` to `text`. - */ - -input[type="number"]::-webkit-inner-spin-button, -input[type="number"]::-webkit-outer-spin-button { - height: auto; -} - -/** - * 1. Address `appearance` set to `searchfield` in Safari and Chrome. - * 2. Address `box-sizing` set to `border-box` in Safari and Chrome - * (include `-moz` to future-proof). - */ - -input[type="search"] { - -webkit-appearance: textfield; /* 1 */ - -moz-box-sizing: content-box; - -webkit-box-sizing: content-box; /* 2 */ - box-sizing: content-box; -} - -/** - * Remove inner padding and search cancel button in Safari and Chrome on OS X. - * Safari (but not Chrome) clips the cancel button when the search input has - * padding (and `textfield` appearance). - */ - -input[type="search"]::-webkit-search-cancel-button, -input[type="search"]::-webkit-search-decoration { - -webkit-appearance: none; -} - -/** - * Define consistent border, margin, and padding. - */ - -fieldset { - border: 1px solid #c0c0c0; - margin: 0 2px; - padding: 0.35em 0.625em 0.75em; -} - -/** - * 1. Correct `color` not being inherited in IE 8/9/10/11. - * 2. Remove padding so people aren't caught out if they zero out fieldsets. - */ - -legend { - border: 0; /* 1 */ - padding: 0; /* 2 */ -} - -/** - * Remove default vertical scrollbar in IE 8/9/10/11. - */ - -textarea { - overflow: auto; -} - -/** - * Don't inherit the `font-weight` (applied by a rule above). - * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. - */ - -optgroup { - font-weight: bold; -} - -/* Tables - ========================================================================== */ - -/** - * Remove most spacing between table cells. - */ - -table { - border-collapse: collapse; - border-spacing: 0; -} - -td, -th { - padding: 0; -} - - -/* Custom - ========================================================================== */ - -/** - * Remove margins from headers and lists - */ - -h1, -h2, -h3, -h4, -ul { - margin: 0; - margin-top: 30px; -} - -/** - * Remove padding and list style from lists - */ -ul { - padding: 0; - list-style: none; -} - -/** - * Fix line-height for code blocks - */ -pre { - line-height: 1.4; -} diff --git a/_templates/page b/_templates/page deleted file mode 100755 index 9213bbb..0000000 --- a/_templates/page +++ /dev/null @@ -1,5 +0,0 @@ ---- -layout: page -title: "{{title}}" -date: {{date}} ---- \ No newline at end of file diff --git a/_templates/post b/_templates/post deleted file mode 100755 index 25d7f8c..0000000 --- a/_templates/post +++ /dev/null @@ -1,8 +0,0 @@ ---- -layout: post -title: "{{title}}" -date: {{date}} -comments: true -external-url: -categories: {{category}} ---- \ No newline at end of file diff --git a/android-chrome-192x192.png b/android-chrome-192x192.png deleted file mode 100644 index 936f3b0..0000000 Binary files a/android-chrome-192x192.png and /dev/null differ diff --git a/android-chrome-512x512.png b/android-chrome-512x512.png deleted file mode 100644 index c9e4117..0000000 Binary files a/android-chrome-512x512.png and /dev/null differ diff --git a/apple-touch-icon.png b/apple-touch-icon.png deleted file mode 100644 index b6e2ad8..0000000 Binary files a/apple-touch-icon.png and /dev/null differ diff --git a/archetypes/default.md b/archetypes/default.md new file mode 100644 index 0000000..00e77bd --- /dev/null +++ b/archetypes/default.md @@ -0,0 +1,6 @@ +--- +title: "{{ replace .Name "-" " " | title }}" +date: {{ .Date }} +draft: true +--- + diff --git a/assets/FiraCode-Medium.woff2 b/assets/FiraCode-Medium.woff2 deleted file mode 100755 index be09f4e..0000000 Binary files a/assets/FiraCode-Medium.woff2 and /dev/null differ diff --git a/assets/FiraCode-Regular.woff2 b/assets/FiraCode-Regular.woff2 deleted file mode 100755 index e93ffe3..0000000 Binary files a/assets/FiraCode-Regular.woff2 and /dev/null differ diff --git a/config.m10c.toml b/config.m10c.toml new file mode 100644 index 0000000..59ab8f6 --- /dev/null +++ b/config.m10c.toml @@ -0,0 +1,29 @@ +baseURL = "https://srp.life/" +languageCode = "en-us" +title = "Seraphim R.P." +paginate = 8 +theme = "m10c" + +[params] + author = "Seraphim R.P." + description = "Seraphim R.P. is an Orthodox Christian and software engineer." + + [params.style] + darkestColor = "#2E3440" + darkColor = "#3B4252" + lightColor = "#D8DEE9" + lightestColor = "#E5E9F0" + primaryColor = "#8FBCBB" + + +[menu] + [[menu.main]] + identifier = "home" + name = "Home" + url = "/" + weight = 1 + [[menu.main]] + identifier = "about" + name = "About" + url = "/about" + weight = 2 diff --git a/config.minima.toml b/config.minima.toml new file mode 100644 index 0000000..c2f4f8b --- /dev/null +++ b/config.minima.toml @@ -0,0 +1,26 @@ +baseURL = "https://srp.life/" +languageCode = "en-us" +title = "Seraphim R.P." +paginate = 8 +theme = "minima" + +[author] + author = "Seraphim R.P." + slogon = "An Orthodox Christian and software engineer." # "slogon", really? + description = "Seraphim R.P. is an Orthodox Christian and software engineer." + +[params] + iam = "I am" + comment = "disqus" + +[menu] + [[menu.main]] + identifier = "home" + name = "Home" + url = "/" + weight = 1 + [[menu.main]] + identifier = "about" + name = "About" + url = "/about" + weight = 2 diff --git a/config.terminal.toml b/config.terminal.toml new file mode 100644 index 0000000..da12b4c --- /dev/null +++ b/config.terminal.toml @@ -0,0 +1,63 @@ +baseURL = "https://srp.life/" +languageCode = "en-us" +title = "Seraphim R.P." +paginate = 8 +rssLimit = 20 +theme = "terminal" +disqusShortname = "seraphimrp" + +[params] + contentTypeName = "posts" + themeColor = "nord" + showMenuItems = 4 + showLanguageSelector = false + fullWidthTheme = false + centerTheme = true + favicon = "favicon.ico" + showLastUpdated = false + # oneHeadingSize = false + +[params.twitter] + creator = "SeraphimRP" + site = "https://srp.life" + +[languages] + [languages.en] + languageName = "English" + title = "Seraphim R.P." + subtitle = "An Orthodox Christian software engineer." + owner = "Seraphim R.P." + keywords = "" + copyright = "© Seraphim R.P." + menuMore = "[show more]" + readMore = "[read more]" + readOtherPosts = "[read other posts]" + newerPosts = "[newer posts]" + olderPosts = "[older posts]" + missingContentMessage = "Page Not Found" + missingBackButtonLabel = "[back to home page]" + + [languages.en.params.logo] + logoText = "Seraphim R.P." + + [languages.en.menu] + [[languages.en.menu.main]] + identifier = "home" + name = "[home]" + url = "/" + weight = 1 + [[languages.en.menu.main]] + identifier = "about" + name = "[about]" + url = "/about" + weight = 2 + [[languages.en.menu.main]] + identifier = "projects" + name = "[projects]" + url = "/projects" + weight = 3 + [[languages.en.menu.main]] + identifier = "resources" + name = "[resources]" + url = "/resources" + weight = 4 diff --git a/config.toml b/config.toml new file mode 120000 index 0000000..592bf9a --- /dev/null +++ b/config.toml @@ -0,0 +1 @@ +config.terminal.toml \ No newline at end of file diff --git a/about.md b/content/about.md similarity index 100% rename from about.md rename to content/about.md diff --git a/_posts/2015-06-19-dropping-out.md b/content/posts/2015-06-19-dropping-out.md similarity index 90% rename from _posts/2015-06-19-dropping-out.md rename to content/posts/2015-06-19-dropping-out.md index f436efd..7a0bf5a 100755 --- a/_posts/2015-06-19-dropping-out.md +++ b/content/posts/2015-06-19-dropping-out.md @@ -5,7 +5,7 @@ date: 2015-06-19 comments: true --- -On January 28th, I made a pretty big life-changing decision. I decided to drop out. I'll begin by providing some backstory. Around 5th grade I began making a decline in education. I wouldn't have things done and I wouldn't have things to turn in, which wasn't good. I somehow made it out of there but I'm not entirely sure how. Once I left elementary school and got into 6th grade, I had a bit of transition. I went from this content, calm person to someone almost excited for everything that was going on. Maybe it was because of me being excited to get older, or being accomplished, or just feeling a release from a lot of burdens I had during my childhood. +On January 28th, I made a pretty big life-changing decision. I decided to drop out. I'll begin by providing some backstory. Around 5th grade I began making a decline in education. I wouldn't have things done and I wouldn't have things to turn in, which wasn't good. I somehow made it out of there but I'm not entirely sure how. Once I left elementary school and got into 6th grade, I had a bit of transition. I went from this content, calm person to someone almost excited for everything that was going on. Maybe it was because of me being excited to get older, or being accomplished, or just feeling a release from a lot of burdens I had during my childhood. I was quite similar to that of an A.D.H.D. child, which is odd considering this was unusual behavior for me. Even some people who knew me back in elementary school understood that I changed over the summer. The decline continued but yet again, I passed through. I came to 7th grade a little more calmed and beginning to become the person who I am today. 7th grade came to be the worse year of my schooling, after my general decline was confronted by a teacher's aide who told me something that changed my year entirely. She blamed my decline on the fact that I knew about a concept the Port Huron Area School District (and possibly other schools had) called 'social promotion.' Now, this was ironic, because I didn't know what the concept was, and that my decline was just me being a giant slacker (for the most part). She also explained what social promotion was in just passing, went sorta like this: "I know that you don't have to do it because of social promotion..." Which I figured gave me a free pass through middle school, which it did. Despite my terrible grades throughout middle school entirely, I made my way to high school, but I'm not skipping 8th grade yet. In 7th grade, I ended up having personality clashes with my science teacher, and ended up getting the most items on my behavioral report in that one year alone. It wasn't because I was truly misbehaving, it was mostly petty things that wasn't tolerated slightly. I even tossed an eraser back at a kid who tossed it towards me, and I ended up getting in trouble for it. This didn't help my decline much at all, as the last thing I wanna do is work for someone who doesn't deserve it. diff --git a/_posts/2015-09-22-keeping-in.md b/content/posts/2015-09-22-keeping-in.md similarity index 98% rename from _posts/2015-09-22-keeping-in.md rename to content/posts/2015-09-22-keeping-in.md index e90a77d..cc82845 100755 --- a/_posts/2015-09-22-keeping-in.md +++ b/content/posts/2015-09-22-keeping-in.md @@ -6,7 +6,7 @@ comments: true --- -It's been a long 3 months since I've updated on all this education stuff. When I wrote the post, I had reached my low point and I wasn't sure where I was headed afterwards. +It's been a long 3 months since I've updated on all this education stuff. When I wrote the post, I had reached my low point and I wasn't sure where I was headed afterwards. **But now, I'm back.** diff --git a/_posts/2017-04-17-just-a-memory.md b/content/posts/2017-04-17-just-a-memory.md similarity index 100% rename from _posts/2017-04-17-just-a-memory.md rename to content/posts/2017-04-17-just-a-memory.md diff --git a/_posts/2018-08-27-a-life-renewed.md b/content/posts/2018-08-27-a-life-renewed.md similarity index 100% rename from _posts/2018-08-27-a-life-renewed.md rename to content/posts/2018-08-27-a-life-renewed.md diff --git a/_posts/2019-12-24-where-i-am-now.md b/content/posts/2019-12-24-where-i-am-now.md similarity index 100% rename from _posts/2019-12-24-where-i-am-now.md rename to content/posts/2019-12-24-where-i-am-now.md diff --git a/_posts/2020-01-03-navigating-the-schism.md b/content/posts/2020-01-03-navigating-the-schism.md similarity index 100% rename from _posts/2020-01-03-navigating-the-schism.md rename to content/posts/2020-01-03-navigating-the-schism.md diff --git a/_posts/2020-11-07-a-reflection.md b/content/posts/2020-11-07-a-reflection.md similarity index 99% rename from _posts/2020-11-07-a-reflection.md rename to content/posts/2020-11-07-a-reflection.md index 24debba..3a72f8b 100644 --- a/_posts/2020-11-07-a-reflection.md +++ b/content/posts/2020-11-07-a-reflection.md @@ -5,7 +5,7 @@ date: 2020-11-07 comments: true --- -After a 5-week penance from my Orthodox online community, Oikonomia, I've learned a lot about myself, the faith, those in it, real values that I can carry with me through life. I intended on not writing these types of autobiographical posts, but this one I feel is worth sharing. This reflection won't cover just the penance, but the events leading up to now. +After a 5-week penance from my Orthodox online community, Oikonomia, I've learned a lot about myself, the faith, those in it, real values that I can carry with me through life. I intended on not writing these types of autobiographical posts, but this one I feel is worth sharing. This reflection won't cover just the penance, but the events leading up to now. ## A Chronology diff --git a/projects.md b/content/projects.md similarity index 100% rename from projects.md rename to content/projects.md diff --git a/resources.md b/content/resources.md similarity index 100% rename from resources.md rename to content/resources.md diff --git a/css/main.scss b/css/main.scss deleted file mode 100755 index 3c48b05..0000000 --- a/css/main.scss +++ /dev/null @@ -1,11 +0,0 @@ ---- ---- -@charset "utf-8"; - -// Import partials from `sass_dir` (defaults to `_sass`) -@import - "fonts", - "settings", - "base", - "syntax-highlighting" -; diff --git a/css/screen.scss b/css/screen.scss deleted file mode 100644 index d5bd4aa..0000000 --- a/css/screen.scss +++ /dev/null @@ -1,52 +0,0 @@ ---- -# Only the main Sass file needs front matter (the dashes are enough) ---- -@charset "utf-8"; - -// Typography -$base-font-family: "adobe-caslon-pro", "Adobe Caslon Pro", serif; -$caption-font-family: "ltc-bodoni-175", "Libre Baskerville", serif; -$banner-font-family: "Sanchez", serif; -$title-font-family: "Libre Baskerville", serif; -$base-font-size: 18px; -$base-font-weight: 400; -$base-line-height: 1; - -// Colours -$text-color: #222; -$caption-text-color: #444; -$border-color: #979797; -$background-color: #fefefe; -$content-width: 750px; -$hover-color: #443E40; -$legal-color: #818181; - -// Layout -$layout-width: 750px; - -// Breakpoints -$desktop-breakpoint: $layout-width / 0.9; -$image-splitting-breakpoint: 510px; - -// Banner -$banner-width: 182px; -$banner-height: 503px; -$banner-margin: 50px; -$banner-border-width: 3px; -$banner-border-offset: 2px; - -// Images -// Note that extensions are omitted for use in retina-background-image mixin -$img-separator: '{{ site.baseurl }}/img/separator'; -$img-banner: '{{ site.baseurl }}/img/banner'; -$img-dude: '{{ site.baseurl }}/img/dude'; -$img-location: '{{ site.baseurl }}/img/icon-location'; - -// Import partials from `sass_dir` (defaults to `_sass`) -@import - "mixins", - "vendors", - "base", - "layout", - "modules" -; diff --git a/epistletochristcord.html b/epistletochristcord.html deleted file mode 100644 index 218f419..0000000 --- a/epistletochristcord.html +++ /dev/null @@ -1,100 +0,0 @@ -
-
on the future and longevity of christcord
-

03 Apr 2017

-
-

Introduction

- -

Who am I (for the unaware)

- -

I’m Elliott, commonly known around the internet as “vipr” or “vypr.” I’m the co-founder (along with stupiddroid) of Christcord, although eventually was removed due to issues that have been resolved for some time. I’m 18 years of age. I specialize in programming, theological thought, and breathing. I’m also fairly decent at writing, you tell me. I run a blog over at http://vypr.xyz, and you can contact me through Discord, email (me@thevypr.com), or Twitter (@thevypr).

- -

My Intentions In Writing This

- -

I hope to see server-wide progress, not only at an administrative level, but at the member level. I also hope to get people thinking and being self-aware of what they’re doing to themselves and others. I believe that the best way to truly do that is by outlining the problems and providing solutions. Whether or not I expect this “letter” of sorts to be effective, is a question for another day.

- -

For Those Reading

- -

When I reference staff or the administration, this includes the “council,” as they are in a nearly equal position of power.

- -

If I receive administrative punishment, leave the server. If I receive punishment for openly criticizing the server, then it’s best for everyone to not be involved, unless you want Stockholm syndrome.

- -

Please provide responses and criticisms, if feeling ambitious. I’d prefer to create a discussion rather than not having one at all.

- -

Meta Info

- -

This letter is licensed under CC BY-NC-ND 4.0, see https://creativecommons.org/licenses/by-nc-nd/4.0/ for more detail on what that means.

- -
- -

Our Current State

- -

I believe in the past 2-3 months, there has been a great amount of degration among the server. This isn’t specific to any area, but the server as a whole. I not only speak for myself on this, as stupiddroid agrees, and I’m more than certain there’s a great number who can say that the server has been in decline. Fighting has increased significantly than it has ever before, people of importance and value have departed, bad decisions are being made, and progress overall has dropped.

- -

I believe the responsibility lies primarily in the staff, however this is not to say that they are the only people responsible. I will cover the staff, but the members should take the time to learn about loving your neighbor. I believe that the staff haven’t been doing their job properly of maintaining order, and when they do so, they do it in a way that can be degrading to the server as a whole.

- -

Problem 1 - Inaction and Improper Action

- -

A good example of improper action would be the creation of rule 11, which came about after a transgender person was told that it was okay to be transgender, and that they should keep on doing so. Whether or not this story of origin is true, my statements still apply. While the premise of the rule was in hope of stopping sin’s influence on the server, this has created a route for censorship and oppression of viewpoints that are as equally valid as anyone else’s. The server has been around since last November, we have never needed such a rule.

- -

I believe that this has contributed to the fighting because then there is a “de facto standard” of what is sin and what is not, and because the server has a stance, people may perceive those who disagree with their personal stance as someone who is wrong because the server agrees. Not only that, this provides a medium where staff can (on a case by case basis) say to one person that they’re breaking rule 11, and saying to another person that they aren’t for the same reason. The administration is Catholic and Protestant, definitions of sin will conflict and will be inconsistent.

- -

Another reason to disagree with the rule is the sheer lack of use, why have a rule that isn’t enforced? If we have a rule defining not to promote sin, shouldn’t we be banning everyone because we clearly don’t have a problem with people not following the Lord and Savior, Jesus Christ? There are Muslims, Sikhs, atheists, and so on. By not converting them or showing (in great display) their error, aren’t we promoting their sinful behavior as a result of our inaction?

- -

Thus, not only is this useless, this is not for a Discord server’s administration to define or deal with, but rather the server as a whole. Historically, when sinful things have came around, the server has dealt with them well, either by talking them through or dismissing them if unnecessary or just absurdly obvious (i.e. manipulative satanists).

- -

Problem 1 - Inaction and Improper Action (Proposed Solution)

- -

Remove the rule, leave it to the members to sort out, only in very grave situations should the administration ever have to deal with it. The only time staff ever needed to intervene was when there was collective server-wide disagreement, and that the staff needed to remove the person so that the server would be back in order. This however, does not warrant a server rule, because it isn’t constant enough to be necessary.

- -

The simple way of dealing with fighting is isolating who the roots of it are, and dealing with those individually. Force them to stop, one way or another. Then once that’s done, look to see how they can resolve it.

- -

Problem 2 - Toxic Members (Detail and Solution)

- -

In these past few months, we have had more members with bad attitudes joining, creating fights, borderline trolling, or simply not keeping conversation thriving. This has been a significant problem, resulting in even moderators leaving because of it. The best way of dealing with this is by having more of a vetting system for new members or some sort of approval system.

- -

Guests would either:

- - - -

A good example of this kind of system would be /r/socialism Discord’s interview system, to ensure quality, or /r/Islam’s application system. /r/Islam’s method would be good at the beginning, to deter those who really don’t have any care for participating, but the interview system would be the most effective.

- -

Problem 3 - The Council (Detail and Solution)

- -

These members are redundant and given the fact that the people are not choosing who these members are goes completely against the point of having the council in the first place. On top of that, this council should not be hidden or out of plain sight. People have a right to know how the main administrative area is doing their job, rather than waiting for documents that would explain what they did, which could lack detail, or be simply wrong.

- -

If we as a server cannot hold our own administration accountable outside of a council, this creates an avenue for the council to thrive in corruption, forwarding their agenda. The simple fact that they have agreed universally on every issue they’ve received means that there isn’t enough diversity to have the alternative opinion hold value.

- -

The solution to this is either:

- - - -
- -

Conclusion

- -

Until these issues are addressed and given great consideration, I do not see the server thriving for long. Even if it did survive long enough, the place will be even worse than what it is now. Valuable members are leaving. If this continues, that number will increase. I will even have the nerve to assert that if nothing comes of this, I will found another Christian Discord server if that’s what needs to be done. I refuse to let Christians be confined to a server that is slowly killing itself due to ignorance.

- -
- - - christcord - - epistles - - - -
diff --git a/favicon-16x16.png b/favicon-16x16.png deleted file mode 100644 index cceae9a..0000000 Binary files a/favicon-16x16.png and /dev/null differ diff --git a/favicon-32x32.png b/favicon-32x32.png deleted file mode 100644 index 22fd985..0000000 Binary files a/favicon-32x32.png and /dev/null differ diff --git a/favicon.ico b/favicon.ico deleted file mode 100644 index 1681961..0000000 Binary files a/favicon.ico and /dev/null differ diff --git a/feed.xml b/feed.xml deleted file mode 100755 index a6628bd..0000000 --- a/feed.xml +++ /dev/null @@ -1,30 +0,0 @@ ---- -layout: null ---- - - - - {{ site.title | xml_escape }} - {{ site.description | xml_escape }} - {{ site.url }}{{ site.baseurl }}/ - - {{ site.time | date_to_rfc822 }} - {{ site.time | date_to_rfc822 }} - Jekyll v{{ jekyll.version }} - {% for post in site.posts limit:10 %} - - {{ post.title | xml_escape }} - {{ post.content | xml_escape }} - {{ post.date | date_to_rfc822 }} - {{ post.url | prepend: site.baseurl | prepend: site.url }} - {{ post.url | prepend: site.baseurl | prepend: site.url }} - {% for tag in post.tags %} - {{ tag | xml_escape }} - {% endfor %} - {% for cat in post.categories %} - {{ cat | xml_escape }} - {% endfor %} - - {% endfor %} - - diff --git a/img/banner.png b/img/banner.png deleted file mode 100644 index 695c8ab..0000000 Binary files a/img/banner.png and /dev/null differ diff --git a/img/banner@2x.png b/img/banner@2x.png deleted file mode 100644 index 955e209..0000000 Binary files a/img/banner@2x.png and /dev/null differ diff --git a/img/banner@3x.png b/img/banner@3x.png deleted file mode 100644 index 22f7504..0000000 Binary files a/img/banner@3x.png and /dev/null differ diff --git a/img/dude.png b/img/dude.png deleted file mode 100644 index e501762..0000000 Binary files a/img/dude.png and /dev/null differ diff --git a/img/dude@2x.png b/img/dude@2x.png deleted file mode 100644 index adf4523..0000000 Binary files a/img/dude@2x.png and /dev/null differ diff --git a/img/dude@3x.png b/img/dude@3x.png deleted file mode 100644 index d4989f4..0000000 Binary files a/img/dude@3x.png and /dev/null differ diff --git a/img/icon-location.png b/img/icon-location.png deleted file mode 100644 index 479e741..0000000 Binary files a/img/icon-location.png and /dev/null differ diff --git a/img/icon-location@2x.png b/img/icon-location@2x.png deleted file mode 100644 index a596e3d..0000000 Binary files a/img/icon-location@2x.png and /dev/null differ diff --git a/img/icon-location@3x.png b/img/icon-location@3x.png deleted file mode 100644 index ecb205d..0000000 Binary files a/img/icon-location@3x.png and /dev/null differ diff --git a/img/separator.png b/img/separator.png deleted file mode 100644 index 386fe96..0000000 Binary files a/img/separator.png and /dev/null differ diff --git a/img/separator@2x.png b/img/separator@2x.png deleted file mode 100644 index d7dd4eb..0000000 Binary files a/img/separator@2x.png and /dev/null differ diff --git a/img/separator@3x.png b/img/separator@3x.png deleted file mode 100644 index 09b27a1..0000000 Binary files a/img/separator@3x.png and /dev/null differ diff --git a/index.html b/index.html deleted file mode 100755 index c558dc5..0000000 --- a/index.html +++ /dev/null @@ -1,20 +0,0 @@ ---- -layout: default ---- - - -{% for post in paginator.posts %} - {% include post.html post=post content=post.content %} -{% endfor %} - -{% if paginator.total_pages > 1 %} - {% include pagination.html maxPages=5 %} -{% endif %} diff --git a/js/galileo.js b/js/galileo.js deleted file mode 100644 index 5d9c703..0000000 --- a/js/galileo.js +++ /dev/null @@ -1,34 +0,0 @@ -'use strict' - -var secretRevealed = false -var doSecretReveal -var resetSecretReveal - -doSecretReveal = function () { - // Remove the negative offset from the banner, while also scrolling down the page - // this reveals the secret without affecting the users position on the page - document.body.className = document.body.className.replace('is-offset', '') - window.scroll(0, window.scrollY + 195) - secretRevealed = true -} - -resetSecretReveal = function () { - if (secretRevealed) { - // The native browser behaviour of automatically scrolling to a users last position on refresh - // is upset by our revealing of the secret banner. This meant that, on refresh, the position - // the browser returns the user to is incorrect. To compensate for this, we hide the secret banner - // section again and adjust the page scroll value accordingly - document.body.className += ' is-offset' - window.scroll(0, Math.max(window.scrollY - 195, 0)) - } -} - -document.addEventListener('DOMContentLoaded', function () { - // 3000 ms is arbitrary, though there must be at least some - // delay here, otherwise it doesn't seem to play ball - setTimeout(doSecretReveal, 3000) -}) - -window.addEventListener('beforeunload', function () { - resetSecretReveal() -}) diff --git a/layouts/_default/rss.xml b/layouts/_default/rss.xml new file mode 100644 index 0000000..9db048d --- /dev/null +++ b/layouts/_default/rss.xml @@ -0,0 +1,40 @@ +{{- $pctx := . -}} +{{- if .IsHome -}}{{ $pctx = .Site }}{{- end -}} +{{- $pages := slice -}} +{{- if or $.IsHome $.IsSection -}} +{{- $pages = $pctx.RegularPages -}} +{{- else -}} +{{- $pages = $pctx.Pages -}} +{{- end -}} +{{- $limit := .Site.Config.Services.RSS.Limit -}} +{{- if ge $limit 1 -}} +{{- $pages = $pages | first $limit -}} +{{- end -}} +{{- printf "" | safeHTML }} + + + {{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }} + {{ .Permalink }} + Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }} + Hugo -- gohugo.io{{ with .Site.LanguageCode }} + {{.}}{{end}}{{ with .Site.Author.email }} + {{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}{{end}}{{ with .Site.Author.email }} + {{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}{{end}}{{ with .Site.Copyright }} + {{.}}{{end}}{{ if not .Date.IsZero }} + {{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}{{ end }} + {{- with .OutputFormats.Get "RSS" -}} + {{ printf "" .Permalink .MediaType | safeHTML }} + {{- end -}} + {{ range $pages }} + + {{ .Title }} + {{ .Permalink }} + {{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }} + {{ with .Site.Author.email }}{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}{{end}} + {{ .Permalink }} + {{ .Summary | html }} + + {{ end }} + + + diff --git a/layouts/partials/comments.html b/layouts/partials/comments.html new file mode 100644 index 0000000..0b59e05 --- /dev/null +++ b/layouts/partials/comments.html @@ -0,0 +1 @@ +{{ template "_internal/disqus.html" . }} diff --git a/oldoikonomiaclosure.html b/oldoikonomiaclosure.html deleted file mode 100644 index 0704d74..0000000 --- a/oldoikonomiaclosure.html +++ /dev/null @@ -1,59 +0,0 @@ - - - - R.I.P. Oikonomia, an Orthodox Christian Community - - - - - - - - - - -

R.I.P. Oikonomia, an Orthodox Christian Community

-

2018-2019

- -
- - February 19th, 2019 - -

As a lot of you already know, Oikonomia was deleted. This was not by Discord, as some might speculate, but rather myself personally. While the decision to delete was capricious, the feelings and environment necessary for me to do that were very much there. Allow me to explain.

- -

Oikonomia was founded somewhere around February/March 2018. In its formation, it was intended to be a low-to-medium sized server for Orthodox, even more so for people who were Orthodox and likeminded with mimi_jean. It remained this way up until late August/early September 2018 when Mimi transferred ownership to me following the growth of traditionalist members on the server and the "schism" of sorts in the creation of Leitourgia. What you saw in Oikonomia the last week of its existence is very far from the original intention. Many, especially TheTiger0502 and Shiranui117, can attest to this.

- -

I involved myself in Oikonomia's administration and development from the beginning. I had abandoned the already-dying Christcord Origin, handing it over to Tiger to focus on Oikonomia. I saw a great potential for the server and through my administration, I made sure that it would be realized. What I saw for Oikonomia was definitely not what Mimi saw for Oikonomia, which would result in many personal conflicts over positions of power. I saw Oikonomia as this community that had the potential to be a powerful force for Orthodoxy on the internet, Mimi wanted a group of likeminded individuals. As you can see in the end, I got my way. Mimi's departure from ownership gave me the perfect opportunity to force Oikonomia in this growth, but it did not come easily.

- -

Since Mimi and I had differing goals for the server, the server up until September 2018 was a mix of these goals. The server had grown quite significantly and became a common name among Christian Discords, but with Mimi's intent for likemindedness, it had a significant amount of those who would lean theologically liberal. These two in combination allowed for Oikonomia to develop the reputation that it did. If you mentioned Oikonomia to someone around September 2018, most would have disdain for it and would have very reactionary viewpoints about it. Thus, when I became owner I had a lot of work on my hands, but that was alright.

- -

Being this in-between of open to modern theological stances and traditionalism, I had no problem letting the growth of traditionalism occur in the server. In fact, I encouraged it not only in my words but in my administration of the server. Of course, this did not come without resistance. I was labeled a Nazi sympathizer by the modernists for the permittance of Nazis in the server, a modernist by the traditionalists for the forbiddance of using specific terms that were often targeted and thrown at the LGBT. I looked to please everyone and provide a more moderate server where respect for persons and viewpoints was given universally. Unfortunately, this would never occur during Oikonomia's lifetime.

- -

Traditionalism had got to the point in the server where those who were traditional would purposefully instigate those who disagreed. Catholics, unless favoring Orthodoxy, didn't stand much of a chance, resulting in the departure of many members such as Jcfraven and vote4waifu. Rather than being a helping hand with Orthodoxy, the server had become a wall for those who were sliding away from it. You know who you are. I am very much complicit as well, as I allowed it to occur in order to please the majority. To anyone who Oikonomia has hurt, I pray that you can forgive me for allowing it.

- -

Nearing the end, Oikonomia was starting to stagnate and further itself as an echochamber of the traditional. Tribalism was very much growing and there are only so little ways to fix that without kicking everyone out and starting from square one.

- -

I loved Oikonomia, it was one of the few reasons why I woke up in the morning, and it's impacted my life in so many ways that I'm grateful for.

- -
- -

Unfortunately, it is not only Oikonomia itself that has led to this. My mental state is seemingly deteriorating by the day. That day when I started spamming and I changed my name and image, giving myself all roles. Your fears were correct, I was losing it. I managed to play the situation to where people wouldn't be alarmed or concerned because the last thing I needed was more pressure. What you saw that day was a cry for help.

- -

My situation at home is only getting worse. My parents' frustration with my behavior is growing and I haven't felt more isolated from the world than I have now. Not mentioning the pressure of having only a year to figure out my life and avoid getting kicked out. I want to protest so badly against my family but without a single physical advocate here, I'm only digging the hole deeper by doing so. I'm stuck in a rock and a hard place and the future is uncertain. What I do know is that I'm not going anywhere and I will endure my sufferings, whether through sorrow or gladness. Kyrie, eleison.

- -

As for what happens next, that is yet to be determined. Mimi has created a server with more of the original intent of Oikonomia represented, a small group of friends. As for myself, I would like to focus on creating a more privatized community with a narrower focus. A lot is still to be determined with what I will be doing, but if you guys are interested in being involved in what I'll eventually do, let me know.

- -

I cannot recommend anyone create a clone of Oikonomia nor try to make a community in its stead and I have advised a majority of former staff to not endorse such as well. Oikonomia was destined to fall, either by implosion, through Discord deleting it for reasons which you guys would know about, or through my deletion of it. If I saw Oikonomia surviving, I would've handed it off to someone else, but I know no one who could put in the time and effort in Oikonomia than I could. Not to be boastful, but I found myself the only one fit to run it.

- -

It brings me sorrow to create disappointment among you all, but I can only pray that you understand how it got to this point.

May you forgive me. I'll answer any questions on Discord DMs.
- Seraphim (vypr#0001)

- diff --git a/public/404.html b/public/404.html new file mode 100644 index 0000000..cf64ee9 --- /dev/null +++ b/public/404.html @@ -0,0 +1,48 @@ + + + + 404 Page not found // Seraphim R.P. + + + + + + + + + + + + + + + + + + + + + + +
+ John Doe +

Seraphim R.P.

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vehicula turpis sit amet elit pretium.

+
+
+ +
+

O + frown + +ps...

+

The link you followed may be broken, or the page may have been removed.

+ Go home + arrow-right + + +
+ +
+ + diff --git a/public/avatar.jpg b/public/avatar.jpg new file mode 100644 index 0000000..dad9e72 Binary files /dev/null and b/public/avatar.jpg differ diff --git a/public/categories/index.html b/public/categories/index.html new file mode 100644 index 0000000..5dcb8f3 --- /dev/null +++ b/public/categories/index.html @@ -0,0 +1,43 @@ + + + + Categories // Seraphim R.P. + + + + + + + + + + + + + + + + + + + + + + +
+ John Doe +

Seraphim R.P.

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vehicula turpis sit amet elit pretium.

+
+
+ +
+

Categories

+ +
+ +
+ + diff --git a/public/categories/index.xml b/public/categories/index.xml new file mode 100644 index 0000000..c3d0371 --- /dev/null +++ b/public/categories/index.xml @@ -0,0 +1,10 @@ + + + + Categories on Seraphim R.P. + https://srp.life/categories/ + Recent content in Categories on Seraphim R.P. + Hugo -- gohugo.io + en-us + + diff --git a/public/css/main.min.4a7ec8660f9a44b08c4da97c5f2e31b1192df1d4d0322e65c0dbbc6ecb1b863f.css b/public/css/main.min.4a7ec8660f9a44b08c4da97c5f2e31b1192df1d4d0322e65c0dbbc6ecb1b863f.css new file mode 100644 index 0000000..f55e88e --- /dev/null +++ b/public/css/main.min.4a7ec8660f9a44b08c4da97c5f2e31b1192df1d4d0322e65c0dbbc6ecb1b863f.css @@ -0,0 +1 @@ +*{box-sizing:border-box}html{line-height:1.6}body{margin:0;font-family:sans-serif;background:#353b43;color:#afbac4}h1,h2,h3,h4,h5,h6{color:#fff}a{color:#57cc8a;transition:color .35s;text-decoration:none}a:hover{color:#fff}code{font-family:monospace,monospace;font-size:1em;color:rgba(175,186,196,.8)}pre{font-size:1rem;line-height:1.2em;margin:0;overflow:auto}pre code{font-size:.8em}::selection{background:rgba(175,186,196,.25)}::-moz-selection{background:rgba(175,186,196,.25)}.app-header{padding:2.5em;background:#242930;text-align:center}.app-header-avatar{width:15rem;height:15rem;border-radius:100%;border:.5rem solid #57cc8a}.app-container{padding:2.5rem}.app-header-social{font-size:2em;color:#fff}.app-header-social a{margin:0 .1em}@media(min-width:940px){.app-header{position:fixed;top:0;left:0;width:20rem;min-height:100vh}.app-container{max-width:65rem;margin-left:20rem}}.error-404{text-align:center}.error-404-title{text-transform:uppercase}.icon{display:inline-block;width:1em;height:1em;vertical-align:-.125em}.pagination{display:block;list-style:none;padding:0;font-size:.8em;text-align:center;margin:3em 0}.page-item{display:inline-block}.page-item .page-link{display:block;padding:.285em .8em}.page-item.active .page-link{color:#fff;border-radius:2em;background:#57cc8a}.post-title{color:#fff}.post-content>pre,.post-content .highlight{margin:1em 0}.post-content>pre,.post-content .highlight>pre,.post-content .highlight>div{border-left:.4em solid rgba(87,204,138,.8);padding:.5em 1em}.post-content img{max-width:100%}.post-meta{font-size:.8em}.posts-list{padding:0}.posts-list-item{list-style:none;padding:.4em 0}.posts-list-item:not(:last-child){border-bottom:1px dashed rgba(255,255,255,.3)}.posts-list-item-description{display:block;font-size:.8em}.tag{display:inline-block;margin-right:.2em;padding:0 .6em;font-size:.9em;border-radius:.2em;white-space:nowrap;background:rgba(255,255,255,.1);transition:color .35s,background .35s}.tag:hover{transition:color .25s,background .05s;background:rgba(255,255,255,.3)}.tags-list{padding:0}.tags-list-item{list-style:none;padding:.4em 0}.tags-list-item:not(:last-child){border-bottom:1px dashed rgba(255,255,255,.3)}@media(min-width:450px){.tags-list{display:flex;flex-wrap:wrap}.tags-list-item{width:calc(50% - 1em)}.tags-list-item:nth-child(even){margin-left:1em}.tags-list-item:nth-last-child(2){border:none}} \ No newline at end of file diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..7fa606d --- /dev/null +++ b/public/index.html @@ -0,0 +1,47 @@ + + + + Seraphim R.P. + + + + + + + + + + + + + + + + + + + + + + +
+ John Doe +

Seraphim R.P.

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vehicula turpis sit amet elit pretium.

+
+
+ +
+

Seraphim R.P.

+ + + + + +
+ +
+ + diff --git a/public/index.xml b/public/index.xml new file mode 100644 index 0000000..4633059 --- /dev/null +++ b/public/index.xml @@ -0,0 +1,10 @@ + + + + Seraphim R.P. + https://srp.life/ + Recent content on Seraphim R.P. + Hugo -- gohugo.io + en-us + + diff --git a/public/page/1/index.html b/public/page/1/index.html new file mode 100644 index 0000000..50ae2af --- /dev/null +++ b/public/page/1/index.html @@ -0,0 +1 @@ +https://srp.life/ \ No newline at end of file diff --git a/public/sitemap.xml b/public/sitemap.xml new file mode 100644 index 0000000..ef2c4a4 --- /dev/null +++ b/public/sitemap.xml @@ -0,0 +1,11 @@ + + + + https://srp.life/categories/ + + https://srp.life/ + + https://srp.life/tags/ + + diff --git a/public/tags/index.html b/public/tags/index.html new file mode 100644 index 0000000..016d54d --- /dev/null +++ b/public/tags/index.html @@ -0,0 +1,43 @@ + + + + Tags // Seraphim R.P. + + + + + + + + + + + + + + + + + + + + + + +
+ John Doe +

Seraphim R.P.

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vehicula turpis sit amet elit pretium.

+
+
+ +
+

Tags

+ +
+ +
+ + diff --git a/public/tags/index.xml b/public/tags/index.xml new file mode 100644 index 0000000..b570e5c --- /dev/null +++ b/public/tags/index.xml @@ -0,0 +1,10 @@ + + + + Tags on Seraphim R.P. + https://srp.life/tags/ + Recent content in Tags on Seraphim R.P. + Hugo -- gohugo.io + en-us + + diff --git a/resources/_gen/assets/scss/css/main.scss_e86386c8bae1cd02295de71a1be078d6.content b/resources/_gen/assets/scss/css/main.scss_e86386c8bae1cd02295de71a1be078d6.content new file mode 100644 index 0000000..9555d13 --- /dev/null +++ b/resources/_gen/assets/scss/css/main.scss_e86386c8bae1cd02295de71a1be078d6.content @@ -0,0 +1 @@ +*{box-sizing:border-box}html{line-height:1.6}body{margin:0;font-family:sans-serif;background:#3b4252;color:#d8dee9}h1,h2,h3,h4,h5,h6{color:#e5e9f0}a{color:#8fbcbb;transition:color .35s;text-decoration:none}a:hover{color:#e5e9f0}code{font-family:monospace,monospace;font-size:1em;color:rgba(216,222,233,.8)}pre{font-size:1rem;line-height:1.2em;margin:0;overflow:auto}pre code{font-size:.8em}::selection{background:rgba(216,222,233,.25)}::-moz-selection{background:rgba(216,222,233,.25)}.app-header{padding:2.5em;background:#2e3440;text-align:center}.app-header-avatar{width:15rem;height:15rem;border-radius:100%;border:.5rem solid #8fbcbb}.app-container{padding:2.5rem}.app-header-social{font-size:2em;color:#e5e9f0}.app-header-social a{margin:0 .1em}@media(min-width:940px){.app-header{position:fixed;top:0;left:0;width:20rem;min-height:100vh}.app-container{max-width:65rem;margin-left:20rem}}.error-404{text-align:center}.error-404-title{text-transform:uppercase}.icon{display:inline-block;width:1em;height:1em;vertical-align:-.125em}.pagination{display:block;list-style:none;padding:0;font-size:.8em;text-align:center;margin:3em 0}.page-item{display:inline-block}.page-item .page-link{display:block;padding:.285em .8em}.page-item.active .page-link{color:#e5e9f0;border-radius:2em;background:#8fbcbb}.post-title{color:#e5e9f0}.post-content>pre,.post-content .highlight{margin:1em 0}.post-content>pre,.post-content .highlight>pre,.post-content .highlight>div{border-left:.4em solid rgba(143,188,187,.8);padding:.5em 1em}.post-content img{max-width:100%}.post-meta{font-size:.8em}.posts-list{padding:0}.posts-list-item{list-style:none;padding:.4em 0}.posts-list-item:not(:last-child){border-bottom:1px dashed rgba(255,255,255,.3)}.posts-list-item-description{display:block;font-size:.8em}.tag{display:inline-block;margin-right:.2em;padding:0 .6em;font-size:.9em;border-radius:.2em;white-space:nowrap;background:rgba(255,255,255,.1);transition:color .35s,background .35s}.tag:hover{transition:color .25s,background .05s;background:rgba(255,255,255,.3)}.tags-list{padding:0}.tags-list-item{list-style:none;padding:.4em 0}.tags-list-item:not(:last-child){border-bottom:1px dashed rgba(255,255,255,.3)}@media(min-width:450px){.tags-list{display:flex;flex-wrap:wrap}.tags-list-item{width:calc(50% - 1em)}.tags-list-item:nth-child(even){margin-left:1em}.tags-list-item:nth-last-child(2){border:none}} \ No newline at end of file diff --git a/resources/_gen/assets/scss/css/main.scss_e86386c8bae1cd02295de71a1be078d6.json b/resources/_gen/assets/scss/css/main.scss_e86386c8bae1cd02295de71a1be078d6.json new file mode 100644 index 0000000..bc6d6b4 --- /dev/null +++ b/resources/_gen/assets/scss/css/main.scss_e86386c8bae1cd02295de71a1be078d6.json @@ -0,0 +1 @@ +{"Target":"css/main.min.2dc982c281238b21c3935ba088001e375ab3b938e785acd62eb94e4bf57fa1d5.css","MediaType":"text/css","Data":{"Integrity":"sha256-LcmCwoEjiyHDk1ugiAAeN1qzuTjnhazWLrlOS/V/odU="}} \ No newline at end of file diff --git a/robots.txt b/robots.txt deleted file mode 100755 index beb17c8..0000000 --- a/robots.txt +++ /dev/null @@ -1,6 +0,0 @@ -User-Agent: * -Disallow: /.bundle/ -Disallow: /.gitignore -Allow: / - -Sitemap: https://vypr.xyz/sitemap.xml diff --git a/site.webmanifest b/site.webmanifest deleted file mode 100644 index 45dc8a2..0000000 --- a/site.webmanifest +++ /dev/null @@ -1 +0,0 @@ -{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"} \ No newline at end of file diff --git a/static/favicon.ico b/static/favicon.ico new file mode 100644 index 0000000..45262de Binary files /dev/null and b/static/favicon.ico differ diff --git a/themes/m10c/.editorconfig b/themes/m10c/.editorconfig new file mode 100644 index 0000000..4bd3bd8 --- /dev/null +++ b/themes/m10c/.editorconfig @@ -0,0 +1,12 @@ +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true + +[*.md] +trim_trailing_whitespace = false diff --git a/themes/m10c/.gitignore b/themes/m10c/.gitignore new file mode 100644 index 0000000..aa94faa --- /dev/null +++ b/themes/m10c/.gitignore @@ -0,0 +1,2 @@ +public/ +exampleSite/resources/ diff --git a/LICENSE b/themes/m10c/LICENSE.md old mode 100755 new mode 100644 similarity index 94% rename from LICENSE rename to themes/m10c/LICENSE.md index 4dd81da..5941ee2 --- a/LICENSE +++ b/themes/m10c/LICENSE.md @@ -1,6 +1,6 @@ -The MIT License (MIT) +MIT License -Copyright (c) 2015 Rowan Oulton +Copyright (c) 2019 Fabien Casters Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal @@ -19,4 +19,3 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. - diff --git a/themes/m10c/README.md b/themes/m10c/README.md new file mode 100644 index 0000000..a2f883e --- /dev/null +++ b/themes/m10c/README.md @@ -0,0 +1,93 @@ +# m10c theme + +![Intro](https://github.com/vaga/hugo-theme-m10c/blob/master/images/cover.png) + +A Hugo minimalistic theme for bloggers + +Main features: + +- Fully responsive +- Twitter Cards, Open Graph, Disqus and Google Analytics supported (see Hugo docs) +- Customizable colors +- Customizable picture and description +- Customizable menu on sidebar +- Customizable social media links on sidebar +- Optimized for performance 100/100 on Lighthouse +- All feather icons included + +## Getting started + +### Installation + +Create a new Hugo site: +```bash +$ hugo new site [path] +``` + +Clone this repository into `themes/` directory: +```bash +$ cd [path] +$ git clone https://github.com/vaga/hugo-theme-m10c.git themes/m10c +``` + +Add this line in the `config.toml` file: +```toml +theme = "m10c" +``` + +### Configuration + +In your `config.toml` file, define the following variables in `params`: + +- `author`: Name of the author +- `description`: Short description of the author +- `avatar`: Path of file containing the author avatar image +- `menu_item_separator`: Separator between each menu item. HTML allowed (default: " - ") +- `favicon`: Absolute path of your favicon.ico file (default: "/favicon.ico") + +To add a menu item, add the following lines in `menu`: + +``` +[[menu.main]] + identifier = "tags" + name = "Tags" + url = "/tags/" +``` + +[Read Hugo documentations](https://gohugo.io/content-management/menus/#readout) for more informations about menu + +To add a social link, add the following lines in `params`: + +``` +[[params.social]] + icon = "github" + name = "My Github" + url = "https://github.com/vaga" +``` + +To change theme colors, add the following lines in `params`: + +``` +[params.style] + darkestColor = "#d35050" + darkColor = "#212121" + lightColor = "#f5e3e0" + lightestColor = "#f5f5f5" + primaryColor = "#ffffff" +``` + +If you want the above theme colors, you can see the [exampleSite/config.toml](/exampleSite/config.toml) file. + +### Styling + +To override styles using scss, add a file called `_extra.scss` to `[path]/assets/css/` + +**Note:** Hugo releases come in two versions, `hugo` and `hugo_extended`. You need `hugo_extended` to automatically compile your scss. + +## License + +This theme is released under the [**MIT**](/LICENSE.md) License. + +## Acknowledgements + +- [feather](https://feathericons.com/) - [MIT](https://github.com/feathericons/feather/blob/master/LICENSE) diff --git a/themes/m10c/assets/css/_base.scss b/themes/m10c/assets/css/_base.scss new file mode 100644 index 0000000..d0a3f3f --- /dev/null +++ b/themes/m10c/assets/css/_base.scss @@ -0,0 +1,59 @@ +* { + box-sizing: border-box; +} + +html { + line-height: 1.6; +} + +body { + margin: 0; + font-family: sans-serif; + background: $dark-color; + color: $light-color; +} + +h1, h2, h3, h4, h5, h6 { + color: $lightest-color; +} + +a { + color: $primary-color; + transition: color 0.35s; + text-decoration: none; + + &:hover { + color: $lightest-color; + } +} + +// Browsers seem to use a smaller default font-size with monospaced code +// blocks (like 80% of the size of normal text) and that looks pretty bad with +// small inline code-blocks in the middle of normal text (mainly because of +// the very noticeable difference in x-height). This CSS corrects that problem. +code { + font-family: monospace,monospace; + font-size: 1em; + color: rgba($light-color, .8); +} + +pre { + font-size: 1rem; + line-height: 1.2em; + margin: 0; + overflow: auto; + + // A larger monospaced block of text (that isn't mixed with normal text) + // generally looks heavier than normal text with the same font size. For this + // reason using a smaller monospaced font size makes sense in this situation. + code { + font-size: .8em; + } +} + +::selection { + background: rgba($light-color, .25); +} +::-moz-selection { + background: rgba($light-color, .25); +} diff --git a/themes/m10c/assets/css/_extra.scss b/themes/m10c/assets/css/_extra.scss new file mode 100644 index 0000000..8eaa4d4 --- /dev/null +++ b/themes/m10c/assets/css/_extra.scss @@ -0,0 +1,2 @@ +// Do not add any CSS to this file in the theme sources. +// This file can be overridden to add project-specific CSS. diff --git a/themes/m10c/assets/css/components/_app.scss b/themes/m10c/assets/css/components/_app.scss new file mode 100644 index 0000000..643f3ce --- /dev/null +++ b/themes/m10c/assets/css/components/_app.scss @@ -0,0 +1,40 @@ +.app-header { + padding: 2.5em; + background: $darkest-color; + text-align: center; +} + +.app-header-avatar { + width: 15rem; + height: 15rem; + border-radius: 100%; + border: 0.5rem solid $primary-color; +} + +.app-container { + padding: 2.5rem; +} + +.app-header-social { + font-size: 2em; + color: $lightest-color; + + a { + margin: 0 0.1em; + } +} + +@media (min-width: 940px) { + .app-header { + position: fixed; + top: 0; + left: 0; + width: 20rem; + min-height: 100vh; + } + + .app-container { + max-width: 65rem; + margin-left: 20rem; + } +} diff --git a/themes/m10c/assets/css/components/_error_404.scss b/themes/m10c/assets/css/components/_error_404.scss new file mode 100644 index 0000000..c819570 --- /dev/null +++ b/themes/m10c/assets/css/components/_error_404.scss @@ -0,0 +1,7 @@ +.error-404 { + text-align: center; +} + +.error-404-title { + text-transform: uppercase; +} diff --git a/themes/m10c/assets/css/components/_icon.scss b/themes/m10c/assets/css/components/_icon.scss new file mode 100644 index 0000000..1af7c1b --- /dev/null +++ b/themes/m10c/assets/css/components/_icon.scss @@ -0,0 +1,6 @@ +.icon { + display: inline-block; + width: 1em; + height: 1em; + vertical-align: -0.125em; +} diff --git a/themes/m10c/assets/css/components/_pagination.scss b/themes/m10c/assets/css/components/_pagination.scss new file mode 100644 index 0000000..cc0d8a1 --- /dev/null +++ b/themes/m10c/assets/css/components/_pagination.scss @@ -0,0 +1,24 @@ +.pagination { + display: block; + list-style: none; + padding: 0; + font-size: 0.8em; + text-align: center; + margin: 3em 0; +} + +.page-item { + display: inline-block; + .page-link { + display: block; + padding: 0.285em 0.8em; + } + + &.active { + .page-link { + color: $lightest-color; + border-radius: 2em; + background: $primary-color; + } + } +} diff --git a/themes/m10c/assets/css/components/_post.scss b/themes/m10c/assets/css/components/_post.scss new file mode 100644 index 0000000..afecccd --- /dev/null +++ b/themes/m10c/assets/css/components/_post.scss @@ -0,0 +1,25 @@ +.post-title { + color: $lightest-color; +} + +.post-content { + & > pre, + .highlight { + margin: 1em 0; + } + + & > pre, + .highlight > pre, + .highlight > div { + border-left: 0.4em solid rgba($primary-color, .8); + padding: .5em 1em; + } + + img { + max-width: 100%; + } +} + +.post-meta { + font-size: 0.8em; +} diff --git a/themes/m10c/assets/css/components/_posts_list.scss b/themes/m10c/assets/css/components/_posts_list.scss new file mode 100644 index 0000000..fd9eea7 --- /dev/null +++ b/themes/m10c/assets/css/components/_posts_list.scss @@ -0,0 +1,17 @@ +.posts-list { + padding: 0; +} + +.posts-list-item { + list-style: none; + padding: 0.4em 0; + + &:not(:last-child) { + border-bottom: 1px dashed rgba(255, 255, 255, 0.3); + } +} + +.posts-list-item-description { + display: block; + font-size: 0.8em; +} diff --git a/themes/m10c/assets/css/components/_tag.scss b/themes/m10c/assets/css/components/_tag.scss new file mode 100644 index 0000000..8bf628a --- /dev/null +++ b/themes/m10c/assets/css/components/_tag.scss @@ -0,0 +1,15 @@ +.tag { + display: inline-block; + margin-right: 0.2em; + padding: 0 0.6em; + font-size: 0.9em; + border-radius: 0.2em; + white-space: nowrap; + background: rgba(255, 255, 255, 0.1); + transition: color 0.35s, background 0.35s; + + &:hover { + transition: color 0.25s, background 0.05s; + background: rgba(255, 255, 255, 0.3); + } +} diff --git a/themes/m10c/assets/css/components/_tags_list.scss b/themes/m10c/assets/css/components/_tags_list.scss new file mode 100644 index 0000000..0b8b331 --- /dev/null +++ b/themes/m10c/assets/css/components/_tags_list.scss @@ -0,0 +1,28 @@ +.tags-list { + padding: 0; +} + +.tags-list-item { + list-style: none; + padding: 0.4em 0; + &:not(:last-child) { + border-bottom: 1px dashed rgba(255, 255, 255, 0.3); + } +} + +@media (min-width: 450px) { + .tags-list { + display: flex; + flex-wrap: wrap; + } + + .tags-list-item { + width: calc(50% - 1em); + &:nth-child(even) { + margin-left: 1em; + } + &:nth-last-child(2) { + border: none; + } + } +} diff --git a/themes/m10c/assets/css/main.scss b/themes/m10c/assets/css/main.scss new file mode 100644 index 0000000..502fdee --- /dev/null +++ b/themes/m10c/assets/css/main.scss @@ -0,0 +1,20 @@ +$darkest-color: {{ .Site.Params.style.darkestColor | default "#242930" }}; +$dark-color: {{ .Site.Params.style.darkColor | default "#353b43" }}; +$light-color: {{ .Site.Params.style.lightColor | default "#afbac4" }}; +$lightest-color: {{ .Site.Params.style.lightestColor | default "#ffffff" }}; +$primary-color: {{ .Site.Params.style.primaryColor | default "#57cc8a" }}; + +@import 'base'; + +@import 'components/app'; +@import 'components/error_404'; +@import 'components/icon'; +@import 'components/pagination'; +@import 'components/post'; +@import 'components/posts_list'; +@import 'components/tag'; +@import 'components/tags_list'; + +// The last 'extra' import can optionally be overridden on a per project +// basis by creating a /assets/css/_extra.scss file. +@import 'extra'; diff --git a/themes/m10c/data/m10c/icons.json b/themes/m10c/data/m10c/icons.json new file mode 100644 index 0000000..b806f64 --- /dev/null +++ b/themes/m10c/data/m10c/icons.json @@ -0,0 +1 @@ +{"activity":"","airplay":"","alert-circle":"","alert-octagon":"","alert-triangle":"","align-center":"","align-justify":"","align-left":"","align-right":"","anchor":"","aperture":"","archive":"","arrow-down-circle":"","arrow-down-left":"","arrow-down-right":"","arrow-down":"","arrow-left-circle":"","arrow-left":"","arrow-right-circle":"","arrow-right":"","arrow-up-circle":"","arrow-up-left":"","arrow-up-right":"","arrow-up":"","at-sign":"","award":"","bar-chart-2":"","bar-chart":"","battery-charging":"","battery":"","bell-off":"","bell":"","bluetooth":"","bold":"","book-open":"","book":"","bookmark":"","box":"","briefcase":"","calendar":"","camera-off":"","camera":"","cast":"","check-circle":"","check-square":"","check":"","chevron-down":"","chevron-left":"","chevron-right":"","chevron-up":"","chevrons-down":"","chevrons-left":"","chevrons-right":"","chevrons-up":"","chrome":"","circle":"","clipboard":"","clock":"","cloud-drizzle":"","cloud-lightning":"","cloud-off":"","cloud-rain":"","cloud-snow":"","cloud":"","code":"","codepen":"","codesandbox":"","coffee":"","columns":"","command":"","compass":"","copy":"","corner-down-left":"","corner-down-right":"","corner-left-down":"","corner-left-up":"","corner-right-down":"","corner-right-up":"","corner-up-left":"","corner-up-right":"","cpu":"","credit-card":"","crop":"","crosshair":"","database":"","delete":"","disc":"","divide-circle":"","divide-square":"","divide":"","dollar-sign":"","download-cloud":"","download":"","dribbble":"","droplet":"","edit-2":"","edit-3":"","edit":"","external-link":"","eye-off":"","eye":"","facebook":"","fast-forward":"","feather":"","figma":"","file-minus":"","file-plus":"","file-text":"","file":"","film":"","filter":"","flag":"","folder-minus":"","folder-plus":"","folder":"","framer":"","frown":"","gift":"","git-branch":"","git-commit":"","git-merge":"","git-pull-request":"","github":"","gitlab":"","globe":"","grid":"","hard-drive":"","hash":"","headphones":"","heart":"","help-circle":"","hexagon":"","home":"","image":"","inbox":"","info":"","instagram":"","italic":"","key":"","layers":"","layout":"","life-buoy":"","link-2":"","link":"","linkedin":"","list":"","loader":"","lock":"","log-in":"","log-out":"","mail":"","map-pin":"","map":"","maximize-2":"","maximize":"","meh":"","menu":"","message-circle":"","message-square":"","mic-off":"","mic":"","minimize-2":"","minimize":"","minus-circle":"","minus-square":"","minus":"","monitor":"","moon":"","more-horizontal":"","more-vertical":"","mouse-pointer":"","move":"","music":"","navigation-2":"","navigation":"","octagon":"","package":"","paperclip":"","pause-circle":"","pause":"","pen-tool":"","percent":"","phone-call":"","phone-forwarded":"","phone-incoming":"","phone-missed":"","phone-off":"","phone-outgoing":"","phone":"","pie-chart":"","play-circle":"","play":"","plus-circle":"","plus-square":"","plus":"","pocket":"","power":"","printer":"","radio":"","refresh-ccw":"","refresh-cw":"","repeat":"","rewind":"","rotate-ccw":"","rotate-cw":"","rss":"","save":"","scissors":"","search":"","send":"","server":"","settings":"","share-2":"","share":"","shield-off":"","shield":"","shopping-bag":"","shopping-cart":"","shuffle":"","sidebar":"","skip-back":"","skip-forward":"","slack":"","slash":"","sliders":"","smartphone":"","smile":"","speaker":"","square":"","star":"","stop-circle":"","sun":"","sunrise":"","sunset":"","tablet":"","tag":"","target":"","terminal":"","thermometer":"","thumbs-down":"","thumbs-up":"","toggle-left":"","toggle-right":"","tool":"","trash-2":"","trash":"","trello":"","trending-down":"","trending-up":"","triangle":"","truck":"","tv":"","twitch":"","twitter":"","type":"","umbrella":"","underline":"","unlock":"","upload-cloud":"","upload":"","user-check":"","user-minus":"","user-plus":"","user-x":"","user":"","users":"","video-off":"","video":"","voicemail":"","volume-1":"","volume-2":"","volume-x":"","volume":"","watch":"","wifi-off":"","wifi":"","wind":"","x-circle":"","x-octagon":"","x-square":"","x":"","youtube":"","zap-off":"","zap":"","zoom-in":"","zoom-out":""} \ No newline at end of file diff --git a/themes/m10c/exampleSite/config.toml b/themes/m10c/exampleSite/config.toml new file mode 100644 index 0000000..99b2039 --- /dev/null +++ b/themes/m10c/exampleSite/config.toml @@ -0,0 +1,59 @@ +baseURL = "https://example.com" +title = "Your title" +themesDir = "../.." +theme = "m10c" +paginate = 8 + +[menu] + [[menu.main]] + identifier = "home" + name = "Home" + url = "/" + weight = 1 + [[menu.main]] + identifier = "tags" + name = "Tags" + url = "/tags/" + weight = 2 + [[menu.main]] + identifier = "about" + name = "About" + url = "/about/" + weight = 3 + +[params] + author = "John Doe" + description = "Lorem ipsum dolor sit amet, consectetur adipiscing elit." + menu_item_separator = " - " + [[params.social]] + icon = "github" + name = "Github" + url = "https://github.com/gohugoio" + [[params.social]] + icon = "twitter" + name = "Twitter" + url = "https://twitter.com/gohugoio" + + # Default theme + #[params.style] + # darkestColor = "#242930" + # darkColor = "#353b43" + # lightColor = "#afbac4" + # lightestColor = "#ffffff" + # primaryColor = "#57cc8a" + + # Green theme + #[params.style] + # darkestColor = "#315659" + # darkColor = "#253031" + # lightColor = "#96a879" + # lightestColor = "#fff" + # primaryColor = "#dad865" + + # Red theme + #[params.style] + # darkestColor = "#d35050" + # darkColor = "#212121" + # lightColor = "#d6d6d6" + # lightestColor = "#d3d3d3" + # primaryColor = "#ffffff" diff --git a/themes/m10c/exampleSite/content/about.md b/themes/m10c/exampleSite/content/about.md new file mode 100644 index 0000000..a55bd30 --- /dev/null +++ b/themes/m10c/exampleSite/content/about.md @@ -0,0 +1,9 @@ ++++ +title = "About" ++++ + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent lacinia lorem quis sodales auctor. Donec bibendum odio leo, bibendum iaculis lectus dapibus sit amet. Etiam ut euismod lectus, vel finibus metus. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer quis vestibulum justo. Duis scelerisque ullamcorper sem, eget congue lorem ultrices mattis. Nam ut mollis tellus, id facilisis turpis. Duis ac egestas mi, a mattis dolor. Curabitur vestibulum est nec tortor hendrerit, vehicula malesuada quam tempor. Duis ornare tortor dapibus, scelerisque est lacinia, aliquet mi. Vivamus convallis malesuada augue ac viverra. Sed molestie erat at sem dapibus porttitor. Vestibulum lacinia, enim id feugiat varius, felis erat sollicitudin nisl, sit amet semper nisi nunc in nisl. Sed dapibus ullamcorper nulla, et molestie lacus accumsan ac. + +Fusce auctor in justo nec porta. Aliquam vitae molestie libero. In scelerisque dolor ac est lacinia, at consectetur neque vulputate. Curabitur ornare lorem vitae euismod vestibulum. Sed non arcu nunc. Suspendisse potenti. Maecenas tristique, dui egestas mattis pulvinar, tortor ligula mollis libero, ac ullamcorper erat nibh in augue. Curabitur nunc diam, pretium at porta et, volutpat sit amet ligula. Proin urna lorem, luctus sit amet metus quis, tempus rutrum augue. Phasellus ut nunc dolor. + +Duis a porta mi, non viverra erat. Nam tincidunt lorem nec sollicitudin laoreet. Mauris faucibus vitae urna ac aliquet. Vivamus rutrum rhoncus tempor. Donec massa diam, molestie sit amet nulla eu, venenatis egestas urna. Vivamus hendrerit elit velit, ut volutpat diam condimentum vel. Etiam ultricies, nulla tincidunt rhoncus placerat, velit nisl gravida velit, mollis vestibulum risus mauris sed lectus. diff --git a/themes/m10c/exampleSite/content/posts/creating-a-new-theme.md b/themes/m10c/exampleSite/content/posts/creating-a-new-theme.md new file mode 100644 index 0000000..e78f6b8 --- /dev/null +++ b/themes/m10c/exampleSite/content/posts/creating-a-new-theme.md @@ -0,0 +1,1142 @@ ++++ +title = "Creating a New Theme" +tags = ["hugo", "themes"] +date = "2014-09-28" ++++ + +## Introduction + +This tutorial will show you how to create a simple theme in Hugo. I assume that you are familiar with HTML, the bash command line, and that you are comfortable using Markdown to format content. I'll explain how Hugo uses templates and how you can organize your templates to create a theme. I won't cover using CSS to style your theme. + +We'll start with creating a new site with a very basic template. Then we'll add in a few pages and posts. With small variations on that, you will be able to create many different types of web sites. + +In this tutorial, commands that you enter will start with the "$" prompt. The output will follow. Lines that start with "#" are comments that I've added to explain a point. When I show updates to a file, the ":wq" on the last line means to save the file. + +Here's an example: + +``` +## this is a comment +$ echo this is a command +this is a command + +## edit the file +$ vi foo.md ++++ +date = "2014-09-28" +title = "creating a new theme" ++++ + +bah and humbug +:wq + +## show it +$ cat foo.md ++++ +date = "2014-09-28" +title = "creating a new theme" ++++ + +bah and humbug +$ +``` + + +## Some Definitions + +There are a few concepts that you need to understand before creating a theme. + +### Skins + +Skins are the files responsible for the look and feel of your site. It’s the CSS that controls colors and fonts, it’s the Javascript that determines actions and reactions. It’s also the rules that Hugo uses to transform your content into the HTML that the site will serve to visitors. + +You have two ways to create a skin. The simplest way is to create it in the ```layouts/``` directory. If you do, then you don’t have to worry about configuring Hugo to recognize it. The first place that Hugo will look for rules and files is in the ```layouts/``` directory so it will always find the skin. + +Your second choice is to create it in a sub-directory of the ```themes/``` directory. If you do, then you must always tell Hugo where to search for the skin. It’s extra work, though, so why bother with it? + +The difference between creating a skin in ```layouts/``` and creating it in ```themes/``` is very subtle. A skin in ```layouts/``` can’t be customized without updating the templates and static files that it is built from. A skin created in ```themes/```, on the other hand, can be and that makes it easier for other people to use it. + +The rest of this tutorial will call a skin created in the ```themes/``` directory a theme. + +Note that you can use this tutorial to create a skin in the ```layouts/``` directory if you wish to. The main difference will be that you won’t need to update the site’s configuration file to use a theme. + +### The Home Page + +The home page, or landing page, is the first page that many visitors to a site see. It is the index.html file in the root directory of the web site. Since Hugo writes files to the public/ directory, our home page is public/index.html. + +### Site Configuration File + +When Hugo runs, it looks for a configuration file that contains settings that override default values for the entire site. The file can use TOML, YAML, or JSON. I prefer to use TOML for my configuration files. If you prefer to use JSON or YAML, you’ll need to translate my examples. You’ll also need to change the name of the file since Hugo uses the extension to determine how to process it. + +Hugo translates Markdown files into HTML. By default, Hugo expects to find Markdown files in your ```content/``` directory and template files in your ```themes/``` directory. It will create HTML files in your ```public/``` directory. You can change this by specifying alternate locations in the configuration file. + +### Content + +Content is stored in text files that contain two sections. The first section is the “front matter,” which is the meta-information on the content. The second section contains Markdown that will be converted to HTML. + +#### Front Matter + +The front matter is information about the content. Like the configuration file, it can be written in TOML, YAML, or JSON. Unlike the configuration file, Hugo doesn’t use the file’s extension to know the format. It looks for markers to signal the type. TOML is surrounded by “`+++`”, YAML by “`---`”, and JSON is enclosed in curly braces. I prefer to use TOML, so you’ll need to translate my examples if you prefer YAML or JSON. + +The information in the front matter is passed into the template before the content is rendered into HTML. + +#### Markdown + +Content is written in Markdown which makes it easier to create the content. Hugo runs the content through a Markdown engine to create the HTML which will be written to the output file. + +### Template Files + +Hugo uses template files to render content into HTML. Template files are a bridge between the content and presentation. Rules in the template define what content is published, where it's published to, and how it will rendered to the HTML file. The template guides the presentation by specifying the style to use. + +There are three types of templates: single, list, and partial. Each type takes a bit of content as input and transforms it based on the commands in the template. + +Hugo uses its knowledge of the content to find the template file used to render the content. If it can’t find a template that is an exact match for the content, it will shift up a level and search from there. It will continue to do so until it finds a matching template or runs out of templates to try. If it can’t find a template, it will use the default template for the site. + +Please note that you can use the front matter to influence Hugo’s choice of templates. + +#### Single Template + +A single template is used to render a single piece of content. For example, an article or post would be a single piece of content and use a single template. + +#### List Template + +A list template renders a group of related content. That could be a summary of recent postings or all articles in a category. List templates can contain multiple groups. + +The homepage template is a special type of list template. Hugo assumes that the home page of your site will act as the portal for the rest of the content in the site. + +#### Partial Template + +A partial template is a template that can be included in other templates. Partial templates must be called using the “partial” template command. They are very handy for rolling up common behavior. For example, your site may have a banner that all pages use. Instead of copying the text of the banner into every single and list template, you could create a partial with the banner in it. That way if you decide to change the banner, you only have to change the partial template. + +## Create a New Site + +Let's use Hugo to create a new web site. I'm a Mac user, so I'll create mine in my home directory, in the Sites folder. If you're using Linux, you might have to create the folder first. + +The "new site" command will create a skeleton of a site. It will give you the basic directory structure and a useable configuration file. + +``` +$ hugo new site ~/Sites/zafta +$ cd ~/Sites/zafta +$ ls -l +total 8 +drwxr-xr-x 7 quoha staff 238 Sep 29 16:49 . +drwxr-xr-x 3 quoha staff 102 Sep 29 16:49 .. +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 archetypes +-rw-r--r-- 1 quoha staff 82 Sep 29 16:49 config.toml +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 content +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 layouts +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 static +$ +``` + +Take a look in the content/ directory to confirm that it is empty. + +The other directories (archetypes/, layouts/, and static/) are used when customizing a theme. That's a topic for a different tutorial, so please ignore them for now. + +### Generate the HTML For the New Site + +Running the `hugo` command with no options will read all the available content and generate the HTML files. It will also copy all static files (that's everything that's not content). Since we have an empty site, it won't do much, but it will do it very quickly. + +``` +$ hugo --verbose +INFO: 2014/09/29 Using config file: config.toml +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/ +WARN: 2014/09/29 Unable to locate layout: [index.html _default/list.html _default/single.html] +WARN: 2014/09/29 Unable to locate layout: [404.html] +0 draft content +0 future content +0 pages created +0 tags created +0 categories created +in 2 ms +$ +``` + +The "`--verbose`" flag gives extra information that will be helpful when we build the template. Every line of the output that starts with "INFO:" or "WARN:" is present because we used that flag. The lines that start with "WARN:" are warning messages. We'll go over them later. + +We can verify that the command worked by looking at the directory again. + +``` +$ ls -l +total 8 +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 archetypes +-rw-r--r-- 1 quoha staff 82 Sep 29 16:49 config.toml +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 content +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 layouts +drwxr-xr-x 4 quoha staff 136 Sep 29 17:02 public +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 static +$ +``` + +See that new public/ directory? Hugo placed all generated content there. When you're ready to publish your web site, that's the place to start. For now, though, let's just confirm that we have what we'd expect from a site with no content. + +``` +$ ls -l public +total 16 +-rw-r--r-- 1 quoha staff 416 Sep 29 17:02 index.xml +-rw-r--r-- 1 quoha staff 262 Sep 29 17:02 sitemap.xml +$ +``` + +Hugo created two XML files, which is standard, but there are no HTML files. + + + +### Test the New Site + +Verify that you can run the built-in web server. It will dramatically shorten your development cycle if you do. Start it by running the "server" command. If it is successful, you will see output similar to the following: + +``` +$ hugo server --verbose +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/ +WARN: 2014/09/29 Unable to locate layout: [index.html _default/list.html _default/single.html] +WARN: 2014/09/29 Unable to locate layout: [404.html] +0 draft content +0 future content +0 pages created +0 tags created +0 categories created +in 2 ms +Serving pages from /Users/quoha/Sites/zafta/public +Web Server is available at http://localhost:1313 +Press Ctrl+C to stop +``` + +Connect to the listed URL (it's on the line that starts with "Web Server"). If everything is working correctly, you should get a page that shows the following: + +``` +index.xml +sitemap.xml +``` + +That's a listing of your public/ directory. Hugo didn't create a home page because our site has no content. When there's no index.html file in a directory, the server lists the files in the directory, which is what you should see in your browser. + +Let’s go back and look at those warnings again. + +``` +WARN: 2014/09/29 Unable to locate layout: [index.html _default/list.html _default/single.html] +WARN: 2014/09/29 Unable to locate layout: [404.html] +``` + +That second warning is easier to explain. We haven’t created a template to be used to generate “page not found errors.” The 404 message is a topic for a separate tutorial. + +Now for the first warning. It is for the home page. You can tell because the first layout that it looked for was “index.html.” That’s only used by the home page. + +I like that the verbose flag causes Hugo to list the files that it's searching for. For the home page, they are index.html, _default/list.html, and _default/single.html. There are some rules that we'll cover later that explain the names and paths. For now, just remember that Hugo couldn't find a template for the home page and it told you so. + +At this point, you've got a working installation and site that we can build upon. All that’s left is to add some content and a theme to display it. + +## Create a New Theme + +Hugo doesn't ship with a default theme. There are a few available (I counted a dozen when I first installed Hugo) and Hugo comes with a command to create new themes. + +We're going to create a new theme called "zafta." Since the goal of this tutorial is to show you how to fill out the files to pull in your content, the theme will not contain any CSS. In other words, ugly but functional. + +All themes have opinions on content and layout. For example, Zafta uses "post" over "blog". Strong opinions make for simpler templates but differing opinions make it tougher to use themes. When you build a theme, consider using the terms that other themes do. + + +### Create a Skeleton + +Use the hugo "new" command to create the skeleton of a theme. This creates the directory structure and places empty files for you to fill out. + +``` +$ hugo new theme zafta + +$ ls -l +total 8 +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 archetypes +-rw-r--r-- 1 quoha staff 82 Sep 29 16:49 config.toml +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 content +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 layouts +drwxr-xr-x 4 quoha staff 136 Sep 29 17:02 public +drwxr-xr-x 2 quoha staff 68 Sep 29 16:49 static +drwxr-xr-x 3 quoha staff 102 Sep 29 17:31 themes + +$ find themes -type f | xargs ls -l +-rw-r--r-- 1 quoha staff 1081 Sep 29 17:31 themes/zafta/LICENSE.md +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/archetypes/default.md +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/_default/list.html +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/_default/single.html +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/partials/footer.html +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/partials/header.html +-rw-r--r-- 1 quoha staff 93 Sep 29 17:31 themes/zafta/theme.toml +$ +``` + +The skeleton includes templates (the files ending in .html), license file, a description of your theme (the theme.toml file), and an empty archetype. + +Please take a minute to fill out the theme.toml and LICENSE.md files. They're optional, but if you're going to be distributing your theme, it tells the world who to praise (or blame). It's also nice to declare the license so that people will know how they can use the theme. + +``` +$ vi themes/zafta/theme.toml +author = "michael d henderson" +description = "a minimal working template" +license = "MIT" +name = "zafta" +source_repo = "" +tags = ["tags", "categories"] +:wq + +## also edit themes/zafta/LICENSE.md and change +## the bit that says "YOUR_NAME_HERE" +``` + +Note that the the skeleton's template files are empty. Don't worry, we'll be changing that shortly. + +``` +$ find themes/zafta -name '*.html' | xargs ls -l +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/_default/list.html +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/_default/single.html +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/partials/footer.html +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/partials/header.html +$ +``` + + + +### Update the Configuration File to Use the Theme + +Now that we've got a theme to work with, it's a good idea to add the theme name to the configuration file. This is optional, because you can always add "-t zafta" on all your commands. I like to put it the configuration file because I like shorter command lines. If you don't put it in the configuration file or specify it on the command line, you won't use the template that you're expecting to. + +Edit the file to add the theme, add a title for the site, and specify that all of our content will use the TOML format. + +``` +$ vi config.toml +theme = "zafta" +baseurl = "" +languageCode = "en-us" +title = "zafta - totally refreshing" +MetaDataFormat = "toml" +:wq + +$ +``` + +### Generate the Site + +Now that we have an empty theme, let's generate the site again. + +``` +$ hugo --verbose +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/ +WARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html] +0 draft content +0 future content +0 pages created +0 tags created +0 categories created +in 2 ms +$ +``` + +Did you notice that the output is different? The warning message for the home page has disappeared and we have an additional information line saying that Hugo is syncing from the theme's directory. + +Let's check the public/ directory to see what Hugo's created. + +``` +$ ls -l public +total 16 +drwxr-xr-x 2 quoha staff 68 Sep 29 17:56 css +-rw-r--r-- 1 quoha staff 0 Sep 29 17:56 index.html +-rw-r--r-- 1 quoha staff 407 Sep 29 17:56 index.xml +drwxr-xr-x 2 quoha staff 68 Sep 29 17:56 js +-rw-r--r-- 1 quoha staff 243 Sep 29 17:56 sitemap.xml +$ +``` + +Notice four things: + +1. Hugo created a home page. This is the file public/index.html. +2. Hugo created a css/ directory. +3. Hugo created a js/ directory. +4. Hugo claimed that it created 0 pages. It created a file and copied over static files, but didn't create any pages. That's because it considers a "page" to be a file created directly from a content file. It doesn't count things like the index.html files that it creates automatically. + +#### The Home Page + +Hugo supports many different types of templates. The home page is special because it gets its own type of template and its own template file. The file, layouts/index.html, is used to generate the HTML for the home page. The Hugo documentation says that this is the only required template, but that depends. Hugo's warning message shows that it looks for three different templates: + +``` +WARN: 2014/09/29 Unable to locate layout: [index.html _default/list.html _default/single.html] +``` + +If it can't find any of these, it completely skips creating the home page. We noticed that when we built the site without having a theme installed. + +When Hugo created our theme, it created an empty home page template. Now, when we build the site, Hugo finds the template and uses it to generate the HTML for the home page. Since the template file is empty, the HTML file is empty, too. If the template had any rules in it, then Hugo would have used them to generate the home page. + +``` +$ find . -name index.html | xargs ls -l +-rw-r--r-- 1 quoha staff 0 Sep 29 20:21 ./public/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 ./themes/zafta/layouts/index.html +$ +``` + +#### The Magic of Static + +Hugo does two things when generating the site. It uses templates to transform content into HTML and it copies static files into the site. Unlike content, static files are not transformed. They are copied exactly as they are. + +Hugo assumes that your site will use both CSS and JavaScript, so it creates directories in your theme to hold them. Remember opinions? Well, Hugo's opinion is that you'll store your CSS in a directory named css/ and your JavaScript in a directory named js/. If you don't like that, you can change the directory names in your theme directory or even delete them completely. Hugo's nice enough to offer its opinion, then behave nicely if you disagree. + +``` +$ find themes/zafta -type d | xargs ls -ld +drwxr-xr-x 7 quoha staff 238 Sep 29 17:38 themes/zafta +drwxr-xr-x 3 quoha staff 102 Sep 29 17:31 themes/zafta/archetypes +drwxr-xr-x 5 quoha staff 170 Sep 29 17:31 themes/zafta/layouts +drwxr-xr-x 4 quoha staff 136 Sep 29 17:31 themes/zafta/layouts/_default +drwxr-xr-x 4 quoha staff 136 Sep 29 17:31 themes/zafta/layouts/partials +drwxr-xr-x 4 quoha staff 136 Sep 29 17:31 themes/zafta/static +drwxr-xr-x 2 quoha staff 68 Sep 29 17:31 themes/zafta/static/css +drwxr-xr-x 2 quoha staff 68 Sep 29 17:31 themes/zafta/static/js +$ +``` + +## The Theme Development Cycle + +When you're working on a theme, you will make changes in the theme's directory, rebuild the site, and check your changes in the browser. Hugo makes this very easy: + +1. Purge the public/ directory. +2. Run the built in web server in watch mode. +3. Open your site in a browser. +4. Update the theme. +5. Glance at your browser window to see changes. +6. Return to step 4. + +I’ll throw in one more opinion: never work on a theme on a live site. Always work on a copy of your site. Make changes to your theme, test them, then copy them up to your site. For added safety, use a tool like Git to keep a revision history of your content and your theme. Believe me when I say that it is too easy to lose both your mind and your changes. + +Check the main Hugo site for information on using Git with Hugo. + +### Purge the public/ Directory + +When generating the site, Hugo will create new files and update existing ones in the ```public/``` directory. It will not delete files that are no longer used. For example, files that were created in the wrong directory or with the wrong title will remain. If you leave them, you might get confused by them later. I recommend cleaning out your site prior to generating it. + +Note: If you're building on an SSD, you should ignore this. Churning on a SSD can be costly. + +### Hugo's Watch Option + +Hugo's "`--watch`" option will monitor the content/ and your theme directories for changes and rebuild the site automatically. + +### Live Reload + +Hugo's built in web server supports live reload. As pages are saved on the server, the browser is told to refresh the page. Usually, this happens faster than you can say, "Wow, that's totally amazing." + +### Development Commands + +Use the following commands as the basis for your workflow. + +``` +## purge old files. hugo will recreate the public directory. +## +$ rm -rf public +## +## run hugo in watch mode +## +$ hugo server --watch --verbose +``` + +Here's sample output showing Hugo detecting a change to the template for the home page. Once generated, the web browser automatically reloaded the page. I've said this before, it's amazing. + + +``` +$ rm -rf public +$ hugo server --watch --verbose +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/ +WARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html] +0 draft content +0 future content +0 pages created +0 tags created +0 categories created +in 2 ms +Watching for changes in /Users/quoha/Sites/zafta/content +Serving pages from /Users/quoha/Sites/zafta/public +Web Server is available at http://localhost:1313 +Press Ctrl+C to stop +INFO: 2014/09/29 File System Event: ["/Users/quoha/Sites/zafta/themes/zafta/layouts/index.html": MODIFY|ATTRIB] +Change detected, rebuilding site + +WARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html] +0 draft content +0 future content +0 pages created +0 tags created +0 categories created +in 1 ms +``` + +## Update the Home Page Template + +The home page is one of a few special pages that Hugo creates automatically. As mentioned earlier, it looks for one of three files in the theme's layout/ directory: + +1. index.html +2. _default/list.html +3. _default/single.html + +We could update one of the default templates, but a good design decision is to update the most specific template available. That's not a hard and fast rule (in fact, we'll break it a few times in this tutorial), but it is a good generalization. + +### Make a Static Home Page + +Right now, that page is empty because we don't have any content and we don't have any logic in the template. Let's change that by adding some text to the template. + +``` +$ vi themes/zafta/layouts/index.html + + + +

hugo says hello!

+ + +:wq + +$ +``` + +Build the web site and then verify the results. + +``` +$ hugo --verbose +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/ +WARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html] +0 draft content +0 future content +0 pages created +0 tags created +0 categories created +in 2 ms + +$ find public -type f -name '*.html' | xargs ls -l +-rw-r--r-- 1 quoha staff 78 Sep 29 21:26 public/index.html + +$ cat public/index.html + + + +

hugo says hello!

+ +``` + +#### Live Reload + +Note: If you're running the server with the `--watch` option, you'll see different content in the file: + +``` +$ cat public/index.html + + + +

hugo says hello!

+ + +``` + +When you use `--watch`, the Live Reload script is added by Hugo. Look for live reload in the documentation to see what it does and how to disable it. + +### Build a "Dynamic" Home Page + +"Dynamic home page?" Hugo's a static web site generator, so this seems an odd thing to say. I mean let's have the home page automatically reflect the content in the site every time Hugo builds it. We'll use iteration in the template to do that. + +#### Create New Posts + +Now that we have the home page generating static content, let's add some content to the site. We'll display these posts as a list on the home page and on their own page, too. + +Hugo has a command to generate a skeleton post, just like it does for sites and themes. + +``` +$ hugo --verbose new post/first.md +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 attempting to create post/first.md of post +INFO: 2014/09/29 curpath: /Users/quoha/Sites/zafta/themes/zafta/archetypes/default.md +ERROR: 2014/09/29 Unable to Cast to map[string]interface{} + +$ +``` + +That wasn't very nice, was it? + +The "new" command uses an archetype to create the post file. Hugo created an empty default archetype file, but that causes an error when there's a theme. For me, the workaround was to create an archetypes file specifically for the post type. + +``` +$ vi themes/zafta/archetypes/post.md ++++ +Description = "" +Tags = [] +Categories = [] ++++ +:wq + +$ find themes/zafta/archetypes -type f | xargs ls -l +-rw-r--r-- 1 quoha staff 0 Sep 29 21:53 themes/zafta/archetypes/default.md +-rw-r--r-- 1 quoha staff 51 Sep 29 21:54 themes/zafta/archetypes/post.md + +$ hugo --verbose new post/first.md +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 attempting to create post/first.md of post +INFO: 2014/09/29 curpath: /Users/quoha/Sites/zafta/themes/zafta/archetypes/post.md +INFO: 2014/09/29 creating /Users/quoha/Sites/zafta/content/post/first.md +/Users/quoha/Sites/zafta/content/post/first.md created + +$ hugo --verbose new post/second.md +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 attempting to create post/second.md of post +INFO: 2014/09/29 curpath: /Users/quoha/Sites/zafta/themes/zafta/archetypes/post.md +INFO: 2014/09/29 creating /Users/quoha/Sites/zafta/content/post/second.md +/Users/quoha/Sites/zafta/content/post/second.md created + +$ ls -l content/post +total 16 +-rw-r--r-- 1 quoha staff 104 Sep 29 21:54 first.md +-rw-r--r-- 1 quoha staff 105 Sep 29 21:57 second.md + +$ cat content/post/first.md ++++ +Categories = [] +Description = "" +Tags = [] +date = "2014-09-29T21:54:53-05:00" +title = "first" + ++++ +my first post + +$ cat content/post/second.md ++++ +Categories = [] +Description = "" +Tags = [] +date = "2014-09-29T21:57:09-05:00" +title = "second" + ++++ +my second post + +$ +``` + +Build the web site and then verify the results. + +``` +$ rm -rf public +$ hugo --verbose +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 found taxonomies: map[string]string{"category":"categories", "tag":"tags"} +WARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html] +0 draft content +0 future content +2 pages created +0 tags created +0 categories created +in 4 ms +$ +``` + +The output says that it created 2 pages. Those are our new posts: + +``` +$ find public -type f -name '*.html' | xargs ls -l +-rw-r--r-- 1 quoha staff 78 Sep 29 22:13 public/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 22:13 public/post/first/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 22:13 public/post/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 22:13 public/post/second/index.html +$ +``` + +The new files are empty because because the templates used to generate the content are empty. The homepage doesn't show the new content, either. We have to update the templates to add the posts. + +### List and Single Templates + +In Hugo, we have three major kinds of templates. There's the home page template that we updated previously. It is used only by the home page. We also have "single" templates which are used to generate output for a single content file. We also have "list" templates that are used to group multiple pieces of content before generating output. + +Generally speaking, list templates are named "list.html" and single templates are named "single.html." + +There are three other types of templates: partials, content views, and terms. We will not go into much detail on these. + +### Add Content to the Homepage + +The home page will contain a list of posts. Let's update its template to add the posts that we just created. The logic in the template will run every time we build the site. + +``` +$ vi themes/zafta/layouts/index.html + + + + {{ range first 10 .Data.Pages }} +

{{ .Title }}

+ {{ end }} + + +:wq + +$ +``` + +Hugo uses the Go template engine. That engine scans the template files for commands which are enclosed between "{{" and "}}". In our template, the commands are: + +1. range +2. .Title +3. end + +The "range" command is an iterator. We're going to use it to go through the first ten pages. Every HTML file that Hugo creates is treated as a page, so looping through the list of pages will look at every file that will be created. + +The ".Title" command prints the value of the "title" variable. Hugo pulls it from the front matter in the Markdown file. + +The "end" command signals the end of the range iterator. The engine loops back to the top of the iteration when it finds "end." Everything between the "range" and "end" is evaluated every time the engine goes through the iteration. In this file, that would cause the title from the first ten pages to be output as heading level one. + +It's helpful to remember that some variables, like .Data, are created before any output files. Hugo loads every content file into the variable and then gives the template a chance to process before creating the HTML files. + +Build the web site and then verify the results. + +``` +$ rm -rf public +$ hugo --verbose +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 found taxonomies: map[string]string{"tag":"tags", "category":"categories"} +WARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html] +0 draft content +0 future content +2 pages created +0 tags created +0 categories created +in 4 ms +$ find public -type f -name '*.html' | xargs ls -l +-rw-r--r-- 1 quoha staff 94 Sep 29 22:23 public/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 22:23 public/post/first/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 22:23 public/post/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 22:23 public/post/second/index.html +$ cat public/index.html + + + + +

second

+ +

first

+ + + +$ +``` + +Congratulations, the home page shows the title of the two posts. The posts themselves are still empty, but let's take a moment to appreciate what we've done. Your template now generates output dynamically. Believe it or not, by inserting the range command inside of those curly braces, you've learned everything you need to know to build a theme. All that's really left is understanding which template will be used to generate each content file and becoming familiar with the commands for the template engine. + +And, if that were entirely true, this tutorial would be much shorter. There are a few things to know that will make creating a new template much easier. Don't worry, though, that's all to come. + +### Add Content to the Posts + +We're working with posts, which are in the content/post/ directory. That means that their section is "post" (and if we don't do something weird, their type is also "post"). + +Hugo uses the section and type to find the template file for every piece of content. Hugo will first look for a template file that matches the section or type name. If it can't find one, then it will look in the _default/ directory. There are some twists that we'll cover when we get to categories and tags, but for now we can assume that Hugo will try post/single.html, then _default/single.html. + +Now that we know the search rule, let's see what we actually have available: + +``` +$ find themes/zafta -name single.html | xargs ls -l +-rw-r--r-- 1 quoha staff 132 Sep 29 17:31 themes/zafta/layouts/_default/single.html +``` + +We could create a new template, post/single.html, or change the default. Since we don't know of any other content types, let's start with updating the default. + +Remember, any content that we haven't created a template for will end up using this template. That can be good or bad. Bad because I know that we're going to be adding different types of content and we're going to end up undoing some of the changes we've made. It's good because we'll be able to see immediate results. It's also good to start here because we can start to build the basic layout for the site. As we add more content types, we'll refactor this file and move logic around. Hugo makes that fairly painless, so we'll accept the cost and proceed. + +Please see the Hugo documentation on template rendering for all the details on determining which template to use. And, as the docs mention, if you're building a single page application (SPA) web site, you can delete all of the other templates and work with just the default single page. That's a refreshing amount of joy right there. + +#### Update the Template File + +``` +$ vi themes/zafta/layouts/_default/single.html + + + + {{ .Title }} + + +

{{ .Title }}

+ {{ .Content }} + + +:wq + +$ +``` + +Build the web site and verify the results. + +``` +$ rm -rf public +$ hugo --verbose +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 found taxonomies: map[string]string{"tag":"tags", "category":"categories"} +WARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html] +0 draft content +0 future content +2 pages created +0 tags created +0 categories created +in 4 ms + +$ find public -type f -name '*.html' | xargs ls -l +-rw-r--r-- 1 quoha staff 94 Sep 29 22:40 public/index.html +-rw-r--r-- 1 quoha staff 125 Sep 29 22:40 public/post/first/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 22:40 public/post/index.html +-rw-r--r-- 1 quoha staff 128 Sep 29 22:40 public/post/second/index.html + +$ cat public/post/first/index.html + + + + first + + +

first

+

my first post

+ + + + +$ cat public/post/second/index.html + + + + second + + +

second

+

my second post

+ + + +$ +``` + +Notice that the posts now have content. You can go to localhost:1313/post/first to verify. + +### Linking to Content + +The posts are on the home page. Let's add a link from there to the post. Since this is the home page, we'll update its template. + +``` +$ vi themes/zafta/layouts/index.html + + + + {{ range first 10 .Data.Pages }} +

{{ .Title }}

+ {{ end }} + + +``` + +Build the web site and verify the results. + +``` +$ rm -rf public +$ hugo --verbose +INFO: 2014/09/29 Using config file: /Users/quoha/Sites/zafta/config.toml +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/themes/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 syncing from /Users/quoha/Sites/zafta/static/ to /Users/quoha/Sites/zafta/public/ +INFO: 2014/09/29 found taxonomies: map[string]string{"tag":"tags", "category":"categories"} +WARN: 2014/09/29 Unable to locate layout: [404.html theme/404.html] +0 draft content +0 future content +2 pages created +0 tags created +0 categories created +in 4 ms + +$ find public -type f -name '*.html' | xargs ls -l +-rw-r--r-- 1 quoha staff 149 Sep 29 22:44 public/index.html +-rw-r--r-- 1 quoha staff 125 Sep 29 22:44 public/post/first/index.html +-rw-r--r-- 1 quoha staff 0 Sep 29 22:44 public/post/index.html +-rw-r--r-- 1 quoha staff 128 Sep 29 22:44 public/post/second/index.html + +$ cat public/index.html + + + + +

second

+ +

first

+ + + + +$ +``` + +### Create a Post Listing + +We have the posts displaying on the home page and on their own page. We also have a file public/post/index.html that is empty. Let's make it show a list of all posts (not just the first ten). + +We need to decide which template to update. This will be a listing, so it should be a list template. Let's take a quick look and see which list templates are available. + +``` +$ find themes/zafta -name list.html | xargs ls -l +-rw-r--r-- 1 quoha staff 0 Sep 29 17:31 themes/zafta/layouts/_default/list.html +``` + +As with the single post, we have to decide to update _default/list.html or create post/list.html. We still don't have multiple content types, so let's stay consistent and update the default list template. + +## Creating Top Level Pages + +Let's add an "about" page and display it at the top level (as opposed to a sub-level like we did with posts). + +The default in Hugo is to use the directory structure of the content/ directory to guide the location of the generated html in the public/ directory. Let's verify that by creating an "about" page at the top level: + +``` +$ vi content/about.md ++++ +title = "about" +description = "about this site" +date = "2014-09-27" +slug = "about time" ++++ + +## about us + +i'm speechless +:wq +``` + +Generate the web site and verify the results. + +``` +$ find public -name '*.html' | xargs ls -l +-rw-rw-r-- 1 mdhender staff 334 Sep 27 15:08 public/about-time/index.html +-rw-rw-r-- 1 mdhender staff 527 Sep 27 15:08 public/index.html +-rw-rw-r-- 1 mdhender staff 358 Sep 27 15:08 public/post/first-post/index.html +-rw-rw-r-- 1 mdhender staff 0 Sep 27 15:08 public/post/index.html +-rw-rw-r-- 1 mdhender staff 342 Sep 27 15:08 public/post/second-post/index.html +``` + +Notice that the page wasn't created at the top level. It was created in a sub-directory named 'about-time/'. That name came from our slug. Hugo will use the slug to name the generated content. It's a reasonable default, by the way, but we can learn a few things by fighting it for this file. + +One other thing. Take a look at the home page. + +``` +$ cat public/index.html + + + +

creating a new theme

+

about

+

second

+

first

+ + +``` + +Notice that the "about" link is listed with the posts? That's not desirable, so let's change that first. + +``` +$ vi themes/zafta/layouts/index.html + + + +

posts

+ {{ range first 10 .Data.Pages }} + {{ if eq .Type "post"}} +

{{ .Title }}

+ {{ end }} + {{ end }} + +

pages

+ {{ range .Data.Pages }} + {{ if eq .Type "page" }} +

{{ .Title }}

+ {{ end }} + {{ end }} + + +:wq +``` + +Generate the web site and verify the results. The home page has two sections, posts and pages, and each section has the right set of headings and links in it. + +But, that about page still renders to about-time/index.html. + +``` +$ find public -name '*.html' | xargs ls -l +-rw-rw-r-- 1 mdhender staff 334 Sep 27 15:33 public/about-time/index.html +-rw-rw-r-- 1 mdhender staff 645 Sep 27 15:33 public/index.html +-rw-rw-r-- 1 mdhender staff 358 Sep 27 15:33 public/post/first-post/index.html +-rw-rw-r-- 1 mdhender staff 0 Sep 27 15:33 public/post/index.html +-rw-rw-r-- 1 mdhender staff 342 Sep 27 15:33 public/post/second-post/index.html +``` + +Knowing that hugo is using the slug to generate the file name, the simplest solution is to change the slug. Let's do it the hard way and change the permalink in the configuration file. + +``` +$ vi config.toml +[permalinks] + page = "/:title/" + about = "/:filename/" +``` + +Generate the web site and verify that this didn't work. Hugo lets "slug" or "URL" override the permalinks setting in the configuration file. Go ahead and comment out the slug in content/about.md, then generate the web site to get it to be created in the right place. + +## Sharing Templates + +If you've been following along, you probably noticed that posts have titles in the browser and the home page doesn't. That's because we didn't put the title in the home page's template (layouts/index.html). That's an easy thing to do, but let's look at a different option. + +We can put the common bits into a shared template that's stored in the themes/zafta/layouts/partials/ directory. + +### Create the Header and Footer Partials + +In Hugo, a partial is a sugar-coated template. Normally a template reference has a path specified. Partials are different. Hugo searches for them along a TODO defined search path. This makes it easier for end-users to override the theme's presentation. + +``` +$ vi themes/zafta/layouts/partials/header.html + + + + {{ .Title }} + + +:wq + +$ vi themes/zafta/layouts/partials/footer.html + + +:wq +``` + +### Update the Home Page Template to Use the Partials + +The most noticeable difference between a template call and a partials call is the lack of path: + +``` +{{ template "theme/partials/header.html" . }} +``` +versus +``` +{{ partial "header.html" . }} +``` +Both pass in the context. + +Let's change the home page template to use these new partials. + +``` +$ vi themes/zafta/layouts/index.html +{{ partial "header.html" . }} + +

posts

+ {{ range first 10 .Data.Pages }} + {{ if eq .Type "post"}} +

{{ .Title }}

+ {{ end }} + {{ end }} + +

pages

+ {{ range .Data.Pages }} + {{ if or (eq .Type "page") (eq .Type "about") }} +

{{ .Type }} - {{ .Title }} - {{ .RelPermalink }}

+ {{ end }} + {{ end }} + +{{ partial "footer.html" . }} +:wq +``` + +Generate the web site and verify the results. The title on the home page is now "your title here", which comes from the "title" variable in the config.toml file. + +### Update the Default Single Template to Use the Partials + +``` +$ vi themes/zafta/layouts/_default/single.html +{{ partial "header.html" . }} + +

{{ .Title }}

+ {{ .Content }} + +{{ partial "footer.html" . }} +:wq +``` + +Generate the web site and verify the results. The title on the posts and the about page should both reflect the value in the markdown file. + +## Add “Date Published” to Posts + +It's common to have posts display the date that they were written or published, so let's add that. The front matter of our posts has a variable named "date." It's usually the date the content was created, but let's pretend that's the value we want to display. + +### Add “Date Published” to the Template + +We'll start by updating the template used to render the posts. The template code will look like: + +``` +{{ .Date.Format "Mon, Jan 2, 2006" }} +``` + +Posts use the default single template, so we'll change that file. + +``` +$ vi themes/zafta/layouts/_default/single.html +{{ partial "header.html" . }} + +

{{ .Title }}

+

{{ .Date.Format "Mon, Jan 2, 2006" }}

+ {{ .Content }} + +{{ partial "footer.html" . }} +:wq +``` + +Generate the web site and verify the results. The posts now have the date displayed in them. There's a problem, though. The "about" page also has the date displayed. + +As usual, there are a couple of ways to make the date display only on posts. We could do an "if" statement like we did on the home page. Another way would be to create a separate template for posts. + +The "if" solution works for sites that have just a couple of content types. It aligns with the principle of "code for today," too. + +Let's assume, though, that we've made our site so complex that we feel we have to create a new template type. In Hugo-speak, we're going to create a section template. + +Let's restore the default single template before we forget. + +``` +$ mkdir themes/zafta/layouts/post +$ vi themes/zafta/layouts/_default/single.html +{{ partial "header.html" . }} + +

{{ .Title }}

+ {{ .Content }} + +{{ partial "footer.html" . }} +:wq +``` + +Now we'll update the post's version of the single template. If you remember Hugo's rules, the template engine will use this version over the default. + +``` +$ vi themes/zafta/layouts/post/single.html +{{ partial "header.html" . }} + +

{{ .Title }}

+

{{ .Date.Format "Mon, Jan 2, 2006" }}

+ {{ .Content }} + +{{ partial "footer.html" . }} +:wq + +``` + +Note that we removed the date logic from the default template and put it in the post template. Generate the web site and verify the results. Posts have dates and the about page doesn't. + +### Don't Repeat Yourself + +DRY is a good design goal and Hugo does a great job supporting it. Part of the art of a good template is knowing when to add a new template and when to update an existing one. While you're figuring that out, accept that you'll be doing some refactoring. Hugo makes that easy and fast, so it's okay to delay splitting up a template. diff --git a/themes/m10c/exampleSite/content/posts/goisforlovers.md b/themes/m10c/exampleSite/content/posts/goisforlovers.md new file mode 100644 index 0000000..48bf607 --- /dev/null +++ b/themes/m10c/exampleSite/content/posts/goisforlovers.md @@ -0,0 +1,332 @@ ++++ +title = "(Hu)go Template Primer" +tags = ["go", "golang", "templates", "themes", "development"] +date = "2014-04-02" ++++ + +Hugo uses the excellent [Go][] [html/template][gohtmltemplate] library for +its template engine. It is an extremely lightweight engine that provides a very +small amount of logic. In our experience that it is just the right amount of +logic to be able to create a good static website. If you have used other +template systems from different languages or frameworks you will find a lot of +similarities in Go templates. + +This document is a brief primer on using Go templates. The [Go docs][gohtmltemplate] +provide more details. + +## Introduction to Go Templates + +Go templates provide an extremely simple template language. It adheres to the +belief that only the most basic of logic belongs in the template or view layer. +One consequence of this simplicity is that Go templates parse very quickly. + +A unique characteristic of Go templates is they are content aware. Variables and +content will be sanitized depending on the context of where they are used. More +details can be found in the [Go docs][gohtmltemplate]. + +## Basic Syntax + +Golang templates are HTML files with the addition of variables and +functions. + +**Go variables and functions are accessible within {{ }}** + +Accessing a predefined variable "foo": + + {{ foo }} + +**Parameters are separated using spaces** + +Calling the add function with input of 1, 2: + + {{ add 1 2 }} + +**Methods and fields are accessed via dot notation** + +Accessing the Page Parameter "bar" + + {{ .Params.bar }} + +**Parentheses can be used to group items together** + + {{ if or (isset .Params "alt") (isset .Params "caption") }} Caption {{ end }} + + +## Variables + +Each Go template has a struct (object) made available to it. In hugo each +template is passed either a page or a node struct depending on which type of +page you are rendering. More details are available on the +[variables](/layout/variables) page. + +A variable is accessed by referencing the variable name. + + {{ .Title }} + +Variables can also be defined and referenced. + + {{ $address := "123 Main St."}} + {{ $address }} + + +## Functions + +Go template ship with a few functions which provide basic functionality. The Go +template system also provides a mechanism for applications to extend the +available functions with their own. [Hugo template +functions](/layout/functions) provide some additional functionality we believe +are useful for building websites. Functions are called by using their name +followed by the required parameters separated by spaces. Template +functions cannot be added without recompiling hugo. + +**Example:** + + {{ add 1 2 }} + +## Includes + +When including another template you will pass to it the data it will be +able to access. To pass along the current context please remember to +include a trailing dot. The templates location will always be starting at +the /layout/ directory within Hugo. + +**Example:** + + {{ template "chrome/header.html" . }} + + +## Logic + +Go templates provide the most basic iteration and conditional logic. + +### Iteration + +Just like in Go, the Go templates make heavy use of range to iterate over +a map, array or slice. The following are different examples of how to use +range. + +**Example 1: Using Context** + + {{ range array }} + {{ . }} + {{ end }} + +**Example 2: Declaring value variable name** + + {{range $element := array}} + {{ $element }} + {{ end }} + +**Example 2: Declaring key and value variable name** + + {{range $index, $element := array}} + {{ $index }} + {{ $element }} + {{ end }} + +### Conditionals + +If, else, with, or, & and provide the framework for handling conditional +logic in Go Templates. Like range, each statement is closed with `end`. + + +Go Templates treat the following values as false: + +* false +* 0 +* any array, slice, map, or string of length zero + +**Example 1: If** + + {{ if isset .Params "title" }}

{{ index .Params "title" }}

{{ end }} + +**Example 2: If -> Else** + + {{ if isset .Params "alt" }} + {{ index .Params "alt" }} + {{else}} + {{ index .Params "caption" }} + {{ end }} + +**Example 3: And & Or** + + {{ if and (or (isset .Params "title") (isset .Params "caption")) (isset .Params "attr")}} + +**Example 4: With** + +An alternative way of writing "if" and then referencing the same value +is to use "with" instead. With rebinds the context `.` within its scope, +and skips the block if the variable is absent. + +The first example above could be simplified as: + + {{ with .Params.title }}

{{ . }}

{{ end }} + +**Example 5: If -> Else If** + + {{ if isset .Params "alt" }} + {{ index .Params "alt" }} + {{ else if isset .Params "caption" }} + {{ index .Params "caption" }} + {{ end }} + +## Pipes + +One of the most powerful components of Go templates is the ability to +stack actions one after another. This is done by using pipes. Borrowed +from unix pipes, the concept is simple, each pipeline's output becomes the +input of the following pipe. + +Because of the very simple syntax of Go templates, the pipe is essential +to being able to chain together function calls. One limitation of the +pipes is that they only can work with a single value and that value +becomes the last parameter of the next pipeline. + +A few simple examples should help convey how to use the pipe. + +**Example 1 :** + + {{ if eq 1 1 }} Same {{ end }} + +is the same as + + {{ eq 1 1 | if }} Same {{ end }} + +It does look odd to place the if at the end, but it does provide a good +illustration of how to use the pipes. + +**Example 2 :** + + {{ index .Params "disqus_url" | html }} + +Access the page parameter called "disqus_url" and escape the HTML. + +**Example 3 :** + + {{ if or (or (isset .Params "title") (isset .Params "caption")) (isset .Params "attr")}} + Stuff Here + {{ end }} + +Could be rewritten as + + {{ isset .Params "caption" | or isset .Params "title" | or isset .Params "attr" | if }} + Stuff Here + {{ end }} + + +## Context (aka. the dot) + +The most easily overlooked concept to understand about Go templates is that {{ . }} +always refers to the current context. In the top level of your template this +will be the data set made available to it. Inside of a iteration it will have +the value of the current item. When inside of a loop the context has changed. . +will no longer refer to the data available to the entire page. If you need to +access this from within the loop you will likely want to set it to a variable +instead of depending on the context. + +**Example:** + + {{ $title := .Site.Title }} + {{ range .Params.tags }} +
  • {{ . }} - {{ $title }}
  • + {{ end }} + +Notice how once we have entered the loop the value of {{ . }} has changed. We +have defined a variable outside of the loop so we have access to it from within +the loop. + +# Hugo Parameters + +Hugo provides the option of passing values to the template language +through the site configuration (for sitewide values), or through the meta +data of each specific piece of content. You can define any values of any +type (supported by your front matter/config format) and use them however +you want to inside of your templates. + + +## Using Content (page) Parameters + +In each piece of content you can provide variables to be used by the +templates. This happens in the [front matter](/content/front-matter). + +An example of this is used in this documentation site. Most of the pages +benefit from having the table of contents provided. Sometimes the TOC just +doesn't make a lot of sense. We've defined a variable in our front matter +of some pages to turn off the TOC from being displayed. + +Here is the example front matter: + +``` +--- +title: "Permalinks" +date: "2013-11-18" +aliases: + - "/doc/permalinks/" +groups: ["extras"] +groups_weight: 30 +notoc: true +--- +``` + +Here is the corresponding code inside of the template: + + {{ if not .Params.notoc }} +
    + {{ .TableOfContents }} +
    + {{ end }} + + + +## Using Site (config) Parameters +In your top-level configuration file (eg, `config.yaml`) you can define site +parameters, which are values which will be available to you in chrome. + +For instance, you might declare: + +```yaml +params: + CopyrightHTML: "Copyright © 2013 John Doe. All Rights Reserved." + TwitterUser: "spf13" + SidebarRecentLimit: 5 +``` + +Within a footer layout, you might then declare a `