From: Bjørn Erik Pedersen Date: Thu, 23 Jan 2025 08:47:46 +0000 (+0100) Subject: Merge commit '346b60358dd8ec2ca228e6635bff9d7914b398b7' X-Git-Url: http://git.maquefel.me/?a=commitdiff_plain;h=43307b07f8ae166cedc149b9dffeb7a0efdd3f34;p=brevno-suite%2Fhugo Merge commit '346b60358dd8ec2ca228e6635bff9d7914b398b7' --- 43307b07f8ae166cedc149b9dffeb7a0efdd3f34 diff --cc docs/.markdownlint.yaml index d9c2c5a67,000000000..ee0a28909 mode 100644,000000..100644 --- a/docs/.markdownlint.yaml +++ b/docs/.markdownlint.yaml @@@ -1,25 -1,0 +1,26 @@@ +# https://github.com/DavidAnson/markdownlint/blob/main/doc/Rules.md + +MD001: false +MD002: false +MD003: false +MD004: false +MD007: false +MD012: + maximum: 2 +MD013: false +MD014: false +MD022: false +MD024: false +MD031: false +MD032: false +MD033: false +MD034: false +MD036: false +MD037: false +MD038: false +MD041: false +MD046: false +MD049: false +MD050: false +MD053: false ++MD055: false diff --cc docs/_vendor/github.com/gohugoio/gohugoioTheme/assets/css/_code.css index c82e77ee7,000000000..9906a13d0 mode 100644,000000..100644 --- a/docs/_vendor/github.com/gohugoio/gohugoioTheme/assets/css/_code.css +++ b/docs/_vendor/github.com/gohugoio/gohugoioTheme/assets/css/_code.css @@@ -1,89 -1,0 +1,89 @@@ +.chroma .lntable pre { + padding: 0; + margin: 0; + border: 0; +} + +.chroma .lntable pre code { + padding: 0; + margin: 0; +} + +code { - padding: 0.2em; ++ padding: 2px 3px; + margin: 0; - font-size: 85%; ++ font-size: 93.75%; + background-color: rgba(27,31,35,0.05); + border-radius: 3px; +} + +pre code { + display: block; + padding: 1.5em 1.5em; + font-size: .875rem; + line-height: 2; + overflow-x: auto; +} + +pre { + background-color: #fff; + color: #333; + white-space: pre; + hyphens: none; + position: relative; + border-width: 1px; + border-color: #ccc; + border-style: solid; +} + +/* The Pygments highlighter comes with its own styles. */ +.highlight pre { + background-color: inherit; + color: inherit; + padding: 0.5em; + font-size: .875rem; +} + + +/*We are adding the copy button content here so we can change it with javascript. See the "Clipboard scripts"*/ +.copy:after { + content: "Copy" +} +.copied:after { + content: "Copied" +} + +@media (--breakpoint-large) { + .full-width + { + /*width: 100vw; + position: relative; + left: 50%; + right: 50%; + margin-left: -50vw; + margin-right: -50vw;*/ + /*width: 60vw;*/ + /*position: relative; + left: 50%; + right: 50%;*/ + /*margin-left: -30vw;*/ + margin-right: -30vw; + max-width: 100vw; + } +} + +.code-block .line-numbers-rows { + background: #2f3a46; + border: none; + bottom: -50px; + color: #98a4b3; + left: -178px; + padding: 50px 0; + top: -50px; + width: 138px +} + +.code-block .line-numbers-rows>span:before { + color: inherit; + padding-right: 30px +} diff --cc docs/_vendor/github.com/gohugoio/gohugoioTheme/assets/output/css/app.css index b6343c7be,000000000..4fd374a1f mode 100644,000000..100644 --- a/docs/_vendor/github.com/gohugoio/gohugoioTheme/assets/output/css/app.css +++ b/docs/_vendor/github.com/gohugoio/gohugoioTheme/assets/output/css/app.css @@@ -1,5349 -1,0 +1,5349 @@@ +/* muli-200normal - latin */ +@font-face { + font-family: 'Muli'; + font-style: normal; + font-display: swap; + font-weight: 200; + src: + local('Muli Extra Light '), + local('Muli-Extra Light'), + url(/fonts/muli-latin-200.woff2) format('woff2'), + url(/fonts/muli-latin-200.woff) format('woff'); /* Modern Browsers */ +} +/* muli-200italic - latin */ +@font-face { + font-family: 'Muli'; + font-style: italic; + font-display: swap; + font-weight: 200; + src: + local('Muli Extra Light italic'), + local('Muli-Extra Lightitalic'), + url(/fonts/muli-latin-200italic.woff2) format('woff2'), + url(/fonts/muli-latin-200italic.woff) format('woff'); /* Modern Browsers */ +} +/* muli-300normal - latin */ +@font-face { + font-family: 'Muli'; + font-style: normal; + font-display: swap; + font-weight: 300; + src: + local('Muli Light '), + local('Muli-Light'), + url(/fonts/muli-latin-300.woff2) format('woff2'), + url(/fonts/muli-latin-300.woff) format('woff'); /* Modern Browsers */ +} +/* muli-300italic - latin */ +@font-face { + font-family: 'Muli'; + font-style: italic; + font-display: swap; + font-weight: 300; + src: + local('Muli Light italic'), + local('Muli-Lightitalic'), + url(/fonts/muli-latin-300italic.woff2) format('woff2'), + url(/fonts/muli-latin-300italic.woff) format('woff'); /* Modern Browsers */ +} +/* muli-400normal - latin */ +@font-face { + font-family: 'Muli'; + font-style: normal; + font-display: swap; + font-weight: 400; + src: + local('Muli Regular '), + local('Muli-Regular'), + url(/fonts/muli-latin-400.woff2) format('woff2'), + url(/fonts/muli-latin-400.woff) format('woff'); /* Modern Browsers */ +} +/* muli-400italic - latin */ +@font-face { + font-family: 'Muli'; + font-style: italic; + font-display: swap; + font-weight: 400; + src: + local('Muli Regular italic'), + local('Muli-Regularitalic'), + url(/fonts/muli-latin-400italic.woff2) format('woff2'), + url(/fonts/muli-latin-400italic.woff) format('woff'); /* Modern Browsers */ +} +/* muli-600normal - latin */ +@font-face { + font-family: 'Muli'; + font-style: normal; + font-display: swap; + font-weight: 600; + src: + local('Muli SemiBold '), + local('Muli-SemiBold'), + url(/fonts/muli-latin-600.woff2) format('woff2'), + url(/fonts/muli-latin-600.woff) format('woff'); /* Modern Browsers */ +} +/* muli-600italic - latin */ +@font-face { + font-family: 'Muli'; + font-style: italic; + font-display: swap; + font-weight: 600; + src: + local('Muli SemiBold italic'), + local('Muli-SemiBolditalic'), + url(/fonts/muli-latin-600italic.woff2) format('woff2'), + url(/fonts/muli-latin-600italic.woff) format('woff'); /* Modern Browsers */ +} +/* muli-700normal - latin */ +@font-face { + font-family: 'Muli'; + font-style: normal; + font-display: swap; + font-weight: 700; + src: + local('Muli Bold '), + local('Muli-Bold'), + url(/fonts/muli-latin-700.woff2) format('woff2'), + url(/fonts/muli-latin-700.woff) format('woff'); /* Modern Browsers */ +} +/* muli-700italic - latin */ +@font-face { + font-family: 'Muli'; + font-style: italic; + font-display: swap; + font-weight: 700; + src: + local('Muli Bold italic'), + local('Muli-Bolditalic'), + url(/fonts/muli-latin-700italic.woff2) format('woff2'), + url(/fonts/muli-latin-700italic.woff) format('woff'); /* Modern Browsers */ +} +/* muli-800normal - latin */ +@font-face { + font-family: 'Muli'; + font-style: normal; + font-display: swap; + font-weight: 800; + src: + local('Muli ExtraBold '), + local('Muli-ExtraBold'), + url(/fonts/muli-latin-800.woff2) format('woff2'), + url(/fonts/muli-latin-800.woff) format('woff'); /* Modern Browsers */ +} +/* muli-800italic - latin */ +@font-face { + font-family: 'Muli'; + font-style: italic; + font-display: swap; + font-weight: 800; + src: + local('Muli ExtraBold italic'), + local('Muli-ExtraBolditalic'), + url(/fonts/muli-latin-800italic.woff2) format('woff2'), + url(/fonts/muli-latin-800italic.woff) format('woff'); /* Modern Browsers */ +} +/* muli-900normal - latin */ +@font-face { + font-family: 'Muli'; + font-style: normal; + font-display: swap; + font-weight: 900; + src: + local('Muli Black '), + local('Muli-Black'), + url(/fonts/muli-latin-900.woff2) format('woff2'), + url(/fonts/muli-latin-900.woff) format('woff'); /* Modern Browsers */ +} +/* muli-900italic - latin */ +@font-face { + font-family: 'Muli'; + font-style: italic; + font-display: swap; + font-weight: 900; + src: + local('Muli Black italic'), + local('Muli-Blackitalic'), + url(/fonts/muli-latin-900italic.woff2) format('woff2'), + url(/fonts/muli-latin-900italic.woff) format('woff'); /* Modern Browsers */ +} + + +/*Base Styles*/ +/*! TACHYONS v4.7.0 | http://tachyons.io */ +/* + * NOTE: The Tachyons folder is for backup/reference only. This file references the module + * ________ ______ + * ___ __/_____ _________ /______ ______________________ + * __ / _ __ `/ ___/_ __ \_ / / / __ \_ __ \_ ___/ + * _ / / /_/ // /__ _ / / / /_/ // /_/ / / / /(__ ) + * /_/ \__,_/ \___/ /_/ /_/_\__, / \____//_/ /_//____/ + * /____/ + * + * TABLE OF CONTENTS + * + * 1. External Library Includes + * - Normalize.css | http://normalize.css.github.io + * 2. Tachyons Modules + * 3. Variables + * - Media Queries + * - Colors + * 4. Debugging + * - Debug all + * - Debug children + * + */ +/* External Library Includes */ +/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ +/* Document + ========================================================================== */ +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in iOS. + */ +html { + line-height: 1.15; /* 1 */ + -webkit-text-size-adjust: 100%; /* 2 */ +} +/* Sections + ========================================================================== */ +/** + * Remove the margin in all browsers. + */ +body { + margin: 0; +} +/** + * Correct the font size and margin on `h1` elements within `section` and + * `article` contexts in Chrome, Firefox, and Safari. + */ +h1 { + font-size: 2em; + margin: 0.67em 0; +} +/* Grouping content + ========================================================================== */ +/** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ +hr { + -webkit-box-sizing: content-box; + box-sizing: content-box; /* 1 */ + height: 0; /* 1 */ + overflow: visible; /* 2 */ +} +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ +pre { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} +/* Text-level semantics + ========================================================================== */ +/** + * Remove the gray background on active links in IE 10. + */ +a { + background-color: transparent; +} +/** + * 1. Remove the bottom border in Chrome 57- + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ +abbr[title] { + border-bottom: none; /* 1 */ + text-decoration: underline; /* 2 */ + -webkit-text-decoration: underline dotted; + text-decoration: underline dotted; /* 2 */ +} +/** + * Add the correct font weight in Chrome, Edge, and Safari. + */ +b, +strong { + font-weight: bolder; +} +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ +code, +kbd, +samp { + font-family: monospace, monospace; /* 1 */ + font-size: 1em; /* 2 */ +} +/** + * Add the correct font size in all browsers. + */ +small { + font-size: 80%; +} +/** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} +sub { + bottom: -0.25em; +} +sup { + top: -0.5em; +} +/* Embedded content + ========================================================================== */ +/** + * Remove the border on images inside links in IE 10. + */ +img { + border-style: none; +} +/* Forms + ========================================================================== */ +/** + * 1. Change the font styles in all browsers. + * 2. Remove the margin in Firefox and Safari. + */ +button, +input, +optgroup, +select, +textarea { + font-family: inherit; /* 1 */ + font-size: 100%; /* 1 */ + line-height: 1.15; /* 1 */ + margin: 0; /* 2 */ +} +/** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ +button, +input { /* 1 */ + overflow: visible; +} +/** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ +button, +select { /* 1 */ + text-transform: none; +} +/** + * Correct the inability to style clickable types in iOS and Safari. + */ +button, +[type="button"], +[type="reset"], +[type="submit"] { + -webkit-appearance: button; +} +/** + * Remove the inner border and padding in Firefox. + */ +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + border-style: none; + padding: 0; +} +/** + * Restore the focus styles unset by the previous rule. + */ +button:-moz-focusring, +[type="button"]:-moz-focusring, +[type="reset"]:-moz-focusring, +[type="submit"]:-moz-focusring { + outline: 1px dotted ButtonText; +} +/** + * Correct the padding in Firefox. + */ +fieldset { + padding: 0.35em 0.75em 0.625em; +} +/** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ +legend { + -webkit-box-sizing: border-box; + box-sizing: border-box; /* 1 */ + color: inherit; /* 2 */ + display: table; /* 1 */ + max-width: 100%; /* 1 */ + padding: 0; /* 3 */ + white-space: normal; /* 1 */ +} +/** + * Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ +progress { + vertical-align: baseline; +} +/** + * Remove the default vertical scrollbar in IE 10+. + */ +textarea { + overflow: auto; +} +/** + * 1. Add the correct box sizing in IE 10. + * 2. Remove the padding in IE 10. + */ +[type="checkbox"], +[type="radio"] { + -webkit-box-sizing: border-box; + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ +} +/** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ +[type="number"]::-webkit-inner-spin-button, +[type="number"]::-webkit-outer-spin-button { + height: auto; +} +/** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ +[type="search"] { + -webkit-appearance: textfield; /* 1 */ + outline-offset: -2px; /* 2 */ +} +/** + * Remove the inner padding in Chrome and Safari on macOS. + */ +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} +/** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ +::-webkit-file-upload-button { + -webkit-appearance: button; /* 1 */ + font: inherit; /* 2 */ +} +/* Interactive + ========================================================================== */ +/* + * Add the correct display in Edge, IE 10+, and Firefox. + */ +details { + display: block; +} +/* + * Add the correct display in all browsers. + */ +summary { + display: list-item; +} +/* Misc + ========================================================================== */ +/** + * Add the correct display in IE 10+. + */ +template { + display: none; +} +/** + * Add the correct display in IE 10. + */ +[hidden] { + display: none; +} +/* Modules */ +/* + + BOX SIZING + +*/ +html, +body, +div, +article, +aside, +section, +main, +nav, +footer, +header, +form, +fieldset, +legend, +pre, +code, +a, +h1,h2,h3,h4,h5,h6, +p, +ul, +ol, +li, +dl, +dt, +dd, +blockquote, +figcaption, +figure, +textarea, +table, +td, +th, +tr, +input[type="email"], +input[type="number"], +input[type="password"], +input[type="tel"], +input[type="text"], +input[type="url"], +.border-box { + -webkit-box-sizing: border-box; + box-sizing: border-box; +} +/*@import 'tachyons/src/_aspect-ratios';*/ +/* + + IMAGES + Docs: http://tachyons.io/docs/elements/images/ + +*/ +/* Responsive images! */ +img { max-width: 100%; } +/* + + BACKGROUND SIZE + Docs: http://tachyons.io/docs/themes/background-size/ + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +/* + Often used in combination with background image set as an inline style + on an html element. +*/ +.cover { background-size: cover!important; } +.contain { background-size: contain!important; } +@media screen and (min-width: 30em) { + .cover-ns { background-size: cover!important; } + .contain-ns { background-size: contain!important; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .cover-m { background-size: cover!important; } + .contain-m { background-size: contain!important; } +} +@media screen and (min-width: 60em) { + .cover-l { background-size: cover!important; } + .contain-l { background-size: contain!important; } +} +/* + + BACKGROUND POSITION + + Base: + bg = background + + Modifiers: + -center = center center + -top = top center + -right = center right + -bottom = bottom center + -left = center left + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + + */ +.bg-center { + background-repeat: no-repeat; + background-position: center center; +} +.bg-top { + background-repeat: no-repeat; + background-position: top center; +} +.bg-right { + background-repeat: no-repeat; + background-position: center right; +} +.bg-bottom { + background-repeat: no-repeat; + background-position: bottom center; +} +.bg-left { + background-repeat: no-repeat; + background-position: center left; +} +@media screen and (min-width: 30em) { + .bg-center-ns { + background-repeat: no-repeat; + background-position: center center; + } + + .bg-top-ns { + background-repeat: no-repeat; + background-position: top center; + } + + .bg-right-ns { + background-repeat: no-repeat; + background-position: center right; + } + + .bg-bottom-ns { + background-repeat: no-repeat; + background-position: bottom center; + } + + .bg-left-ns { + background-repeat: no-repeat; + background-position: center left; + } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .bg-center-m { + background-repeat: no-repeat; + background-position: center center; + } + + .bg-top-m { + background-repeat: no-repeat; + background-position: top center; + } + + .bg-right-m { + background-repeat: no-repeat; + background-position: center right; + } + + .bg-bottom-m { + background-repeat: no-repeat; + background-position: bottom center; + } + + .bg-left-m { + background-repeat: no-repeat; + background-position: center left; + } +} +@media screen and (min-width: 60em) { + .bg-center-l { + background-repeat: no-repeat; + background-position: center center; + } + + .bg-top-l { + background-repeat: no-repeat; + background-position: top center; + } + + .bg-right-l { + background-repeat: no-repeat; + background-position: center right; + } + + .bg-bottom-l { + background-repeat: no-repeat; + background-position: bottom center; + } + + .bg-left-l { + background-repeat: no-repeat; + background-position: center left; + } +} +/*@import 'tachyons/src/_outlines';*/ +/* + + BORDERS + Docs: http://tachyons.io/docs/themes/borders/ + + Base: + b = border + + Modifiers: + a = all + t = top + r = right + b = bottom + l = left + n = none + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.ba { border-style: solid; border-width: 1px; } +.bt { border-top-style: solid; border-top-width: 1px; } +.br { border-right-style: solid; border-right-width: 1px; } +.bb { border-bottom-style: solid; border-bottom-width: 1px; } +.bl { border-left-style: solid; border-left-width: 1px; } +.bn { border-style: none; border-width: 0; } +@media screen and (min-width: 30em) { + .ba-ns { border-style: solid; border-width: 1px; } + .bt-ns { border-top-style: solid; border-top-width: 1px; } + .br-ns { border-right-style: solid; border-right-width: 1px; } + .bb-ns { border-bottom-style: solid; border-bottom-width: 1px; } + .bl-ns { border-left-style: solid; border-left-width: 1px; } + .bn-ns { border-style: none; border-width: 0; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .ba-m { border-style: solid; border-width: 1px; } + .bt-m { border-top-style: solid; border-top-width: 1px; } + .br-m { border-right-style: solid; border-right-width: 1px; } + .bb-m { border-bottom-style: solid; border-bottom-width: 1px; } + .bl-m { border-left-style: solid; border-left-width: 1px; } + .bn-m { border-style: none; border-width: 0; } +} +@media screen and (min-width: 60em) { + .ba-l { border-style: solid; border-width: 1px; } + .bt-l { border-top-style: solid; border-top-width: 1px; } + .br-l { border-right-style: solid; border-right-width: 1px; } + .bb-l { border-bottom-style: solid; border-bottom-width: 1px; } + .bl-l { border-left-style: solid; border-left-width: 1px; } + .bn-l { border-style: none; border-width: 0; } +} +/* + + BORDER COLORS + Docs: http://tachyons.io/docs/themes/borders/ + + Border colors can be used to extend the base + border classes ba,bt,bb,br,bl found in the _borders.css file. + + The base border class by default will set the color of the border + to that of the current text color. These classes are for the cases + where you desire for the text and border colors to be different. + + Base: + b = border + + Modifiers: + --color-name = each color variable name is also a border color name + +*/ +.b--black { border-color: #000; } +.b--near-black { border-color: #111; } +.b--dark-gray { border-color: #333; } +.b--mid-gray { border-color: #555; } +.b--gray { border-color: #777; } +.b--silver { border-color: #999; } +.b--light-silver { border-color: #aaa; } +.b--moon-gray { border-color: #ccc; } +.b--light-gray { border-color: #eee; } +.b--near-white { border-color: #f4f4f4; } +.b--white { border-color: #fff; } +.b--white-90 { border-color: rgba(255, 255, 255, .9); } +.b--white-80 { border-color: rgba(255, 255, 255, .8); } +.b--white-70 { border-color: rgba(255, 255, 255, .7); } +.b--white-60 { border-color: rgba(255, 255, 255, .6); } +.b--white-50 { border-color: rgba(255, 255, 255, .5); } +.b--white-40 { border-color: rgba(255, 255, 255, .4); } +.b--white-30 { border-color: rgba(255, 255, 255, .3); } +.b--white-20 { border-color: rgba(255, 255, 255, .2); } +.b--white-10 { border-color: rgba(255, 255, 255, .1); } +.b--white-05 { border-color: rgba(255, 255, 255, .05); } +.b--white-025 { border-color: rgba(255, 255, 255, .025); } +.b--white-0125 { border-color: rgba(255, 255, 255, .0125); } +.b--black-90 { border-color: rgba(0, 0, 0, .9); } +.b--black-80 { border-color: rgba(0, 0, 0, .8); } +.b--black-70 { border-color: rgba(0, 0, 0, .7); } +.b--black-60 { border-color: rgba(0, 0, 0, .6); } +.b--black-50 { border-color: rgba(0, 0, 0, .5); } +.b--black-40 { border-color: rgba(0, 0, 0, .4); } +.b--black-30 { border-color: rgba(0, 0, 0, .3); } +.b--black-20 { border-color: rgba(0, 0, 0, .2); } +.b--black-10 { border-color: rgba(0, 0, 0, .1); } +.b--black-05 { border-color: rgba(0, 0, 0, .05); } +.b--black-025 { border-color: rgba(0, 0, 0, .025); } +.b--black-0125 { border-color: rgba(0, 0, 0, .0125); } +.b--dark-red { border-color: #e7040f; } +.b--red { border-color: #ff4136; } +.b--light-red { border-color: #ff725c; } +.b--orange { border-color: #ff6300; } +.b--gold { border-color: #ffb700; } +.b--yellow { border-color: #ffd700; } +.b--light-yellow { border-color: #fbf1a9; } +.b--purple { border-color: #5e2ca5; } +.b--light-purple { border-color: #a463f2; } +.b--dark-pink { border-color: #d5008f; } +.b--hot-pink { border-color: #ff41b4; } +.b--pink { border-color: #ff80cc; } +.b--light-pink { border-color: #ffa3d7; } +.b--dark-green { border-color: #137752; } +.b--green { border-color: #19a974; } +.b--light-green { border-color: #9eebcf; } +.b--navy { border-color: #001b44; } +.b--dark-blue { border-color: #00449e; } +.b--blue { border-color: #0594CB; } +.b--light-blue { border-color: #96ccff; } +.b--lightest-blue { border-color: #cdecff; } +.b--washed-blue { border-color: #f6fffe; } +.b--washed-green { border-color: #e8fdf5; } +.b--washed-yellow { border-color: #fffceb; } +.b--washed-red { border-color: #ffdfdf; } +.b--transparent { border-color: transparent; } +.b--inherit { border-color: inherit; } +/* + + BORDER RADIUS + Docs: http://tachyons.io/docs/themes/border-radius/ + + Base: + br = border-radius + + Modifiers: + 0 = 0/none + 1 = 1st step in scale + 2 = 2nd step in scale + 3 = 3rd step in scale + 4 = 4th step in scale + + Literal values: + -100 = 100% + -pill = 9999px + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.br0 { border-radius: 0; } +.br1 { border-radius: .125rem; } +.br2 { border-radius: .25rem; } +.br3 { border-radius: .5rem; } +.br4 { border-radius: 1rem; } +.br-100 { border-radius: 100%; } +.br-pill { border-radius: 9999px; } +.br--bottom { + border-top-left-radius: 0; + border-top-right-radius: 0; + } +.br--top { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + } +.br--right { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } +.br--left { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } +@media screen and (min-width: 30em) { + .br0-ns { border-radius: 0; } + .br1-ns { border-radius: .125rem; } + .br2-ns { border-radius: .25rem; } + .br3-ns { border-radius: .5rem; } + .br4-ns { border-radius: 1rem; } + .br-100-ns { border-radius: 100%; } + .br-pill-ns { border-radius: 9999px; } + .br--bottom-ns { + border-top-left-radius: 0; + border-top-right-radius: 0; + } + .br--top-ns { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + } + .br--right-ns { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + .br--left-ns { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .br0-m { border-radius: 0; } + .br1-m { border-radius: .125rem; } + .br2-m { border-radius: .25rem; } + .br3-m { border-radius: .5rem; } + .br4-m { border-radius: 1rem; } + .br-100-m { border-radius: 100%; } + .br-pill-m { border-radius: 9999px; } + .br--bottom-m { + border-top-left-radius: 0; + border-top-right-radius: 0; + } + .br--top-m { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + } + .br--right-m { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + .br--left-m { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } +} +@media screen and (min-width: 60em) { + .br0-l { border-radius: 0; } + .br1-l { border-radius: .125rem; } + .br2-l { border-radius: .25rem; } + .br3-l { border-radius: .5rem; } + .br4-l { border-radius: 1rem; } + .br-100-l { border-radius: 100%; } + .br-pill-l { border-radius: 9999px; } + .br--bottom-l { + border-top-left-radius: 0; + border-top-right-radius: 0; + } + .br--top-l { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; + } + .br--right-l { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + .br--left-l { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } +} +/* + + BORDER STYLES + Docs: http://tachyons.io/docs/themes/borders/ + + Depends on base border module in _borders.css + + Base: + b = border-style + + Modifiers: + --none = none + --dotted = dotted + --dashed = dashed + --solid = solid + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + + */ +.b--dotted { border-style: dotted; } +.b--dashed { border-style: dashed; } +.b--solid { border-style: solid; } +.b--none { border-style: none; } +@media screen and (min-width: 30em) { + .b--dotted-ns { border-style: dotted; } + .b--dashed-ns { border-style: dashed; } + .b--solid-ns { border-style: solid; } + .b--none-ns { border-style: none; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .b--dotted-m { border-style: dotted; } + .b--dashed-m { border-style: dashed; } + .b--solid-m { border-style: solid; } + .b--none-m { border-style: none; } +} +@media screen and (min-width: 60em) { + .b--dotted-l { border-style: dotted; } + .b--dashed-l { border-style: dashed; } + .b--solid-l { border-style: solid; } + .b--none-l { border-style: none; } +} +/* + + BORDER WIDTHS + Docs: http://tachyons.io/docs/themes/borders/ + + Base: + bw = border-width + + Modifiers: + 0 = 0 width border + 1 = 1st step in border-width scale + 2 = 2nd step in border-width scale + 3 = 3rd step in border-width scale + 4 = 4th step in border-width scale + 5 = 5th step in border-width scale + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.bw0 { border-width: 0; } +.bw1 { border-width: .125rem; } +.bw2 { border-width: .25rem; } +.bw3 { border-width: .5rem; } +.bw4 { border-width: 1rem; } +.bw5 { border-width: 2rem; } +/* Resets */ +.bt-0 { border-top-width: 0; } +.br-0 { border-right-width: 0; } +.bb-0 { border-bottom-width: 0; } +.bl-0 { border-left-width: 0; } +@media screen and (min-width: 30em) { + .bw0-ns { border-width: 0; } + .bw1-ns { border-width: .125rem; } + .bw2-ns { border-width: .25rem; } + .bw3-ns { border-width: .5rem; } + .bw4-ns { border-width: 1rem; } + .bw5-ns { border-width: 2rem; } + .bt-0-ns { border-top-width: 0; } + .br-0-ns { border-right-width: 0; } + .bb-0-ns { border-bottom-width: 0; } + .bl-0-ns { border-left-width: 0; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .bw0-m { border-width: 0; } + .bw1-m { border-width: .125rem; } + .bw2-m { border-width: .25rem; } + .bw3-m { border-width: .5rem; } + .bw4-m { border-width: 1rem; } + .bw5-m { border-width: 2rem; } + .bt-0-m { border-top-width: 0; } + .br-0-m { border-right-width: 0; } + .bb-0-m { border-bottom-width: 0; } + .bl-0-m { border-left-width: 0; } +} +@media screen and (min-width: 60em) { + .bw0-l { border-width: 0; } + .bw1-l { border-width: .125rem; } + .bw2-l { border-width: .25rem; } + .bw3-l { border-width: .5rem; } + .bw4-l { border-width: 1rem; } + .bw5-l { border-width: 2rem; } + .bt-0-l { border-top-width: 0; } + .br-0-l { border-right-width: 0; } + .bb-0-l { border-bottom-width: 0; } + .bl-0-l { border-left-width: 0; } +} +/* + + BOX-SHADOW + Docs: http://tachyons.io/docs/themes/box-shadow/ + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + + */ +.shadow-1 { -webkit-box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, .2); box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, .2); } +.shadow-2 { -webkit-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .2); box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .2); } +.shadow-3 { -webkit-box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, .2); box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, .2); } +.shadow-4 { -webkit-box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, .2); box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, .2); } +.shadow-5 { -webkit-box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, .2); box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, .2); } +@media screen and (min-width: 30em) { + .shadow-1-ns { -webkit-box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, .2); box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, .2); } + .shadow-2-ns { -webkit-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .2); box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .2); } + .shadow-3-ns { -webkit-box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, .2); box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, .2); } + .shadow-4-ns { -webkit-box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, .2); box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, .2); } + .shadow-5-ns { -webkit-box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, .2); box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, .2); } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .shadow-1-m { -webkit-box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, .2); box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, .2); } + .shadow-2-m { -webkit-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .2); box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .2); } + .shadow-3-m { -webkit-box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, .2); box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, .2); } + .shadow-4-m { -webkit-box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, .2); box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, .2); } + .shadow-5-m { -webkit-box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, .2); box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, .2); } +} +@media screen and (min-width: 60em) { + .shadow-1-l { -webkit-box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, .2); box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, .2); } + .shadow-2-l { -webkit-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .2); box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, .2); } + .shadow-3-l { -webkit-box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, .2); box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, .2); } + .shadow-4-l { -webkit-box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, .2); box-shadow: 2px 2px 8px 0px rgba(0, 0, 0, .2); } + .shadow-5-l { -webkit-box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, .2); box-shadow: 4px 4px 8px 0px rgba(0, 0, 0, .2); } +} +/*@import 'tachyons/src/_code';*/ +/* + + COORDINATES + Docs: http://tachyons.io/docs/layout/position/ + + Use in combination with the position module. + + Base: + top + bottom + right + left + + Modifiers: + -0 = literal value 0 + -1 = literal value 1 + -2 = literal value 2 + --1 = literal value -1 + --2 = literal value -2 + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.top-0 { top: 0; } +.right-0 { right: 0; } +.bottom-0 { bottom: 0; } +.left-0 { left: 0; } +.top-1 { top: 1rem; } +.right-1 { right: 1rem; } +.bottom-1 { bottom: 1rem; } +.left-1 { left: 1rem; } +.top-2 { top: 2rem; } +.right-2 { right: 2rem; } +.bottom-2 { bottom: 2rem; } +.left-2 { left: 2rem; } +.top--1 { top: -1rem; } +.right--1 { right: -1rem; } +.bottom--1 { bottom: -1rem; } +.left--1 { left: -1rem; } +.top--2 { top: -2rem; } +.right--2 { right: -2rem; } +.bottom--2 { bottom: -2rem; } +.left--2 { left: -2rem; } +.absolute--fill { + top: 0; + right: 0; + bottom: 0; + left: 0; +} +@media screen and (min-width: 30em) { + .top-0-ns { top: 0; } + .left-0-ns { left: 0; } + .right-0-ns { right: 0; } + .bottom-0-ns { bottom: 0; } + .top-1-ns { top: 1rem; } + .left-1-ns { left: 1rem; } + .right-1-ns { right: 1rem; } + .bottom-1-ns { bottom: 1rem; } + .top-2-ns { top: 2rem; } + .left-2-ns { left: 2rem; } + .right-2-ns { right: 2rem; } + .bottom-2-ns { bottom: 2rem; } + .top--1-ns { top: -1rem; } + .right--1-ns { right: -1rem; } + .bottom--1-ns { bottom: -1rem; } + .left--1-ns { left: -1rem; } + .top--2-ns { top: -2rem; } + .right--2-ns { right: -2rem; } + .bottom--2-ns { bottom: -2rem; } + .left--2-ns { left: -2rem; } + .absolute--fill-ns { + top: 0; + right: 0; + bottom: 0; + left: 0; + } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .top-0-m { top: 0; } + .left-0-m { left: 0; } + .right-0-m { right: 0; } + .bottom-0-m { bottom: 0; } + .top-1-m { top: 1rem; } + .left-1-m { left: 1rem; } + .right-1-m { right: 1rem; } + .bottom-1-m { bottom: 1rem; } + .top-2-m { top: 2rem; } + .left-2-m { left: 2rem; } + .right-2-m { right: 2rem; } + .bottom-2-m { bottom: 2rem; } + .top--1-m { top: -1rem; } + .right--1-m { right: -1rem; } + .bottom--1-m { bottom: -1rem; } + .left--1-m { left: -1rem; } + .top--2-m { top: -2rem; } + .right--2-m { right: -2rem; } + .bottom--2-m { bottom: -2rem; } + .left--2-m { left: -2rem; } + .absolute--fill-m { + top: 0; + right: 0; + bottom: 0; + left: 0; + } +} +@media screen and (min-width: 60em) { + .top-0-l { top: 0; } + .left-0-l { left: 0; } + .right-0-l { right: 0; } + .bottom-0-l { bottom: 0; } + .top-1-l { top: 1rem; } + .left-1-l { left: 1rem; } + .right-1-l { right: 1rem; } + .bottom-1-l { bottom: 1rem; } + .top-2-l { top: 2rem; } + .left-2-l { left: 2rem; } + .right-2-l { right: 2rem; } + .bottom-2-l { bottom: 2rem; } + .top--1-l { top: -1rem; } + .right--1-l { right: -1rem; } + .bottom--1-l { bottom: -1rem; } + .left--1-l { left: -1rem; } + .top--2-l { top: -2rem; } + .right--2-l { right: -2rem; } + .bottom--2-l { bottom: -2rem; } + .left--2-l { left: -2rem; } + .absolute--fill-l { + top: 0; + right: 0; + bottom: 0; + left: 0; + } +} +/* + + CLEARFIX + http://tachyons.io/docs/layout/clearfix/ + +*/ +/* Nicolas Gallaghers Clearfix solution + Ref: http://nicolasgallagher.com/micro-clearfix-hack/ */ +.cf:before, +.cf:after { content: " "; display: table; } +.cf:after { clear: both; } +.cf { *zoom: 1; } +.cl { clear: left; } +.cr { clear: right; } +.cb { clear: both; } +.cn { clear: none; } +@media screen and (min-width: 30em) { + .cl-ns { clear: left; } + .cr-ns { clear: right; } + .cb-ns { clear: both; } + .cn-ns { clear: none; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .cl-m { clear: left; } + .cr-m { clear: right; } + .cb-m { clear: both; } + .cn-m { clear: none; } +} +@media screen and (min-width: 60em) { + .cl-l { clear: left; } + .cr-l { clear: right; } + .cb-l { clear: both; } + .cn-l { clear: none; } +} +/* + + DISPLAY + Docs: http://tachyons.io/docs/layout/display + + Base: + d = display + + Modifiers: + n = none + b = block + ib = inline-block + it = inline-table + t = table + tc = table-cell + t-row = table-row + t-columm = table-column + t-column-group = table-column-group + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.dn { display: none; } +.di { display: inline; } +.db { display: block; } +.dib { display: inline-block; } +.dit { display: inline-table; } +.dt { display: table; } +.dtc { display: table-cell; } +.dt-row { display: table-row; } +.dt-row-group { display: table-row-group; } +.dt-column { display: table-column; } +.dt-column-group { display: table-column-group; } +/* + This will set table to full width and then + all cells will be equal width +*/ +.dt--fixed { + table-layout: fixed; + width: 100%; +} +@media screen and (min-width: 30em) { + .dn-ns { display: none; } + .di-ns { display: inline; } + .db-ns { display: block; } + .dib-ns { display: inline-block; } + .dit-ns { display: inline-table; } + .dt-ns { display: table; } + .dtc-ns { display: table-cell; } + .dt-row-ns { display: table-row; } + .dt-row-group-ns { display: table-row-group; } + .dt-column-ns { display: table-column; } + .dt-column-group-ns { display: table-column-group; } + + .dt--fixed-ns { + table-layout: fixed; + width: 100%; + } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .dn-m { display: none; } + .di-m { display: inline; } + .db-m { display: block; } + .dib-m { display: inline-block; } + .dit-m { display: inline-table; } + .dt-m { display: table; } + .dtc-m { display: table-cell; } + .dt-row-m { display: table-row; } + .dt-row-group-m { display: table-row-group; } + .dt-column-m { display: table-column; } + .dt-column-group-m { display: table-column-group; } + + .dt--fixed-m { + table-layout: fixed; + width: 100%; + } +} +@media screen and (min-width: 60em) { + .dn-l { display: none; } + .di-l { display: inline; } + .db-l { display: block; } + .dib-l { display: inline-block; } + .dit-l { display: inline-table; } + .dt-l { display: table; } + .dtc-l { display: table-cell; } + .dt-row-l { display: table-row; } + .dt-row-group-l { display: table-row-group; } + .dt-column-l { display: table-column; } + .dt-column-group-l { display: table-column-group; } + + .dt--fixed-l { + table-layout: fixed; + width: 100%; + } +} +/* + + FLEXBOX + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.flex { display: -webkit-box; display: -ms-flexbox; display: flex; } +.inline-flex { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; } +/* 1. Fix for Chrome 44 bug. + * https://code.google.com/p/chromium/issues/detail?id=506893 */ +.flex-auto { + -webkit-box-flex: 1; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + min-width: 0; /* 1 */ + min-height: 0; /* 1 */ +} +.flex-none { -webkit-box-flex: 0; -ms-flex: none; flex: none; } +.flex-column { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } +.flex-row { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } +.flex-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; } +.flex-nowrap { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } +.flex-wrap-reverse { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } +.flex-column-reverse { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } +.flex-row-reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } +.items-start { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } +.items-end { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } +.items-center { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } +.items-baseline { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } +.items-stretch { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } +.self-start { -ms-flex-item-align: start; align-self: flex-start; } +.self-end { -ms-flex-item-align: end; align-self: flex-end; } +.self-center { -ms-flex-item-align: center; align-self: center; } +.self-baseline { -ms-flex-item-align: baseline; align-self: baseline; } +.self-stretch { -ms-flex-item-align: stretch; align-self: stretch; } +.justify-start { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } +.justify-end { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } +.justify-center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } +.justify-between { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } +.justify-around { -ms-flex-pack: distribute; justify-content: space-around; } +.content-start { -ms-flex-line-pack: start; align-content: flex-start; } +.content-end { -ms-flex-line-pack: end; align-content: flex-end; } +.content-center { -ms-flex-line-pack: center; align-content: center; } +.content-between { -ms-flex-line-pack: justify; align-content: space-between; } +.content-around { -ms-flex-line-pack: distribute; align-content: space-around; } +.content-stretch { -ms-flex-line-pack: stretch; align-content: stretch; } +.order-0 { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } +.order-1 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } +.order-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } +.order-3 { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } +.order-4 { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; } +.order-5 { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; } +.order-6 { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; } +.order-7 { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; } +.order-8 { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; } +.order-last { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; } +.flex-grow-0 { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; } +.flex-grow-1 { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } +.flex-shrink-0 { -ms-flex-negative: 0; flex-shrink: 0; } +.flex-shrink-1 { -ms-flex-negative: 1; flex-shrink: 1; } +@media screen and (min-width: 30em) { + .flex-ns { display: -webkit-box; display: -ms-flexbox; display: flex; } + .inline-flex-ns { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; } + .flex-auto-ns { + -webkit-box-flex: 1; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + min-width: 0; /* 1 */ + min-height: 0; /* 1 */ + } + .flex-none-ns { -webkit-box-flex: 0; -ms-flex: none; flex: none; } + .flex-column-ns { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } + .flex-row-ns { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } + .flex-wrap-ns { -ms-flex-wrap: wrap; flex-wrap: wrap; } + .flex-nowrap-ns { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } + .flex-wrap-reverse-ns { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } + .flex-column-reverse-ns { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } + .flex-row-reverse-ns { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } + .items-start-ns { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } + .items-end-ns { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } + .items-center-ns { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } + .items-baseline-ns { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } + .items-stretch-ns { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } + + .self-start-ns { -ms-flex-item-align: start; align-self: flex-start; } + .self-end-ns { -ms-flex-item-align: end; align-self: flex-end; } + .self-center-ns { -ms-flex-item-align: center; align-self: center; } + .self-baseline-ns { -ms-flex-item-align: baseline; align-self: baseline; } + .self-stretch-ns { -ms-flex-item-align: stretch; align-self: stretch; } + + .justify-start-ns { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } + .justify-end-ns { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } + .justify-center-ns { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } + .justify-between-ns { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } + .justify-around-ns { -ms-flex-pack: distribute; justify-content: space-around; } + + .content-start-ns { -ms-flex-line-pack: start; align-content: flex-start; } + .content-end-ns { -ms-flex-line-pack: end; align-content: flex-end; } + .content-center-ns { -ms-flex-line-pack: center; align-content: center; } + .content-between-ns { -ms-flex-line-pack: justify; align-content: space-between; } + .content-around-ns { -ms-flex-line-pack: distribute; align-content: space-around; } + .content-stretch-ns { -ms-flex-line-pack: stretch; align-content: stretch; } + + .order-0-ns { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } + .order-1-ns { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } + .order-2-ns { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } + .order-3-ns { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } + .order-4-ns { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; } + .order-5-ns { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; } + .order-6-ns { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; } + .order-7-ns { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; } + .order-8-ns { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; } + .order-last-ns { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; } + + .flex-grow-0-ns { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; } + .flex-grow-1-ns { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } + + .flex-shrink-0-ns { -ms-flex-negative: 0; flex-shrink: 0; } + .flex-shrink-1-ns { -ms-flex-negative: 1; flex-shrink: 1; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .flex-m { display: -webkit-box; display: -ms-flexbox; display: flex; } + .inline-flex-m { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; } + .flex-auto-m { + -webkit-box-flex: 1; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + min-width: 0; /* 1 */ + min-height: 0; /* 1 */ + } + .flex-none-m { -webkit-box-flex: 0; -ms-flex: none; flex: none; } + .flex-column-m { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } + .flex-row-m { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } + .flex-wrap-m { -ms-flex-wrap: wrap; flex-wrap: wrap; } + .flex-nowrap-m { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } + .flex-wrap-reverse-m { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } + .flex-column-reverse-m { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } + .flex-row-reverse-m { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } + .items-start-m { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } + .items-end-m { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } + .items-center-m { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } + .items-baseline-m { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } + .items-stretch-m { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } + + .self-start-m { -ms-flex-item-align: start; align-self: flex-start; } + .self-end-m { -ms-flex-item-align: end; align-self: flex-end; } + .self-center-m { -ms-flex-item-align: center; align-self: center; } + .self-baseline-m { -ms-flex-item-align: baseline; align-self: baseline; } + .self-stretch-m { -ms-flex-item-align: stretch; align-self: stretch; } + + .justify-start-m { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } + .justify-end-m { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } + .justify-center-m { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } + .justify-between-m { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } + .justify-around-m { -ms-flex-pack: distribute; justify-content: space-around; } + + .content-start-m { -ms-flex-line-pack: start; align-content: flex-start; } + .content-end-m { -ms-flex-line-pack: end; align-content: flex-end; } + .content-center-m { -ms-flex-line-pack: center; align-content: center; } + .content-between-m { -ms-flex-line-pack: justify; align-content: space-between; } + .content-around-m { -ms-flex-line-pack: distribute; align-content: space-around; } + .content-stretch-m { -ms-flex-line-pack: stretch; align-content: stretch; } + + .order-0-m { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } + .order-1-m { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } + .order-2-m { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } + .order-3-m { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } + .order-4-m { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; } + .order-5-m { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; } + .order-6-m { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; } + .order-7-m { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; } + .order-8-m { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; } + .order-last-m { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; } + + .flex-grow-0-m { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; } + .flex-grow-1-m { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } + + .flex-shrink-0-m { -ms-flex-negative: 0; flex-shrink: 0; } + .flex-shrink-1-m { -ms-flex-negative: 1; flex-shrink: 1; } +} +@media screen and (min-width: 60em) { + .flex-l { display: -webkit-box; display: -ms-flexbox; display: flex; } + .inline-flex-l { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; } + .flex-auto-l { + -webkit-box-flex: 1; + -ms-flex: 1 1 auto; + flex: 1 1 auto; + min-width: 0; /* 1 */ + min-height: 0; /* 1 */ + } + .flex-none-l { -webkit-box-flex: 0; -ms-flex: none; flex: none; } + .flex-column-l { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } + .flex-row-l { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } + .flex-wrap-l { -ms-flex-wrap: wrap; flex-wrap: wrap; } + .flex-nowrap-l { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } + .flex-wrap-reverse-l { -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; } + .flex-column-reverse-l { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } + .flex-row-reverse-l { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } + + .items-start-l { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } + .items-end-l { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } + .items-center-l { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } + .items-baseline-l { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } + .items-stretch-l { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } + + .self-start-l { -ms-flex-item-align: start; align-self: flex-start; } + .self-end-l { -ms-flex-item-align: end; align-self: flex-end; } + .self-center-l { -ms-flex-item-align: center; align-self: center; } + .self-baseline-l { -ms-flex-item-align: baseline; align-self: baseline; } + .self-stretch-l { -ms-flex-item-align: stretch; align-self: stretch; } + + .justify-start-l { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } + .justify-end-l { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } + .justify-center-l { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } + .justify-between-l { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } + .justify-around-l { -ms-flex-pack: distribute; justify-content: space-around; } + + .content-start-l { -ms-flex-line-pack: start; align-content: flex-start; } + .content-end-l { -ms-flex-line-pack: end; align-content: flex-end; } + .content-center-l { -ms-flex-line-pack: center; align-content: center; } + .content-between-l { -ms-flex-line-pack: justify; align-content: space-between; } + .content-around-l { -ms-flex-line-pack: distribute; align-content: space-around; } + .content-stretch-l { -ms-flex-line-pack: stretch; align-content: stretch; } + + .order-0-l { -webkit-box-ordinal-group: 1; -ms-flex-order: 0; order: 0; } + .order-1-l { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } + .order-2-l { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } + .order-3-l { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } + .order-4-l { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; } + .order-5-l { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; } + .order-6-l { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6; } + .order-7-l { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7; } + .order-8-l { -webkit-box-ordinal-group: 9; -ms-flex-order: 8; order: 8; } + .order-last-l { -webkit-box-ordinal-group: 100000; -ms-flex-order: 99999; order: 99999; } + + .flex-grow-0-l { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; } + .flex-grow-1-l { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } + + .flex-shrink-0-l { -ms-flex-negative: 0; flex-shrink: 0; } + .flex-shrink-1-l { -ms-flex-negative: 1; flex-shrink: 1; } +} +/* + + FLOATS + http://tachyons.io/docs/layout/floats/ + + 1. Floated elements are automatically rendered as block level elements. + Setting floats to display inline will fix the double margin bug in + ie6. You know... just in case. + + 2. Don't forget to clearfix your floats with .cf + + Base: + f = float + + Modifiers: + l = left + r = right + n = none + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.fl { float: left; _display: inline; } +.fr { float: right; _display: inline; } +.fn { float: none; } +@media screen and (min-width: 30em) { + .fl-ns { float: left; _display: inline; } + .fr-ns { float: right; _display: inline; } + .fn-ns { float: none; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .fl-m { float: left; _display: inline; } + .fr-m { float: right; _display: inline; } + .fn-m { float: none; } +} +@media screen and (min-width: 60em) { + .fl-l { float: left; _display: inline; } + .fr-l { float: right; _display: inline; } + .fn-l { float: none; } +} +/*@import 'tachyons/src/_font-family';*/ +/* + + FONT STYLE + Docs: http://tachyons.io/docs/typography/font-style/ + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.i { font-style: italic; } +.fs-normal { font-style: normal; } +@media screen and (min-width: 30em) { + .i-ns { font-style: italic; } + .fs-normal-ns { font-style: normal; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .i-m { font-style: italic; } + .fs-normal-m { font-style: normal; } +} +@media screen and (min-width: 60em) { + .i-l { font-style: italic; } + .fs-normal-l { font-style: normal; } +} +/* + + FONT WEIGHT + Docs: http://tachyons.io/docs/typography/font-weight/ + + Base + fw = font-weight + + Modifiers: + 1 = literal value 100 + 2 = literal value 200 + 3 = literal value 300 + 4 = literal value 400 + 5 = literal value 500 + 6 = literal value 600 + 7 = literal value 700 + 8 = literal value 800 + 9 = literal value 900 + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.normal { font-weight: normal; } +.b { font-weight: bold; } +.fw1 { font-weight: 100; } +.fw2 { font-weight: 200; } +.fw3 { font-weight: 300; } +.fw4 { font-weight: 400; } +.fw5 { font-weight: 500; } +.fw6 { font-weight: 600; } +.fw7 { font-weight: 700; } +.fw8 { font-weight: 800; } +.fw9 { font-weight: 900; } +@media screen and (min-width: 30em) { + .normal-ns { font-weight: normal; } + .b-ns { font-weight: bold; } + .fw1-ns { font-weight: 100; } + .fw2-ns { font-weight: 200; } + .fw3-ns { font-weight: 300; } + .fw4-ns { font-weight: 400; } + .fw5-ns { font-weight: 500; } + .fw6-ns { font-weight: 600; } + .fw7-ns { font-weight: 700; } + .fw8-ns { font-weight: 800; } + .fw9-ns { font-weight: 900; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .normal-m { font-weight: normal; } + .b-m { font-weight: bold; } + .fw1-m { font-weight: 100; } + .fw2-m { font-weight: 200; } + .fw3-m { font-weight: 300; } + .fw4-m { font-weight: 400; } + .fw5-m { font-weight: 500; } + .fw6-m { font-weight: 600; } + .fw7-m { font-weight: 700; } + .fw8-m { font-weight: 800; } + .fw9-m { font-weight: 900; } +} +@media screen and (min-width: 60em) { + .normal-l { font-weight: normal; } + .b-l { font-weight: bold; } + .fw1-l { font-weight: 100; } + .fw2-l { font-weight: 200; } + .fw3-l { font-weight: 300; } + .fw4-l { font-weight: 400; } + .fw5-l { font-weight: 500; } + .fw6-l { font-weight: 600; } + .fw7-l { font-weight: 700; } + .fw8-l { font-weight: 800; } + .fw9-l { font-weight: 900; } +} +/* + + FORMS + +*/ +.input-reset { + -webkit-appearance: none; + -moz-appearance: none; +} +.button-reset::-moz-focus-inner, +.input-reset::-moz-focus-inner { + border: 0; + padding: 0; +} +/* + + HEIGHTS + Docs: http://tachyons.io/docs/layout/heights/ + + Base: + h = height + min-h = min-height + min-vh = min-height vertical screen height + vh = vertical screen height + + Modifiers + 1 = 1st step in height scale + 2 = 2nd step in height scale + 3 = 3rd step in height scale + 4 = 4th step in height scale + 5 = 5th step in height scale + + -25 = literal value 25% + -50 = literal value 50% + -75 = literal value 75% + -100 = literal value 100% + + -auto = string value of auto + -inherit = string value of inherit + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +/* Height Scale */ +.h1 { height: 1rem; } +.h2 { height: 2rem; } +.h3 { height: 4rem; } +.h4 { height: 8rem; } +.h5 { height: 16rem; } +/* Height Percentages - Based off of height of parent */ +.h-25 { height: 25%; } +.h-50 { height: 50%; } +.h-75 { height: 75%; } +.h-100 { height: 100%; } +.min-h-100 { min-height: 100%; } +/* Screen Height Percentage */ +.vh-25 { height: 25vh; } +.vh-50 { height: 50vh; } +.vh-75 { height: 75vh; } +.vh-100 { height: 100vh; } +.min-vh-100 { min-height: 100vh; } +/* String Properties */ +.h-auto { height: auto; } +.h-inherit { height: inherit; } +@media screen and (min-width: 30em) { + .h1-ns { height: 1rem; } + .h2-ns { height: 2rem; } + .h3-ns { height: 4rem; } + .h4-ns { height: 8rem; } + .h5-ns { height: 16rem; } + .h-25-ns { height: 25%; } + .h-50-ns { height: 50%; } + .h-75-ns { height: 75%; } + .h-100-ns { height: 100%; } + .min-h-100-ns { min-height: 100%; } + .vh-25-ns { height: 25vh; } + .vh-50-ns { height: 50vh; } + .vh-75-ns { height: 75vh; } + .vh-100-ns { height: 100vh; } + .min-vh-100-ns { min-height: 100vh; } + .h-auto-ns { height: auto; } + .h-inherit-ns { height: inherit; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .h1-m { height: 1rem; } + .h2-m { height: 2rem; } + .h3-m { height: 4rem; } + .h4-m { height: 8rem; } + .h5-m { height: 16rem; } + .h-25-m { height: 25%; } + .h-50-m { height: 50%; } + .h-75-m { height: 75%; } + .h-100-m { height: 100%; } + .min-h-100-m { min-height: 100%; } + .vh-25-m { height: 25vh; } + .vh-50-m { height: 50vh; } + .vh-75-m { height: 75vh; } + .vh-100-m { height: 100vh; } + .min-vh-100-m { min-height: 100vh; } + .h-auto-m { height: auto; } + .h-inherit-m { height: inherit; } +} +@media screen and (min-width: 60em) { + .h1-l { height: 1rem; } + .h2-l { height: 2rem; } + .h3-l { height: 4rem; } + .h4-l { height: 8rem; } + .h5-l { height: 16rem; } + .h-25-l { height: 25%; } + .h-50-l { height: 50%; } + .h-75-l { height: 75%; } + .h-100-l { height: 100%; } + .min-h-100-l { min-height: 100%; } + .vh-25-l { height: 25vh; } + .vh-50-l { height: 50vh; } + .vh-75-l { height: 75vh; } + .vh-100-l { height: 100vh; } + .min-vh-100-l { min-height: 100vh; } + .h-auto-l { height: auto; } + .h-inherit-l { height: inherit; } +} +/* + + LETTER SPACING + Docs: http://tachyons.io/docs/typography/tracking/ + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.tracked { letter-spacing: .1em; } +.tracked-tight { letter-spacing: -.05em; } +.tracked-mega { letter-spacing: .25em; } +@media screen and (min-width: 30em) { + .tracked-ns { letter-spacing: .1em; } + .tracked-tight-ns { letter-spacing: -.05em; } + .tracked-mega-ns { letter-spacing: .25em; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .tracked-m { letter-spacing: .1em; } + .tracked-tight-m { letter-spacing: -.05em; } + .tracked-mega-m { letter-spacing: .25em; } +} +@media screen and (min-width: 60em) { + .tracked-l { letter-spacing: .1em; } + .tracked-tight-l { letter-spacing: -.05em; } + .tracked-mega-l { letter-spacing: .25em; } +} +/* + + LINE HEIGHT / LEADING + Docs: http://tachyons.io/docs/typography/line-height + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.lh-solid { line-height: 1; } +.lh-title { line-height: 1.25; } +.lh-copy { line-height: 1.5; } +@media screen and (min-width: 30em) { + .lh-solid-ns { line-height: 1; } + .lh-title-ns { line-height: 1.25; } + .lh-copy-ns { line-height: 1.5; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .lh-solid-m { line-height: 1; } + .lh-title-m { line-height: 1.25; } + .lh-copy-m { line-height: 1.5; } +} +@media screen and (min-width: 60em) { + .lh-solid-l { line-height: 1; } + .lh-title-l { line-height: 1.25; } + .lh-copy-l { line-height: 1.5; } +} +/* + + LINKS + Docs: http://tachyons.io/docs/elements/links/ + +*/ +.link { + text-decoration: none; + -webkit-transition: color .15s ease-in; + transition: color .15s ease-in; +} +.link:link, +.link:visited { + -webkit-transition: color .15s ease-in; + transition: color .15s ease-in; +} +.link:hover { + -webkit-transition: color .15s ease-in; + transition: color .15s ease-in; +} +.link:active { + -webkit-transition: color .15s ease-in; + transition: color .15s ease-in; +} +.link:focus { + -webkit-transition: color .15s ease-in; + transition: color .15s ease-in; + outline: 1px dotted currentColor; +} +/* + + LISTS + http://tachyons.io/docs/elements/lists/ + +*/ +.list { list-style-type: none; } +/* + + MAX WIDTHS + Docs: http://tachyons.io/docs/layout/max-widths/ + + Base: + mw = max-width + + Modifiers + 1 = 1st step in width scale + 2 = 2nd step in width scale + 3 = 3rd step in width scale + 4 = 4th step in width scale + 5 = 5th step in width scale + 6 = 6st step in width scale + 7 = 7nd step in width scale + 8 = 8rd step in width scale + 9 = 9th step in width scale + + -100 = literal value 100% + + -none = string value none + + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +/* Max Width Percentages */ +.mw-100 { max-width: 100%; } +/* Max Width Scale */ +.mw1 { max-width: 1rem; } +.mw2 { max-width: 2rem; } +.mw3 { max-width: 4rem; } +.mw4 { max-width: 8rem; } +.mw5 { max-width: 16rem; } +.mw6 { max-width: 32rem; } +.mw7 { max-width: 48rem; } +.mw8 { max-width: 64rem; } +.mw9 { max-width: 96rem; } +/* Max Width String Properties */ +.mw-none { max-width: none; } +@media screen and (min-width: 30em) { + .mw-100-ns { max-width: 100%; } + + .mw1-ns { max-width: 1rem; } + .mw2-ns { max-width: 2rem; } + .mw3-ns { max-width: 4rem; } + .mw4-ns { max-width: 8rem; } + .mw5-ns { max-width: 16rem; } + .mw6-ns { max-width: 32rem; } + .mw7-ns { max-width: 48rem; } + .mw8-ns { max-width: 64rem; } + .mw9-ns { max-width: 96rem; } + + .mw-none-ns { max-width: none; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .mw-100-m { max-width: 100%; } + + .mw1-m { max-width: 1rem; } + .mw2-m { max-width: 2rem; } + .mw3-m { max-width: 4rem; } + .mw4-m { max-width: 8rem; } + .mw5-m { max-width: 16rem; } + .mw6-m { max-width: 32rem; } + .mw7-m { max-width: 48rem; } + .mw8-m { max-width: 64rem; } + .mw9-m { max-width: 96rem; } + + .mw-none-m { max-width: none; } +} +@media screen and (min-width: 60em) { + .mw-100-l { max-width: 100%; } + + .mw1-l { max-width: 1rem; } + .mw2-l { max-width: 2rem; } + .mw3-l { max-width: 4rem; } + .mw4-l { max-width: 8rem; } + .mw5-l { max-width: 16rem; } + .mw6-l { max-width: 32rem; } + .mw7-l { max-width: 48rem; } + .mw8-l { max-width: 64rem; } + .mw9-l { max-width: 96rem; } + + .mw-none-l { max-width: none; } +} +/* + + WIDTHS + Docs: http://tachyons.io/docs/layout/widths/ + + Base: + w = width + + Modifiers + 1 = 1st step in width scale + 2 = 2nd step in width scale + 3 = 3rd step in width scale + 4 = 4th step in width scale + 5 = 5th step in width scale + + -10 = literal value 10% + -20 = literal value 20% + -25 = literal value 25% + -30 = literal value 30% + -33 = literal value 33% + -34 = literal value 34% + -40 = literal value 40% + -50 = literal value 50% + -60 = literal value 60% + -70 = literal value 70% + -75 = literal value 75% + -80 = literal value 80% + -90 = literal value 90% + -100 = literal value 100% + + -third = 100% / 3 (Not supported in opera mini or IE8) + -two-thirds = 100% / 1.5 (Not supported in opera mini or IE8) + -auto = string value auto + + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +/* Width Scale */ +.w1 { width: 1rem; } +.w2 { width: 2rem; } +.w3 { width: 4rem; } +.w4 { width: 8rem; } +.w5 { width: 16rem; } +.w-10 { width: 10%; } +.w-20 { width: 20%; } +.w-25 { width: 25%; } +.w-30 { width: 30%; } +.w-33 { width: 33%; } +.w-34 { width: 34%; } +.w-40 { width: 40%; } +.w-50 { width: 50%; } +.w-60 { width: 60%; } +.w-70 { width: 70%; } +.w-75 { width: 75%; } +.w-80 { width: 80%; } +.w-90 { width: 90%; } +.w-100 { width: 100%; } +.w-third { width: 33.33333%; } +.w-two-thirds { width: 66.66667%; } +.w-auto { width: auto; } +@media screen and (min-width: 30em) { + .w1-ns { width: 1rem; } + .w2-ns { width: 2rem; } + .w3-ns { width: 4rem; } + .w4-ns { width: 8rem; } + .w5-ns { width: 16rem; } + .w-10-ns { width: 10%; } + .w-20-ns { width: 20%; } + .w-25-ns { width: 25%; } + .w-30-ns { width: 30%; } + .w-33-ns { width: 33%; } + .w-34-ns { width: 34%; } + .w-40-ns { width: 40%; } + .w-50-ns { width: 50%; } + .w-60-ns { width: 60%; } + .w-70-ns { width: 70%; } + .w-75-ns { width: 75%; } + .w-80-ns { width: 80%; } + .w-90-ns { width: 90%; } + .w-100-ns { width: 100%; } + .w-third-ns { width: 33.33333%; } + .w-two-thirds-ns { width: 66.66667%; } + .w-auto-ns { width: auto; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .w1-m { width: 1rem; } + .w2-m { width: 2rem; } + .w3-m { width: 4rem; } + .w4-m { width: 8rem; } + .w5-m { width: 16rem; } + .w-10-m { width: 10%; } + .w-20-m { width: 20%; } + .w-25-m { width: 25%; } + .w-30-m { width: 30%; } + .w-33-m { width: 33%; } + .w-34-m { width: 34%; } + .w-40-m { width: 40%; } + .w-50-m { width: 50%; } + .w-60-m { width: 60%; } + .w-70-m { width: 70%; } + .w-75-m { width: 75%; } + .w-80-m { width: 80%; } + .w-90-m { width: 90%; } + .w-100-m { width: 100%; } + .w-third-m { width: 33.33333%; } + .w-two-thirds-m { width: 66.66667%; } + .w-auto-m { width: auto; } +} +@media screen and (min-width: 60em) { + .w1-l { width: 1rem; } + .w2-l { width: 2rem; } + .w3-l { width: 4rem; } + .w4-l { width: 8rem; } + .w5-l { width: 16rem; } + .w-10-l { width: 10%; } + .w-20-l { width: 20%; } + .w-25-l { width: 25%; } + .w-30-l { width: 30%; } + .w-33-l { width: 33%; } + .w-34-l { width: 34%; } + .w-40-l { width: 40%; } + .w-50-l { width: 50%; } + .w-60-l { width: 60%; } + .w-70-l { width: 70%; } + .w-75-l { width: 75%; } + .w-80-l { width: 80%; } + .w-90-l { width: 90%; } + .w-100-l { width: 100%; } + .w-third-l { width: 33.33333%; } + .w-two-thirds-l { width: 66.66667%; } + .w-auto-l { width: auto; } +} +/* + + OVERFLOW + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + + */ +.overflow-visible { overflow: visible; } +.overflow-hidden { overflow: hidden; } +.overflow-scroll { overflow: scroll; } +.overflow-auto { overflow: auto; } +.overflow-x-visible { overflow-x: visible; } +.overflow-x-hidden { overflow-x: hidden; } +.overflow-x-scroll { overflow-x: scroll; } +.overflow-x-auto { overflow-x: auto; } +.overflow-y-visible { overflow-y: visible; } +.overflow-y-hidden { overflow-y: hidden; } +.overflow-y-scroll { overflow-y: scroll; } +.overflow-y-auto { overflow-y: auto; } +@media screen and (min-width: 30em) { + .overflow-visible-ns { overflow: visible; } + .overflow-hidden-ns { overflow: hidden; } + .overflow-scroll-ns { overflow: scroll; } + .overflow-auto-ns { overflow: auto; } + .overflow-x-visible-ns { overflow-x: visible; } + .overflow-x-hidden-ns { overflow-x: hidden; } + .overflow-x-scroll-ns { overflow-x: scroll; } + .overflow-x-auto-ns { overflow-x: auto; } + + .overflow-y-visible-ns { overflow-y: visible; } + .overflow-y-hidden-ns { overflow-y: hidden; } + .overflow-y-scroll-ns { overflow-y: scroll; } + .overflow-y-auto-ns { overflow-y: auto; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .overflow-visible-m { overflow: visible; } + .overflow-hidden-m { overflow: hidden; } + .overflow-scroll-m { overflow: scroll; } + .overflow-auto-m { overflow: auto; } + + .overflow-x-visible-m { overflow-x: visible; } + .overflow-x-hidden-m { overflow-x: hidden; } + .overflow-x-scroll-m { overflow-x: scroll; } + .overflow-x-auto-m { overflow-x: auto; } + + .overflow-y-visible-m { overflow-y: visible; } + .overflow-y-hidden-m { overflow-y: hidden; } + .overflow-y-scroll-m { overflow-y: scroll; } + .overflow-y-auto-m { overflow-y: auto; } +} +@media screen and (min-width: 60em) { + .overflow-visible-l { overflow: visible; } + .overflow-hidden-l { overflow: hidden; } + .overflow-scroll-l { overflow: scroll; } + .overflow-auto-l { overflow: auto; } + + .overflow-x-visible-l { overflow-x: visible; } + .overflow-x-hidden-l { overflow-x: hidden; } + .overflow-x-scroll-l { overflow-x: scroll; } + .overflow-x-auto-l { overflow-x: auto; } + + .overflow-y-visible-l { overflow-y: visible; } + .overflow-y-hidden-l { overflow-y: hidden; } + .overflow-y-scroll-l { overflow-y: scroll; } + .overflow-y-auto-l { overflow-y: auto; } +} +/* + + POSITIONING + Docs: http://tachyons.io/docs/layout/position/ + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.static { position: static; } +.relative { position: relative; } +.absolute { position: absolute; } +.fixed { position: fixed; } +@media screen and (min-width: 30em) { + .static-ns { position: static; } + .relative-ns { position: relative; } + .absolute-ns { position: absolute; } + .fixed-ns { position: fixed; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .static-m { position: static; } + .relative-m { position: relative; } + .absolute-m { position: absolute; } + .fixed-m { position: fixed; } +} +@media screen and (min-width: 60em) { + .static-l { position: static; } + .relative-l { position: relative; } + .absolute-l { position: absolute; } + .fixed-l { position: fixed; } +} +/* + + OPACITY + Docs: http://tachyons.io/docs/themes/opacity/ + +*/ +.o-100 { opacity: 1; } +.o-90 { opacity: .9; } +.o-80 { opacity: .8; } +.o-70 { opacity: .7; } +.o-60 { opacity: .6; } +.o-50 { opacity: .5; } +.o-40 { opacity: .4; } +.o-30 { opacity: .3; } +.o-20 { opacity: .2; } +.o-10 { opacity: .1; } +.o-05 { opacity: .05; } +.o-025 { opacity: .025; } +.o-0 { opacity: 0; } +/*@import 'tachyons/src/_rotations';*/ +/* + + SKINS + Docs: http://tachyons.io/docs/themes/skins/ + + Classes for setting foreground and background colors on elements. + If you haven't declared a border color, but set border on an element, it will + be set to the current text color. + +*/ +/* Text colors */ +.black-90 { color: rgba(0, 0, 0, .9); } +.black-80 { color: rgba(0, 0, 0, .8); } +.black-70 { color: rgba(0, 0, 0, .7); } +.black-60 { color: rgba(0, 0, 0, .6); } +.black-50 { color: rgba(0, 0, 0, .5); } +.black-40 { color: rgba(0, 0, 0, .4); } +.black-30 { color: rgba(0, 0, 0, .3); } +.black-20 { color: rgba(0, 0, 0, .2); } +.black-10 { color: rgba(0, 0, 0, .1); } +.black-05 { color: rgba(0, 0, 0, .05); } +.white-90 { color: rgba(255, 255, 255, .9); } +.white-80 { color: rgba(255, 255, 255, .8); } +.white-70 { color: rgba(255, 255, 255, .7); } +.white-60 { color: rgba(255, 255, 255, .6); } +.white-50 { color: rgba(255, 255, 255, .5); } +.white-40 { color: rgba(255, 255, 255, .4); } +.white-30 { color: rgba(255, 255, 255, .3); } +.white-20 { color: rgba(255, 255, 255, .2); } +.white-10 { color: rgba(255, 255, 255, .1); } +.black { color: #000; } +.near-black { color: #111; } +.dark-gray { color: #333; } +.mid-gray { color: #555; } +.gray { color: #777; } +.silver { color: #999; } +.light-silver { color: #aaa; } +.moon-gray { color: #ccc; } +.light-gray { color: #eee; } +.near-white { color: #f4f4f4; } +.white { color: #fff; } +.dark-red { color: #e7040f; } +.red { color: #ff4136; } +.light-red { color: #ff725c; } +.orange { color: #ff6300; } +.gold { color: #ffb700; } +.yellow { color: #ffd700; } +.light-yellow { color: #fbf1a9; } +.purple { color: #5e2ca5; } +.light-purple { color: #a463f2; } +.dark-pink { color: #d5008f; } +.hot-pink { color: #ff41b4; } +.pink { color: #ff80cc; } +.light-pink { color: #ffa3d7; } +.dark-green { color: #137752; } +.green { color: #19a974; } +.light-green { color: #9eebcf; } +.navy { color: #001b44; } +.dark-blue { color: #00449e; } +.blue { color: #0594CB; } +.light-blue { color: #96ccff; } +.lightest-blue { color: #cdecff; } +.washed-blue { color: #f6fffe; } +.washed-green { color: #e8fdf5; } +.washed-yellow { color: #fffceb; } +.washed-red { color: #ffdfdf; } +.color-inherit { color: inherit; } +.bg-black-90 { background-color: rgba(0, 0, 0, .9); } +.bg-black-80 { background-color: rgba(0, 0, 0, .8); } +.bg-black-70 { background-color: rgba(0, 0, 0, .7); } +.bg-black-60 { background-color: rgba(0, 0, 0, .6); } +.bg-black-50 { background-color: rgba(0, 0, 0, .5); } +.bg-black-40 { background-color: rgba(0, 0, 0, .4); } +.bg-black-30 { background-color: rgba(0, 0, 0, .3); } +.bg-black-20 { background-color: rgba(0, 0, 0, .2); } +.bg-black-10 { background-color: rgba(0, 0, 0, .1); } +.bg-black-05 { background-color: rgba(0, 0, 0, .05); } +.bg-white-90 { background-color: rgba(255, 255, 255, .9); } +.bg-white-80 { background-color: rgba(255, 255, 255, .8); } +.bg-white-70 { background-color: rgba(255, 255, 255, .7); } +.bg-white-60 { background-color: rgba(255, 255, 255, .6); } +.bg-white-50 { background-color: rgba(255, 255, 255, .5); } +.bg-white-40 { background-color: rgba(255, 255, 255, .4); } +.bg-white-30 { background-color: rgba(255, 255, 255, .3); } +.bg-white-20 { background-color: rgba(255, 255, 255, .2); } +.bg-white-10 { background-color: rgba(255, 255, 255, .1); } +/* Background colors */ +.bg-black { background-color: #000; } +.bg-near-black { background-color: #111; } +.bg-dark-gray { background-color: #333; } +.bg-mid-gray { background-color: #555; } +.bg-gray { background-color: #777; } +.bg-silver { background-color: #999; } +.bg-light-silver { background-color: #aaa; } +.bg-moon-gray { background-color: #ccc; } +.bg-light-gray { background-color: #eee; } +.bg-near-white { background-color: #f4f4f4; } +.bg-white { background-color: #fff; } +.bg-transparent { background-color: transparent; } +.bg-dark-red { background-color: #e7040f; } +.bg-red { background-color: #ff4136; } +.bg-light-red { background-color: #ff725c; } +.bg-orange { background-color: #ff6300; } +.bg-gold { background-color: #ffb700; } +.bg-yellow { background-color: #ffd700; } +.bg-light-yellow { background-color: #fbf1a9; } +.bg-purple { background-color: #5e2ca5; } +.bg-light-purple { background-color: #a463f2; } +.bg-dark-pink { background-color: #d5008f; } +.bg-hot-pink { background-color: #ff41b4; } +.bg-pink { background-color: #ff80cc; } +.bg-light-pink { background-color: #ffa3d7; } +.bg-dark-green { background-color: #137752; } +.bg-green { background-color: #19a974; } +.bg-light-green { background-color: #9eebcf; } +.bg-navy { background-color: #001b44; } +.bg-dark-blue { background-color: #00449e; } +.bg-blue { background-color: #0594CB; } +.bg-light-blue { background-color: #96ccff; } +.bg-lightest-blue { background-color: #cdecff; } +.bg-washed-blue { background-color: #f6fffe; } +.bg-washed-green { background-color: #e8fdf5; } +.bg-washed-yellow { background-color: #fffceb; } +.bg-washed-red { background-color: #ffdfdf; } +.bg-inherit { background-color: inherit; } +/* + + SKINS:PSEUDO + + Customize the color of an element when + it is focused or hovered over. + + */ +.hover-black:hover, +.hover-black:focus { color: #000; } +.hover-near-black:hover, +.hover-near-black:focus { color: #111; } +.hover-dark-gray:hover, +.hover-dark-gray:focus { color: #333; } +.hover-mid-gray:hover, +.hover-mid-gray:focus { color: #555; } +.hover-gray:hover, +.hover-gray:focus { color: #777; } +.hover-silver:hover, +.hover-silver:focus { color: #999; } +.hover-light-silver:hover, +.hover-light-silver:focus { color: #aaa; } +.hover-moon-gray:hover, +.hover-moon-gray:focus { color: #ccc; } +.hover-light-gray:hover, +.hover-light-gray:focus { color: #eee; } +.hover-near-white:hover, +.hover-near-white:focus { color: #f4f4f4; } +.hover-white:hover, +.hover-white:focus { color: #fff; } +.hover-black-90:hover, +.hover-black-90:focus { color: rgba(0, 0, 0, .9); } +.hover-black-80:hover, +.hover-black-80:focus { color: rgba(0, 0, 0, .8); } +.hover-black-70:hover, +.hover-black-70:focus { color: rgba(0, 0, 0, .7); } +.hover-black-60:hover, +.hover-black-60:focus { color: rgba(0, 0, 0, .6); } +.hover-black-50:hover, +.hover-black-50:focus { color: rgba(0, 0, 0, .5); } +.hover-black-40:hover, +.hover-black-40:focus { color: rgba(0, 0, 0, .4); } +.hover-black-30:hover, +.hover-black-30:focus { color: rgba(0, 0, 0, .3); } +.hover-black-20:hover, +.hover-black-20:focus { color: rgba(0, 0, 0, .2); } +.hover-black-10:hover, +.hover-black-10:focus { color: rgba(0, 0, 0, .1); } +.hover-white-90:hover, +.hover-white-90:focus { color: rgba(255, 255, 255, .9); } +.hover-white-80:hover, +.hover-white-80:focus { color: rgba(255, 255, 255, .8); } +.hover-white-70:hover, +.hover-white-70:focus { color: rgba(255, 255, 255, .7); } +.hover-white-60:hover, +.hover-white-60:focus { color: rgba(255, 255, 255, .6); } +.hover-white-50:hover, +.hover-white-50:focus { color: rgba(255, 255, 255, .5); } +.hover-white-40:hover, +.hover-white-40:focus { color: rgba(255, 255, 255, .4); } +.hover-white-30:hover, +.hover-white-30:focus { color: rgba(255, 255, 255, .3); } +.hover-white-20:hover, +.hover-white-20:focus { color: rgba(255, 255, 255, .2); } +.hover-white-10:hover, +.hover-white-10:focus { color: rgba(255, 255, 255, .1); } +.hover-inherit:hover, +.hover-inherit:focus { color: inherit; } +.hover-bg-black:hover, +.hover-bg-black:focus { background-color: #000; } +.hover-bg-near-black:hover, +.hover-bg-near-black:focus { background-color: #111; } +.hover-bg-dark-gray:hover, +.hover-bg-dark-gray:focus { background-color: #333; } +.hover-bg-mid-gray:hover, +.hover-bg-mid-gray:focus { background-color: #555; } +.hover-bg-gray:hover, +.hover-bg-gray:focus { background-color: #777; } +.hover-bg-silver:hover, +.hover-bg-silver:focus { background-color: #999; } +.hover-bg-light-silver:hover, +.hover-bg-light-silver:focus { background-color: #aaa; } +.hover-bg-moon-gray:hover, +.hover-bg-moon-gray:focus { background-color: #ccc; } +.hover-bg-light-gray:hover, +.hover-bg-light-gray:focus { background-color: #eee; } +.hover-bg-near-white:hover, +.hover-bg-near-white:focus { background-color: #f4f4f4; } +.hover-bg-white:hover, +.hover-bg-white:focus { background-color: #fff; } +.hover-bg-transparent:hover, +.hover-bg-transparent:focus { background-color: transparent; } +.hover-bg-black-90:hover, +.hover-bg-black-90:focus { background-color: rgba(0, 0, 0, .9); } +.hover-bg-black-80:hover, +.hover-bg-black-80:focus { background-color: rgba(0, 0, 0, .8); } +.hover-bg-black-70:hover, +.hover-bg-black-70:focus { background-color: rgba(0, 0, 0, .7); } +.hover-bg-black-60:hover, +.hover-bg-black-60:focus { background-color: rgba(0, 0, 0, .6); } +.hover-bg-black-50:hover, +.hover-bg-black-50:focus { background-color: rgba(0, 0, 0, .5); } +.hover-bg-black-40:hover, +.hover-bg-black-40:focus { background-color: rgba(0, 0, 0, .4); } +.hover-bg-black-30:hover, +.hover-bg-black-30:focus { background-color: rgba(0, 0, 0, .3); } +.hover-bg-black-20:hover, +.hover-bg-black-20:focus { background-color: rgba(0, 0, 0, .2); } +.hover-bg-black-10:hover, +.hover-bg-black-10:focus { background-color: rgba(0, 0, 0, .1); } +.hover-bg-white-90:hover, +.hover-bg-white-90:focus { background-color: rgba(255, 255, 255, .9); } +.hover-bg-white-80:hover, +.hover-bg-white-80:focus { background-color: rgba(255, 255, 255, .8); } +.hover-bg-white-70:hover, +.hover-bg-white-70:focus { background-color: rgba(255, 255, 255, .7); } +.hover-bg-white-60:hover, +.hover-bg-white-60:focus { background-color: rgba(255, 255, 255, .6); } +.hover-bg-white-50:hover, +.hover-bg-white-50:focus { background-color: rgba(255, 255, 255, .5); } +.hover-bg-white-40:hover, +.hover-bg-white-40:focus { background-color: rgba(255, 255, 255, .4); } +.hover-bg-white-30:hover, +.hover-bg-white-30:focus { background-color: rgba(255, 255, 255, .3); } +.hover-bg-white-20:hover, +.hover-bg-white-20:focus { background-color: rgba(255, 255, 255, .2); } +.hover-bg-white-10:hover, +.hover-bg-white-10:focus { background-color: rgba(255, 255, 255, .1); } +.hover-dark-red:hover, +.hover-dark-red:focus { color: #e7040f; } +.hover-red:hover, +.hover-red:focus { color: #ff4136; } +.hover-light-red:hover, +.hover-light-red:focus { color: #ff725c; } +.hover-orange:hover, +.hover-orange:focus { color: #ff6300; } +.hover-gold:hover, +.hover-gold:focus { color: #ffb700; } +.hover-yellow:hover, +.hover-yellow:focus { color: #ffd700; } +.hover-light-yellow:hover, +.hover-light-yellow:focus { color: #fbf1a9; } +.hover-purple:hover, +.hover-purple:focus { color: #5e2ca5; } +.hover-light-purple:hover, +.hover-light-purple:focus { color: #a463f2; } +.hover-dark-pink:hover, +.hover-dark-pink:focus { color: #d5008f; } +.hover-hot-pink:hover, +.hover-hot-pink:focus { color: #ff41b4; } +.hover-pink:hover, +.hover-pink:focus { color: #ff80cc; } +.hover-light-pink:hover, +.hover-light-pink:focus { color: #ffa3d7; } +.hover-dark-green:hover, +.hover-dark-green:focus { color: #137752; } +.hover-green:hover, +.hover-green:focus { color: #19a974; } +.hover-light-green:hover, +.hover-light-green:focus { color: #9eebcf; } +.hover-navy:hover, +.hover-navy:focus { color: #001b44; } +.hover-dark-blue:hover, +.hover-dark-blue:focus { color: #00449e; } +.hover-blue:hover, +.hover-blue:focus { color: #0594CB; } +.hover-light-blue:hover, +.hover-light-blue:focus { color: #96ccff; } +.hover-lightest-blue:hover, +.hover-lightest-blue:focus { color: #cdecff; } +.hover-washed-blue:hover, +.hover-washed-blue:focus { color: #f6fffe; } +.hover-washed-green:hover, +.hover-washed-green:focus { color: #e8fdf5; } +.hover-washed-yellow:hover, +.hover-washed-yellow:focus { color: #fffceb; } +.hover-washed-red:hover, +.hover-washed-red:focus { color: #ffdfdf; } +.hover-bg-dark-red:hover, +.hover-bg-dark-red:focus { background-color: #e7040f; } +.hover-bg-red:hover, +.hover-bg-red:focus { background-color: #ff4136; } +.hover-bg-light-red:hover, +.hover-bg-light-red:focus { background-color: #ff725c; } +.hover-bg-orange:hover, +.hover-bg-orange:focus { background-color: #ff6300; } +.hover-bg-gold:hover, +.hover-bg-gold:focus { background-color: #ffb700; } +.hover-bg-yellow:hover, +.hover-bg-yellow:focus { background-color: #ffd700; } +.hover-bg-light-yellow:hover, +.hover-bg-light-yellow:focus { background-color: #fbf1a9; } +.hover-bg-purple:hover, +.hover-bg-purple:focus { background-color: #5e2ca5; } +.hover-bg-light-purple:hover, +.hover-bg-light-purple:focus { background-color: #a463f2; } +.hover-bg-dark-pink:hover, +.hover-bg-dark-pink:focus { background-color: #d5008f; } +.hover-bg-hot-pink:hover, +.hover-bg-hot-pink:focus { background-color: #ff41b4; } +.hover-bg-pink:hover, +.hover-bg-pink:focus { background-color: #ff80cc; } +.hover-bg-light-pink:hover, +.hover-bg-light-pink:focus { background-color: #ffa3d7; } +.hover-bg-dark-green:hover, +.hover-bg-dark-green:focus { background-color: #137752; } +.hover-bg-green:hover, +.hover-bg-green:focus { background-color: #19a974; } +.hover-bg-light-green:hover, +.hover-bg-light-green:focus { background-color: #9eebcf; } +.hover-bg-navy:hover, +.hover-bg-navy:focus { background-color: #001b44; } +.hover-bg-dark-blue:hover, +.hover-bg-dark-blue:focus { background-color: #00449e; } +.hover-bg-blue:hover, +.hover-bg-blue:focus { background-color: #0594CB; } +.hover-bg-light-blue:hover, +.hover-bg-light-blue:focus { background-color: #96ccff; } +.hover-bg-lightest-blue:hover, +.hover-bg-lightest-blue:focus { background-color: #cdecff; } +.hover-bg-washed-blue:hover, +.hover-bg-washed-blue:focus { background-color: #f6fffe; } +.hover-bg-washed-green:hover, +.hover-bg-washed-green:focus { background-color: #e8fdf5; } +.hover-bg-washed-yellow:hover, +.hover-bg-washed-yellow:focus { background-color: #fffceb; } +.hover-bg-washed-red:hover, +.hover-bg-washed-red:focus { background-color: #ffdfdf; } +.hover-bg-inherit:hover, +.hover-bg-inherit:focus { background-color: inherit; } +/* Variables */ +/* + SPACING + Docs: http://tachyons.io/docs/layout/spacing/ + + An eight step powers of two scale ranging from 0 to 16rem. + + Base: + p = padding + m = margin + + Modifiers: + a = all + h = horizontal + v = vertical + t = top + r = right + b = bottom + l = left + + 0 = none + 1 = 1st step in spacing scale + 2 = 2nd step in spacing scale + 3 = 3rd step in spacing scale + 4 = 4th step in spacing scale + 5 = 5th step in spacing scale + 6 = 6th step in spacing scale + 7 = 7th step in spacing scale + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.pa0 { padding: 0; } +.pa1 { padding: .25rem; } +.pa2 { padding: .5rem; } +.pa3 { padding: 1rem; } +.pa4 { padding: 2rem; } +.pa5 { padding: 4rem; } +.pa6 { padding: 8rem; } +.pa7 { padding: 16rem; } +.pl0 { padding-left: 0; } +.pl1 { padding-left: .25rem; } +.pl2 { padding-left: .5rem; } +.pl3 { padding-left: 1rem; } +.pl4 { padding-left: 2rem; } +.pl5 { padding-left: 4rem; } +.pl6 { padding-left: 8rem; } +.pl7 { padding-left: 16rem; } +.pr0 { padding-right: 0; } +.pr1 { padding-right: .25rem; } +.pr2 { padding-right: .5rem; } +.pr3 { padding-right: 1rem; } +.pr4 { padding-right: 2rem; } +.pr5 { padding-right: 4rem; } +.pr6 { padding-right: 8rem; } +.pr7 { padding-right: 16rem; } +.pb0 { padding-bottom: 0; } +.pb1 { padding-bottom: .25rem; } +.pb2 { padding-bottom: .5rem; } +.pb3 { padding-bottom: 1rem; } +.pb4 { padding-bottom: 2rem; } +.pb5 { padding-bottom: 4rem; } +.pb6 { padding-bottom: 8rem; } +.pb7 { padding-bottom: 16rem; } +.pt0 { padding-top: 0; } +.pt1 { padding-top: .25rem; } +.pt2 { padding-top: .5rem; } +.pt3 { padding-top: 1rem; } +.pt4 { padding-top: 2rem; } +.pt5 { padding-top: 4rem; } +.pt6 { padding-top: 8rem; } +.pt7 { padding-top: 16rem; } +.pv0 { + padding-top: 0; + padding-bottom: 0; +} +.pv1 { + padding-top: .25rem; + padding-bottom: .25rem; +} +.pv2 { + padding-top: .5rem; + padding-bottom: .5rem; +} +.pv3 { + padding-top: 1rem; + padding-bottom: 1rem; +} +.pv4 { + padding-top: 2rem; + padding-bottom: 2rem; +} +.pv5 { + padding-top: 4rem; + padding-bottom: 4rem; +} +.pv6 { + padding-top: 8rem; + padding-bottom: 8rem; +} +.pv7 { + padding-top: 16rem; + padding-bottom: 16rem; +} +.ph0 { + padding-left: 0; + padding-right: 0; +} +.ph1 { + padding-left: .25rem; + padding-right: .25rem; +} +.ph2 { + padding-left: .5rem; + padding-right: .5rem; +} +.ph3 { + padding-left: 1rem; + padding-right: 1rem; +} +.ph4 { + padding-left: 2rem; + padding-right: 2rem; +} +.ph5 { + padding-left: 4rem; + padding-right: 4rem; +} +.ph6 { + padding-left: 8rem; + padding-right: 8rem; +} +.ph7 { + padding-left: 16rem; + padding-right: 16rem; +} +.ma0 { margin: 0; } +.ma1 { margin: .25rem; } +.ma2 { margin: .5rem; } +.ma3 { margin: 1rem; } +.ma4 { margin: 2rem; } +.ma5 { margin: 4rem; } +.ma6 { margin: 8rem; } +.ma7 { margin: 16rem; } +.ml0 { margin-left: 0; } +.ml1 { margin-left: .25rem; } +.ml2 { margin-left: .5rem; } +.ml3 { margin-left: 1rem; } +.ml4 { margin-left: 2rem; } +.ml5 { margin-left: 4rem; } +.ml6 { margin-left: 8rem; } +.ml7 { margin-left: 16rem; } +.mr0 { margin-right: 0; } +.mr1 { margin-right: .25rem; } +.mr2 { margin-right: .5rem; } +.mr3 { margin-right: 1rem; } +.mr4 { margin-right: 2rem; } +.mr5 { margin-right: 4rem; } +.mr6 { margin-right: 8rem; } +.mr7 { margin-right: 16rem; } +.mb0 { margin-bottom: 0; } +.mb1 { margin-bottom: .25rem; } +.mb2 { margin-bottom: .5rem; } +.mb3 { margin-bottom: 1rem; } +.mb4 { margin-bottom: 2rem; } +.mb5 { margin-bottom: 4rem; } +.mb6 { margin-bottom: 8rem; } +.mb7 { margin-bottom: 16rem; } +.mt0 { margin-top: 0; } +.mt1 { margin-top: .25rem; } +.mt2 { margin-top: .5rem; } +.mt3 { margin-top: 1rem; } +.mt4 { margin-top: 2rem; } +.mt5 { margin-top: 4rem; } +.mt6 { margin-top: 8rem; } +.mt7 { margin-top: 16rem; } +.mv0 { + margin-top: 0; + margin-bottom: 0; +} +.mv1 { + margin-top: .25rem; + margin-bottom: .25rem; +} +.mv2 { + margin-top: .5rem; + margin-bottom: .5rem; +} +.mv3 { + margin-top: 1rem; + margin-bottom: 1rem; +} +.mv4 { + margin-top: 2rem; + margin-bottom: 2rem; +} +.mv5 { + margin-top: 4rem; + margin-bottom: 4rem; +} +.mv6 { + margin-top: 8rem; + margin-bottom: 8rem; +} +.mv7 { + margin-top: 16rem; + margin-bottom: 16rem; +} +.mh0 { + margin-left: 0; + margin-right: 0; +} +.mh1 { + margin-left: .25rem; + margin-right: .25rem; +} +.mh2 { + margin-left: .5rem; + margin-right: .5rem; +} +.mh3 { + margin-left: 1rem; + margin-right: 1rem; +} +.mh4 { + margin-left: 2rem; + margin-right: 2rem; +} +.mh5 { + margin-left: 4rem; + margin-right: 4rem; +} +.mh6 { + margin-left: 8rem; + margin-right: 8rem; +} +.mh7 { + margin-left: 16rem; + margin-right: 16rem; +} +@media screen and (min-width: 30em) { + .pa0-ns { padding: 0; } + .pa1-ns { padding: .25rem; } + .pa2-ns { padding: .5rem; } + .pa3-ns { padding: 1rem; } + .pa4-ns { padding: 2rem; } + .pa5-ns { padding: 4rem; } + .pa6-ns { padding: 8rem; } + .pa7-ns { padding: 16rem; } + + .pl0-ns { padding-left: 0; } + .pl1-ns { padding-left: .25rem; } + .pl2-ns { padding-left: .5rem; } + .pl3-ns { padding-left: 1rem; } + .pl4-ns { padding-left: 2rem; } + .pl5-ns { padding-left: 4rem; } + .pl6-ns { padding-left: 8rem; } + .pl7-ns { padding-left: 16rem; } + + .pr0-ns { padding-right: 0; } + .pr1-ns { padding-right: .25rem; } + .pr2-ns { padding-right: .5rem; } + .pr3-ns { padding-right: 1rem; } + .pr4-ns { padding-right: 2rem; } + .pr5-ns { padding-right: 4rem; } + .pr6-ns { padding-right: 8rem; } + .pr7-ns { padding-right: 16rem; } + + .pb0-ns { padding-bottom: 0; } + .pb1-ns { padding-bottom: .25rem; } + .pb2-ns { padding-bottom: .5rem; } + .pb3-ns { padding-bottom: 1rem; } + .pb4-ns { padding-bottom: 2rem; } + .pb5-ns { padding-bottom: 4rem; } + .pb6-ns { padding-bottom: 8rem; } + .pb7-ns { padding-bottom: 16rem; } + + .pt0-ns { padding-top: 0; } + .pt1-ns { padding-top: .25rem; } + .pt2-ns { padding-top: .5rem; } + .pt3-ns { padding-top: 1rem; } + .pt4-ns { padding-top: 2rem; } + .pt5-ns { padding-top: 4rem; } + .pt6-ns { padding-top: 8rem; } + .pt7-ns { padding-top: 16rem; } + + .pv0-ns { + padding-top: 0; + padding-bottom: 0; + } + .pv1-ns { + padding-top: .25rem; + padding-bottom: .25rem; + } + .pv2-ns { + padding-top: .5rem; + padding-bottom: .5rem; + } + .pv3-ns { + padding-top: 1rem; + padding-bottom: 1rem; + } + .pv4-ns { + padding-top: 2rem; + padding-bottom: 2rem; + } + .pv5-ns { + padding-top: 4rem; + padding-bottom: 4rem; + } + .pv6-ns { + padding-top: 8rem; + padding-bottom: 8rem; + } + .pv7-ns { + padding-top: 16rem; + padding-bottom: 16rem; + } + .ph0-ns { + padding-left: 0; + padding-right: 0; + } + .ph1-ns { + padding-left: .25rem; + padding-right: .25rem; + } + .ph2-ns { + padding-left: .5rem; + padding-right: .5rem; + } + .ph3-ns { + padding-left: 1rem; + padding-right: 1rem; + } + .ph4-ns { + padding-left: 2rem; + padding-right: 2rem; + } + .ph5-ns { + padding-left: 4rem; + padding-right: 4rem; + } + .ph6-ns { + padding-left: 8rem; + padding-right: 8rem; + } + .ph7-ns { + padding-left: 16rem; + padding-right: 16rem; + } + + .ma0-ns { margin: 0; } + .ma1-ns { margin: .25rem; } + .ma2-ns { margin: .5rem; } + .ma3-ns { margin: 1rem; } + .ma4-ns { margin: 2rem; } + .ma5-ns { margin: 4rem; } + .ma6-ns { margin: 8rem; } + .ma7-ns { margin: 16rem; } + + .ml0-ns { margin-left: 0; } + .ml1-ns { margin-left: .25rem; } + .ml2-ns { margin-left: .5rem; } + .ml3-ns { margin-left: 1rem; } + .ml4-ns { margin-left: 2rem; } + .ml5-ns { margin-left: 4rem; } + .ml6-ns { margin-left: 8rem; } + .ml7-ns { margin-left: 16rem; } + + .mr0-ns { margin-right: 0; } + .mr1-ns { margin-right: .25rem; } + .mr2-ns { margin-right: .5rem; } + .mr3-ns { margin-right: 1rem; } + .mr4-ns { margin-right: 2rem; } + .mr5-ns { margin-right: 4rem; } + .mr6-ns { margin-right: 8rem; } + .mr7-ns { margin-right: 16rem; } + + .mb0-ns { margin-bottom: 0; } + .mb1-ns { margin-bottom: .25rem; } + .mb2-ns { margin-bottom: .5rem; } + .mb3-ns { margin-bottom: 1rem; } + .mb4-ns { margin-bottom: 2rem; } + .mb5-ns { margin-bottom: 4rem; } + .mb6-ns { margin-bottom: 8rem; } + .mb7-ns { margin-bottom: 16rem; } + + .mt0-ns { margin-top: 0; } + .mt1-ns { margin-top: .25rem; } + .mt2-ns { margin-top: .5rem; } + .mt3-ns { margin-top: 1rem; } + .mt4-ns { margin-top: 2rem; } + .mt5-ns { margin-top: 4rem; } + .mt6-ns { margin-top: 8rem; } + .mt7-ns { margin-top: 16rem; } + + .mv0-ns { + margin-top: 0; + margin-bottom: 0; + } + .mv1-ns { + margin-top: .25rem; + margin-bottom: .25rem; + } + .mv2-ns { + margin-top: .5rem; + margin-bottom: .5rem; + } + .mv3-ns { + margin-top: 1rem; + margin-bottom: 1rem; + } + .mv4-ns { + margin-top: 2rem; + margin-bottom: 2rem; + } + .mv5-ns { + margin-top: 4rem; + margin-bottom: 4rem; + } + .mv6-ns { + margin-top: 8rem; + margin-bottom: 8rem; + } + .mv7-ns { + margin-top: 16rem; + margin-bottom: 16rem; + } + + .mh0-ns { + margin-left: 0; + margin-right: 0; + } + .mh1-ns { + margin-left: .25rem; + margin-right: .25rem; + } + .mh2-ns { + margin-left: .5rem; + margin-right: .5rem; + } + .mh3-ns { + margin-left: 1rem; + margin-right: 1rem; + } + .mh4-ns { + margin-left: 2rem; + margin-right: 2rem; + } + .mh5-ns { + margin-left: 4rem; + margin-right: 4rem; + } + .mh6-ns { + margin-left: 8rem; + margin-right: 8rem; + } + .mh7-ns { + margin-left: 16rem; + margin-right: 16rem; + } + +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .pa0-m { padding: 0; } + .pa1-m { padding: .25rem; } + .pa2-m { padding: .5rem; } + .pa3-m { padding: 1rem; } + .pa4-m { padding: 2rem; } + .pa5-m { padding: 4rem; } + .pa6-m { padding: 8rem; } + .pa7-m { padding: 16rem; } + + .pl0-m { padding-left: 0; } + .pl1-m { padding-left: .25rem; } + .pl2-m { padding-left: .5rem; } + .pl3-m { padding-left: 1rem; } + .pl4-m { padding-left: 2rem; } + .pl5-m { padding-left: 4rem; } + .pl6-m { padding-left: 8rem; } + .pl7-m { padding-left: 16rem; } + + .pr0-m { padding-right: 0; } + .pr1-m { padding-right: .25rem; } + .pr2-m { padding-right: .5rem; } + .pr3-m { padding-right: 1rem; } + .pr4-m { padding-right: 2rem; } + .pr5-m { padding-right: 4rem; } + .pr6-m { padding-right: 8rem; } + .pr7-m { padding-right: 16rem; } + + .pb0-m { padding-bottom: 0; } + .pb1-m { padding-bottom: .25rem; } + .pb2-m { padding-bottom: .5rem; } + .pb3-m { padding-bottom: 1rem; } + .pb4-m { padding-bottom: 2rem; } + .pb5-m { padding-bottom: 4rem; } + .pb6-m { padding-bottom: 8rem; } + .pb7-m { padding-bottom: 16rem; } + + .pt0-m { padding-top: 0; } + .pt1-m { padding-top: .25rem; } + .pt2-m { padding-top: .5rem; } + .pt3-m { padding-top: 1rem; } + .pt4-m { padding-top: 2rem; } + .pt5-m { padding-top: 4rem; } + .pt6-m { padding-top: 8rem; } + .pt7-m { padding-top: 16rem; } + + .pv0-m { + padding-top: 0; + padding-bottom: 0; + } + .pv1-m { + padding-top: .25rem; + padding-bottom: .25rem; + } + .pv2-m { + padding-top: .5rem; + padding-bottom: .5rem; + } + .pv3-m { + padding-top: 1rem; + padding-bottom: 1rem; + } + .pv4-m { + padding-top: 2rem; + padding-bottom: 2rem; + } + .pv5-m { + padding-top: 4rem; + padding-bottom: 4rem; + } + .pv6-m { + padding-top: 8rem; + padding-bottom: 8rem; + } + .pv7-m { + padding-top: 16rem; + padding-bottom: 16rem; + } + + .ph0-m { + padding-left: 0; + padding-right: 0; + } + .ph1-m { + padding-left: .25rem; + padding-right: .25rem; + } + .ph2-m { + padding-left: .5rem; + padding-right: .5rem; + } + .ph3-m { + padding-left: 1rem; + padding-right: 1rem; + } + .ph4-m { + padding-left: 2rem; + padding-right: 2rem; + } + .ph5-m { + padding-left: 4rem; + padding-right: 4rem; + } + .ph6-m { + padding-left: 8rem; + padding-right: 8rem; + } + .ph7-m { + padding-left: 16rem; + padding-right: 16rem; + } + + .ma0-m { margin: 0; } + .ma1-m { margin: .25rem; } + .ma2-m { margin: .5rem; } + .ma3-m { margin: 1rem; } + .ma4-m { margin: 2rem; } + .ma5-m { margin: 4rem; } + .ma6-m { margin: 8rem; } + .ma7-m { margin: 16rem; } + + .ml0-m { margin-left: 0; } + .ml1-m { margin-left: .25rem; } + .ml2-m { margin-left: .5rem; } + .ml3-m { margin-left: 1rem; } + .ml4-m { margin-left: 2rem; } + .ml5-m { margin-left: 4rem; } + .ml6-m { margin-left: 8rem; } + .ml7-m { margin-left: 16rem; } + + .mr0-m { margin-right: 0; } + .mr1-m { margin-right: .25rem; } + .mr2-m { margin-right: .5rem; } + .mr3-m { margin-right: 1rem; } + .mr4-m { margin-right: 2rem; } + .mr5-m { margin-right: 4rem; } + .mr6-m { margin-right: 8rem; } + .mr7-m { margin-right: 16rem; } + + .mb0-m { margin-bottom: 0; } + .mb1-m { margin-bottom: .25rem; } + .mb2-m { margin-bottom: .5rem; } + .mb3-m { margin-bottom: 1rem; } + .mb4-m { margin-bottom: 2rem; } + .mb5-m { margin-bottom: 4rem; } + .mb6-m { margin-bottom: 8rem; } + .mb7-m { margin-bottom: 16rem; } + + .mt0-m { margin-top: 0; } + .mt1-m { margin-top: .25rem; } + .mt2-m { margin-top: .5rem; } + .mt3-m { margin-top: 1rem; } + .mt4-m { margin-top: 2rem; } + .mt5-m { margin-top: 4rem; } + .mt6-m { margin-top: 8rem; } + .mt7-m { margin-top: 16rem; } + + .mv0-m { + margin-top: 0; + margin-bottom: 0; + } + .mv1-m { + margin-top: .25rem; + margin-bottom: .25rem; + } + .mv2-m { + margin-top: .5rem; + margin-bottom: .5rem; + } + .mv3-m { + margin-top: 1rem; + margin-bottom: 1rem; + } + .mv4-m { + margin-top: 2rem; + margin-bottom: 2rem; + } + .mv5-m { + margin-top: 4rem; + margin-bottom: 4rem; + } + .mv6-m { + margin-top: 8rem; + margin-bottom: 8rem; + } + .mv7-m { + margin-top: 16rem; + margin-bottom: 16rem; + } + + .mh0-m { + margin-left: 0; + margin-right: 0; + } + .mh1-m { + margin-left: .25rem; + margin-right: .25rem; + } + .mh2-m { + margin-left: .5rem; + margin-right: .5rem; + } + .mh3-m { + margin-left: 1rem; + margin-right: 1rem; + } + .mh4-m { + margin-left: 2rem; + margin-right: 2rem; + } + .mh5-m { + margin-left: 4rem; + margin-right: 4rem; + } + .mh6-m { + margin-left: 8rem; + margin-right: 8rem; + } + .mh7-m { + margin-left: 16rem; + margin-right: 16rem; + } + +} +@media screen and (min-width: 60em) { + .pa0-l { padding: 0; } + .pa1-l { padding: .25rem; } + .pa2-l { padding: .5rem; } + .pa3-l { padding: 1rem; } + .pa4-l { padding: 2rem; } + .pa5-l { padding: 4rem; } + .pa6-l { padding: 8rem; } + .pa7-l { padding: 16rem; } + + .pl0-l { padding-left: 0; } + .pl1-l { padding-left: .25rem; } + .pl2-l { padding-left: .5rem; } + .pl3-l { padding-left: 1rem; } + .pl4-l { padding-left: 2rem; } + .pl5-l { padding-left: 4rem; } + .pl6-l { padding-left: 8rem; } + .pl7-l { padding-left: 16rem; } + + .pr0-l { padding-right: 0; } + .pr1-l { padding-right: .25rem; } + .pr2-l { padding-right: .5rem; } + .pr3-l { padding-right: 1rem; } + .pr4-l { padding-right: 2rem; } + .pr5-l { padding-right: 4rem; } + .pr6-l { padding-right: 8rem; } + .pr7-l { padding-right: 16rem; } + + .pb0-l { padding-bottom: 0; } + .pb1-l { padding-bottom: .25rem; } + .pb2-l { padding-bottom: .5rem; } + .pb3-l { padding-bottom: 1rem; } + .pb4-l { padding-bottom: 2rem; } + .pb5-l { padding-bottom: 4rem; } + .pb6-l { padding-bottom: 8rem; } + .pb7-l { padding-bottom: 16rem; } + + .pt0-l { padding-top: 0; } + .pt1-l { padding-top: .25rem; } + .pt2-l { padding-top: .5rem; } + .pt3-l { padding-top: 1rem; } + .pt4-l { padding-top: 2rem; } + .pt5-l { padding-top: 4rem; } + .pt6-l { padding-top: 8rem; } + .pt7-l { padding-top: 16rem; } + + .pv0-l { + padding-top: 0; + padding-bottom: 0; + } + .pv1-l { + padding-top: .25rem; + padding-bottom: .25rem; + } + .pv2-l { + padding-top: .5rem; + padding-bottom: .5rem; + } + .pv3-l { + padding-top: 1rem; + padding-bottom: 1rem; + } + .pv4-l { + padding-top: 2rem; + padding-bottom: 2rem; + } + .pv5-l { + padding-top: 4rem; + padding-bottom: 4rem; + } + .pv6-l { + padding-top: 8rem; + padding-bottom: 8rem; + } + .pv7-l { + padding-top: 16rem; + padding-bottom: 16rem; + } + + .ph0-l { + padding-left: 0; + padding-right: 0; + } + .ph1-l { + padding-left: .25rem; + padding-right: .25rem; + } + .ph2-l { + padding-left: .5rem; + padding-right: .5rem; + } + .ph3-l { + padding-left: 1rem; + padding-right: 1rem; + } + .ph4-l { + padding-left: 2rem; + padding-right: 2rem; + } + .ph5-l { + padding-left: 4rem; + padding-right: 4rem; + } + .ph6-l { + padding-left: 8rem; + padding-right: 8rem; + } + .ph7-l { + padding-left: 16rem; + padding-right: 16rem; + } + + .ma0-l { margin: 0; } + .ma1-l { margin: .25rem; } + .ma2-l { margin: .5rem; } + .ma3-l { margin: 1rem; } + .ma4-l { margin: 2rem; } + .ma5-l { margin: 4rem; } + .ma6-l { margin: 8rem; } + .ma7-l { margin: 16rem; } + + .ml0-l { margin-left: 0; } + .ml1-l { margin-left: .25rem; } + .ml2-l { margin-left: .5rem; } + .ml3-l { margin-left: 1rem; } + .ml4-l { margin-left: 2rem; } + .ml5-l { margin-left: 4rem; } + .ml6-l { margin-left: 8rem; } + .ml7-l { margin-left: 16rem; } + + .mr0-l { margin-right: 0; } + .mr1-l { margin-right: .25rem; } + .mr2-l { margin-right: .5rem; } + .mr3-l { margin-right: 1rem; } + .mr4-l { margin-right: 2rem; } + .mr5-l { margin-right: 4rem; } + .mr6-l { margin-right: 8rem; } + .mr7-l { margin-right: 16rem; } + + .mb0-l { margin-bottom: 0; } + .mb1-l { margin-bottom: .25rem; } + .mb2-l { margin-bottom: .5rem; } + .mb3-l { margin-bottom: 1rem; } + .mb4-l { margin-bottom: 2rem; } + .mb5-l { margin-bottom: 4rem; } + .mb6-l { margin-bottom: 8rem; } + .mb7-l { margin-bottom: 16rem; } + + .mt0-l { margin-top: 0; } + .mt1-l { margin-top: .25rem; } + .mt2-l { margin-top: .5rem; } + .mt3-l { margin-top: 1rem; } + .mt4-l { margin-top: 2rem; } + .mt5-l { margin-top: 4rem; } + .mt6-l { margin-top: 8rem; } + .mt7-l { margin-top: 16rem; } + + .mv0-l { + margin-top: 0; + margin-bottom: 0; + } + .mv1-l { + margin-top: .25rem; + margin-bottom: .25rem; + } + .mv2-l { + margin-top: .5rem; + margin-bottom: .5rem; + } + .mv3-l { + margin-top: 1rem; + margin-bottom: 1rem; + } + .mv4-l { + margin-top: 2rem; + margin-bottom: 2rem; + } + .mv5-l { + margin-top: 4rem; + margin-bottom: 4rem; + } + .mv6-l { + margin-top: 8rem; + margin-bottom: 8rem; + } + .mv7-l { + margin-top: 16rem; + margin-bottom: 16rem; + } + + .mh0-l { + margin-left: 0; + margin-right: 0; + } + .mh1-l { + margin-left: .25rem; + margin-right: .25rem; + } + .mh2-l { + margin-left: .5rem; + margin-right: .5rem; + } + .mh3-l { + margin-left: 1rem; + margin-right: 1rem; + } + .mh4-l { + margin-left: 2rem; + margin-right: 2rem; + } + .mh5-l { + margin-left: 4rem; + margin-right: 4rem; + } + .mh6-l { + margin-left: 8rem; + margin-right: 8rem; + } + .mh7-l { + margin-left: 16rem; + margin-right: 16rem; + } +} +/* + NEGATIVE MARGINS + + Base: + n = negative + + Modifiers: + a = all + t = top + r = right + b = bottom + l = left + + 1 = 1st step in spacing scale + 2 = 2nd step in spacing scale + 3 = 3rd step in spacing scale + 4 = 4th step in spacing scale + 5 = 5th step in spacing scale + 6 = 6th step in spacing scale + 7 = 7th step in spacing scale + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.na1 { margin: -0.25rem; } +.na2 { margin: -0.5rem; } +.na3 { margin: -1rem; } +.na4 { margin: -2rem; } +.na5 { margin: -4rem; } +.na6 { margin: -8rem; } +.na7 { margin: -16rem; } +.nl1 { margin-left: -0.25rem; } +.nl2 { margin-left: -0.5rem; } +.nl3 { margin-left: -1rem; } +.nl4 { margin-left: -2rem; } +.nl5 { margin-left: -4rem; } +.nl6 { margin-left: -8rem; } +.nl7 { margin-left: -16rem; } +.nr1 { margin-right: -0.25rem; } +.nr2 { margin-right: -0.5rem; } +.nr3 { margin-right: -1rem; } +.nr4 { margin-right: -2rem; } +.nr5 { margin-right: -4rem; } +.nr6 { margin-right: -8rem; } +.nr7 { margin-right: -16rem; } +.nb1 { margin-bottom: -0.25rem; } +.nb2 { margin-bottom: -0.5rem; } +.nb3 { margin-bottom: -1rem; } +.nb4 { margin-bottom: -2rem; } +.nb5 { margin-bottom: -4rem; } +.nb6 { margin-bottom: -8rem; } +.nb7 { margin-bottom: -16rem; } +.nt1 { margin-top: -0.25rem; } +.nt2 { margin-top: -0.5rem; } +.nt3 { margin-top: -1rem; } +.nt4 { margin-top: -2rem; } +.nt5 { margin-top: -4rem; } +.nt6 { margin-top: -8rem; } +.nt7 { margin-top: -16rem; } +@media screen and (min-width: 30em) { + + .na1-ns { margin: -0.25rem; } + .na2-ns { margin: -0.5rem; } + .na3-ns { margin: -1rem; } + .na4-ns { margin: -2rem; } + .na5-ns { margin: -4rem; } + .na6-ns { margin: -8rem; } + .na7-ns { margin: -16rem; } + + .nl1-ns { margin-left: -0.25rem; } + .nl2-ns { margin-left: -0.5rem; } + .nl3-ns { margin-left: -1rem; } + .nl4-ns { margin-left: -2rem; } + .nl5-ns { margin-left: -4rem; } + .nl6-ns { margin-left: -8rem; } + .nl7-ns { margin-left: -16rem; } + + .nr1-ns { margin-right: -0.25rem; } + .nr2-ns { margin-right: -0.5rem; } + .nr3-ns { margin-right: -1rem; } + .nr4-ns { margin-right: -2rem; } + .nr5-ns { margin-right: -4rem; } + .nr6-ns { margin-right: -8rem; } + .nr7-ns { margin-right: -16rem; } + + .nb1-ns { margin-bottom: -0.25rem; } + .nb2-ns { margin-bottom: -0.5rem; } + .nb3-ns { margin-bottom: -1rem; } + .nb4-ns { margin-bottom: -2rem; } + .nb5-ns { margin-bottom: -4rem; } + .nb6-ns { margin-bottom: -8rem; } + .nb7-ns { margin-bottom: -16rem; } + + .nt1-ns { margin-top: -0.25rem; } + .nt2-ns { margin-top: -0.5rem; } + .nt3-ns { margin-top: -1rem; } + .nt4-ns { margin-top: -2rem; } + .nt5-ns { margin-top: -4rem; } + .nt6-ns { margin-top: -8rem; } + .nt7-ns { margin-top: -16rem; } + +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .na1-m { margin: -0.25rem; } + .na2-m { margin: -0.5rem; } + .na3-m { margin: -1rem; } + .na4-m { margin: -2rem; } + .na5-m { margin: -4rem; } + .na6-m { margin: -8rem; } + .na7-m { margin: -16rem; } + + .nl1-m { margin-left: -0.25rem; } + .nl2-m { margin-left: -0.5rem; } + .nl3-m { margin-left: -1rem; } + .nl4-m { margin-left: -2rem; } + .nl5-m { margin-left: -4rem; } + .nl6-m { margin-left: -8rem; } + .nl7-m { margin-left: -16rem; } + + .nr1-m { margin-right: -0.25rem; } + .nr2-m { margin-right: -0.5rem; } + .nr3-m { margin-right: -1rem; } + .nr4-m { margin-right: -2rem; } + .nr5-m { margin-right: -4rem; } + .nr6-m { margin-right: -8rem; } + .nr7-m { margin-right: -16rem; } + + .nb1-m { margin-bottom: -0.25rem; } + .nb2-m { margin-bottom: -0.5rem; } + .nb3-m { margin-bottom: -1rem; } + .nb4-m { margin-bottom: -2rem; } + .nb5-m { margin-bottom: -4rem; } + .nb6-m { margin-bottom: -8rem; } + .nb7-m { margin-bottom: -16rem; } + + .nt1-m { margin-top: -0.25rem; } + .nt2-m { margin-top: -0.5rem; } + .nt3-m { margin-top: -1rem; } + .nt4-m { margin-top: -2rem; } + .nt5-m { margin-top: -4rem; } + .nt6-m { margin-top: -8rem; } + .nt7-m { margin-top: -16rem; } + +} +@media screen and (min-width: 60em) { + .na1-l { margin: -0.25rem; } + .na2-l { margin: -0.5rem; } + .na3-l { margin: -1rem; } + .na4-l { margin: -2rem; } + .na5-l { margin: -4rem; } + .na6-l { margin: -8rem; } + .na7-l { margin: -16rem; } + + .nl1-l { margin-left: -0.25rem; } + .nl2-l { margin-left: -0.5rem; } + .nl3-l { margin-left: -1rem; } + .nl4-l { margin-left: -2rem; } + .nl5-l { margin-left: -4rem; } + .nl6-l { margin-left: -8rem; } + .nl7-l { margin-left: -16rem; } + + .nr1-l { margin-right: -0.25rem; } + .nr2-l { margin-right: -0.5rem; } + .nr3-l { margin-right: -1rem; } + .nr4-l { margin-right: -2rem; } + .nr5-l { margin-right: -4rem; } + .nr6-l { margin-right: -8rem; } + .nr7-l { margin-right: -16rem; } + + .nb1-l { margin-bottom: -0.25rem; } + .nb2-l { margin-bottom: -0.5rem; } + .nb3-l { margin-bottom: -1rem; } + .nb4-l { margin-bottom: -2rem; } + .nb5-l { margin-bottom: -4rem; } + .nb6-l { margin-bottom: -8rem; } + .nb7-l { margin-bottom: -16rem; } + + .nt1-l { margin-top: -0.25rem; } + .nt2-l { margin-top: -0.5rem; } + .nt3-l { margin-top: -1rem; } + .nt4-l { margin-top: -2rem; } + .nt5-l { margin-top: -4rem; } + .nt6-l { margin-top: -8rem; } + .nt7-l { margin-top: -16rem; } +} +/* + + TABLES + Docs: http://tachyons.io/docs/elements/tables/ + +*/ +.collapse { + border-collapse: collapse; + border-spacing: 0; +} +.striped--light-silver:nth-child(odd) { + background-color: #aaa; +} +.striped--moon-gray:nth-child(odd) { + background-color: #ccc; +} +.striped--light-gray:nth-child(odd) { + background-color: #eee; +} +.striped--near-white:nth-child(odd) { + background-color: #f4f4f4; +} +.stripe-light:nth-child(odd) { + background-color: rgba(255, 255, 255, .1); +} +.stripe-dark:nth-child(odd) { + background-color: rgba(0, 0, 0, .1); +} +/* + + TEXT DECORATION + Docs: http://tachyons.io/docs/typography/text-decoration/ + + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.strike { text-decoration: line-through; } +.underline { text-decoration: underline; } +.no-underline { text-decoration: none; } +@media screen and (min-width: 30em) { + .strike-ns { text-decoration: line-through; } + .underline-ns { text-decoration: underline; } + .no-underline-ns { text-decoration: none; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .strike-m { text-decoration: line-through; } + .underline-m { text-decoration: underline; } + .no-underline-m { text-decoration: none; } +} +@media screen and (min-width: 60em) { + .strike-l { text-decoration: line-through; } + .underline-l { text-decoration: underline; } + .no-underline-l { text-decoration: none; } +} +/* + + TEXT ALIGN + Docs: http://tachyons.io/docs/typography/text-align/ + + Base + t = text-align + + Modifiers + l = left + r = right + c = center + j = justify + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.tl { text-align: left; } +.tr { text-align: right; } +.tc { text-align: center; } +.tj { text-align: justify; } +@media screen and (min-width: 30em) { + .tl-ns { text-align: left; } + .tr-ns { text-align: right; } + .tc-ns { text-align: center; } + .tj-ns { text-align: justify; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .tl-m { text-align: left; } + .tr-m { text-align: right; } + .tc-m { text-align: center; } + .tj-m { text-align: justify; } +} +@media screen and (min-width: 60em) { + .tl-l { text-align: left; } + .tr-l { text-align: right; } + .tc-l { text-align: center; } + .tj-l { text-align: justify; } +} +/* + + TEXT TRANSFORM + Docs: http://tachyons.io/docs/typography/text-transform/ + + Base: + tt = text-transform + + Modifiers + c = capitalize + l = lowercase + u = uppercase + n = none + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.ttc { text-transform: capitalize; } +.ttl { text-transform: lowercase; } +.ttu { text-transform: uppercase; } +.ttn { text-transform: none; } +@media screen and (min-width: 30em) { + .ttc-ns { text-transform: capitalize; } + .ttl-ns { text-transform: lowercase; } + .ttu-ns { text-transform: uppercase; } + .ttn-ns { text-transform: none; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .ttc-m { text-transform: capitalize; } + .ttl-m { text-transform: lowercase; } + .ttu-m { text-transform: uppercase; } + .ttn-m { text-transform: none; } +} +@media screen and (min-width: 60em) { + .ttc-l { text-transform: capitalize; } + .ttl-l { text-transform: lowercase; } + .ttu-l { text-transform: uppercase; } + .ttn-l { text-transform: none; } +} +/* + + TYPE SCALE + Docs: http://tachyons.io/docs/typography/scale/ + + Base: + f = font-size + + Modifiers + 1 = 1st step in size scale + 2 = 2nd step in size scale + 3 = 3rd step in size scale + 4 = 4th step in size scale + 5 = 5th step in size scale + 6 = 6th step in size scale + 7 = 7th step in size scale + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large +*/ +/* + * For Hero/Marketing Titles + * + * These generally are too large for mobile + * so be careful using them on smaller screens. + * */ +.f-6, +.f-headline { + font-size: 6rem; +} +.f-5, +.f-subheadline { + font-size: 5rem; +} +/* Type Scale */ +.f1 { font-size: 3rem; } +.f2 { font-size: 2.25rem; } +.f3 { font-size: 1.5rem; } +.f4 { font-size: 1.25rem; } +.f5 { font-size: 1rem; } +.f6 { font-size: .875rem; } +.f7 { font-size: .75rem; } +/* Small and hard to read for many people so use with extreme caution */ +@media screen and (min-width: 30em){ + .f-6-ns, + .f-headline-ns { font-size: 6rem; } + .f-5-ns, + .f-subheadline-ns { font-size: 5rem; } + .f1-ns { font-size: 3rem; } + .f2-ns { font-size: 2.25rem; } + .f3-ns { font-size: 1.5rem; } + .f4-ns { font-size: 1.25rem; } + .f5-ns { font-size: 1rem; } + .f6-ns { font-size: .875rem; } + .f7-ns { font-size: .75rem; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .f-6-m, + .f-headline-m { font-size: 6rem; } + .f-5-m, + .f-subheadline-m { font-size: 5rem; } + .f1-m { font-size: 3rem; } + .f2-m { font-size: 2.25rem; } + .f3-m { font-size: 1.5rem; } + .f4-m { font-size: 1.25rem; } + .f5-m { font-size: 1rem; } + .f6-m { font-size: .875rem; } + .f7-m { font-size: .75rem; } +} +@media screen and (min-width: 60em) { + .f-6-l, + .f-headline-l { + font-size: 6rem; + } + .f-5-l, + .f-subheadline-l { + font-size: 5rem; + } + .f1-l { font-size: 3rem; } + .f2-l { font-size: 2.25rem; } + .f3-l { font-size: 1.5rem; } + .f4-l { font-size: 1.25rem; } + .f5-l { font-size: 1rem; } + .f6-l { font-size: .875rem; } + .f7-l { font-size: .75rem; } +} +/* + + TYPOGRAPHY + http://tachyons.io/docs/typography/measure/ + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +/* Measure is limited to ~66 characters */ +.measure { + max-width: 30em; +} +/* Measure is limited to ~80 characters */ +.measure-wide { + max-width: 34em; +} +/* Measure is limited to ~45 characters */ +.measure-narrow { + max-width: 20em; +} +/* Book paragraph style - paragraphs are indented with no vertical spacing. */ +.indent { + text-indent: 1em; + margin-top: 0; + margin-bottom: 0; +} +.small-caps { + -webkit-font-feature-settings: "c2sc"; + font-feature-settings: "c2sc"; + font-variant: small-caps; +} +/* Combine this class with a width to truncate text (or just leave as is to truncate at width of containing element. */ +.truncate { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +@media screen and (min-width: 30em) { + .measure-ns { + max-width: 30em; + } + .measure-wide-ns { + max-width: 34em; + } + .measure-narrow-ns { + max-width: 20em; + } + .indent-ns { + text-indent: 1em; + margin-top: 0; + margin-bottom: 0; + } + .small-caps-ns { + -webkit-font-feature-settings: "c2sc"; + font-feature-settings: "c2sc"; + font-variant: small-caps; + } + .truncate-ns { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .measure-m { + max-width: 30em; + } + .measure-wide-m { + max-width: 34em; + } + .measure-narrow-m { + max-width: 20em; + } + .indent-m { + text-indent: 1em; + margin-top: 0; + margin-bottom: 0; + } + .small-caps-m { + -webkit-font-feature-settings: "c2sc"; + font-feature-settings: "c2sc"; + font-variant: small-caps; + } + .truncate-m { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } +} +@media screen and (min-width: 60em) { + .measure-l { + max-width: 30em; + } + .measure-wide-l { + max-width: 34em; + } + .measure-narrow-l { + max-width: 20em; + } + .indent-l { + text-indent: 1em; + margin-top: 0; + margin-bottom: 0; + } + .small-caps-l { + -webkit-font-feature-settings: "c2sc"; + font-feature-settings: "c2sc"; + font-variant: small-caps; + } + .truncate-l { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } +} +/* + + UTILITIES + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +/* Equivalent to .overflow-y-scroll */ +.overflow-container { + overflow-y: scroll; +} +.center { + margin-right: auto; + margin-left: auto; +} +.mr-auto { margin-right: auto; } +.ml-auto { margin-left: auto; } +@media screen and (min-width: 30em){ + .center-ns { + margin-right: auto; + margin-left: auto; + } + .mr-auto-ns { margin-right: auto; } + .ml-auto-ns { margin-left: auto; } +} +@media screen and (min-width: 30em) and (max-width: 60em){ + .center-m { + margin-right: auto; + margin-left: auto; + } + .mr-auto-m { margin-right: auto; } + .ml-auto-m { margin-left: auto; } +} +@media screen and (min-width: 60em){ + .center-l { + margin-right: auto; + margin-left: auto; + } + .mr-auto-l { margin-right: auto; } + .ml-auto-l { margin-left: auto; } +} +/* + + VISIBILITY + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +/* + Text that is hidden but accessible + Ref: http://snook.ca/archives/html_and_css/hiding-content-for-accessibility +*/ +.clip { + position: fixed !important; + _position: absolute !important; + clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ + clip: rect(1px, 1px, 1px, 1px); +} +@media screen and (min-width: 30em) { + .clip-ns { + position: fixed !important; + _position: absolute !important; + clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ + clip: rect(1px, 1px, 1px, 1px); + } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .clip-m { + position: fixed !important; + _position: absolute !important; + clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ + clip: rect(1px, 1px, 1px, 1px); + } +} +@media screen and (min-width: 60em) { + .clip-l { + position: fixed !important; + _position: absolute !important; + clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ + clip: rect(1px, 1px, 1px, 1px); + } +} +/* + + WHITE SPACE + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.ws-normal { white-space: normal; } +.nowrap { white-space: nowrap; } +.pre { white-space: pre; } +@media screen and (min-width: 30em) { + .ws-normal-ns { white-space: normal; } + .nowrap-ns { white-space: nowrap; } + .pre-ns { white-space: pre; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .ws-normal-m { white-space: normal; } + .nowrap-m { white-space: nowrap; } + .pre-m { white-space: pre; } +} +@media screen and (min-width: 60em) { + .ws-normal-l { white-space: normal; } + .nowrap-l { white-space: nowrap; } + .pre-l { white-space: pre; } +} +/* + + VERTICAL ALIGN + + Media Query Extensions: + -ns = not-small + -m = medium + -l = large + +*/ +.v-base { vertical-align: baseline; } +.v-mid { vertical-align: middle; } +.v-top { vertical-align: top; } +.v-btm { vertical-align: bottom; } +@media screen and (min-width: 30em) { + .v-base-ns { vertical-align: baseline; } + .v-mid-ns { vertical-align: middle; } + .v-top-ns { vertical-align: top; } + .v-btm-ns { vertical-align: bottom; } +} +@media screen and (min-width: 30em) and (max-width: 60em) { + .v-base-m { vertical-align: baseline; } + .v-mid-m { vertical-align: middle; } + .v-top-m { vertical-align: top; } + .v-btm-m { vertical-align: bottom; } +} +@media screen and (min-width: 60em) { + .v-base-l { vertical-align: baseline; } + .v-mid-l { vertical-align: middle; } + .v-top-l { vertical-align: top; } + .v-btm-l { vertical-align: bottom; } +} +/* + + HOVER EFFECTS + Docs: http://tachyons.io/docs/themes/hovers/ + + - Dim + - Glow + - Hide Child + - Underline text + - Grow + - Pointer + - Shadow + +*/ +/* + + Dim element on hover by adding the dim class. + +*/ +.dim { + opacity: 1; + -webkit-transition: opacity .15s ease-in; + transition: opacity .15s ease-in; +} +.dim:hover, +.dim:focus { + opacity: .5; + -webkit-transition: opacity .15s ease-in; + transition: opacity .15s ease-in; +} +.dim:active { + opacity: .8; -webkit-transition: opacity .15s ease-out; transition: opacity .15s ease-out; +} +/* + + Animate opacity to 100% on hover by adding the glow class. + +*/ +.glow { + -webkit-transition: opacity .15s ease-in; + transition: opacity .15s ease-in; +} +.glow:hover, +.glow:focus { + opacity: 1; + -webkit-transition: opacity .15s ease-in; + transition: opacity .15s ease-in; +} +/* + + Hide child & reveal on hover: + + Put the hide-child class on a parent element and any nested element with the + child class will be hidden and displayed on hover or focus. + +
+
Hidden until hover or focus
+
Hidden until hover or focus
+
Hidden until hover or focus
+
Hidden until hover or focus
+
+*/ +.hide-child .child { + opacity: 0; + -webkit-transition: opacity .15s ease-in; + transition: opacity .15s ease-in; +} +.hide-child:hover .child, +.hide-child:focus .child, +.hide-child:active .child { + opacity: 1; + -webkit-transition: opacity .15s ease-in; + transition: opacity .15s ease-in; +} +.underline-hover:hover, +.underline-hover:focus { + text-decoration: underline; +} +/* Can combine this with overflow-hidden to make background images grow on hover + * even if you are using background-size: cover */ +.grow { + -moz-osx-font-smoothing: grayscale; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition: -webkit-transform 0.25s ease-out; + transition: -webkit-transform 0.25s ease-out; + transition: transform 0.25s ease-out; + transition: transform 0.25s ease-out, -webkit-transform 0.25s ease-out; +} +.grow:hover, +.grow:focus { + -webkit-transform: scale(1.05); + transform: scale(1.05); +} +.grow:active { + -webkit-transform: scale(.90); + transform: scale(.90); +} +.grow-large { + -moz-osx-font-smoothing: grayscale; + -webkit-backface-visibility: hidden; + backface-visibility: hidden; + -webkit-transform: translateZ(0); + transform: translateZ(0); + -webkit-transition: -webkit-transform .25s ease-in-out; + transition: -webkit-transform .25s ease-in-out; + transition: transform .25s ease-in-out; + transition: transform .25s ease-in-out, -webkit-transform .25s ease-in-out; +} +.grow-large:hover, +.grow-large:focus { + -webkit-transform: scale(1.2); + transform: scale(1.2); +} +.grow-large:active { + -webkit-transform: scale(.95); + transform: scale(.95); +} +/* Add pointer on hover */ +.pointer:hover { + cursor: pointer; +} +/* + Add shadow on hover. + + Performant box-shadow animation pattern from + http://tobiasahlin.com/blog/how-to-animate-box-shadow/ +*/ +.shadow-hover { + cursor: pointer; + position: relative; + -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); + transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); +} +.shadow-hover::after { + content: ''; + -webkit-box-shadow: 0px 0px 16px 2px rgba(0, 0, 0, .2); + box-shadow: 0px 0px 16px 2px rgba(0, 0, 0, .2); + border-radius: inherit; + opacity: 0; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: -1; + -webkit-transition: opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); + transition: opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); +} +.shadow-hover:hover::after, +.shadow-hover:focus::after { + opacity: 1; +} +/* Combine with classes in skins and skins-pseudo for + * many different transition possibilities. */ +.bg-animate, +.bg-animate:hover, +.bg-animate:focus { + -webkit-transition: background-color .15s ease-in-out; + transition: background-color .15s ease-in-out; +} +/* + + Z-INDEX + + Base + z = z-index + + Modifiers + -0 = literal value 0 + -1 = literal value 1 + -2 = literal value 2 + -3 = literal value 3 + -4 = literal value 4 + -5 = literal value 5 + -999 = literal value 999 + -9999 = literal value 9999 + + -max = largest accepted z-index value as integer + + -inherit = string value inherit + -initial = string value initial + -unset = string value unset + + MDN: https://developer.mozilla.org/en/docs/Web/CSS/z-index + Spec: http://www.w3.org/TR/CSS2/zindex.html + Articles: + https://philipwalton.com/articles/what-no-one-told-you-about-z-index/ + + Tips on extending: + There might be a time worth using negative z-index values. + Or if you are using tachyons with another project, you might need to + adjust these values to suit your needs. + +*/ +.z-0 { z-index: 0; } +.z-1 { z-index: 1; } +.z-2 { z-index: 2; } +.z-3 { z-index: 3; } +.z-4 { z-index: 4; } +.z-5 { z-index: 5; } +.z-999 { z-index: 999; } +.z-9999 { z-index: 9999; } +.z-max { + z-index: 2147483647; +} +.z-inherit { z-index: inherit; } +.z-initial { z-index: auto; z-index: initial; } +.z-unset { z-index: unset; } +/* + + NESTED + Tachyons module for styling nested elements + that are generated by a cms. + +*/ +.nested-copy-line-height p, +.nested-copy-line-height ul, +.nested-copy-line-height ol { + line-height: 1.5; +} +.nested-headline-line-height h1, +.nested-headline-line-height h2, +.nested-headline-line-height h3, +.nested-headline-line-height h4, +.nested-headline-line-height h5, +.nested-headline-line-height h6 { + line-height: 1.25; +} +.nested-list-reset ul, +.nested-list-reset ol { + padding-left: 0; + margin-left: 0; + list-style-type: none; +} +.nested-copy-indent p+p { + text-indent: 1em; + margin-top: 0; + margin-bottom: 0; +} +.nested-copy-separator p+p { + margin-top: 1.5em; +} +.nested-img img { + width: 100%; + max-width: 100%; + display: block; +} +.nested-links a { + color: #0594CB; + -webkit-transition: color .15s ease-in; + transition: color .15s ease-in; +} +.nested-links a:hover, +.nested-links a:focus { + color: #96ccff; + -webkit-transition: color .15s ease-in; + transition: color .15s ease-in; +} +/*@import 'tachyons/src/_styles';*/ +/* Variables */ +/* Importing here will allow you to override any variables in the modules */ +/* + + Tachyons + COLOR VARIABLES + + Grayscale + - Solids + - Transparencies + Colors + +*/ +/* + + CUSTOM MEDIA QUERIES + + Media query values can be changed to fit your own content. + There are no magic bullets when it comes to media query width values. + They should be declared in em units - and they should be set to meet + the needs of your content. You can also add additional media queries, + or remove some of the existing ones. + + These media queries can be referenced like so: + + @media (--breakpoint-not-small) { + .medium-and-larger-specific-style { + background-color: red; + } + } + + @media (--breakpoint-medium) { + .medium-screen-specific-style { + background-color: red; + } + } + + @media (--breakpoint-large) { + .large-and-larger-screen-specific-style { + background-color: red; + } + } + +*/ +/* Media Queries */ +/* Debugging */ +/*@import 'tachyons/src/_debug-children'; +@import 'tachyons/src/_debug-grid';*/ +/* Uncomment out the line below to help debug layout issues */ +/* @import 'tachyons/src/_debug'; */ +/* purgecss start ignore */ +.header-link:after { + position: relative; + left: 0.5em; + opacity: 0; + font-size: 0.8em; + -moz-transition: opacity 0.2s ease-in-out 0.1s; + -ms-transition: opacity 0.2s ease-in-out 0.1s; +} +h2:hover .header-link, +h3:hover .header-link, +h4:hover .header-link, +h5:hover .header-link, +h6:hover .header-link { + opacity: 1; +} +.animated { + -webkit-animation-duration: .5s; + animation-duration: .5s; + -webkit-animation-fill-mode: forwards; + animation-fill-mode: forwards; + -webkit-animation-timing-function: ease-in-out; + animation-timing-function: ease-in-out; +} +@-webkit-keyframes fadeIn { + from { + opacity: 0; + } + + to { + opacity: 1; + } +} +@keyframes fadeIn { + from { + opacity: 0; + } + + to { + opacity: 1; + } +} +.fadeIn { + -webkit-animation-name: fadeIn; + animation-name: fadeIn; +} +.animated-delay-1 { + -webkit-animation-delay: 0.5s; + animation-delay: 0.5s; +} +.note, +.warning { + + border-left-width: 4px; + border-left-style: solid; + position: relative; + border-color: #0594CB; + + display: block; +} +.note #exclamation-icon, +.warning #exclamation-icon { + + fill: #0594CB; + position: absolute; + top: 35%; + left: -12px; + /*background-color: white;*/ +} +.admonition-content { + display: block; + margin: 0px; + padding: .125em 1em; + /*margin-left: 1em;*/ + margin-top: 2em; + margin-bottom: 2em; + overflow-x: auto; + /*font-size: .9375em;*/ + background-color: rgba(0, 0, 0, .05); + } +.hide-child-menu .child-menu { + display: none; + } +.hide-child-menu:hover .child-menu, + .hide-child-menu:focus .child-menu, + .hide-child-menu:active .child-menu { + display: block; + } +/*documentation-copy headings exaggerate spacing and size to chunk content */ +.documentation-copy h2 { + margin-top: 3em + } +.documentation-copy h2.minor { + font-size: inherit; + margin-top: inherit; + border-bottom: none; +} +.searchbox{display:inline-block;position:relative;width:200px;height:32px!important;white-space:nowrap;-webkit-box-sizing:border-box;box-sizing:border-box;visibility:visible!important} +.searchbox .algolia-autocomplete{display:block;width:100%;height:100%} +.searchbox__wrapper{width:100%;height:100%;z-index:999;position:relative} +.searchbox__input{display:inline-block;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-transition:background .4s ease,-webkit-box-shadow .4s ease;transition:background .4s ease,-webkit-box-shadow .4s ease;transition:box-shadow .4s ease,background .4s ease;transition:box-shadow .4s ease,background .4s ease,-webkit-box-shadow .4s ease;border:0;border-radius:16px;-webkit-box-shadow:inset 0 0 0 1px #ccc;box-shadow:inset 0 0 0 1px #ccc;background:#fff!important;padding:0 26px 0 32px;width:100%;height:100%;vertical-align:middle;white-space:normal;font-size:12px;-webkit-appearance:none;-moz-appearance:none;appearance:none} +.searchbox__input::-webkit-search-cancel-button,.searchbox__input::-webkit-search-decoration,.searchbox__input::-webkit-search-results-button,.searchbox__input::-webkit-search-results-decoration{display:none} +.searchbox__input:hover{-webkit-box-shadow:inset 0 0 0 1px #b3b3b3;box-shadow:inset 0 0 0 1px #b3b3b3} +.searchbox__input:active,.searchbox__input:focus{outline:0;-webkit-box-shadow:inset 0 0 0 1px #aaa;box-shadow:inset 0 0 0 1px #aaa;background:#fff} +.searchbox__input::-webkit-input-placeholder{color:#aaa} +.searchbox__input:-ms-input-placeholder{color:#aaa} +.searchbox__input::-ms-input-placeholder{color:#aaa} +.searchbox__input::placeholder{color:#aaa} +.searchbox__submit{position:absolute;top:0;margin:0;border:0;border-radius:16px 0 0 16px;background-color:rgba(69, 142, 225, 0);padding:0;width:32px;height:100%;vertical-align:middle;text-align:center;font-size:inherit;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;right:inherit;left:0} +.searchbox__submit:before{display:inline-block;margin-right:-4px;height:100%;vertical-align:middle;content:""} +.searchbox__submit:active,.searchbox__submit:hover{cursor:pointer} +.searchbox__submit:focus{outline:0} +.searchbox__submit svg{width:14px;height:14px;vertical-align:middle;fill:#6d7e96} +.searchbox__reset{display:block;position:absolute;top:8px;right:8px;margin:0;border:0;background:none;cursor:pointer;padding:0;font-size:inherit;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;fill:rgba(0, 0, 0, .5)} +.searchbox__reset.hide{display:none} +.searchbox__reset:focus{outline:0} +.searchbox__reset svg{display:block;margin:4px;width:8px;height:8px} +.searchbox__input:valid~.searchbox__reset{display:block;-webkit-animation-name:sbx-reset-in;animation-name:sbx-reset-in;-webkit-animation-duration:.15s;animation-duration:.15s} +@-webkit-keyframes sbx-reset-in{0%{-webkit-transform:translate3d(-20%,0,0);transform:translate3d(-20%,0,0);opacity:0}to{-webkit-transform:none;transform:none;opacity:1}} +@keyframes sbx-reset-in{0%{-webkit-transform:translate3d(-20%,0,0);transform:translate3d(-20%,0,0);opacity:0}to{-webkit-transform:none;transform:none;opacity:1}} +.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu{right:0!important;left:inherit!important} +.algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu:before{right:48px} +.algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu{left:0!important;right:inherit!important} +.algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu:before{left:48px} +.algolia-autocomplete .ds-dropdown-menu{top:-6px;border-radius:4px;margin:6px 0 0;padding:0;text-align:left;height:auto;position:relative;background:transparent;border:none;z-index:999;max-width:600px;min-width:500px;-webkit-box-shadow:0 1px 0 0 rgba(0, 0, 0, .2),0 2px 3px 0 rgba(0, 0, 0, .1);box-shadow:0 1px 0 0 rgba(0, 0, 0, .2),0 2px 3px 0 rgba(0, 0, 0, .1)} +.algolia-autocomplete .ds-dropdown-menu:before{display:block;position:absolute;content:"";width:14px;height:14px;background:#fff;z-index:1000;top:-7px;border-top:1px solid #d9d9d9;border-right:1px solid #d9d9d9;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);border-radius:2px} +.algolia-autocomplete .ds-dropdown-menu .ds-suggestions{position:relative;z-index:1000;margin-top:8px} +.algolia-autocomplete .ds-dropdown-menu .ds-suggestions a:hover{text-decoration:none} +.algolia-autocomplete .ds-dropdown-menu .ds-suggestion{cursor:pointer} +.algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion.suggestion-layout-simple,.algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion:not(.suggestion-layout-simple) .algolia-docsearch-suggestion--content{background-color:rgba(69, 142, 225, .05)} +.algolia-autocomplete .ds-dropdown-menu [class^=ds-dataset-]{position:relative;border:1px solid #d9d9d9;background:#fff;border-radius:4px;overflow:auto;padding:0 8px 8px} +.algolia-autocomplete .ds-dropdown-menu *{-webkit-box-sizing:border-box;box-sizing:border-box} +.algolia-autocomplete .algolia-docsearch-suggestion{display:block;position:relative;padding:0 8px;background:#fff;color:#02060c;overflow:hidden} +.algolia-autocomplete .algolia-docsearch-suggestion--highlight{color:#174d8c;background:rgba(143, 187, 237, .1);padding:.1em .05em} +.algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl0 .algolia-docsearch-suggestion--highlight,.algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl1 .algolia-docsearch-suggestion--highlight,.algolia-autocomplete .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight{padding:0 0 1px;background:inherit;-webkit-box-shadow:inset 0 -2px 0 0 rgba(69, 142, 225, .8);box-shadow:inset 0 -2px 0 0 rgba(69, 142, 225, .8);color:inherit} +.algolia-autocomplete .algolia-docsearch-suggestion--content{display:block;float:right;width:70%;position:relative;padding:5.33333px 0 5.33333px 10.66667px;cursor:pointer} +.algolia-autocomplete .algolia-docsearch-suggestion--content:before{content:"";position:absolute;display:block;top:0;height:100%;width:1px;background:#ddd;left:-1px} +.algolia-autocomplete .algolia-docsearch-suggestion--category-header{position:relative;border-bottom:1px solid #ddd;display:none;margin-top:8px;padding:4px 0;font-size:1em;color:#33363d} +.algolia-autocomplete .algolia-docsearch-suggestion--wrapper{width:100%;float:left;padding:8px 0 0} +.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column{float:left;width:30%;text-align:right;position:relative;padding:5.33333px 10.66667px;color:#a4a7ae;font-size:.9em;word-wrap:break-word} +.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column:before{content:"";position:absolute;display:block;top:0;height:100%;width:1px;background:#ddd;right:0} +.algolia-autocomplete .algolia-docsearch-suggestion--subcategory-inline{display:none} +.algolia-autocomplete .algolia-docsearch-suggestion--title{margin-bottom:4px;color:#02060c;font-size:.9em;font-weight:700} +.algolia-autocomplete .algolia-docsearch-suggestion--text{display:block;line-height:1.2em;font-size:.85em;color:#63676d} +.algolia-autocomplete .algolia-docsearch-suggestion--no-results{width:100%;padding:8px 0;text-align:center;font-size:1.2em} +.algolia-autocomplete .algolia-docsearch-suggestion--no-results:before{display:none} +.algolia-autocomplete .algolia-docsearch-suggestion code{padding:1px 5px;font-size:90%;border:none;color:#222;background-color:#ebebeb;border-radius:3px;font-family:Menlo,Monaco,Consolas,Courier New,monospace} +.algolia-autocomplete .algolia-docsearch-suggestion code .algolia-docsearch-suggestion--highlight{background:none} +.algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__main .algolia-docsearch-suggestion--category-header,.algolia-autocomplete .algolia-docsearch-suggestion.algolia-docsearch-suggestion__secondary{display:block} +@media (min-width:768px){.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column{display:block}} +@media (max-width:768px){.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column{display:inline-block;width:auto;float:left;padding:0;color:#02060c;font-size:.9em;font-weight:700;text-align:left;opacity:.5}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column:before{display:none}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--subcategory-column:after{content:"|"}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--content{display:inline-block;width:auto;text-align:left;float:left;padding:0}.algolia-autocomplete .algolia-docsearch-suggestion .algolia-docsearch-suggestion--content:before{display:none}} +.algolia-autocomplete .suggestion-layout-simple.algolia-docsearch-suggestion{border-bottom:1px solid #eee;padding:8px;margin:0} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--content{width:100%;padding:0} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--content:before{display:none} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header{margin:0;padding:0;display:block;width:100%;border:none} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl0,.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl1{opacity:.6;font-size:.85em} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--category-header-lvl1:before{background-image:url('data:image/svg+xml;utf8,');content:"";width:10px;height:10px;display:inline-block} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--wrapper{width:100%;float:left;margin:0;padding:0} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--duplicate-content,.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--subcategory-inline{display:none!important} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--title{margin:0;color:#458ee1;font-size:.9em;font-weight:400} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--title:before{content:"#";font-weight:700;color:#458ee1;display:inline-block} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--text{margin:4px 0 0;display:block;line-height:1.4em;padding:5.33333px 8px;background:#f8f8f8;font-size:.85em;opacity:.8} +.algolia-autocomplete .suggestion-layout-simple .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight{color:#3f4145;font-weight:700;-webkit-box-shadow:none;box-shadow:none} +.algolia-autocomplete .algolia-docsearch-footer{width:134px;height:20px;z-index:2000;margin-top:10.66667px;float:right;font-size:0;line-height:0} +.algolia-autocomplete .algolia-docsearch-footer--logo{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='168' height='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath d='M78.988.938h16.594a2.968 2.968 0 0 1 2.966 2.966V20.5a2.967 2.967 0 0 1-2.966 2.964H78.988a2.967 2.967 0 0 1-2.966-2.964V3.897A2.961 2.961 0 0 1 78.988.938zm41.937 17.866c-4.386.02-4.386-3.54-4.386-4.106l-.007-13.336 2.675-.424v13.254c0 .322 0 2.358 1.718 2.364v2.248zm-10.846-2.18c.821 0 1.43-.047 1.855-.129v-2.719a6.334 6.334 0 0 0-1.574-.199 5.7 5.7 0 0 0-.897.069 2.699 2.699 0 0 0-.814.24c-.24.116-.439.28-.582.491-.15.212-.219.335-.219.656 0 .628.219.991.616 1.23s.938.362 1.615.362zm-.233-9.7c.883 0 1.629.109 2.231.328.602.218 1.088.525 1.444.915.363.396.609.922.76 1.483.157.56.232 1.175.232 1.85v6.874a32.5 32.5 0 0 1-1.868.314c-.834.123-1.772.185-2.813.185-.69 0-1.327-.069-1.895-.198a4.001 4.001 0 0 1-1.471-.636 3.085 3.085 0 0 1-.951-1.134c-.226-.465-.343-1.12-.343-1.803 0-.656.13-1.073.384-1.525a3.24 3.24 0 0 1 1.047-1.106c.445-.287.95-.492 1.532-.615a8.8 8.8 0 0 1 1.82-.185 8.404 8.404 0 0 1 1.972.24v-.438c0-.307-.035-.6-.11-.874a1.88 1.88 0 0 0-.384-.73 1.784 1.784 0 0 0-.724-.493 3.164 3.164 0 0 0-1.143-.205c-.616 0-1.177.075-1.69.164a7.735 7.735 0 0 0-1.26.307l-.321-2.192c.335-.117.834-.233 1.478-.349a10.98 10.98 0 0 1 2.073-.178zm52.842 9.626c.822 0 1.43-.048 1.854-.13V13.7a6.347 6.347 0 0 0-1.574-.199c-.294 0-.595.021-.896.069a2.7 2.7 0 0 0-.814.24 1.46 1.46 0 0 0-.582.491c-.15.212-.218.335-.218.656 0 .628.218.991.615 1.23.404.245.938.362 1.615.362zm-.226-9.694c.883 0 1.629.108 2.231.327.602.219 1.088.526 1.444.915.355.39.609.923.759 1.483a6.8 6.8 0 0 1 .233 1.852v6.873c-.41.088-1.034.19-1.868.314-.834.123-1.772.184-2.813.184-.69 0-1.327-.068-1.895-.198a4.001 4.001 0 0 1-1.471-.635 3.085 3.085 0 0 1-.951-1.134c-.226-.465-.343-1.12-.343-1.804 0-.656.13-1.073.384-1.524.26-.45.608-.82 1.047-1.107.445-.286.95-.491 1.532-.614a8.803 8.803 0 0 1 2.751-.13c.329.034.671.096 1.04.185v-.437a3.3 3.3 0 0 0-.109-.875 1.873 1.873 0 0 0-.384-.731 1.784 1.784 0 0 0-.724-.492 3.165 3.165 0 0 0-1.143-.205c-.616 0-1.177.075-1.69.164a7.75 7.75 0 0 0-1.26.307l-.321-2.193c.335-.116.834-.232 1.478-.348a11.633 11.633 0 0 1 2.073-.177zm-8.034-1.271a1.626 1.626 0 0 1-1.628-1.62c0-.895.725-1.62 1.628-1.62.904 0 1.63.725 1.63 1.62 0 .895-.733 1.62-1.63 1.62zm1.348 13.22h-2.689V7.27l2.69-.423v11.956zm-4.714 0c-4.386.02-4.386-3.54-4.386-4.107l-.008-13.336 2.676-.424v13.254c0 .322 0 2.358 1.718 2.364v2.248zm-8.698-5.903c0-1.156-.253-2.119-.746-2.788-.493-.677-1.183-1.01-2.067-1.01-.882 0-1.574.333-2.065 1.01-.493.676-.733 1.632-.733 2.788 0 1.168.246 1.953.74 2.63.492.683 1.183 1.018 2.066 1.018.882 0 1.574-.342 2.067-1.019.492-.683.738-1.46.738-2.63zm2.737-.007c0 .902-.13 1.584-.397 2.33a5.52 5.52 0 0 1-1.128 1.906 4.986 4.986 0 0 1-1.752 1.223c-.685.286-1.739.45-2.265.45-.528-.006-1.574-.157-2.252-.45a5.096 5.096 0 0 1-1.744-1.223c-.487-.527-.863-1.162-1.137-1.906a6.345 6.345 0 0 1-.41-2.33c0-.902.123-1.77.397-2.508a5.554 5.554 0 0 1 1.15-1.892 5.133 5.133 0 0 1 1.75-1.216c.679-.287 1.425-.423 2.232-.423.808 0 1.553.142 2.237.423a4.88 4.88 0 0 1 1.753 1.216 5.644 5.644 0 0 1 1.135 1.892c.287.738.431 1.606.431 2.508zm-20.138 0c0 1.12.246 2.363.738 2.882.493.52 1.13.78 1.91.78.424 0 .828-.062 1.204-.178.377-.116.677-.253.917-.417V9.33a10.476 10.476 0 0 0-1.766-.226c-.971-.028-1.71.37-2.23 1.004-.513.636-.773 1.75-.773 2.788zm7.438 5.274c0 1.824-.466 3.156-1.404 4.004-.936.846-2.367 1.27-4.296 1.27-.705 0-2.17-.137-3.34-.396l.431-2.118c.98.205 2.272.26 2.95.26 1.074 0 1.84-.219 2.299-.656.459-.437.684-1.086.684-1.948v-.437a8.07 8.07 0 0 1-1.047.397c-.43.13-.93.198-1.492.198-.739 0-1.41-.116-2.018-.349a4.206 4.206 0 0 1-1.567-1.025c-.431-.45-.774-1.017-1.013-1.694-.24-.677-.363-1.885-.363-2.773 0-.834.13-1.88.384-2.577.26-.696.629-1.298 1.129-1.796.493-.498 1.095-.881 1.8-1.162a6.605 6.605 0 0 1 2.428-.457c.87 0 1.67.109 2.45.24.78.129 1.444.265 1.985.415V18.17z' fill='%235468FF'/%3E%3Cpath d='M6.972 6.677v1.627c-.712-.446-1.52-.67-2.425-.67-.585 0-1.045.13-1.38.391a1.24 1.24 0 0 0-.502 1.03c0 .425.164.765.494 1.02.33.256.835.532 1.516.83.447.192.795.356 1.045.495.25.138.537.332.862.582.324.25.563.548.718.894.154.345.23.741.23 1.188 0 .947-.334 1.691-1.004 2.234-.67.542-1.537.814-2.601.814-1.18 0-2.16-.229-2.936-.686v-1.708c.84.628 1.814.942 2.92.942.585 0 1.048-.136 1.388-.407.34-.271.51-.646.51-1.125 0-.287-.1-.55-.302-.79-.203-.24-.42-.42-.655-.542-.234-.123-.585-.29-1.053-.503a61.27 61.27 0 0 1-.582-.271 13.67 13.67 0 0 1-.55-.287 4.275 4.275 0 0 1-.567-.351 6.92 6.92 0 0 1-.455-.4c-.18-.17-.31-.34-.39-.51-.08-.17-.155-.37-.224-.598a2.553 2.553 0 0 1-.104-.742c0-.915.333-1.638.998-2.17.664-.532 1.523-.798 2.576-.798.968 0 1.793.17 2.473.51zm7.468 5.696v-.287c-.022-.607-.187-1.088-.495-1.444-.309-.357-.75-.535-1.324-.535-.532 0-.99.194-1.373.583-.382.388-.622.949-.717 1.683h3.909zm1.005 2.792v1.404c-.596.34-1.383.51-2.362.51-1.255 0-2.255-.377-3-1.132-.744-.755-1.116-1.744-1.116-2.968 0-1.297.34-2.316 1.021-3.055.68-.74 1.548-1.11 2.6-1.11 1.033 0 1.852.323 2.458.966.606.644.91 1.572.91 2.784 0 .33-.033.676-.096 1.038h-5.314c.107.702.405 1.239.894 1.611.49.372 1.106.558 1.85.558.862 0 1.58-.202 2.155-.606zm6.605-1.77h-1.212c-.596 0-1.045.116-1.349.35-.303.234-.454.532-.454.894 0 .372.117.664.35.877.235.213.575.32 1.022.32.51 0 .912-.142 1.204-.424.293-.281.44-.651.44-1.108v-.91zm-4.068-2.554V9.325c.627-.361 1.457-.542 2.489-.542 2.116 0 3.175 1.026 3.175 3.08V17h-1.548v-.957c-.415.68-1.143 1.02-2.186 1.02-.766 0-1.38-.22-1.843-.661-.462-.442-.694-1.003-.694-1.684 0-.776.293-1.38.878-1.81.585-.431 1.404-.647 2.457-.647h1.34V11.8c0-.554-.133-.971-.399-1.253-.266-.282-.707-.423-1.324-.423a4.07 4.07 0 0 0-2.345.718zm9.333-1.93v1.42c.394-1 1.101-1.5 2.123-1.5.148 0 .313.016.494.048v1.531a1.885 1.885 0 0 0-.75-.143c-.542 0-.989.24-1.34.718-.351.479-.527 1.048-.527 1.707V17h-1.563V8.91h1.563zm5.01 4.084c.022.82.272 1.492.75 2.019.479.526 1.15.79 2.01.79.639 0 1.235-.176 1.788-.527v1.404c-.521.319-1.186.479-1.995.479-1.265 0-2.276-.4-3.031-1.197-.755-.798-1.133-1.792-1.133-2.984 0-1.16.38-2.151 1.14-2.975.761-.825 1.79-1.237 3.088-1.237.702 0 1.346.149 1.93.447v1.436a3.242 3.242 0 0 0-1.77-.495c-.84 0-1.513.266-2.019.798-.505.532-.758 1.213-.758 2.042zM40.24 5.72v4.579c.458-1 1.293-1.5 2.505-1.5.787 0 1.42.245 1.899.734.479.49.718 1.17.718 2.042V17h-1.564v-5.106c0-.553-.14-.98-.422-1.284-.282-.303-.652-.455-1.11-.455-.531 0-1.002.202-1.411.606-.41.405-.615 1.022-.615 1.851V17h-1.563V5.72h1.563zm14.966 10.02c.596 0 1.096-.253 1.5-.758.404-.506.606-1.157.606-1.955 0-.915-.202-1.62-.606-2.114-.404-.495-.92-.742-1.548-.742-.553 0-1.05.224-1.491.67-.442.447-.662 1.133-.662 2.058 0 .958.212 1.67.638 2.138.425.469.946.703 1.563.703zM53.004 5.72v4.42c.574-.894 1.388-1.341 2.44-1.341 1.022 0 1.857.383 2.506 1.149.649.766.973 1.781.973 3.047 0 1.138-.309 2.109-.925 2.912-.617.803-1.463 1.205-2.537 1.205-1.075 0-1.894-.447-2.457-1.34V17h-1.58V5.72h1.58zm9.908 11.104l-3.223-7.913h1.739l1.005 2.632 1.26 3.415c.096-.32.48-1.458 1.15-3.415l.909-2.632h1.66l-2.92 7.866c-.777 2.074-1.963 3.11-3.559 3.11a2.92 2.92 0 0 1-.734-.079v-1.34c.17.042.351.064.543.064 1.032 0 1.755-.57 2.17-1.708z' fill='%235D6494'/%3E%3Cpath d='M89.632 5.967v-.772a.978.978 0 0 0-.978-.977h-2.28a.978.978 0 0 0-.978.977v.793c0 .088.082.15.171.13a7.127 7.127 0 0 1 1.984-.28c.65 0 1.295.088 1.917.259.082.02.164-.04.164-.13m-6.248 1.01l-.39-.389a.977.977 0 0 0-1.382 0l-.465.465a.973.973 0 0 0 0 1.38l.383.383c.062.061.15.047.205-.014.226-.307.472-.601.746-.874.281-.28.568-.526.883-.751.068-.042.075-.137.02-.2m4.16 2.453v3.341c0 .096.104.165.192.117l2.97-1.537c.068-.034.089-.117.055-.184a3.695 3.695 0 0 0-3.08-1.866c-.068 0-.136.054-.136.13m0 8.048a4.489 4.489 0 0 1-4.49-4.482 4.488 4.488 0 0 1 4.49-4.482 4.488 4.488 0 0 1 4.489 4.482 4.484 4.484 0 0 1-4.49 4.482m0-10.85a6.363 6.363 0 1 0 0 12.729 6.37 6.37 0 0 0 6.372-6.368 6.358 6.358 0 0 0-6.371-6.36' fill='%23FFF'/%3E%3C/g%3E%3C/svg%3E");background-repeat:no-repeat;background-position:50%;background-size:100%;overflow:hidden;text-indent:-9000px;padding:0!important;width:100%;height:100%;display:block} +/* These styles enhance the home page carousel, located here: themes/gohugoioTheme/layouts/partials/home-page-sections/showcase.html */ +.overflow-x-scroll{ + -webkit-overflow-scrolling: touch; +} +.row { + -webkit-transition: 450ms -webkit-transform; + transition: 450ms -webkit-transform; + transition: 450ms transform; + transition: 450ms transform, 450ms -webkit-transform; + font-size: 0; +} +.tile { + -webkit-transition: 450ms all; + transition: 450ms all; +} +.details { + background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .9)), to(rgba(0, 0, 0, 0))); + background: linear-gradient(to top, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, 0) 100%); + -webkit-transition: 450ms opacity; + transition: 450ms opacity; +} +.tile:hover .details { + opacity: 1; +} +.row:hover .tile { + opacity: 0.3; +} +.row:hover .tile:hover { + opacity: 1; +} +.chroma .lntable pre { + padding: 0; + margin: 0; + border: 0; +} +.chroma .lntable pre code { + padding: 0; + margin: 0; +} +code { - padding: 0.2em; ++ padding: 2px 3px; + margin: 0; - font-size: 85%; ++ font-size: 93.75%; + background-color: rgba(27, 31, 35, .05); + border-radius: 3px; +} +pre code { + display: block; + padding: 1.5em 1.5em; + font-size: .875rem; + line-height: 2; + overflow-x: auto; +} +pre { + background-color: #fff; + color: #333; + white-space: pre; + -webkit-hyphens: none; + -ms-hyphens: none; + hyphens: none; + position: relative; + border-width: 1px; + border-color: #ccc; + border-style: solid; +} +/* The Pygments highlighter comes with its own styles. */ +.highlight pre { + background-color: inherit; + color: inherit; + padding: 0.5em; + font-size: .875rem; +} +/*We are adding the copy button content here so we can change it with javascript. See the "Clipboard scripts"*/ +.copy:after { + content: "Copy" +} +.copied:after { + content: "Copied" +} +@media screen and (min-width: 60em) { + .full-width + { + /*width: 100vw; + position: relative; + left: 50%; + right: 50%; + margin-left: -50vw; + margin-right: -50vw;*/ + /*width: 60vw;*/ + /*position: relative; + left: 50%; + right: 50%;*/ + /*margin-left: -30vw;*/ + margin-right: -30vw; + max-width: 100vw; + } +} +.code-block .line-numbers-rows { + background: #2f3a46; + border: none; + bottom: -50px; + color: #98a4b3; + left: -178px; + padding: 50px 0; + top: -50px; + width: 138px +} +.code-block .line-numbers-rows>span:before { + color: inherit; + padding-right: 30px +} +.tab-button{ + margin-bottom:1px; + position: relative; + z-index: 1; + color:#333; + border-color:#ccc; + outline: none; + background-color:white; +} +.tab-pane code{ + background:#f1f2f2; + border-radius:0; +} +.tab-pane .chroma{ + background:none; + padding:0; +} +.tab-button.active{ + border-bottom-color:#f1f2f2; + background-color: #f1f2f2; +} +.tab-content .tab-pane{ + display: none; +} +.tab-content .tab-pane.active{ + display: block; +} +/* Treatment of copy buttons inside a tab module */ +.tab-content .copy, .tab-content .copied{ + display: none; +} +.tab-content .tab-pane.active + .copy, .tab-content .tab-pane.active + .copied{ + display: block; +} +.primary-color {color: #0594CB} +.bg-primary-color {background-color: #0594CB} +.hover-bg-primary-color:hover {background-color: #0594CB} +.primary-color-dark {color: #0A1922} +.bg-primary-color-dark {background-color: #0A1922} +.hover-bg-primary-color-dark:hover {background-color: #0A1922} +.primary-color-light {color: #f9f9f9} +.bg-primary-color-light {background-color: #f9f9f9} +.hover-bg-primary-color-light:hover {background-color: #f9f9f9} +.accent-color {color: #EBB951} +.bg-accent-color {background-color: #EBB951} +.hover-bg-accent-color:hover {background-color: #EBB951} +.accent-color-light {color: #FF4088} +.hover-accent-color-light:hover {color: #FF4088} +.bg-accent-color-light {background-color: #FF4088} +.hover-bg-accent-color-light:hover {background-color: #FF4088} +.accent-color-dark {color: #33ba91} +.bg-accent-color-dark {background-color: #33ba91} +.hover-bg-accent-color-dark:hover {background-color: #33ba91} +.text-color-primary {color: #373737} +.text-on-primary-color {color: #fff} +.text-color-secondary {color: #ccc} +.text-color-disabled {color: #F7f7f7} +.divider-color {color: #f6f6f6} +.warn-color {color: red} +.nested-links a { + color: #0594CB; + text-decoration: none; + +} +.column-count-2 {-webkit-column-count: 1;column-count: 1} +.column-gap-1 {-webkit-column-gap: 0;column-gap: 0} +.break-inside-avoid {-webkit-column-break-inside: auto;break-inside: auto} +@media screen and (min-width: 60em) { + .column-count-3-l {-webkit-column-count: 3;column-count: 3} + .column-count-2-l {-webkit-column-count: 2;column-count: 2} + .column-gap-1-l {-webkit-column-gap: 1;column-gap: 1} + .break-inside-avoid-l {-webkit-column-break-inside: avoid;break-inside: avoid} +} +.prose ul, .prose ol { + margin-bottom: 2em; +} +.prose ul li, .prose ol li { + margin-bottom: .5em; +} +.prose li:hover { + background-color: #eee +} +.prose ::selection { + background: #0594CB; /* WebKit/Blink Browsers */ + color: white; +} +.prose-glossary h3 { + margin-top: 0; + font-size: 1.125rem; +} +.prose-glossary h3:first-of-type { + margin-top: 3em; +} +.prose-glossary h3 ~ p { + margin: 0.5em 0 2em 0; +} +body { + +line-height: 1.45; + +} +p {margin-bottom: 1.3em;} +h1, h2, h3, h4 { +margin: 1.414em 0 0.5em; + +line-height: 1.2; +} +h1 { +margin-top: 0; +font-size: 2.441em; +} +h2 {font-size: 1.953em;} +h3 {font-size: 1.563em;} +h4 {font-size: 1.25em;} +small, .font_small {font-size: 0.8em;} +.prose table { + width: 100%; + margin-bottom: 3em; + border-collapse: collapse; + border-spacing: 0; + font-size: 1em; + border: 1px solid #eee + +} +.prose table th { + background-color: #0594CB; + border-bottom: 1px solid #0594CB; + color: white; + font-weight: 400; + text-align: left; + padding: .375em .5em; +} +.prose table td, .prose table tc { + padding: .75em .5em; + text-align: left; + border-right: 1px solid #eee; +} +.prose table tr:nth-child(even) { + background-color: #eee; +} +dl dt { + font-weight: bold; + font-size: 1.125rem; +} +dd { + margin: .5em 0 2em 0; + padding: 0; +} +.f2-fluid { + font-size: 2.25rem; +} +@media screen and (min-width: 60em) { + .f2-fluid { + font-size: 1.25rem; + font-size: calc(0.70833rem + 0.83333vw); + } +} +/* From https://www.cssfontstack.com */ +code, .code, pre code, .highlight pre { + font-family: 'inconsolata',Menlo,Monaco,'Courier New',monospace; +} +.sans-serif { + font-family: 'Muli', Avenir, 'Helvetica Neue', Helvetica, Roboto, Noto, 'Segoe UI', Arial, sans-serif; +} +.serif { + font-family: Palatino,"Palatino Linotype","Palatino LT STD","Book Antiqua",Georgia,serif; +} +/* Monospaced Typefaces (for code) */ +.courier { + font-family: 'Courier Next', + courier, + monospace; +} +/* Sans-Serif Typefaces */ +.helvetica { + font-family: 'helvetica neue', helvetica, + sans-serif; +} +.avenir { + font-family: 'avenir next', avenir, + sans-serif; +} +/* Serif Typefaces */ +.athelas { + font-family: athelas, + georgia, + serif; +} +.georgia { + font-family: georgia, + serif; +} +.times { + font-family: times, + serif; +} +.bodoni { + font-family: "Bodoni MT", + serif; +} +.calisto { + font-family: "Calisto MT", + serif; +} +.garamond { + font-family: garamond, + serif; +} +.baskerville { + font-family: baskerville, + serif; +} +/* pagination.html: https://github.com/gohugoio/hugo/blob/master/tpl/tplimpl/template_embedded.go#L117 */ +.pagination { + margin: 3rem 0; +} +.pagination li { + display: inline-block; + margin-right: .375rem; + font-size: .875rem; + margin-bottom: 2.5em; +} +.pagination li a { + padding: .5rem .625rem; + background-color: white; + color: #333; + border: 1px solid #ddd; + border-radius: 3px; + text-decoration: none; +} +.pagination li.disabled { + display: none; +} +.pagination li.active a:link, +.pagination li.active a:active, +.pagination li.active a:visited { + background-color: #ddd; +} +/* Hides non-meaningful TOC items*/ +#TableOfContents ul li ul li ul li{ + display: none; + } +#TableOfContents ul li { + color: black; + display: block; + margin-bottom: .375em; + line-height: 1.375; +} +#TableOfContents ul li a{ + width: 100%; + padding: .25em .375em; + margin-left: -.375em; + +} +#TableOfContents ul li a:hover { + background-color: #999; + color: white; + +} +.no-js .needs-js { + opacity: 0 +} +.js .needs-js { + opacity: 1; + -webkit-transition: opacity .15s ease-in; + transition: opacity .15s ease-in; +} +.facebook, +.twitter, +.instagram, +.youtube { + fill: #bababa; +} +.facebook:hover { + fill: #3b5998; +} +.twitter { + fill: #55acee; +} +.twitter:hover { + fill: #bababa; +} +.instagram:hover { + fill: #e95950; +} +.youtube:hover { + fill: #bb0000; +} +.mstdn { + display: inline-block; + background-color: #282c37; + color: #d9e1e8; + text-decoration: none; + padding: 4px 10px 4px 30px; + border-radius: 4px; + font-size: 16px; + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2261.076954mm%22%20height%3D%2265.47831mm%22%20viewBox%3D%220%200%20216.4144%20232.00976%22%3E%3Cpath%20d%3D%22M211.80734%20139.0875c-3.18125%2016.36625-28.4925%2034.2775-57.5625%2037.74875-15.15875%201.80875-30.08375%203.47125-45.99875%202.74125-26.0275-1.1925-46.565-6.2125-46.565-6.2125%200%202.53375.15625%204.94625.46875%207.2025%203.38375%2025.68625%2025.47%2027.225%2046.39125%2027.9425%2021.11625.7225%2039.91875-5.20625%2039.91875-5.20625l.8675%2019.09s-14.77%207.93125-41.08125%209.39c-14.50875.7975-32.52375-.365-53.50625-5.91875C9.23234%20213.82%201.40609%20165.31125.20859%20116.09125c-.365-14.61375-.14-28.39375-.14-39.91875%200-50.33%2032.97625-65.0825%2032.97625-65.0825C49.67234%203.45375%2078.20359.2425%20107.86484%200h.72875c29.66125.2425%2058.21125%203.45375%2074.8375%2011.09%200%200%2032.975%2014.7525%2032.975%2065.0825%200%200%20.41375%2037.13375-4.59875%2062.915%22%20fill%3D%22%233088d4%22%2F%3E%3Cpath%20d%3D%22M177.50984%2080.077v60.94125h-24.14375v-59.15c0-12.46875-5.24625-18.7975-15.74-18.7975-11.6025%200-17.4175%207.5075-17.4175%2022.3525v32.37625H96.20734V85.42325c0-14.845-5.81625-22.3525-17.41875-22.3525-10.49375%200-15.74%206.32875-15.74%2018.7975v59.15H38.90484V80.077c0-12.455%203.17125-22.3525%209.54125-29.675%206.56875-7.3225%2015.17125-11.07625%2025.85-11.07625%2012.355%200%2021.71125%204.74875%2027.8975%2014.2475l6.01375%2010.08125%206.015-10.08125c6.185-9.49875%2015.54125-14.2475%2027.8975-14.2475%2010.6775%200%2019.28%203.75375%2025.85%2011.07625%206.36875%207.3225%209.54%2017.22%209.54%2029.675%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); + background-size: 16px; + background-repeat: no-repeat; + background-position: top 50% left 8px; + -webkit-transition: all 0.5s; + transition: all 0.5s; +} +.mstdn:hover { + background-color: #484c56; +} +.mstdn > span { + color: #9baec8; + font-size: 12px; + padding-left: 3px; +} +.mstdn > span:before { + content: "@"; +} +@media (min-width: 75em) { + + [data-scrolldir="down"] .sticky { + position: fixed; + top:100px; + right:0; + } + + [data-scrolldir="up"] .sticky { + position: fixed; + top:100px; + right:0; + } +} +#right-sidebar { + scrollbar-width: none; /* hide scrollbar: Firefox */ + -ms-overflow-style: none; /* hide scrollbar: Internet Explorer 10+ */ + height: calc(100vh - 9rem); + overflow-y: auto; +} +#right-sidebar::-webkit-scrollbar { /* hide scrollbar: WebKit */ + width: 0; + height: 0; +} +.fill-current { fill: currentColor; } +/* Background */ +.chroma { background-color: #ffffff } +/* Error */ +.chroma .err { color: #a61717; background-color: #e3d2d2 } +/* LineTableTD */ +.chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; } +/* LineTable */ +.chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; } +/* LineHighlight */ +.chroma .hl { display: block; width: 100%;background-color: #ffffcc } +/* LineNumbersTable */ +.chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; } +/* LineNumbers */ +.chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em; } +/* Keyword */ +.chroma .k { font-weight: bold } +/* KeywordConstant */ +.chroma .kc { font-weight: bold } +/* KeywordDeclaration */ +.chroma .kd { font-weight: bold } +/* KeywordNamespace */ +.chroma .kn { font-weight: bold } +/* KeywordPseudo */ +.chroma .kp { font-weight: bold } +/* KeywordReserved */ +.chroma .kr { font-weight: bold } +/* KeywordType */ +.chroma .kt { color: #445588; font-weight: bold } +/* NameAttribute */ +.chroma .na { color: #008080 } +/* NameBuiltin */ +.chroma .nb { color: #999999 } +/* NameClass */ +.chroma .nc { color: #445588; font-weight: bold } +/* NameConstant */ +.chroma .no { color: #008080 } +/* NameEntity */ +.chroma .ni { color: #800080 } +/* NameException */ +.chroma .ne { color: #990000; font-weight: bold } +/* NameFunction */ +.chroma .nf { color: #990000; font-weight: bold } +/* NameNamespace */ +.chroma .nn { color: #555555 } +/* NameTag */ +.chroma .nt { color: #000080 } +/* NameVariable */ +.chroma .nv { color: #008080 } +/* LiteralString */ +.chroma .s { color: #bb8844 } +/* LiteralStringAffix */ +.chroma .sa { color: #bb8844 } +/* LiteralStringBacktick */ +.chroma .sb { color: #bb8844 } +/* LiteralStringChar */ +.chroma .sc { color: #bb8844 } +/* LiteralStringDelimiter */ +.chroma .dl { color: #bb8844 } +/* LiteralStringDoc */ +.chroma .sd { color: #bb8844 } +/* LiteralStringDouble */ +.chroma .s2 { color: #bb8844 } +/* LiteralStringEscape */ +.chroma .se { color: #bb8844 } +/* LiteralStringHeredoc */ +.chroma .sh { color: #bb8844 } +/* LiteralStringInterpol */ +.chroma .si { color: #bb8844 } +/* LiteralStringOther */ +.chroma .sx { color: #bb8844 } +/* LiteralStringRegex */ +.chroma .sr { color: #808000 } +/* LiteralStringSingle */ +.chroma .s1 { color: #bb8844 } +/* LiteralStringSymbol */ +.chroma .ss { color: #bb8844 } +/* LiteralNumber */ +.chroma .m { color: #009999 } +/* LiteralNumberBin */ +.chroma .mb { color: #009999 } +/* LiteralNumberFloat */ +.chroma .mf { color: #009999 } +/* LiteralNumberHex */ +.chroma .mh { color: #009999 } +/* LiteralNumberInteger */ +.chroma .mi { color: #009999 } +/* LiteralNumberIntegerLong */ +.chroma .il { color: #009999 } +/* LiteralNumberOct */ +.chroma .mo { color: #009999 } +/* Operator */ +.chroma .o { font-weight: bold } +/* OperatorWord */ +.chroma .ow { font-weight: bold } +/* Comment */ +.chroma .c { color: #999988; font-style: italic } +/* CommentHashbang */ +.chroma .ch { color: #999988; font-style: italic } +/* CommentMultiline */ +.chroma .cm { color: #999988; font-style: italic } +/* CommentSingle */ +.chroma .c1 { color: #999988; font-style: italic } +/* CommentSpecial */ +.chroma .cs { color: #999999; font-weight: bold; font-style: italic } +/* CommentPreproc */ +.chroma .cp { color: #999999; font-weight: bold } +/* CommentPreprocFile */ +.chroma .cpf { color: #999999; font-weight: bold } +/* GenericDeleted */ +.chroma .gd { color: #000000; background-color: #ffdddd } +/* GenericEmph */ +.chroma .ge { font-style: italic } +/* GenericError */ +.chroma .gr { color: #aa0000 } +/* GenericHeading */ +.chroma .gh { color: #999999 } +/* GenericInserted */ +.chroma .gi { color: #000000; background-color: #ddffdd } +/* GenericOutput */ +.chroma .go { color: #888888 } +/* GenericPrompt */ +.chroma .gp { color: #555555 } +/* GenericStrong */ +.chroma .gs { font-weight: bold } +/* GenericSubheading */ +.chroma .gu { color: #aaaaaa } +/* GenericTraceback */ +.chroma .gt { color: #aa0000 } +/* TextWhitespace */ +.chroma .w { color: #bbbbbb } +@media print { + #page-footer, + body > footer, + body > nav { + display: none; + } +} +/* +Make h6 elements behave like dt elements. Initially implemented to support +linkable glossary entries. + +Yes, it's a hack. That's why it's in the shame file. +*/ +h6 { + margin-top: 0; + margin-bottom: 0; + font-size: 1.125rem; +} +h6:first-of-type { + margin-top: 3em; +} +h6 ~ p { + margin: 0.5em 0 2em 0; +} +/* QR codes */ +img.qrcode { + width: auto; + width: initial; +} +.nested-blockquote blockquote { + border-left: 4px solid #0594CB; + padding-left: 1em; +} +.mw-90 { + max-width:90%; +} +/* purgecss end ignore */ + diff --cc docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/partials/components/author-github-data-card.html index 4caa21f3e,000000000..d3edadaac mode 100644,000000..100644 --- a/docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/partials/components/author-github-data-card.html +++ b/docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/partials/components/author-github-data-card.html @@@ -1,43 -1,0 +1,43 @@@ +{{ $author := .context.Params.author }} +{{ if $author }} + +{{ end }} diff --cc docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/partials/components/author-github-data.html index fbad3a0a7,000000000..c281e411f mode 100644,000000..100644 --- a/docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/partials/components/author-github-data.html +++ b/docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/partials/components/author-github-data.html @@@ -1,36 -1,0 +1,36 @@@ +{{ $author := .context.Params.author }} +{{ if $author }} + +{{ end }} diff --cc docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/partials/utilities/get-remote-data.html index 69ac41da4,000000000..78b2ba06e mode 100644,000000..100644 --- a/docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/partials/utilities/get-remote-data.html +++ b/docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/partials/utilities/get-remote-data.html @@@ -1,23 -1,0 +1,23 @@@ +{{/* +Parses the serialized data from the given URL and returns a map or an array. + +Supports CSV, JSON, TOML, YAML, and XML. + +@param {string} . The URL from which to retrieve the serialized data. +@returns {any} + +@example {{ partial "get-remote-data.html" "https://example.org/foo.json" }} +*/}} + +{{ $url := . }} +{{ $data := dict }} - {{ with resources.GetRemote $url }} ++{{ with try (resources.GetRemote $url) }} + {{ with .Err }} + {{ errorf "%s" . }} - {{ else }} ++ {{ else with .Value }} + {{ $data = .Content | transform.Unmarshal }} ++ {{ else }} ++ {{ errorf "Unable to get remote resource %q" $url }} + {{ end }} - {{ else }} - {{ errorf "Unable to get remote resource %q" $url }} +{{ end }} +{{ return $data }} diff --cc docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/shortcodes/hl.html index 000000000,000000000..1a5b4e1ec new file mode 100644 --- /dev/null +++ b/docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/shortcodes/hl.html @@@ -1,0 -1,0 +1,11 @@@ ++{{- /* ++Returns syntax-highlighted code from the given text. ++ ++This is useful as a terse way to highlight inline code snippets. Calling the ++highlight shortcode for inline snippets is verbose. ++*/}} ++ ++{{- $code := .Inner | strings.TrimSpace }} ++{{- $lang := or (.Get 0) "go" }} ++{{- $opts := dict "hl_inline" true "noClasses" true }} ++{{- transform.Highlight $code $lang $opts }} diff --cc docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/shortcodes/img.html index dd8c60e18,000000000..7c2d805d2 mode 100644,000000..100644 --- a/docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/shortcodes/img.html +++ b/docs/_vendor/github.com/gohugoio/gohugoioTheme/layouts/shortcodes/img.html @@@ -1,381 -1,0 +1,391 @@@ +{{- /* +Renders the given image using the given filter, if any. + +@param {string} src The path to the image which must be a remote, page, or global resource. +@param {string} [filter] The filter to apply to the image (case-insensitive). +@param {string} [filterArgs] A comma-delimited list of arguments to pass to the filter. +@param {bool} [example=false] If true, renders a before/after example. +@param {int} [exampleWidth=384] Image width, in pixels, when rendering a before/after example. + +@returns {template.HTML} + +@examples + + {{< img src="zion-national-park.jpg" >}} + + {{< img src="zion-national-park.jpg" alt="Zion National Park" >}} + + {{< img + src="zion-national-park.jpg" + alt="Zion National Park" + filter="grayscale" + >}} + + {{< img + src="zion-national-park.jpg" + alt="Zion National Park" + filter="process" + filterArgs="resize 400x webp" + >}} + + {{< img + src="zion-national-park.jpg" + alt="Zion National Park" + filter="colorize" + filterArgs="180,50,20" + >}} + + {{< img + src="zion-national-park.jpg" + alt="Zion National Park" + filter="grayscale" + example=true + >}} + + {{< img + src="zion-national-park.jpg" + alt="Zion National Park" + filter="grayscale" + example=true + exampleWidth=400 + >}} + + When using the text filter, provide the arguments in this order: + + 0. The text + 1. The horizontal offset, in pixels, relative to the left of the image (default 20) + 2. The vertical offset, in pixels, relative to the top of the image (default 20) + 3. The font size in pixels (default 64) + 4. The line height (default 1.2) + 5. The font color (default #ffffff) + + {{< img + src="images/examples/zion-national-park.jpg" + alt="Zion National Park" + filter="Text" + filterArgs="Zion National Park,25,250,56" + example=true + >}} + + When using the padding filter, provide all arguments in this order: + + 0. Padding top + 1. Padding right + 2. Padding bottom + 3. Padding right + 4. Canvas color + + {{< img + src="images/examples/zion-national-park.jpg" + alt="Zion National Park" + filter="Padding" + filterArgs="20,50,20,50,#0705" + example=true + >}} + +*/}} + +{{- /* Initialize. */}} +{{- $alt := "" }} +{{- $src := "" }} +{{- $filter := "" }} +{{- $filterArgs := slice }} +{{- $example := false }} +{{- $exampleWidth := 384 }} + +{{- /* Default values to use with the text filter. */}} +{{ $textFilterOpts := dict + "xOffset" 20 + "yOffset" 20 + "fontSize" 64 + "lineHeight" 1.2 + "fontColor" "#ffffff" + "fontPath" "https://github.com/google/fonts/raw/main/ofl/lato/Lato-Regular.ttf" +}} + +{{- /* Get and validate parameters. */}} +{{- with .Get "alt" }} + {{- $alt = .}} +{{- end }} + +{{- with .Get "src" }} + {{- $src = . }} +{{- else }} + {{- errorf "The %q shortcode requires a file parameter. See %s" .Name .Position }} +{{- end }} + +{{- with .Get "filter" }} + {{- $filter = . | lower }} +{{- end }} + +{{- $validFilters := slice + "autoorient" "brightness" "colorbalance" "colorize" "contrast" "dither" - "gamma" "gaussianblur" "grayscale" "hue" "invert" "none" "opacity" "overlay" - "padding" "pixelate" "process" "saturation" "sepia" "sigmoid" "text" ++ "gamma" "gaussianblur" "grayscale" "hue" "invert" "mask" "none" "opacity" ++ "overlay" "padding" "pixelate" "process" "saturation" "sepia" "sigmoid" "text" + "unsharpmask" +}} + +{{- with $filter }} + {{- if not (in $validFilters .) }} + {{- errorf "The filter passed to the %q shortcode is invalid. The filter must be one of %s. See %s" $.Name (delimit $validFilters ", " ", or ") $.Position }} + {{- end }} +{{- end }} + +{{- with .Get "filterArgs" }} + {{- $filterArgs = split . "," }} + {{- $filterArgs = apply $filterArgs "trim" "." " " }} +{{- end }} + +{{- if in (slice "false" false 0) (.Get "example") }} + {{- $example = false }} +{{- else if in (slice "true" true 1) (.Get "example")}} + {{- $example = true }} +{{- end }} + +{{- with .Get "exampleWidth" }} + {{- $exampleWidth = . | int }} +{{- end }} + +{{- /* Get image. */}} +{{- $ctx := dict "page" .Page "src" $src "name" .Name "position" .Position }} +{{- $i := partial "inline/get-resource.html" $ctx }} + +{{- /* Resize if rendering before/after examples. */}} +{{- if $example }} + {{- $i = $i.Resize (printf "%dx" $exampleWidth) }} +{{- end }} + +{{- /* Create filter. */}} +{{- $f := "" }} +{{- $ctx := dict "filter" $filter "args" $filterArgs "name" .Name "position" .Position }} +{{- if eq $filter "autoorient" }} + {{- $ctx = merge $ctx (dict "argsRequired" 0) }} + {{- template "validate-arg-count" $ctx }} + {{- $f = images.AutoOrient }} +{{- else if eq $filter "brightness" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "percentage" "argValue" (index $filterArgs 0) "min" -100 "max" 100) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.Brightness (index $filterArgs 0) }} +{{- else if eq $filter "colorbalance" }} + {{- $ctx = merge $ctx (dict "argsRequired" 3) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "percentage red" "argValue" (index $filterArgs 0) "min" -100 "max" 500) }} + {{- template "validate-arg-value" $ctx }} + {{- $ctx = merge $ctx (dict "argName" "percentage green" "argValue" (index $filterArgs 1) "min" -100 "max" 500) }} + {{- template "validate-arg-value" $ctx }} + {{- $ctx = merge $ctx (dict "argName" "percentage blue" "argValue" (index $filterArgs 2) "min" -100 "max" 500) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.ColorBalance (index $filterArgs 0) (index $filterArgs 1) (index $filterArgs 2) }} +{{- else if eq $filter "colorize" }} + {{- $ctx = merge $ctx (dict "argsRequired" 3) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "hue" "argValue" (index $filterArgs 0) "min" 0 "max" 360) }} + {{- template "validate-arg-value" $ctx }} + {{- $ctx = merge $ctx (dict "argName" "saturation" "argValue" (index $filterArgs 1) "min" 0 "max" 100) }} + {{- template "validate-arg-value" $ctx }} + {{- $ctx = merge $ctx (dict "argName" "percentage" "argValue" (index $filterArgs 2) "min" 0 "max" 100) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.Colorize (index $filterArgs 0) (index $filterArgs 1) (index $filterArgs 2) }} +{{- else if eq $filter "contrast" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "percentage" "argValue" (index $filterArgs 0) "min" -100 "max" 100) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.Contrast (index $filterArgs 0) }} +{{- else if eq $filter "dither" }} + {{- $f = images.Dither }} +{{- else if eq $filter "gamma" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "gamma" "argValue" (index $filterArgs 0) "min" 0 "max" 100) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.Gamma (index $filterArgs 0) }} +{{- else if eq $filter "gaussianblur" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "sigma" "argValue" (index $filterArgs 0) "min" 0 "max" 1000) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.GaussianBlur (index $filterArgs 0) }} +{{- else if eq $filter "grayscale" }} + {{- $ctx = merge $ctx (dict "argsRequired" 0) }} + {{- template "validate-arg-count" $ctx }} + {{- $f = images.Grayscale }} +{{- else if eq $filter "hue" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "shift" "argValue" (index $filterArgs 0) "min" -180 "max" 180) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.Hue (index $filterArgs 0) }} +{{- else if eq $filter "invert" }} + {{- $ctx = merge $ctx (dict "argsRequired" 0) }} + {{- template "validate-arg-count" $ctx }} + {{- $f = images.Invert }} ++{{- else if eq $filter "mask" }} ++ {{- $ctx = merge $ctx (dict "argsRequired" 1) }} ++ {{- template "validate-arg-count" $ctx }} ++ {{- $ctx := dict "src" (index $filterArgs 0) "name" .Name "position" .Position }} ++ {{- $maskImage := partial "inline/get-resource.html" $ctx }} ++ {{- $f = images.Mask $maskImage }} +{{- else if eq $filter "opacity" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "opacity" "argValue" (index $filterArgs 0) "min" 0 "max" 1) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.Opacity (index $filterArgs 0) }} +{{- else if eq $filter "overlay" }} + {{- $ctx = merge $ctx (dict "argsRequired" 3) }} + {{- template "validate-arg-count" $ctx }} + {{- $ctx := dict "src" (index $filterArgs 0) "name" .Name "position" .Position }} + {{- $overlayImg := partial "inline/get-resource.html" $ctx }} + {{- $f = images.Overlay $overlayImg (index $filterArgs 1 | float ) (index $filterArgs 2 | float) }} +{{- else if eq $filter "padding" }} + {{- $ctx = merge $ctx (dict "argsRequired" 5) }} + {{- template "validate-arg-count" $ctx }} + {{- $f = images.Padding + (index $filterArgs 0 | int) + (index $filterArgs 1 | int) + (index $filterArgs 2 | int) + (index $filterArgs 3 | int) + (index $filterArgs 4) + }} +{{- else if eq $filter "pixelate" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "size" "argValue" (index $filterArgs 0) "min" 0 "max" 1000) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.Pixelate (index $filterArgs 0) }} +{{- else if eq $filter "process" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $f = images.Process (index $filterArgs 0) }} +{{- else if eq $filter "saturation" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "percentage" "argValue" (index $filterArgs 0) "min" -100 "max" 500) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.Saturation (index $filterArgs 0) }} +{{- else if eq $filter "sepia" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "percentage" "argValue" (index $filterArgs 0) "min" 0 "max" 100) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.Sepia (index $filterArgs 0) }} +{{- else if eq $filter "sigmoid" }} + {{- $ctx = merge $ctx (dict "argsRequired" 2) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "midpoint" "argValue" (index $filterArgs 0) "min" 0 "max" 1) }} + {{- template "validate-arg-value" $ctx }} + {{- $ctx = merge $ctx (dict "argName" "factor" "argValue" (index $filterArgs 1) "min" -10 "max" 10) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.Sigmoid (index $filterArgs 0) (index $filterArgs 1) }} +{{- else if eq $filter "text" }} + {{- $ctx = merge $ctx (dict "argsRequired" 1) }} + {{- template "validate-arg-count" $ctx }} + {{- $ctx := dict "src" $textFilterOpts.fontPath "name" .Name "position" .Position }} + {{- $font := or (partial "inline/get-resource.html" $ctx) }} + {{- $fontSize := or (index $filterArgs 3 | int) $textFilterOpts.fontSize }} + {{- $lineHeight := math.Max (or (index $filterArgs 4 | float) $textFilterOpts.lineHeight) 1 }} + {{- $opts := dict + "x" (or (index $filterArgs 1 | int) $textFilterOpts.xOffset) + "y" (or (index $filterArgs 2 | int) $textFilterOpts.yOffset) + "size" $fontSize + "linespacing" (mul (sub $lineHeight 1) $fontSize) + "color" (or (index $filterArgs 5) $textFilterOpts.fontColor) + "font" $font + }} + {{- $f = images.Text (index $filterArgs 0) $opts }} +{{- else if eq $filter "unsharpmask" }} + {{- $ctx = merge $ctx (dict "argsRequired" 3) }} + {{- template "validate-arg-count" $ctx }} + {{- $filterArgs = apply $filterArgs "float" "." }} + {{- $ctx = merge $ctx (dict "argName" "sigma" "argValue" (index $filterArgs 0) "min" 0 "max" 500) }} + {{- template "validate-arg-value" $ctx }} + {{- $ctx = merge $ctx (dict "argName" "amount" "argValue" (index $filterArgs 1) "min" 0 "max" 100) }} + {{- template "validate-arg-value" $ctx }} + {{- $ctx = merge $ctx (dict "argName" "threshold" "argValue" (index $filterArgs 2) "min" 0 "max" 1) }} + {{- template "validate-arg-value" $ctx }} + {{- $f = images.UnsharpMask (index $filterArgs 0) (index $filterArgs 1) (index $filterArgs 2) }} +{{- end }} + +{{- /* Apply filter. */}} +{{- $fi := $i }} +{{- with $f }} + {{- $fi = $i.Filter . }} +{{- end }} + +{{- /* Render. */}} ++{{- $class := "di va b--black-20" }} ++{{- if eq $filter "mask" }} ++ {{- $class = "di va" }} ++{{- end }} +{{- if $example }} +

Original

- {{ $alt }} ++ {{ $alt }} +

Processed

- {{ $alt }} ++ {{ $alt }} +{{- else -}} + {{ $alt }} +{{- end }} + +{{- define "validate-arg-count" }} + {{- $msg := "When using the %q filter, the %q shortcode requires an args parameter with %d %s. See %s" }} + {{- if lt (len .args) .argsRequired }} + {{- $text := "values" }} + {{- if eq 1 .argsRequired }} + {{- $text = "value" }} + {{- end }} + {{- errorf $msg .filter .name .argsRequired $text .position }} + {{- end }} +{{- end }} + +{{- define "validate-arg-value" }} + {{- $msg := "The %q argument passed to the %q shortcode is invalid. Expected a value in the range [%v,%v], but received %v. See %s" }} + {{- if or (lt .argValue .min) (gt .argValue .max) }} + {{- errorf $msg .argName .name .min .max .argValue .position }} + {{- end }} +{{- end }} + +{{- define "partials/inline/get-resource.html" }} + {{- $r := "" }} + {{- $u := urls.Parse .src }} + {{- $msg := "The %q shortcode was unable to resolve %s. See %s" }} + {{- if $u.IsAbs }} - {{- with resources.GetRemote $u.String }} ++ {{- with try (resources.GetRemote $u.String) }} + {{- with .Err }} + {{- errorf "%s" . }} - {{- else }} ++ {{- else with .Value }} + {{- /* This is a remote resource. */}} + {{- $r = . }} ++ {{- else }} ++ {{- errorf $msg $.name $u.String $.position }} + {{- end }} - {{- else }} - {{- errorf $msg $.name $u.String $.position }} + {{- end }} + {{- else }} + {{- with .page.Resources.Get (strings.TrimPrefix "./" $u.Path) }} + {{- /* This is a page resource. */}} + {{- $r = . }} + {{- else }} + {{- with resources.Get $u.Path }} + {{- /* This is a global resource. */}} + {{- $r = . }} + {{- else }} + {{- errorf $msg $.name $u.Path $.position }} + {{- end }} + {{- end }} + {{- end }} + {{- return $r}} +{{- end -}} diff --cc docs/_vendor/modules.txt index a5092f11e,000000000..50178323d mode 100644,000000..100644 --- a/docs/_vendor/modules.txt +++ b/docs/_vendor/modules.txt @@@ -1,1 -1,0 +1,1 @@@ - # github.com/gohugoio/gohugoioTheme v0.0.0-20250106044328-feb60697e056 ++# github.com/gohugoio/gohugoioTheme v0.0.0-20250116152525-2d382cae7743 diff --cc docs/archetypes/glossary.md index 000000000,000000000..b38ced64a new file mode 100644 --- /dev/null +++ b/docs/archetypes/glossary.md @@@ -1,0 -1,0 +1,19 @@@ ++--- ++title: {{ replace .File.ContentBaseName "-" " " }} ++--- ++ ++ diff --cc docs/archetypes/showcase/index.md index 04d454575,000000000..cdd036722 mode 100644,000000..100644 --- a/docs/archetypes/showcase/index.md +++ b/docs/archetypes/showcase/index.md @@@ -1,36 -1,0 +1,36 @@@ +--- + +title: {{ replace .File.ContentBaseName "-" " " | title }} +date: {{ now.Format "2006-01-02" }} + +description: A short description of this page. + +# The URL to the site on the internet. +siteURL: https://gohugo.io/ + +# Link to the site's Hugo source code if public and you can/want to share. +# Remove or leave blank if not needed/wanted. +siteSource: https://github.com/gohugoio/hugoDocs + +# Add credit to the article author. Leave blank or remove if not needed/wanted. +byline: "[bep](https://github.com/bep), Hugo Lead" + +--- + +To complete this showcase: + +1. Write the story about your site in this file. - 2. Add a summary to the `bio.md` file in this folder. ++2. Add a summary to the `bio.md` file in this directory. +3. Replace the `featured-template.png` with a screenshot of your site. You can rename it, but it must contain the word `featured`. +4. Create a new pull request in https://github.com/gohugoio/hugoDocs/pulls + +The content of this bundle explained: + +index.md +: The main content file. Fill in required front matter metadata and write your story. I does not have to be a novel. It can even be self-promotional, but it should include Hugo in some form. + +bio.md +: A short summary of the website. Site credits (who built it) fits nicely here. + +featured.png +: A reasonably sized screenshot of your website. It can be named anything, but the name must start with "featured". The sample image is `1500x750` (2:1 aspect ratio). diff --cc docs/assets/images/examples/mask.png index 000000000,000000000..c3005a669 new file mode 100644 Binary files differ diff --cc docs/config/_default/menus/menus.en.toml index 3f4e76879,000000000..aac432fab mode 100644,000000..100644 --- a/docs/config/_default/menus/menus.en.toml +++ b/docs/config/_default/menus/menus.en.toml @@@ -1,152 -1,0 +1,158 @@@ +[[docs]] +identifier = 'about' +name = 'About' +pageRef = '/about/' +weight = 10 + +[[docs]] +name = 'Installation' +weight = 20 +identifier = 'installation' +pageRef = '/installation/' + +[[docs]] +name = 'Getting started' +weight = 30 +identifier = 'getting-started' +pageRef = '/getting-started/' + +[[docs]] +name = 'Quick reference' +weight = 40 +identifier = 'quick-reference' +pageRef = '/quick-reference/' +post = 'break' + +[[docs]] +name = 'Content management' +weight = 50 +identifier = 'content-management' +post = 'expanded' +pageRef = '/content-management/' + +[[docs]] +name = 'Templates' +weight = 60 +identifier = 'templates' +pageRef = '/templates/' + +[[docs]] +name = 'Functions' +weight = 70 +identifier = 'functions' +pageRef = '/functions/' + +[[docs]] +name = 'Methods' +weight = 80 +identifier = 'methods' +pageRef = '/methods/' + +[[docs]] +name = 'Render hooks' +weight = 90 +identifier = 'render-hooks' +pageRef = '/render-hooks/' + +[[docs]] - name = 'Hugo Modules' ++name = 'Shortcodes' +weight = 100 ++identifier = 'shortcodes' ++pageRef = '/shortcodes/' ++ ++[[docs]] ++name = 'Hugo Modules' ++weight = 110 +identifier = 'modules' +pageRef = '/hugo-modules/' + +[[docs]] +name = 'Hugo Pipes' - weight = 110 ++weight = 120 +identifier = 'hugo-pipes' +pageRef = '/hugo-pipes/' + +[[docs]] +name = 'CLI' - weight = 120 ++weight = 130 +post = 'break' +identifier = 'commands' +pageRef = '/commands/' + +# Low level items + +[[docs]] +name = 'Troubleshooting' - weight = 130 ++weight = 140 +identifier = 'troubleshooting' +pageRef = '/troubleshooting/' + +[[docs]] +name = 'Developer tools' - weight = 140 ++weight = 150 +identifier = 'developer-tools' +pageRef = '/tools/' + +[[docs]] +name = 'Hosting and deployment' - weight = 150 ++weight = 160 +identifier = 'hosting-and-deployment' +pageRef = '/hosting-and-deployment/' + +[[docs]] +name = 'Contribute' - weight = 160 ++weight = 170 +post = 'break' +identifier = 'contribute' +pageRef = '/contribute/' + +######## QUICKLINKS + +[[quicklinks]] +identifier = 'fundamentals' +name = 'Fundamentals' +pageRef = '/tags/fundamentals/' +weight = 1 + +######## GLOBAL ITEMS TO BE SHARED WITH THE HUGO SITES + +[[global]] +name = 'News' +weight = 1 +identifier = 'news' +pageRef = '/news/' + +[[global]] +name = 'Docs' +weight = 5 +identifier = 'docs' +url = '/documentation/' + +[[global]] +name = 'Themes' +weight = 10 +identifier = 'themes' +url = 'https://themes.gohugo.io/' + +# [[global]] +# name = 'Showcase' +# weight = 20 +# identifier = 'showcase' +# pageRef = '/showcase/' + +# Anything with a weight > 100 gets an external icon + +[[global]] +name = 'Community' +weight = 150 +icon = true +identifier = 'community' +post = 'external' +url = 'https://discourse.gohugo.io/' + +[[global]] +name = 'GitHub' +weight = 200 +identifier = 'github' +post = 'external' +url = 'https://github.com/gohugoio/hugo' diff --cc docs/content/en/about/features.md index 58d324853,000000000..c04f69686 mode 100644,000000..100644 --- a/docs/content/en/about/features.md +++ b/docs/content/en/about/features.md @@@ -1,139 -1,0 +1,139 @@@ +--- +title: Features +description: Hugo's rich and powerful feature set provides the framework and tools to create static sites that build in seconds, often less. +categories: [about] +keywords: [] +menu: + docs: + parent: about + weight: 30 +weight: 30 +toc: true +--- + +## Framework + +[Multiplatform] +: Install Hugo's single executable on Linux, macOS, Windows, and more. + +[Multilingual] +: Localize your project for each language and region, including translations, images, dates, currencies, numbers, percentages, and collation sequence. Hugo's multilingual framework supports single-host and multihost configurations. + +[Output formats] +: Render each page of your site to one or more output formats, with granular control by page kind, section, and path. While HTML is the default output format, you can add JSON, RSS, CSV, and more. For example, create a REST API to access content. + +[Templates] +: Create templates using variables, functions, and methods to transform your content, resources, and data into a published page. While HTML templates are the most common, you can create templates for any output format. + +[Themes] +: Reduce development time and cost by using one of the hundreds of themes contributed by the Hugo community. Themes are available for corporate sites, documentation projects, image portfolios, landing pages, personal and professional blogs, resumes, CVs, and more. + +[Modules] +: Reduce development time and cost by creating or importing packaged combinations of archetypes, assets, content, data, templates, translation tables, static files, or configuration settings. A module may serve as the basis for a new site, or to augment an existing site. + +[Privacy] +: Configure the behavior of Hugo's embedded templates and shortcodes to facilitate compliance with regional privacy regulations, including the [GDPR] and [CCPA]. + +[Security] +: Hugo's security model is based on the premise that template and configuration authors are trusted, but content authors are not. This model enables generation of HTML output safe against code injection. Other protections prevent "shelling out" to arbitrary applications, limit access to specific environment variables, prevent connections to arbitrary remote data sources, and more. + +## Content authoring + +[Content formats] +: Create your content using Markdown, HTML, AsciiDoc, Emacs Org Mode, Pandoc, or reStructuredText. Markdown is the default content format, conforming to the [CommonMark] and [GitHub Flavored Markdown] specifications. + +[Markdown attributes] +: Apply HTML attributes such as `class` and `id` to Markdown images and block elements including blockquotes, fenced code blocks, headings, horizontal rules, lists, paragraphs, and tables. + +[Markdown extensions] +: Leverage the embedded Markdown extensions to create tables, definition lists, footnotes, task lists, inserted text, mark text, subscripts, superscripts, and more. + +[Markdown render hooks] +: Override the conversion of Markdown to HTML when rendering blockquotes, fenced code blocks, headings, images, links, and tables. For example, render every standalone image as an HTML `figure` element. + +[Diagrams] +: Use fenced code blocks and Markdown render hooks to include diagrams in your content. + +[Mathematics] - : Include mathematical equations and expressions in Markdown using LaTeX or TeX typesetting syntax. ++: Include mathematical equations and expressions in Markdown using LaTeX markup. + +[Syntax highlighting] +: Syntactically highlight code examples using Hugo's embedded syntax highlighter, enabled by default for fenced code blocks in Markdown. The syntax highlighter supports hundreds of code languages and dozens of styles. + +[Shortcodes] +: Use Hugo's embedded shortcodes, or create your own, to insert complex content. For example, use shortcodes to include `audio` and `video` elements, render tables from local or remote data sources, insert snippets from other pages, and more. + +## Content management + +[Content adapters] +: Create content adapters to dynamically add content when building your site. For example, use a content adapter to create pages from a remote data source such as JSON, TOML, YAML, or XML. + +[Taxonomies] +: Classify content to establish simple or complex logical relationships between pages. For example, create an authors taxonomy, and assign one or more authors to each page. Among other uses, the taxonomy system provides an inverted, weighted index to render a list of related pages, ordered by relevance. + +[Data] +: Augment your content using local or remote data sources including CSV, JSON, TOML, YAML, and XML. For example, create a shortcode to render an HTML table from a remote CSV file. + +[Menus] +: Provide rapid access to content via Hugo's menu system, configured automatically, globally, or on a page-by-page basis. The menu system is a key component of Hugo's multilingual architecture. + +[URL management] +: Serve any page from any path via global configuration or on a page-by-page basis. + +## Asset pipelines + +[Image processing] +: Convert, resize, crop, rotate, adjust colors, apply filters, overlay text and images, and extract EXIF data. + +[JavaScript bundling] +: Transpile TypeScript and JSX to JavaScript, bundle, tree shake, minify, create source maps, and perform SRI hashing. + +[Sass processing] +: Transpile Sass to CSS, bundle, tree shake, minify, create source maps, perform SRI hashing, and integrate with PostCSS. + +[Tailwind CSS processing] +: Compile Tailwind CSS utility classes into standard CSS, bundle, tree shake, optimize, minify, perform SRI hashing, and integrate with PostCSS. + +## Performance + +[Caching] +: Reduce build time and cost by rendering a partial template once then cache the result, either globally or within a given context. For example, cache the result of an asset pipeline to prevent reprocessing on every rendered page. + +[Segmentation] +: Reduce build time and cost by partitioning your sites into segments. For example, render the home page and the "news section" every hour, and render the entire site once a week. + +[Minification] +: Minify HTML, CSS, and JavaScript to reduce file size, bandwidth consumption, and loading times. + +[CCPA]: https://en.wikipedia.org/wiki/California_Consumer_Privacy_Act +[Sass processing]: /functions/css/Sass/ +[Caching]: /functions/partials/includecached/ +[CommonMark]: https://spec.commonmark.org/current/ +[Content adapters]: /content-management/content-adapters/ +[Content formats]: /content-management/formats/ +[Data]: /content-management/data-sources/ +[Diagrams]: /content-management/diagrams/ +[GDPR]: https://en.wikipedia.org/wiki/General_Data_Protection_Regulation +[GitHub Flavored Markdown]: https://github.github.com/gfm/ +[Image processing]: /content-management/image-processing/ +[JavaScript bundling]: /functions/js/build/ +[Markdown attributes]: /content-management/markdown-attributes/ +[Markdown extensions]: /getting-started/configuration-markup/#goldmark-extensions +[Markdown render hooks]: /render-hooks/introduction/ +[Mathematics]: /content-management/mathematics/ +[Menus]: /content-management/menus/ +[Minification]: /getting-started/configuration/#configure-minify - [Modules]: https://gohugo.io/hugo-modules/ ++[Modules]: /hugo-modules/ +[Multilingual]: /content-management/multilingual/ +[Multiplatform]: /installation/ +[Output formats]: /templates/output-formats/ +[Privacy]: /about/privacy/ +[Security]: /about/security/ +[Segmentation]: /getting-started/configuration/#configure-segments +[Shortcodes]: /content-management/shortcodes/ +[Syntax highlighting]: /content-management/syntax-highlighting/ +[Tailwind CSS processing]: /functions/css/tailwindcss/ +[Taxonomies]: /content-management/taxonomies/ - [Templates]: templates/introduction/ ++[Templates]: /templates/introduction/ +[Themes]: https://themes.gohugo.io/ +[URL management]: /content-management/urls/ diff --cc docs/content/en/about/privacy.md index a3491f864,000000000..425af0bcf mode 100644,000000..100644 --- a/docs/content/en/about/privacy.md +++ b/docs/content/en/about/privacy.md @@@ -1,122 -1,0 +1,122 @@@ +--- +title: Privacy +linkTitle: Privacy +description: Configure your site to facilitate compliance with regional privacy regulations. +categories: [about] +keywords: ["GDPR", "Privacy", "Data Protection"] +menu: + docs: + parent: about + weight: 40 +weight: 40 +toc: true +aliases: [/gdpr/,/about/hugo-and-gdpr/] +--- + + General Data Protection Regulation ([GDPR](https://en.wikipedia.org/wiki/General_Data_Protection_Regulation)) is a regulation in EU law on data protection and privacy for all individuals within the European Union and the European Economic Area. It became enforceable on 25 May 2018. + + **Hugo is a static site generator. By using Hugo you are already standing on very solid ground. Static HTML files on disk are much easier to reason about compared to server and database driven websites.** + + But even static websites can integrate with external services, so from version `0.41`, Hugo provides a **privacy configuration** that covers the relevant built-in templates. + + Note that: + + * These settings have their defaults setting set to _off_, i.e. how it worked before Hugo `0.41`. You must do your own evaluation of your site and apply the appropriate settings. + * These settings work with the [embedded templates](/templates/embedded/). Some theme may contain custom templates for embedding services like Google Analytics. In that case these options have no effect. + * We will continue this work and improve this further in future Hugo versions. + +## All privacy settings + +Below are all privacy settings and their default value. These settings need to be put in your site configuration (e.g. `hugo.toml`). + +{{< code-toggle file=hugo >}} +[privacy] +[privacy.disqus] +disable = false +[privacy.googleAnalytics] +disable = false +respectDoNotTrack = false +[privacy.instagram] +disable = false +simple = false - [privacy.twitter] ++[privacy.vimeo] +disable = false +enableDNT = false +simple = false - [privacy.vimeo] ++[privacy.x] +disable = false +enableDNT = false +simple = false +[privacy.youtube] +disable = false +privacyEnhanced = false +{{< /code-toggle >}} + +## Disable all services + +An example privacy configuration that disables all the relevant services in Hugo. With this configuration, the other settings will not matter. + +{{< code-toggle file=hugo >}} +[privacy] +[privacy.disqus] +disable = true +[privacy.googleAnalytics] +disable = true +[privacy.instagram] +disable = true - [privacy.twitter] - disable = true +[privacy.vimeo] +disable = true ++[privacy.x] ++disable = true +[privacy.youtube] +disable = true +{{< /code-toggle >}} + +## The privacy settings explained + +### GoogleAnalytics + +respectDoNotTrack +: Enabling this will make the GA templates respect the "Do Not Track" HTTP header. + +### Instagram + +simple +: If simple mode is enabled, a static and no-JS version of the Instagram image card will be built. Note that this only supports image cards and the image itself will be fetched from Instagram's servers. + +**Note:** If you use the _simple mode_ for Instagram and a site styled with Bootstrap 4, you may want to disable the inline styles provided by Hugo: + +{{< code-toggle file=hugo >}} +[services] +[services.instagram] +disableInlineCSS = true +{{< /code-toggle >}} + - ### Twitter ++### X + +enableDNT - : Enabling this for the twitter/tweet shortcode, the tweet and its embedded page on your site are not used for purposes that include personalized suggestions and personalized ads. ++: Enabling this for the x shortcode, the post and its embedded page on your site are not used for purposes that include personalized suggestions and personalized ads. + +simple - : If simple mode is enabled, a static and no-JS version of a tweet will be built. ++: If simple mode is enabled, a static and no-JS version of a post will be built. + - **Note:** If you use the _simple mode_ for Twitter, you may want to disable the inline styles provided by Hugo: ++**Note:** If you use the _simple mode_ for X, you may want to disable the inline styles provided by Hugo: + +{{< code-toggle file=hugo >}} +[services] - [services.twitter] ++[services.x] +disableInlineCSS = true +{{< /code-toggle >}} + +### YouTube + +privacyEnhanced +: When you turn on privacy-enhanced mode, YouTube won’t store information about visitors on your website unless the user plays the embedded video. + +### Vimeo + +enableDNT +: Enabling this for the vimeo shortcode, the Vimeo player will be blocked from tracking any session data, including all cookies and stats. + +simple +: If simple mode is enabled, the video thumbnail is fetched from Vimeo's servers and it is overlaid with a play button. If the user clicks to play the video, it will open in a new tab directly on Vimeo's website. diff --cc docs/content/en/commands/hugo.md index ef0bca9a5,000000000..42f882ad7 mode 100644,000000..100644 --- a/docs/content/en/commands/hugo.md +++ b/docs/content/en/commands/hugo.md @@@ -1,84 -1,0 +1,83 @@@ +--- +title: "hugo" +slug: hugo +url: /commands/hugo/ +--- +## hugo + +Build your site + +### Synopsis + +hugo is the main command, used to build your Hugo site. + +Hugo is a Fast and Flexible Static Site Generator +built with love by spf13 and friends in Go. + +Complete documentation is available at https://gohugo.io/. + +``` +hugo [flags] +``` + +### Options + +``` + -b, --baseURL string hostname (and path) to the root, e.g. https://spf13.com/ + -D, --buildDrafts include content marked as draft + -E, --buildExpired include expired content + -F, --buildFuture include content with publishdate in the future + --cacheDir string filesystem path to cache directory + --cleanDestinationDir remove files from destination not found in static directories + --clock string set the clock used by Hugo, e.g. --clock 2021-11-06T22:30:00.00+09:00 + --config string config file (default is hugo.yaml|json|toml) + --configDir string config dir (default "config") + -c, --contentDir string filesystem path to content directory + -d, --destination string filesystem path to write files to + --disableKinds strings disable different kind of pages (home, RSS etc.) + --enableGitInfo add Git revision, date, author, and CODEOWNERS info to the pages + -e, --environment string build environment + --forceSyncStatic copy all files when static is changed. + --gc enable to run some cleanup tasks (remove unused cache files) after the build + -h, --help help for hugo + --ignoreCache ignores the cache directory + --ignoreVendorPaths string ignores any _vendor for module paths matching the given Glob pattern + -l, --layoutDir string filesystem path to layout directory + --logLevel string log level (debug|info|warn|error) + --minify minify any supported output format (HTML, XML etc.) + --noBuildLock don't create .hugo_build.lock file + --noChmod don't sync permission mode of files + --noTimes don't sync modification time of files + --panicOnWarning panic on first WARNING log + --poll string set this to a poll interval, e.g --poll 700ms, to use a poll based approach to watch for file system changes + --printI18nWarnings print missing translations + --printMemoryUsage print memory usage to screen at intervals + --printPathWarnings print warnings on duplicate target paths etc. + --printUnusedTemplates print warnings on unused templates. + --quiet build in quiet mode + --renderSegments strings named segments to render (configured in the segments config) + -M, --renderToMemory render to memory (mostly useful when running the server) + -s, --source string filesystem path to read files relative from + --templateMetrics display metrics about template executions + --templateMetricsHints calculate some improvement hints when combined with --templateMetrics + -t, --theme strings themes to use (located in /themes/THEMENAME/) + --themesDir string filesystem path to themes directory + --trace file write trace to file (not useful in general) + -w, --watch watch filesystem for changes and recreate as needed +``` + +### SEE ALSO + +* [hugo build](/commands/hugo_build/) - Build your site +* [hugo completion](/commands/hugo_completion/) - Generate the autocompletion script for the specified shell +* [hugo config](/commands/hugo_config/) - Display site configuration +* [hugo convert](/commands/hugo_convert/) - Convert front matter to another format - * [hugo deploy](/commands/hugo_deploy/) - Deploy your site to a cloud provider +* [hugo env](/commands/hugo_env/) - Display version and environment info +* [hugo gen](/commands/hugo_gen/) - Generate documentation and syntax highlighting styles +* [hugo import](/commands/hugo_import/) - Import a site from another system +* [hugo list](/commands/hugo_list/) - List content +* [hugo mod](/commands/hugo_mod/) - Manage modules +* [hugo new](/commands/hugo_new/) - Create new content +* [hugo server](/commands/hugo_server/) - Start the embedded web server +* [hugo version](/commands/hugo_version/) - Display version + diff --cc docs/content/en/content-management/archetypes.md index acf101fda,000000000..30747258c mode 100644,000000..100644 --- a/docs/content/en/content-management/archetypes.md +++ b/docs/content/en/content-management/archetypes.md @@@ -1,203 -1,0 +1,193 @@@ +--- +title: Archetypes +description: An archetype is a template for new content. +categories: [content management] +keywords: [archetypes,generators,metadata,front matter] +menu: + docs: + parent: content-management + weight: 140 + quicklinks: +weight: 140 +toc: true +aliases: [/content/archetypes/] +--- + +## Overview + - A content file consists of [front matter] and markup. The markup is typically Markdown, but Hugo also supports other [content formats]. Front matter can be TOML, YAML, or JSON. ++A content file consists of [front matter](g) and markup. The markup is typically Markdown, but Hugo also supports other [content formats](g). Front matter can be TOML, YAML, or JSON. + +The `hugo new content` command creates a new file in the `content` directory, using an archetype as a template. This is the default archetype: + +{{< code-toggle file=archetypes/default.md fm=true >}} +title = '{{ replace .File.ContentBaseName `-` ` ` | title }}' +date = '{{ .Date }}' +draft = true +{{< /code-toggle >}} + - When you create new content, Hugo evaluates the [template actions] within the archetype. For example: ++When you create new content, Hugo evaluates the [template actions](g) within the archetype. For example: + +```sh +hugo new content posts/my-first-post.md +``` + +With the default archetype shown above, Hugo creates this content file: + +{{< code-toggle file=content/posts/my-first-post.md fm=true >}} +title = 'My First Post' +date = '2023-08-24T11:49:46-07:00' +draft = true +{{< /code-toggle >}} + - You can create an archetype for one or more [content types]. For example, use one archetype for posts, and use the default archetype for everything else: ++You can create an archetype for one or more [content types](g). For example, use one archetype for posts, and use the default archetype for everything else: + +```text +archetypes/ +├── default.md +└── posts.md +``` + +## Lookup order + +Hugo looks for archetypes in the `archetypes` directory in the root of your project, falling back to the `archetypes` directory in themes or installed modules. An archetype for a specific content type takes precedence over the default archetype. + +For example, with this command: + +```sh +hugo new content posts/my-first-post.md +``` + +The archetype lookup order is: + - 1. archetypes/posts.md - 1. archetypes/default.md - 1. themes/my-theme/archetypes/posts.md - 1. themes/my-theme/archetypes/default.md ++1. `archetypes/posts.md` ++1. `archetypes/default.md` ++1. `themes/my-theme/archetypes/posts.md` ++1. `themes/my-theme/archetypes/default.md` + +If none of these exists, Hugo uses a built-in default archetype. + +## Functions and context + - You can use any [template function] within an archetype. As shown above, the default archetype uses the [`replace`](/functions/strings/replace) function to replace hyphens with spaces when populating the title in front matter. ++You can use any template [function](g) within an archetype. As shown above, the default archetype uses the [`replace`](/functions/strings/replace) function to replace hyphens with spaces when populating the title in front matter. + - Archetypes receive the following [context]: ++Archetypes receive the following [context](g): + +Date +: (`string`) The current date and time, formatted in compliance with RFC3339. + +File +: (`hugolib.fileInfo`) Returns file information for the current page. See [details](/methods/page/file). + +Type - : (`string`) The [content type] inferred from the top-level directory name, or as specified by the `--kind` flag passed to the `hugo new content` command. - - [content type]: /getting-started/glossary#content-type ++: (`string`) The [content type](g) inferred from the top-level directory name, or as specified by the `--kind` flag passed to the `hugo new content` command. + +Site +: (`page.Site`) The current site object. See [details](/methods/site/). + +## Date format + +To insert date and time with a different format, use the [`time.Now`] function: + +[`time.Now`]: /functions/time/now/ + +{{< code-toggle file=archetypes/default.md fm=true >}} +title = '{{ replace .File.ContentBaseName `-` ` ` | title }}' +date = '{{ time.Now.Format "2006-01-02" }}' +draft = true +{{< /code-toggle >}} + +## Include content + +Although typically used as a front matter template, you can also use an archetype to populate content. + +For example, in a documentation site you might have a section (content type) for functions. Every page within this section should follow the same format: a brief description, the function signature, examples, and notes. We can pre-populate the page to remind content authors of the standard format. + +{{< code file=archetypes/functions.md >}} +--- +date: '{{ .Date }}' +draft: true +title: '{{ replace .File.ContentBaseName `-` ` ` | title }}' +--- + +A brief description of what the function does, using simple present tense in the third person singular form. For example: + +`someFunction` returns the string `s` repeated `n` times. + +## Signature + +```text +func someFunction(s string, n int) string +``` + +## Examples + +One or more practical examples, each within a fenced code block. + +## Notes + +Additional information to clarify as needed. +{{< /code >}} + - Although you can include [template actions] within the content body, remember that Hugo evaluates these once---at the time of content creation. In most cases, place template actions in a [template] where Hugo evaluates the actions every time you [build](/getting-started/glossary/#build) the site. ++Although you can include [template actions](g) within the content body, remember that Hugo evaluates these once---at the time of content creation. In most cases, place template actions in a [template](g) where Hugo evaluates the actions every time you [build](g) the site. + +## Leaf bundles + - You can also create archetypes for [leaf bundles](/getting-started/glossary/#leaf-bundle). ++You can also create archetypes for [leaf bundles](g). + +For example, in a photography site you might have a section (content type) for galleries. Each gallery is leaf bundle with content and images. + +Create an archetype for galleries: + +```text +archetypes/ +├── galleries/ +│ ├── images/ +│ │ └── .gitkeep +│ └── index.md <-- same format as default.md +└── default.md +``` + +Subdirectories within an archetype must contain at least one file. Without a file, Hugo will not create the subdirectory when you create new content. The name and size of the file are irrelevant. The example above includes a `.gitkeep` file, an empty file commonly used to preserve otherwise empty directories in a Git repository. + +To create a new gallery: + +```sh +hugo new galleries/bryce-canyon +``` + +This produces: + +```text +content/ +├── galleries/ +│ └── bryce-canyon/ +│ ├── images/ +│ │ └── .gitkeep +│ └── index.md +└── _index.md +``` + +## Specify archetype + +Use the `--kind` command line flag to specify an archetype when creating content. + +For example, let's say your site has two sections: articles and tutorials. Create an archetype for each content type: + +```text +archetypes/ +├── articles.md +├── default.md +└── tutorials.md +``` + +To create an article using the articles archetype: + +```sh +hugo new content articles/something.md +``` + +To create an article using the tutorials archetype: + +```sh +hugo new content --kind tutorials articles/something.md +``` - - [content formats]: /getting-started/glossary/#content-format - [content types]: /getting-started/glossary/#content-type - [context]: /getting-started/glossary/#context - [front matter]: /getting-started/glossary/#front-matter - [template actions]: /getting-started/glossary/#template-action - [template]: /getting-started/glossary/#template - [template function]: /getting-started/glossary/#function diff --cc docs/content/en/content-management/build-options.md index a279fb651,000000000..e78462455 mode 100644,000000..100644 --- a/docs/content/en/content-management/build-options.md +++ b/docs/content/en/content-management/build-options.md @@@ -1,321 -1,0 +1,320 @@@ +--- +title: Build options +description: Build options help define how Hugo must treat a given page when building the site. +categories: [content management,fundamentals] +keywords: [build,content,front matter, page resources] +menu: + docs: + parent: content-management + weight: 70 +weight: 70 +toc: true +aliases: [/content/build-options/] +--- + +Build options are stored in a reserved front matter object named `build` with these defaults: + +{{< code-toggle file=content/example/index.md fm=true >}} +[build] +list = 'always' +publishResources = true +render = 'always' +{{< /code-toggle >}} + - +list +: When to include the page within page collections. Specify one of: + + - `always` + : Include the page in _all_ page collections. For example, `site.RegularPages`, `.Pages`, etc. This is the default value. + + - `local` + : Include the page in _local_ page collections. For example, `.RegularPages`, `.Pages`, etc. Use this option to create fully navigable but headless content sections. + + - `never` + : Do not include the page in _any_ page collection. + +publishResources +: Applicable to [page bundles], determines whether to publish the associated [page resources]. Specify one of: + + - `true` + : Always publish resources. This is the default value. + + - `false` + : Only publish a resource when invoking its [`Permalink`], [`RelPermalink`], or [`Publish`] method within a template. + +render +: When to render the page. Specify one of: + + - `always` + : Always render the page to disk. This is the default value. + + - `link` + : Do not render the page to disk, but assign `Permalink` and `RelPermalink` values. + + - `never` + : Never render the page to disk, and exclude it from all page collections. + +[page bundles]: /content-management/page-bundles/ +[page resources]: /content-management/page-resources/ +[`Permalink`]: /methods/resource/permalink/ +[`RelPermalink`]: /methods/resource/relpermalink/ +[`Publish`]: /methods/resource/publish/ + +{{% note %}} +Any page, regardless of its build options, will always be available by using the [`.Page.GetPage`] or [`.Site.GetPage`] method. + +[`.Page.GetPage`]: /methods/page/getpage/ +[`.Site.GetPage`]: /methods/site/getpage/ +{{% /note %}} + +## Example -- headless page + +Create a unpublished page whose content and resources can be included in other pages. + +```text +content/ +├── headless/ +│ ├── a.jpg +│ ├── b.jpg +│ └── index.md <-- leaf bundle +└── _index.md <-- home page +``` + +Set the build options in front matter: + +{{< code-toggle file=content/headless/index.md fm=true >}} +title = 'Headless page' +[build] + list = 'never' + publishResources = false + render = 'never' +{{< /code-toggle >}} + +To include the content and images on the home page: + +{{< code file=layouts/_default/home.html >}} +{{ with .Site.GetPage "/headless" }} + {{ .Content }} + {{ range .Resources.ByType "image" }} + + {{ end }} +{{ end }} +{{< /code >}} + +The published site will have this structure: + +```text +public/ +├── headless/ +│ ├── a.jpg +│ └── b.jpg +└── index.html +``` + +In the example above, note that: + +1. Hugo did not publish an HTML file for the page. - 2. Despite setting `publishResources` to `false` in front matter, Hugo published the [page resources] because we invoked the [`RelPermalink`] method on each resource. This is the expected behavior. ++1. Despite setting `publishResources` to `false` in front matter, Hugo published the [page resources] because we invoked the [`RelPermalink`] method on each resource. This is the expected behavior. + +## Example -- headless section + +Create a unpublished section whose content and resources can be included in other pages. + +[branch bundle]: /content-management/page-bundles/ + +```text +content/ +├── headless/ +│ ├── note-1/ +│ │ ├── a.jpg +│ │ ├── b.jpg +│ │ └── index.md <-- leaf bundle +│ ├── note-2/ +│ │ ├── c.jpg +│ │ ├── d.jpg +│ │ └── index.md <-- leaf bundle +│ └── _index.md <-- branch bundle +└── _index.md <-- home page +``` + +Set the build options in front matter, using the `cascade` keyword to "cascade" the values down to descendant pages. + +{{< code-toggle file=content/headless/_index.md fm=true >}} +title = 'Headless section' +[[cascade]] +[cascade.build] + list = 'local' + publishResources = false + render = 'never' +{{< /code-toggle >}} + +In the front matter above, note that we have set `list` to `local` to include the descendant pages in local page collections. + +To include the content and images on the home page: + +{{< code file=layouts/_default/home.html >}} +{{ with .Site.GetPage "/headless" }} + {{ range .Pages }} + {{ .Content }} + {{ range .Resources.ByType "image" }} + + {{ end }} + {{ end }} +{{ end }} +{{< /code >}} + +The published site will have this structure: + +```text +public/ +├── headless/ +│ ├── note-1/ +│ │ ├── a.jpg +│ │ └── b.jpg +│ └── note-2/ +│ ├── c.jpg +│ └── d.jpg +└── index.html +``` + +In the example above, note that: + +1. Hugo did not publish an HTML file for the page. - 2. Despite setting `publishResources` to `false` in front matter, Hugo correctly published the [page resources] because we invoked the [`RelPermalink`] method on each resource. This is the expected behavior. ++1. Despite setting `publishResources` to `false` in front matter, Hugo correctly published the [page resources] because we invoked the [`RelPermalink`] method on each resource. This is the expected behavior. + +## Example -- list without publishing + +Publish a section page without publishing the descendant pages. For example, to create a glossary: + +```text +content/ +├── glossary/ +│ ├── _index.md +│ ├── bar.md +│ ├── baz.md +│ └── foo.md +└── _index.md +``` + +Set the build options in front matter, using the `cascade` keyword to "cascade" the values down to descendant pages. + +{{< code-toggle file=content/glossary/_index.md fm=true >}} +title = 'Glossary' +[build] +render = 'always' +[[cascade]] +[cascade.build] + list = 'local' + publishResources = false + render = 'never' +{{< /code-toggle >}} + +To render the glossary: + +{{< code file=layouts/glossary/list.html >}} +
+ {{ range .Pages }} +
{{ .Title }}
+
{{ .Content }}
+ {{ end }} +
+{{< /code >}} + +The published site will have this structure: + +```text +public/ +├── glossary/ +│ └── index.html +└── index.html +``` + +## Example -- publish without listing + +Publish a section's descendant pages without publishing the section page itself. + +```text +content/ +├── books/ +│ ├── _index.md +│ ├── book-1.md +│ └── book-2.md +└── _index.md +``` + +Set the build options in front matter: + +{{< code-toggle file=content/books/_index.md fm=true >}} +title = 'Books' +[build] +render = 'never' +list = 'never' +{{< /code-toggle >}} + +The published site will have this structure: + +```html +public/ +├── books/ +│ ├── book-1/ +│ │ └── index.html +│ └── book-2/ +│ └── index.html +└── index.html +``` + +## Example -- conditionally hide section + +Consider this example. A documentation site has a team of contributors with access to 20 custom shortcodes. Each shortcode takes several arguments, and requires documentation for the contributors to reference when using them. + +Instead of external documentation for the shortcodes, include an "internal" section that is hidden when building the production site. + +```text +content/ +├── internal/ +│ ├── shortcodes/ +│ │ ├── _index.md +│ │ ├── shortcode-1.md +│ │ └── shortcode-2.md +│ └── _index.md +├── reference/ +│ ├── _index.md +│ ├── reference-1.md +│ └── reference-2.md +├── tutorials/ +│ ├── _index.md +│ ├── tutorial-1.md +│ └── tutorial-2.md +└── _index.md +``` + +Set the build options in front matter, using the `cascade` keyword to "cascade" the values down to descendant pages, and use the `target` keyword to target the production environment. + +{{< code-toggle file=content/internal/_index.md >}} +title = 'Internal' +[[cascade]] +[cascade.build] +render = 'never' +list = 'never' +[cascade._target] +environment = 'production' +{{< /code-toggle >}} + +The production site will have this structure: + +```html +public/ +├── reference/ +│ ├── reference-1/ +│ │ └── index.html +│ ├── reference-2/ +│ │ └── index.html +│ └── index.html +├── tutorials/ +│ ├── tutorial-1/ +│ │ └── index.html +│ ├── tutorial-2/ +│ │ └── index.html +│ └── index.html +└── index.html +``` diff --cc docs/content/en/content-management/content-adapters.md index a88bdba5f,000000000..369e91a12 mode 100644,000000..100644 --- a/docs/content/en/content-management/content-adapters.md +++ b/docs/content/en/content-management/content-adapters.md @@@ -1,359 -1,0 +1,356 @@@ +--- +title: Content adapters +description: Create content adapters to dynamically add content when building your site. +categories: [content management] +keywords: [] +menu: + docs: + parent: content-management + weight: 290 +weight: 290 +toc: true +--- + +{{< new-in 0.126.0 >}} + +## Overview + +A content adapter is a template that dynamically creates pages when building a site. For example, use a content adapter to create pages from a remote data source such as JSON, TOML, YAML, or XML. + - Unlike templates that reside in the layouts directory, content adapters reside in the content directory, no more than one per directory per language. When a content adapter creates a page, the page's [logical path] will be relative to the content adapter. ++Unlike templates that reside in the `layouts` directory, content adapters reside in the `content` directory, no more than one per directory per language. When a content adapter creates a page, the page's [logical path](g) will be relative to the content adapter. + +```text +content/ +├── articles/ +│ ├── _index.md +│ ├── article-1.md +│ └── article-2.md +├── books/ +│ ├── _content.gotmpl <-- content adapter +│ └── _index.md +└── films/ + ├── _content.gotmpl <-- content adapter + └── _index.md +``` + - Each content adapter is named _content.gotmpl and uses the same [syntax] as templates in the layouts directory. You can use any of the [template functions] within a content adapter, as well as the methods described below. ++Each content adapter is named _content.gotmpl and uses the same [syntax] as templates in the `layouts` directory. You can use any of the [template functions] within a content adapter, as well as the methods described below. + +## Methods + +Use these methods within a content adapter. + +###### AddPage + +Adds a page to the site. + +{{< code file=content/books/_content.gotmpl >}} +{{ $content := dict + "mediaType" "text/markdown" + "value" "The _Hunchback of Notre Dame_ was written by Victor Hugo." +}} +{{ $page := dict + "content" $content + "kind" "page" + "path" "the-hunchback-of-notre-dame" + "title" "The Hunchback of Notre Dame" +}} +{{ .AddPage $page }} +{{< /code >}} + +###### AddResource + +Adds a page resource to the site. + +{{< code file=content/books/_content.gotmpl >}} +{{ with resources.Get "images/a.jpg" }} + {{ $content := dict + "mediaType" .MediaType.Type + "value" . + }} + {{ $resource := dict + "content" $content + "path" "the-hunchback-of-notre-dame/cover.jpg" + }} + {{ $.AddResource $resource }} +{{ end }} +{{< /code >}} + +Then retrieve the new page resource with something like: + +{{< code file=layouts/_default/single.html >}} +{{ with .Resources.Get "cover.jpg" }} + +{{ end }} +{{< /code >}} + +###### Site + +Returns the `Site` to which the pages will be added. + +{{< code file=content/books/_content.gotmpl >}} +{{ .Site.Title }} +{{< /code >}} + +{{% note %}} +Note that the `Site` returned isn't fully built when invoked from the content adapters; if you try to call methods that depends on pages, e.g. `.Site.Pages`, you will get an error saying "this method cannot be called before the site is fully initialized". +{{% /note %}} + +###### Store + +Returns a persistent “scratch pad” to store and manipulate data. The main use case for this is to transfer values between executions when [EnableAllLanguages](#enablealllanguages) is set. See [examples](/methods/page/store/). + +{{< code file=content/books/_content.gotmpl >}} +{{ .Store.Set "key" "value" }} +{{ .Store.Get "key" }} +{{< /code >}} + +###### EnableAllLanguages + +By default, Hugo executes the content adapter for the language defined by the _content.gotmpl file . Use this method to activate the content adapter for all languages. + +{{< code file=content/books/_content.gotmpl >}} +{{ .EnableAllLanguages }} +{{ $content := dict + "mediaType" "text/markdown" + "value" "The _Hunchback of Notre Dame_ was written by Victor Hugo." +}} +{{ $page := dict + "content" $content + "kind" "page" + "path" "the-hunchback-of-notre-dame" + "title" "The Hunchback of Notre Dame" +}} +{{ .AddPage $page }} +{{< /code >}} + +## Page map + +Set any [front matter field] in the map passed to the [`AddPage`](#addpage) method, excluding `markup`. Instead of setting the `markup` field, specify the `content.mediaType` as described below. + +This table describes the fields most commonly passed to the `AddPage` method. + +Key|Description|Required +:--|:--|:-: +`content.mediaType`|The content [media type]. Default is `text/markdown`. See [content formats] for examples.|  +`content.value`|The content value as a string.|  +`dates.date`|The page creation date as a `time.Time` value.|  +`dates.expiryDate`|The page expiry date as a `time.Time` value.|  +`dates.lastmod`|The page last modification date as a `time.Time` value.|  +`dates.publishDate`|The page publication date as a `time.Time` value.|  - `kind`|The [page kind]. Default is `page`.|  +`params`|A map of page parameters.|  - `path`|The page's [logical path] relative to the content adapter. Do not include a leading slash or file extension.|:heavy_check_mark: ++`path`|The page's [logical path](g) relative to the content adapter. Do not include a leading slash or file extension.|:heavy_check_mark: +`title`|The page title.|  + +{{% note %}} +While `path` is the only required field, we recommend setting `title` as well. + +When setting the `path`, Hugo transforms the given string to a logical path. For example, setting `path` to `A B C` produces a logical path of `/section/a-b-c`. +{{% /note %}} + +## Resource map + +Construct the map passed to the [`AddResource`](#addresource) method using the fields below. + +Key|Description|Required +:--|:--|:-: +`content.mediaType`|The content [media type].|:heavy_check_mark: +`content.value`|The content value as a string or resource.|:heavy_check_mark: +`name`|The resource name.|  +`params`|A map of resource parameters.|  - `path`|The resources's [logical path] relative to the content adapter. Do not include a leading slash.|:heavy_check_mark: ++`path`|The resources's [logical path](g) relative to the content adapter. Do not include a leading slash.|:heavy_check_mark: +`title`|The resource title.|  + +{{% note %}} +If the `content.value` is a string Hugo creates a new resource. If the `content.value` is a resource, Hugo obtains the value from the existing resource. + +When setting the `path`, Hugo transforms the given string to a logical path. For example, setting `path` to `A B C/cover.jpg` produces a logical path of `/section/a-b-c/cover.jpg`. +{{% /note %}} + +## Example + +Create pages from remote data, where each page represents a book review. + +Step 1 +: Create the content structure. + +```text +content/ +└── books/ + ├── _content.gotmpl <-- content adapter + └── _index.md +``` + +Step 2 +: Inspect the remote data to determine how to map key-value pairs to front matter fields. + +: + +Step 3 +: Create the content adapter. + +{{< code file=content/books/_content.gotmpl copy=true >}} +{{/* Get remote data. */}} +{{ $data := dict }} +{{ $url := "https://gohugo.io/shared/examples/data/books.json" }} - {{ with resources.GetRemote $url }} ++{{ with try (resources.GetRemote $url) }} + {{ with .Err }} + {{ errorf "Unable to get remote resource %s: %s" $url . }} - {{ else }} ++ {{ else with .Value }} + {{ $data = . | transform.Unmarshal }} ++ {{ else }} ++ {{ errorf "Unable to get remote resource %s" $url }} + {{ end }} - {{ else }} - {{ errorf "Unable to get remote resource %s" $url }} +{{ end }} + +{{/* Add pages and page resources. */}} +{{ range $data }} + + {{/* Add page. */}} + {{ $content := dict "mediaType" "text/markdown" "value" .summary }} + {{ $dates := dict "date" (time.AsTime .date) }} + {{ $params := dict "author" .author "isbn" .isbn "rating" .rating "tags" .tags }} + {{ $page := dict + "content" $content + "dates" $dates + "kind" "page" + "params" $params + "path" .title + "title" .title + }} + {{ $.AddPage $page }} + + {{/* Add page resource. */}} + {{ $item := . }} + {{ with $url := $item.cover }} - {{ with resources.GetRemote $url }} ++ {{ with try (resources.GetRemote $url) }} + {{ with .Err }} + {{ errorf "Unable to get remote resource %s: %s" $url . }} - {{ else }} ++ {{ else with .Value }} + {{ $content := dict "mediaType" .MediaType.Type "value" .Content }} + {{ $params := dict "alt" $item.title }} + {{ $resource := dict + "content" $content + "params" $params + "path" (printf "%s/cover.%s" $item.title .MediaType.SubType) + }} + {{ $.AddResource $resource }} ++ {{ else }} ++ {{ errorf "Unable to get remote resource %s" $url }} + {{ end }} - {{ else }} - {{ errorf "Unable to get remote resource %s" $url }} + {{ end }} + {{ end }} + +{{ end }} +{{< /code >}} + +Step 4 +: Create a single template to render each book review. + +{{< code file=layouts/books/single.html copy=true >}} +{{ define "main" }} +

{{ .Title }}

+ + {{ with .Resources.GetMatch "cover.*" }} + {{ .Params.alt }} + {{ end }} + +

Author: {{ .Params.author }}

+ +

+ ISBN: {{ .Params.isbn }}
+ Rating: {{ .Params.rating }}
+ Review date: {{ .Date | time.Format ":date_long" }} +

+ + {{ with .GetTerms "tags" }} +

Tags:

+ + {{ end }} + + {{ .Content }} +{{ end }} +{{< /code >}} + +## Multilingual sites + +With multilingual sites you can: + +1. Create one content adapter for all languages using the [`EnableAllLanguages`](#enablealllanguages) method as described above. - 2. Create content adapters unique to each language. See the examples below. ++1. Create content adapters unique to each language. See the examples below. + +### Translations by file name + +With this site configuration: + +{{< code-toggle file=hugo >}} +[languages.en] +weight = 1 + +[languages.de] +weight = 2 +{{< /code-toggle >}} + +Include a language designator in the content adapter's file name. + +```text +content/ +└── books/ + ├── _content.de.gotmpl + ├── _content.en.gotmpl + ├── _index.de.md + └── _index.en.md +``` + +### Translations by content directory + +With this site configuration: + +{{< code-toggle file=hugo >}} +[languages.en] +contentDir = 'content/en' +weight = 1 + +[languages.de] +contentDir = 'content/de' +weight = 2 +{{< /code-toggle >}} + +Create a single content adapter in each directory: + +```text +content/ +├── de/ +│ └── books/ +│ ├── _content.gotmpl +│ └── _index.md +└── en/ + └── books/ + ├── _content.gotmpl + └── _index.md +``` + +## Page collisions + +Two or more pages collide when they have the same publication path. Due to concurrency, the content of the published page is indeterminate. Consider this example: + +```text +content/ +└── books/ + ├── _content.gotmpl <-- content adapter + ├── _index.md + └── the-hunchback-of-notre-dame.md +``` + +If the content adapter also creates books/the-hunchback-of-notre-dame, the content of the published page is indeterminate. You can not define the processing order. + +To detect page collisions, use the `--printPathWarnings` flag when building your site. + +[content formats]: /content-management/formats/#classification +[front matter field]: /content-management/front-matter/#fields - [logical path]: /getting-started/glossary/#logical-path +[media type]: https://en.wikipedia.org/wiki/Media_type - [page kind]: /getting-started/glossary/#page-kind +[syntax]: /templates/introduction/ +[template functions]: /functions/ diff --cc docs/content/en/content-management/cross-references.md index 124a3bf06,000000000..56f4c39e1 mode 100644,000000..100644 --- a/docs/content/en/content-management/cross-references.md +++ b/docs/content/en/content-management/cross-references.md @@@ -1,148 -1,0 +1,148 @@@ +--- +title: Links and cross references +description: Shortcodes for creating links to documents. +categories: [content management] +keywords: [cross references,references,anchors,urls] +menu: + docs: + parent: content-management + weight: 170 +weight: 170 +toc: true +aliases: [/extras/crossreferences/] +--- + +The `ref` and `relref` shortcodes display the absolute and relative permalinks to a document, respectively. + +## Use of `ref` and `relref` + +The `ref` and `relref` shortcodes require a single argument: the path to a content document, with or without a file extension, with or without an anchor. Paths without a leading `/` are first resolved relative to the current page, then to the remainder of the site. + +```text +. +└── content + ├── about + | ├── _index.md + | └── credits.md + ├── pages + | ├── document1.md + | └── document2.md // has anchor #anchor + ├── products + | └── index.md + └── blog + └── my-post.md +``` + +The pages can be referenced as follows: + +```text +{{}} <-- From pages/document1.md, relative path +{{}} +{{}} +{{}} +{{}} <-- From pages/document2.md +{{}} <-- From anywhere, absolute path +{{}} +{{}} +{{}} +{{}} +{{}} +``` + - index.md can be reference either by its path or by its containing folder without the ending `/`. \_index.md can be referenced only by its containing folder: ++`index.md` can be reference either by its path or by its containing directory without the ending `/`. `_index.md` can be referenced only by its containing directory: + +```text +{{}} <-- References /about/_index.md +{{}} <-- Raises REF_NOT_FOUND error +{{}} <-- References /about/credits.md + +{{}} <-- References /products/index.md +{{}} <-- References /products/index.md +``` + +To generate a hyperlink using `ref` or `relref` in Markdown: + +```text +[About]({{}} "About Us") +``` + +Hugo emits an error or warning if a document cannot be uniquely resolved. The error behavior is configurable; see below. + +### Link to another language version + +Using `ref` or `relref` without specifying a language, will make the reference resolve to the language of the current content page. + +To link to another language version of a document, use this syntax: + +```text +{{}} +``` + +### Get another output format + +To link to another Output Format of a document, use this syntax: + +```text +{{}} +``` + +### Heading IDs + +When using Markdown document types, Hugo generates element IDs for every heading on a page. For example: + +```text +## Reference +``` + +produces this HTML: + +```html +

Reference

+``` + +Get the permalink to a heading by appending the ID to the path when using the `ref` or `relref` shortcodes: + +```text +{{}} +{{}} +``` + +Generate a custom heading ID by including an attribute. For example: + +```text +## Reference A {#foo} +## Reference B {id="bar"} +``` + +produces this HTML: + +```html +

Reference A

+

Reference B

+``` + +Hugo will generate unique element IDs if the same heading appears more than once on a page. For example: + +```text +## Reference +## Reference +## Reference +``` + +produces this HTML: + +```html +

Reference

+

Reference

+

Reference

+``` + +## Ref and RelRef Configuration + +The behavior can be configured in `hugo.toml`: + +refLinksErrorLevel ("ERROR") +: When using `ref` or `relref` to resolve page links and a link cannot resolved, it will be logged with this log level. Valid values are `ERROR` (default) or `WARNING`. Any `ERROR` will fail the build (`exit -1`). + +refLinksNotFoundURL +: URL to be used as a placeholder when a page reference cannot be found in `ref` or `relref`. Is used as-is. diff --cc docs/content/en/content-management/data-sources.md index c009fb7f3,000000000..1237e4f4d mode 100644,000000..100644 --- a/docs/content/en/content-management/data-sources.md +++ b/docs/content/en/content-management/data-sources.md @@@ -1,126 -1,0 +1,120 @@@ +--- +title: Data sources +description: Use local and remote data sources to augment or create content. +categories: [content management] +keywords: [data,json,toml,yaml,xml] +menu: + docs: + parent: content-management + weight: 280 +weight: 280 +toc: true +aliases: [/extras/datafiles/,/extras/datadrivencontent/,/doc/datafiles/,/templates/data-templates/] +--- + - Hugo can access and [unmarshal] local and remote data sources including CSV, JSON, TOML, YAML, and XML. Use this data to augment existing content or to create new content. ++Hugo can access and [unmarshal](g) local and remote data sources including CSV, JSON, TOML, YAML, and XML. Use this data to augment existing content or to create new content. + - [unmarshal]: /getting-started/glossary/#unmarshal - - A data source might be a file in the data directory, a [global resource], a [page resource], or a [remote resource]. - - [global resource]: /getting-started/glossary/#global-resource - [page resource]: /getting-started/glossary/#page-resource - [remote resource]: /getting-started/glossary/#remote-resource ++A data source might be a file in the `data` directory, a [global resource](g), a [page resource](g), or a [remote resource](g). + +## Data directory + - The data directory in the root of your project may contain one or more data files, in either a flat or nested tree. Hugo merges the data files to create a single data structure, accessible with the `Data` method on a `Site` object. ++The `data` directory in the root of your project may contain one or more data files, in either a flat or nested tree. Hugo merges the data files to create a single data structure, accessible with the `Data` method on a `Site` object. + - Hugo also merges data directories from themes and modules into this single data structure, where the data directory in the root of your project takes precedence. ++Hugo also merges data directories from themes and modules into this single data structure, where the `data` directory in the root of your project takes precedence. + +{{% note %}} +Hugo reads the combined data structure into memory and keeps it there for the entire build. For data that is infrequently accessed, use global or page resources instead. +{{% /note %}} + +Theme and module authors may wish to namespace their data files to prevent collisions. For example: + +```text +project/ +└── data/ + └── mytheme/ + └── foo.json +``` + +{{% note %}} - Do not place CSV files in the data directory. Access CSV files as page, global, or remote resources. ++Do not place CSV files in the `data` directory. Access CSV files as page, global, or remote resources. +{{% /note %}} + +See the documentation for the [`Data`] method on a `Site` object for details and examples. + +[`Data`]: /methods/site/data/ + +## Global resources + +Use the `resources.Get` and `transform.Unmarshal` functions to access data files that exist as global resources. + +See the [`transform.Unmarshal`](/functions/transform/unmarshal/#global-resource) documentation for details and examples. + +## Page resources + +Use the `Resources.Get` method on a `Page` object combined with the `transform.Unmarshal` function to access data files that exist as page resources. + +See the [`transform.Unmarshal`](/functions/transform/unmarshal/#page-resource) documentation for details and examples. + +## Remote resources + +Use the `resources.GetRemote` and `transform.Unmarshal` functions to access remote data. + +See the [`transform.Unmarshal`](/functions/transform/unmarshal/#remote-resource) documentation for details and examples. + +## Augment existing content + +Use data sources to augment existing content. For example, create a shortcode to render an HTML table from a global CSV resource. + +{{< code file=assets/pets.csv >}} +"name","type","breed","age" +"Spot","dog","Collie","3" +"Felix","cat","Malicious","7" +{{< /code >}} + +{{< code file=content/example.md lang=text >}} +{{}} +{{< /code >}} + +{{< code file=layouts/shortcodes/csv-to-table.html >}} +{{ with $file := .Get 0 }} + {{ with resources.Get $file }} + {{ with . | transform.Unmarshal }} + + + + {{ range index . 0 }} + + {{ end }} + + + + {{ range after 1 . }} + + {{ range . }} + + {{ end }} + + {{ end }} + +
{{ . }}
{{ . }}
+ {{ end }} + {{ else }} + {{ errorf "The %q shortcode was unable to find %s. See %s" $.Name $file $.Position }} + {{ end }} +{{ else }} + {{ errorf "The %q shortcode requires one positional argument, the path to the CSV file relative to the assets directory. See %s" .Name .Position }} +{{ end }} +{{< /code >}} + +Hugo renders this to: + +name|type|breed|age +:--|:--|:--|:-- +Spot|dog|Collie|3 +Felix|cat|Malicious|7 + +## Create new content + +Use [content adapters] to create new content. + +[content adapters]: /content-management/content-adapters/ diff --cc docs/content/en/content-management/formats.md index 1132c888c,000000000..a02aa2545 mode 100644,000000..100644 --- a/docs/content/en/content-management/formats.md +++ b/docs/content/en/content-management/formats.md @@@ -1,137 -1,0 +1,145 @@@ +--- +title: Content formats +description: Create your content using Markdown, HTML, Emacs Org Mode, AsciiDoc, Pandoc, or reStructuredText. +categories: [content management] +keywords: [markdown,asciidoc,pandoc,content format] +menu: + docs: + parent: content-management + weight: 40 +weight: 40 +toc: true +aliases: [/content/markdown-extras/,/content/supported-formats/,/doc/supported-formats/] +--- + +## Introduction + +You may mix content formats throughout your site. For example: + +```text +content/ +└── posts/ + ├── post-1.md + ├── post-2.adoc + ├── post-3.org + ├── post-4.pandoc + ├── post-5.rst + └── post-6.html +``` + +Regardless of content format, all content must have [front matter], preferably including both `title` and `date`. + - Hugo selects the content renderer based on the `markup` identifier in front matter, falling back to the file extension. See the [classification](#classification) table below for a list of markup identifiers and recognized file extensions. ++Hugo selects the content renderer based on the `markup` identifier in front matter, falling back to the file extension. See the [classification] table below for a list of markup identifiers and recognized file extensions. ++ ++[classification]: #classification ++[front matter]: /content-management/front-matter/ + +## Formats + +### Markdown + +Create your content in [Markdown] preceded by front matter. + - Markdown is Hugo's default content format. Hugo natively renders Markdown to HTML using [Goldmark]. Goldmark is fast and conforms to the [CommonMark] and [GitHub Flavored Markdown] specifications. You can [configure Goldmark] in your site configuration. ++Markdown is Hugo's default content format. Hugo natively renders Markdown to HTML using [Goldmark]. Goldmark is fast and conforms to the [CommonMark] and [GitHub Flavored Markdown] specifications. You can configure Goldmark in your [site configuration][configure goldmark]. + +Hugo provides custom Markdown features including: + +[Attributes] +: Apply HTML attributes such as `class` and `id` to Markdown images and block elements including blockquotes, fenced code blocks, headings, horizontal rules, lists, paragraphs, and tables. + +[Extensions] +: Leverage the embedded Markdown extensions to create tables, definition lists, footnotes, task lists, inserted text, mark text, subscripts, superscripts, and more. + +[Mathematics] - : Include mathematical equations and expressions in Markdown using LaTeX or TeX typesetting syntax. ++: Include mathematical equations and expressions in Markdown using LaTeX markup. + +[Render hooks] +: Override the conversion of Markdown to HTML when rendering fenced code blocks, headings, images, and links. For example, render every standalone image as an HTML `figure` element. + ++[Attributes]: /content-management/markdown-attributes/ ++[CommonMark]: https://spec.commonmark.org/current/ ++[Extensions]: /getting-started/configuration-markup/#goldmark-extensions ++[GitHub Flavored Markdown]: https://github.github.com/gfm/ ++[Goldmark]: https://github.com/yuin/goldmark ++[Markdown]: https://daringfireball.net/projects/markdown/ ++[Mathematics]: /content-management/mathematics/ ++[Render hooks]: /render-hooks/introduction/ ++[configure goldmark]: /getting-started/configuration-markup/#goldmark ++ +### HTML + +Create your content in [HTML] preceded by front matter. The content is typically what you would place within an HTML document's `body` or `main` element. + ++[HTML]: https://developer.mozilla.org/en-US/docs/Learn_web_development/Getting_started/Your_first_website/Creating_the_content ++ +### Emacs Org Mode + - Create your content in the [Emacs Org Mode] format preceded by front matter. You can use Org Mode keywords for front matter. See [details](/content-management/front-matter/#emacs-org-mode). ++Create your content in the [Emacs Org Mode] format preceded by front matter. You can use Org Mode keywords for front matter. See [details]. ++ ++[details]: /content-management/front-matter/#emacs-org-mode ++[Emacs Org Mode]: https://orgmode.org/ + +### AsciiDoc + +Create your content in the [AsciiDoc] format preceded by front matter. Hugo renders AsciiDoc content to HTML using the Asciidoctor executable. You must install Asciidoctor and its dependencies (Ruby) to use the AsciiDoc content format. + - You can [configure the AsciiDoc renderer] in your site configuration. ++You can configure the AsciiDoc renderer in your [site configuration][configure asciidoc]. + +In its default configuration, Hugo passes these CLI flags when calling the Asciidoctor executable: + +```text +--no-header-footer +``` + +The CLI flags passed to the Asciidoctor executable depend on configuration. You may inspect the flags when building your site: + +```text +hugo --logLevel info +``` + ++[AsciiDoc]: https://asciidoc.org/ ++[configure the AsciiDoc renderer]: /getting-started/configuration-markup/#asciidoc ++[configure asciidoc]: /getting-started/configuration-markup/#asciidoc ++ +### Pandoc + +Create your content in the [Pandoc] format preceded by front matter. Hugo renders Pandoc content to HTML using the Pandoc executable. You must install Pandoc to use the Pandoc content format. + +Hugo passes these CLI flags when calling the Pandoc executable: + +```text +--mathjax +``` + ++[Pandoc]: https://pandoc.org/ ++ +### reStructuredText + +Create your content in the [reStructuredText] format preceded by front matter. Hugo renders reStructuredText content to HTML using [Docutils], specifically rst2html. You must install Docutils and its dependencies (Python) to use the reStructuredText content format. + +Hugo passes these CLI flags when calling the rst2html executable: + +```text +--leave-comments --initial-header-level=2 +``` + ++[Docutils]: https://docutils.sourceforge.io/ ++[reStructuredText]: https://docutils.sourceforge.io/rst.html ++ +## Classification + +Content format|Media type|Identifier|File extensions +:--|:--|:--|:-- +Markdown|`text/markdown`|`markdown`|`markdown`,`md`, `mdown` +HTML|`text/html`|`html`|`htm`, `html` +Emacs Org Mode|`text/org`|`org`|`org` +AsciiDoc|`text/asciidoc`|`asciidoc`|`ad`, `adoc`, `asciidoc` +Pandoc|`text/pandoc`|`pandoc`|`pandoc`, `pdc` +reStructuredText|`text/rst`|`rst`|`rst` + +When converting content to HTML, Hugo uses: + +- Native renderers for Markdown, HTML, and Emacs Org mode +- External renderers for AsciiDoc, Pandoc, and reStructuredText + +Native renderers are faster than external renderers. - - [AsciiDoc]: https://asciidoc.org/ - [Asciidoctor]: https://asciidoctor.org/ - [Attributes]: /content-management/markdown-attributes/ - [CommonMark]: https://spec.commonmark.org/current/ - [Docutils]: https://docutils.sourceforge.io/ - [Emacs Org Mode]: https://orgmode.org/ - [Extensions]: /getting-started/configuration-markup/#goldmark-extensions - [GitHub Flavored Markdown]: https://github.github.com/gfm/ - [Goldmark]: https://github.com/yuin/goldmark - [HTML]: https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/HTML_basics - [Markdown]: https://daringfireball.net/projects/markdown/ - [Mathematics]: /content-management/mathematics/ - [Pandoc]: https://pandoc.org/ - [Render hooks]: https://gohugo.io/render-hooks/introduction/ - [configure Goldmark]: /getting-started/configuration-markup/#goldmark - [configure the AsciiDoc renderer]: /getting-started/configuration-markup/#asciidoc - [front matter]: /content-management/front-matter/ - [reStructuredText]: https://docutils.sourceforge.io/rst.html diff --cc docs/content/en/content-management/front-matter.md index 5cbf645a5,000000000..dba77f1d1 mode 100644,000000..100644 --- a/docs/content/en/content-management/front-matter.md +++ b/docs/content/en/content-management/front-matter.md @@@ -1,463 -1,0 +1,441 @@@ +--- +title: Front matter +description: Use front matter to add metadata to your content. +categories: [content management] +keywords: [front matter,yaml,toml,json,metadata,archetypes] +menu: + docs: + parent: content-management + weight: 60 +weight: 60 +toc: true +aliases: [/content/front-matter/] +--- + +## Overview + +The front matter at the top of each content file is metadata that: + +- Describes the content +- Augments the content +- Establishes relationships with other content +- Controls the published structure of your site +- Determines template selection + +Provide front matter using a serialization format, one of [JSON], [TOML], or [YAML]. Hugo determines the front matter format by examining the delimiters that separate the front matter from the page content. + +[json]: https://www.json.org/ +[toml]: https://toml.io/ +[yaml]: https://yaml.org/ + +See examples of front matter delimiters by toggling between the serialization formats below. + +{{< code-toggle file=content/example.md fm=true >}} +title = 'Example' +date = 2024-02-02T04:14:54-08:00 +draft = false +weight = 10 +[params] +author = 'John Smith' +{{< /code-toggle >}} + - Front matter fields may be [boolean], [integer], [float], [string], [arrays], or [maps]. Note that the TOML format also supports unquoted date/time values. - - [scalar]: /getting-started/glossary/#scalar - [arrays]: /getting-started/glossary/#array - [maps]: /getting-started/glossary/#map - [boolean]: /getting-started/glossary/#boolean - [integer]: /getting-started/glossary/#integer - [float]: /getting-started/glossary/#float - [string]: /getting-started/glossary/#string ++Front matter fields may be [boolean](g), [integer](g), [float](g), [string](g), [arrays](g), or [maps](g). Note that the TOML format also supports unquoted date/time values. + +## Fields + +The most common front matter fields are `date`, `draft`, `title`, and `weight`, but you can specify metadata using any of fields below. + +{{% note %}} +The field names below are reserved. For example, you cannot create a custom field named `type`. Create custom fields under the `params` key. See the [parameters] section for details. + +[parameters]: #parameters +{{% /note %}} + +###### aliases + +(`string array`) An array of one or more aliases, where each alias is a relative URL that will redirect the browser to the current location. Access these values from a template using the [`Aliases`] method on a `Page` object. See the [aliases] section for details. + +[`aliases`]: /methods/page/aliases/ +[aliases]: /content-management/urls/#aliases + +###### build + +(`map`) A map of [build options]. + +[build options]: /content-management/build-options/ + +###### cascade {#cascade-field} + +(`map`) A map of front matter keys whose values are passed down to the page’s descendants unless overwritten by self or a closer ancestor’s cascade. See the [cascade] section for details. + +[cascade]: #cascade + +###### date + +(`string`) The date associated with the page, typically the creation date. Note that the TOML format also supports unquoted date/time values. See the [dates](#dates) section for examples. Access this value from a template using the [`Date`] method on a `Page` object. + - +[`date`]: /methods/page/date/ + +###### description + +(`string`) Conceptually different than the page `summary`, the description is typically rendered within a `meta` element within the `head` element of the published HTML file. Access this value from a template using the [`Description`] method on a `Page` object. + +[`description`]: /methods/page/description/ + +###### draft + +(`bool`) +If `true`, the page will not be rendered unless you pass the `--buildDrafts` flag to the `hugo` command. Access this value from a template using the [`Draft`] method on a `Page` object. + +[`draft`]: /methods/page/draft/ + +###### expiryDate + +(`string`) The page expiration date. On or after the expiration date, the page will not be rendered unless you pass the `--buildExpired` flag to the `hugo` command. Note that the TOML format also supports unquoted date/time values. See the [dates](#dates) section for examples. Access this value from a template using the [`ExpiryDate`] method on a `Page` object. + +[`expirydate`]: /methods/page/expirydate/ + +###### headless + +(`bool`) Applicable to [leaf bundles], if `true` this value sets the `render` and `list` [build options] to `never`, creating a headless bundle of [page resources]. + +[leaf bundles]: /content-management/page-bundles/#leaf-bundles +[page resources]: /content-management/page-resources/ + +###### isCJKLanguage + - (`bool`) Set to `true` if the content language is in the [CJK] family. This value determines how Hugo calculates word count, and affects the values returned by the [`WordCount`], [`FuzzyWordCount`], [`ReadingTime`], and [`Summary`] methods on a `Page` object. ++(`bool`) Set to `true` if the content language is in the [CJK](g) family. This value determines how Hugo calculates word count, and affects the values returned by the [`WordCount`], [`FuzzyWordCount`], [`ReadingTime`], and [`Summary`] methods on a `Page` object. + +[`fuzzywordcount`]: /methods/page/wordcount/ +[`readingtime`]: /methods/page/readingtime/ +[`summary`]: /methods/page/summary/ +[`wordcount`]: /methods/page/wordcount/ - [cjk]: /getting-started/glossary/#cjk + +###### keywords + - (`string array`) An array of keywords, typically rendered within a `meta` element within the `head` element of the published HTML file, or used as a [taxonomy] to classify content. Access these values from a template using the [`Keywords`] method on a `Page` object. ++(`string array`) An array of keywords, typically rendered within a `meta` element within the `head` element of the published HTML file, or used as a [taxonomy](g) to classify content. Access these values from a template using the [`Keywords`] method on a `Page` object. + +[`keywords`]: /methods/page/keywords/ - [taxonomy]: /getting-started/glossary/#taxonomy + - {{% comment %}} + + + + + - {{% /comment %}} + +###### lastmod + +(`string`) The date that the page was last modified. Note that the TOML format also supports unquoted date/time values. See the [dates](#dates) section for examples. Access this value from a template using the [`Lastmod`] method on a `Page` object. + +[`lastmod`]: /methods/page/date/ + +###### layout + +(`string`) Provide a template name to [target a specific template], overriding the default [template lookup order]. Set the value to the base file name of the template, excluding its extension. Access this value from a template using the [`Layout`] method on a `Page` object. + +[`layout`]: /methods/page/layout/ +[template lookup order]: /templates/lookup-order/ - [target a specific template]: templates/lookup-order/#target-a-template ++[target a specific template]: /templates/lookup-order/#target-a-template + +###### linkTitle + +(`string`) Typically a shorter version of the `title`. Access this value from a template using the [`LinkTitle`] method on a `Page` object. + +[`linktitle`]: /methods/page/linktitle/ + +###### markup + +(`string`) An identifier corresponding to one of the supported [content formats]. If not provided, Hugo determines the content renderer based on the file extension. + +[content formats]: /content-management/formats/#classification + +###### menus + +(`string`, `string array`, or `map`) If set, Hugo adds the page to the given menu or menus. See the [menus] page for details. + +[menus]: /content-management/menus/#define-in-front-matter + +###### modified + +Alias to [lastmod](#lastmod). + +###### outputs + +(`string array`) The [output formats] to render. + +[output formats]: /templates/output-formats/ + - {{% comment %}} + + - {{% /comment %}} + +###### params + +{{< new-in 0.123.0 >}} + +(`map`) A map of custom [page parameters]. + +[page parameters]: #parameters + +###### pubdate + +Alias to [publishDate](#publishdate). + +###### publishDate + +(`string`) The page publication date. Before the publication date, the page will not be rendered unless you pass the `--buildFuture` flag to the `hugo` command. Note that the TOML format also supports unquoted date/time values. See the [dates](#dates) section for examples. Access this value from a template using the [`PublishDate`] method on a `Page` object. + +[`publishdate`]: /methods/page/publishdate/ + +###### published + +Alias to [publishDate](#publishdate). + +###### resources + +(`map array`) An array of maps to provide metadata for [page resources]. + +[page-resources]: /content-management/page-resources/#page-resources-metadata + +###### sitemap + +(`map`) A map of sitemap options. See the [sitemap templates] page for details. Access these values from a template using the [`Sitemap`] method on a `Page` object. + +[sitemap templates]: /templates/sitemap/ +[`sitemap`]: /methods/page/sitemap/ + +###### slug + +(`string`) Overrides the last segment of the URL path. Not applicable to section pages. See the [URL management] page for details. Access this value from a template using the [`Slug`] method on a `Page` object. + +[`slug`]: /methods/page/slug/ +[URL management]: /content-management/urls/#slug + +###### summary + +(`string`) Conceptually different than the page `description`, the summary either summarizes the content or serves as a teaser to encourage readers to visit the page. Access this value from a template using the [`Summary`] method on a `Page` object. + +[`Summary`]: /methods/page/summary/ + +###### title + +(`string`) The page title. Access this value from a template using the [`Title`] method on a `Page` object. + +[`title`]: /methods/page/title/ + +###### translationKey + +(`string`) An arbitrary value used to relate two or more translations of the same page, useful when the translated pages do not share a common path. Access this value from a template using the [`TranslationKey`] method on a `Page` object. + +[`translationkey`]: /methods/page/translationkey/ + +###### type + - (`string`) The [content type], overriding the value derived from the top level section in which the page resides. Access this value from a template using the [`Type`] method on a `Page` object. ++(`string`) The [content type](g), overriding the value derived from the top level section in which the page resides. Access this value from a template using the [`Type`] method on a `Page` object. + - [content type]: /getting-started/glossary/#content-type +[`type`]: /methods/page/type/ + +###### unpublishdate + +Alias to [expirydate](#expirydate). + +###### url + +(`string`) Overrides the entire URL path. Applicable to regular pages and section pages. See the [URL management] page for details. + +###### weight - (`int`) The page [weight], used to order the page within a [page collection]. Access this value from a template using the [`Weight`] method on a `Page` object. ++(`int`) The page [weight](g), used to order the page within a [page collection](g). Access this value from a template using the [`Weight`] method on a `Page` object. + - [page collection]: /getting-started/glossary/#page-collection - [weight]: /getting-started/glossary/#weight +[`weight`]: /methods/page/weight/ + +## Parameters + +{{< new-in 0.123.0 >}} + +Specify custom page parameters under the `params` key in front matter: + +{{< code-toggle file=content/example.md fm=true >}} +title = 'Example' +date = 2024-02-02T04:14:54-08:00 +draft = false +weight = 10 +[params] +author = 'John Smith' +{{< /code-toggle >}} + +Access these values from a template using the [`Params`] or [`Param`] method on a `Page` object. + +[`param`]: /methods/page/param/ +[`params`]: /methods/page/params/ + +Hugo provides [embedded templates] to optionally insert meta data within the `head` element of your rendered pages. These embedded templates expect the following front matter parameters: + +Parameter|Data type|Used by these embedded templates +:--|:--|:-- +`audio`|`[]string`|[`opengraph.html`] +`images`|`[]string`|[`opengraph.html`], [`schema.html`], [`twitter_cards.html`] +`videos`|`[]string`|[`opengraph.html`] + - The embedded templates will skip a parameter if not provided in front matter, but will throw an error if the data type is unexpected. ++The embedded templates will skip a parameter if not provided in front matter, but will throw an error if the data type is unexpected. + +[`opengraph.html`]: {{% eturl opengraph %}} +[`schema.html`]: {{% eturl schema %}} +[`twitter_cards.html`]: {{% eturl twitter_cards %}} +[embedded templates]: /templates/embedded/ + +## Taxonomies + +Classify content by adding taxonomy terms to front matter. For example, with this site configuration: + +{{< code-toggle file=hugo >}} +[taxonomies] +tag = 'tags' +genre = 'genres' +{{< /code-toggle >}} + +Add taxonomy terms as shown below: + +{{< code-toggle file=content/example.md fm=true >}} +title = 'Example' +date = 2024-02-02T04:14:54-08:00 +draft = false +weight = 10 +tags = ['red','blue'] +genres = ['mystery','romance'] +[params] +author = 'John Smith' +{{< /code-toggle >}} + - You can add taxonomy terms to the front matter of any these [page kinds]: ++You can add taxonomy terms to the front matter of any these [page kinds](g): + +- `home` +- `page` +- `section` +- `taxonomy` +- `term` + - [page kinds]: /getting-started/glossary/#page-kind - +Access taxonomy terms from a template using the [`Params`] or [`GetTerms`] method on a `Page` object. For example: + +{{< code file=layouts/_default/single.html >}} +{{ with .GetTerms "tags" }} +

Tags

+ +{{ end }} +{{< /code >}} + +[`Params`]: /methods/page/params/ +[`GetTerms`]: /methods/page/getterms/ + +## Cascade + - Any [node] can pass down to its descendants a set of front matter values. - - [node]: /getting-started/glossary/#node ++Any [node](g) can pass down to its descendants a set of front matter values. + +### Target specific pages + +The `cascade` block can be an array with an optional `_target` keyword, allowing you to target different page sets while cascading values. + +{{< code-toggle file=content/_index.md fm=true >}} +title ="Home" +[[cascade]] +[cascade.params] +background = "yosemite.jpg" +[cascade._target] +path="/articles/**" +lang="en" +kind="page" +[[cascade]] +[cascade.params] +background = "goldenbridge.jpg" +[cascade._target] +kind="section" +{{}} + +Use any combination of these keywords to target a set of pages: + +###### path {#cascade-path} + +(`string`) A [Glob](https://github.com/gobwas/glob) pattern matching the content path below /content. Expects Unix-styled slashes. Note that this is the virtual path, so it starts at the mount root. The matching supports double-asterisks so you can match for patterns like `/blog/*/**` to match anything from the third level and down. + +###### kind {#cascade-kind} + +(`string`) A Glob pattern matching the Page's Kind(s), e.g. "{home,section}". + +###### lang {#cascade-lang} + +(`string`) A Glob pattern matching the Page's language, e.g. "{en,sv}". + +###### environment {#cascade-environment} + +(`string`) A Glob pattern matching the build environment, e.g. "{production,development}" + +Any of the above can be omitted. + +{{% note %}} +With a multilingual site it may be more efficient to define the `cascade` values in your site configuration to avoid duplicating the `cascade` values on the section, taxonomy, or term page for each language. + +With a multilingual site, if you choose to define the `cascade` values in front matter, you must create a section, taxonomy, or term page for each language; the `lang` keyword is ignored. +{{% /note %}} + +### Example + +{{< code-toggle file=content/posts/_index.md fm=true >}} +date = 2024-02-01T21:25:36-08:00 +title = 'Posts' +[cascade] + [cascade.params] + banner = 'images/typewriter.jpg' +{{}} + +With the above example the posts section page and its descendants will return `images/typewriter.jpg` when `.Params.banner` is invoked unless: + +- Said descendant has its own `banner` value set +- Or a closer ancestor node has its own `cascade.banner` value set. + +## Emacs Org Mode + +If your [content format] is [Emacs Org Mode], you may provide front matter using Org Mode keywords. For example: + +{{< code file=content/example.org lang=text >}} +#+TITLE: Example +#+DATE: 2024-02-02T04:14:54-08:00 +#+DRAFT: false +#+AUTHOR: John Smith +#+GENRES: mystery +#+GENRES: romance +#+TAGS: red +#+TAGS: blue +#+WEIGHT: 10 +{{< /code >}} + +Note that you can also specify array elements on a single line: + +{{< code file=content/example.org lang=text >}} +#+TAGS[]: red blue +{{< /code >}} + +[content format]: /content-management/formats/ +[emacs org mode]: https://orgmode.org/ + +## Dates + +When populating a date field, whether a [custom page parameter](#parameters) or one of the four predefined fields ([`date`](#date), [`expiryDate`](#expirydate), [`lastmod`](#lastmod), [`publishDate`](#publishdate)), use one of these parsable formats: + +{{% include "functions/time/_common/parsable-date-time-strings.md" %}} + +To override the default time zone, set the [`timeZone`](https://gohugo.io/getting-started/configuration/#timezone) in your site configuration. The order of precedence for determining the time zone is: + +1. The time zone offset in the date/time string - 2. The time zone specified in your site configuration - 3. The `Etc/UTC` time zone ++1. The time zone specified in your site configuration ++1. The `Etc/UTC` time zone diff --cc docs/content/en/content-management/image-processing/index.md index 841f12863,000000000..69ee30dc8 mode 100644,000000..100644 --- a/docs/content/en/content-management/image-processing/index.md +++ b/docs/content/en/content-management/image-processing/index.md @@@ -1,521 -1,0 +1,520 @@@ +--- +title: Image processing +description: Resize, crop, rotate, filter, and convert images. +categories: [content management,fundamentals] +keywords: [resources,images] +menu: + docs: + parent: content-management + weight: 90 +toc: true +weight: 90 +--- + +## Image resources + +To process an image you must access the file as a page resource, global resource, or remote resource. + +### Page resource + +A page resource is a file within a [page bundle]. A page bundle is a directory with an `index.md` or `_index.md` file at its root. + +```text +content/ +└── posts/ + └── post-1/ <-- page bundle + ├── index.md + └── sunset.jpg <-- page resource +``` + +To access an image as a page resource: + +```go-html-template +{{ $image := .Resources.Get "sunset.jpg" }} +``` + +### Global resource + +A global resource is a file within the `assets` directory, or within any directory [mounted] to the `assets` directory. + +```text +assets/ +└── images/ + └── sunset.jpg <-- global resource +``` + +To access an image as a global resource: + +```go-html-template +{{ $image := resources.Get "images/sunset.jpg" }} +``` + +### Remote resource + +A remote resource is a file on a remote server, accessible via HTTP or HTTPS. To access an image as a remote resource: + +```go-html-template +{{ $image := resources.GetRemote "https://gohugo.io/img/hugo-logo.png" }} +``` + +## Image rendering + +Once you have accessed an image as a resource, render it in your templates using the `Permalink`, `RelPermalink`, `Width`, and `Height` properties. + +Example 1: Throws an error if the resource is not found. + +```go-html-template +{{ $image := .Resources.GetMatch "sunset.jpg" }} + +``` + +Example 2: Skips image rendering if the resource is not found. + +```go-html-template +{{ $image := .Resources.GetMatch "sunset.jpg" }} +{{ with $image }} + +{{ end }} +``` + +Example 3: A more concise way to skip image rendering if the resource is not found. + +```go-html-template +{{ with .Resources.GetMatch "sunset.jpg" }} + +{{ end }} +``` + +Example 4: Skips rendering if there's problem accessing a remote resource. + +```go-html-template - {{ $u := "https://gohugo.io/img/hugo-logo.png" }} - {{ with resources.GetRemote $u }} ++{{ $url := "https://gohugo.io/img/hugo-logo.png" }} ++{{ with try (resources.GetRemote $url) }} + {{ with .Err }} + {{ errorf "%s" . }} - {{ else }} ++ {{ else with .Value }} + ++ {{ else }} ++ {{ errorf "Unable to get remote resource %q" $url }} + {{ end }} - {{ else }} - {{ errorf "Unable to get remote resource %q" $u }} +{{ end }} +``` + +## Image processing methods + +The `image` resource implements the [`Process`], [`Resize`], [`Fit`], [`Fill`], [`Crop`], [`Filter`], [`Colors`] and [`Exif`] methods. + +{{% note %}} +Metadata (EXIF, IPTC, XMP, etc.) is not preserved during image transformation. Use the `Exif` method with the _original_ image to extract EXIF metadata from JPEG, PNG, TIFF, and WebP images. +{{% /note %}} + +### Process + +{{< new-in 0.119.0 >}} + +{{% note %}} +The `Process` method is also available as a filter, which is more effective if you need to apply multiple filters to an image. See [Process filter](/functions/images/process). +{{% /note %}} + +Process processes the image with the given specification. The specification can contain an optional action, one of `resize`, `crop`, `fit` or `fill`. This means that you can use this method instead of [`Resize`], [`Fit`], [`Fill`], or [`Crop`]. + +See [Options](#image-processing-options) for available options. + +You can also use this method apply image processing that does not need any scaling, e.g. format conversions: + +```go-html-template +{{/* Convert the image from JPG to PNG. */}} +{{ $png := $jpg.Process "png" }} +``` + +Some more examples: + +```go-html-template +{{/* Rotate the image 90 degrees counter-clockwise. */}} +{{ $image := $image.Process "r90" }} + +{{/* Scaling actions. */}} +{{ $image := $image.Process "resize 600x" }} +{{ $image := $image.Process "crop 600x400" }} +{{ $image := $image.Process "fit 600x400" }} +{{ $image := $image.Process "fill 600x400" }} +``` + +### Resize + +Resize an image to the given width and/or height. + +If you specify both width and height, the resulting image will be disproportionally scaled unless the original image has the same aspect ratio. + +```go-html-template +{{/* Resize to a width of 600px and preserve aspect ratio */}} +{{ $image := $image.Resize "600x" }} + +{{/* Resize to a height of 400px and preserve aspect ratio */}} +{{ $image := $image.Resize "x400" }} + +{{/* Resize to a width of 600px and a height of 400px */}} +{{ $image := $image.Resize "600x400" }} +``` + +### Fit + +Downscale an image to fit the given dimensions while maintaining aspect ratio. You must provide both width and height. + +```go-html-template +{{ $image := $image.Fit "600x400" }} +``` + +### Fill + +Crop and resize an image to match the given dimensions. You must provide both width and height. Use the [`anchor`] option to change the crop box anchor point. + +```go-html-template +{{ $image := $image.Fill "600x400" }} +``` + +### Crop + +Crop an image to match the given dimensions without resizing. You must provide both width and height. Use the [`anchor`] option to change the crop box anchor point. + +```go-html-template +{{ $image := $image.Crop "600x400" }} +``` + +### Filter + +Apply one or more [filters] to an image. + +```go-html-template +{{ $image := $image.Filter (images.GaussianBlur 6) (images.Pixelate 8) }} +``` + +Write this in a more functional style using pipes. Hugo applies the filters in the order given. + +```go-html-template +{{ $image := $image | images.Filter (images.GaussianBlur 6) (images.Pixelate 8) }} +``` + +Sometimes it can be useful to create the filter chain once and then reuse it. + +```go-html-template +{{ $filters := slice (images.GaussianBlur 6) (images.Pixelate 8) }} +{{ $image1 := $image1.Filter $filters }} +{{ $image2 := $image2.Filter $filters }} +``` + +### Colors + +`.Colors` returns a slice of hex strings with the dominant colors in the image using a simple histogram method. + +```go-html-template +{{ $colors := $image.Colors }} +``` + +This method is fast, but if you also scale down your images, it would be good for performance to extract the colors from the scaled down image. + +### EXIF + +Provides an [EXIF] object containing image metadata. + +You may access EXIF data in JPEG, PNG, TIFF, and WebP images. To prevent errors when processing images without EXIF data, wrap the access in a [`with`] statement. + +```go-html-template +{{ with $image.Exif }} + Date: {{ .Date }} + Lat/Long: {{ .Lat }}/{{ .Long }} + Tags: + {{ range $k, $v := .Tags }} + TAG: {{ $k }}: {{ $v }} + {{ end }} +{{ end }} +``` + +You may also access EXIF fields individually, using the [`lang.FormatNumber`] function to format the fields as needed. + +```go-html-template +{{ with $image.Exif }} + +{{ end }} +``` + +#### EXIF methods + +Date +: (`time.Time`) Returns the image creation date/time. Format with the [`time.Format`]function. + +[time.Format]: /functions/time/format/ + +Lat +: (`float64`) Returns the GPS latitude in degrees. + +Long +: (`float64`) Returns the GPS longitude in degrees. + +Tags +: (`exif.Tags`) Returns a collection of the available EXIF tags for this image. You may include or exclude specific tags from this collection in the [site configuration]. + +## Image processing options + +The [`Resize`], [`Fit`], [`Fill`], and [`Crop`] methods accept a space-delimited, case-insensitive list of options. The order of the options within the list is irrelevant. + +### Dimensions + +With the [`Resize`] method you must specify width, height, or both. The [`Fit`], [`Fill`], and [`Crop`] methods require both width and height. All dimensions are in pixels. + +```go-html-template +{{ $image := $image.Resize "600x" }} +{{ $image := $image.Resize "x400" }} +{{ $image := $image.Resize "600x400" }} +{{ $image := $image.Fit "600x400" }} +{{ $image := $image.Fill "600x400" }} +{{ $image := $image.Crop "600x400" }} +``` + +### Rotation + +Rotates an image counter-clockwise by the given angle. Hugo performs rotation _before_ scaling. For example, if the original image is 600x400 and you wish to rotate the image 90 degrees counter-clockwise while scaling it by 50%: + +```go-html-template +{{ $image = $image.Resize "200x r90" }} +``` + +In the example above, the width represents the desired width _after_ rotation. + +To rotate an image without scaling, use the dimensions of the original image: + +```go-html-template +{{ with .Resources.GetMatch "sunset.jpg" }} + {{ with .Resize (printf "%dx%d r90" .Height .Width) }} + + {{ end }} +{{ end }} +``` + +In the example above, on the second line, we have reversed width and height to reflect the desired dimensions _after_ rotation. + +### Anchor + +When using the [`Crop`] or [`Fill`] method, the _anchor_ determines the placement of the crop box. You may specify `TopLeft`, `Top`, `TopRight`, `Left`, `Center`, `Right`, `BottomLeft`, `Bottom`, `BottomRight`, or `Smart`. + +The default value is `Smart`, which uses [Smartcrop] image analysis to determine the optimal placement of the crop box. You may override the default value in the [site configuration]. + +For example, if you have a 400x200 image with a bird in the upper left quadrant, you can create a 200x100 thumbnail containing the bird: + +```go-html-template +{{ $image.Crop "200x100 TopLeft" }} +``` + +If you apply [rotation](#rotation) when using the [`Crop`] or [`Fill`] method, specify the anchor relative to the rotated image. + +### Target format + +By default, Hugo encodes the image in the source format. You may convert the image to another format by specifying `bmp`, `gif`, `jpeg`, `jpg`, `png`, `tif`, `tiff`, or `webp`. + +```go-html-template +{{ $image.Resize "600x webp" }} +``` + +To convert an image without scaling, use the dimensions of the original image: + +```go-html-template +{{ with .Resources.GetMatch "sunset.jpg" }} + {{ with .Resize (printf "%dx%d webp" .Width .Height) }} + + {{ end }} +{{ end }} +``` + +### Quality + +Applicable to JPEG and WebP images, the `q` value determines the quality of the converted image. Higher values produce better quality images, while lower values produce smaller files. Set this value to a whole number between 1 and 100, inclusive. + +The default value is 75. You may override the default value in the [site configuration]. + +```go-html-template +{{ $image.Resize "600x webp q50" }} +``` + +### Hint + +Applicable to WebP images, this option corresponds to a set of predefined encoding parameters, and is equivalent to the `-preset` flag for the [`cwebp`] encoder. + +[`cwebp`]: https://developers.google.com/speed/webp/docs/cwebp + +Value|Example +:--|:-- +`drawing`|Hand or line drawing with high-contrast details +`icon`|Small colorful image +`photo`|Outdoor photograph with natural lighting +`picture`|Indoor photograph such as a portrait +`text`|Image that is primarily text + +The default value is `photo`. You may override the default value in the [site configuration]. + +```go-html-template +{{ $image.Resize "600x webp picture" }} +``` + +### Background color + +When converting an image from a format that supports transparency (e.g., PNG) to a format that does _not_ support transparency (e.g., JPEG), you may specify the background color of the resulting image. + +Use either a 3-digit or 6-digit hexadecimal color code (e.g., `#00f` or `#0000ff`). + +The default value is `#ffffff` (white). You may override the default value in the [site configuration]. + +```go-html-template +{{ $image.Resize "600x jpg #b31280" }} +``` + +### Resampling filter + +You may specify the resampling filter used when resizing an image. Commonly used resampling filters include: + +Filter|Description +:--|:-- +`Box`|Simple and fast averaging filter appropriate for downscaling +`Lanczos`|High-quality resampling filter for photographic images yielding sharp results +`CatmullRom`|Sharp cubic filter that is faster than the Lanczos filter while providing similar results +`MitchellNetravali`|Cubic filter that produces smoother results with less ringing artifacts than CatmullRom +`Linear`|Bilinear resampling filter, produces smooth output, faster than cubic filters +`NearestNeighbor`|Fastest resampling filter, no antialiasing + +The default value is `Box`. You may override the default value in the [site configuration]. + +```go-html-template +{{ $image.Resize "600x400 Lanczos" }} +``` + +See [github.com/disintegration/imaging] for the complete list of resampling filters. If you wish to improve image quality at the expense of performance, you may wish to experiment with the alternative filters. + +## Image processing examples + +_The photo of the sunset used in the examples below is Copyright [Bjørn Erik Pedersen](https://commons.wikimedia.org/wiki/User:Bep) (Creative Commons Attribution-Share Alike 4.0 International license)_ + +{{< imgproc "sunset.jpg" "resize 300x" />}} + +{{< imgproc "sunset.jpg" "fill 90x120 left" />}} + +{{< imgproc "sunset.jpg" "fill 90x120 right" />}} + +{{< imgproc "sunset.jpg" "fit 90x90" />}} + +{{< imgproc "sunset.jpg" "crop 250x250 center" />}} + +{{< imgproc "sunset.jpg" "resize 300x q10" />}} + +This is the shortcode used to generate the examples above: + +{{< readfile file=layouts/shortcodes/imgproc.html highlight=go-html-template >}} + +Call the shortcode from your Markdown like this: + +```go-html-template +{{}} +``` + +{{% note %}} +Note the self-closing shortcode syntax above. You may call the `imgproc` shortcode with or without **inner content**. +{{% /note %}} + +## Imaging configuration + +### Processing options + +Define an `imaging` section in your site configuration to set the default [image processing options](#image-processing-options). + +{{< code-toggle config=imaging />}} + +anchor +: See image processing options: [anchor](#anchor). + +bgColor +: See image processing options: [background color](#background-color). + +hint +: See image processing options: [hint](#hint). + +quality +: See image processing options: [quality](#quality). + +resampleFilter +: See image processing options: [resampling filter](#resampling-filter). + +### EXIF data + +Define an `imaging.exif` section in your site configuration to control the availability of EXIF data. + +{{< code-toggle file=hugo >}} +[imaging.exif] +includeFields = "" +excludeFields = "" +disableDate = false +disableLatLong = false +{{< /code-toggle >}} + +disableDate +: Hugo extracts the image creation date/time into `.Date`. Set this to `true` to disable. Default is `false`. + +disableLatLong +: Hugo extracts the GPS latitude and longitude into `.Lat` and `.Long`. Set this to `true` to disable. Default is `false`. + +excludeFields +: Regular expression matching the EXIF tags to exclude from the `.Tags` collection. Default is `""`. + +includeFields +: Regular expression matching the EXIF tags to include in the `.Tags` collection. Default is `""`. To include all available tags, set this value to `".*"`. + +{{% note %}} +To improve performance and decrease cache size, Hugo excludes the following tags: `ColorSpace`, `Contrast`, `Exif`, `Exposure[M|P|B]`, `Flash`, `GPS`, `JPEG`, `Metering`, `Resolution`, `Saturation`, `Sensing`, `Sharp`, and `WhiteBalance`. + +To control tag availability, change the `excludeFields` or `includeFields` settings as described above. +{{% /note %}} + +## Smart cropping of images + - By default, Hugo uses the [Smartcrop] library when cropping images with the `Crop` or`Fill` methods. You can set the anchor point manually, but in most cases the `Smart` option will make a good choice. ++By default, Hugo uses the [Smartcrop] library when cropping images with the `Crop` or `Fill` methods. You can set the anchor point manually, but in most cases the `Smart` option will make a good choice. + +Examples using the sunset image from above: + +{{< imgproc "sunset.jpg" "fill 200x200 smart" />}} + +{{< imgproc "sunset.jpg" "crop 200x200 smart" />}} + +## Image processing performance consideration + +Hugo caches processed images in the `resources` directory. If you include this directory in source control, Hugo will not have to regenerate the images in a CI/CD workflow (e.g., GitHub Pages, GitLab Pages, Netlify, etc.). This results in faster builds. + +If you change image processing methods or options, or if you rename or remove images, the `resources` directory will contain unused images. To remove the unused images, perform garbage collection with: + +```sh +hugo --gc +``` + - +[`anchor`]: /content-management/image-processing#anchor +[mounted]: /hugo-modules/configuration#module-configuration-mounts +[page bundle]: /content-management/page-bundles/ +[`lang.FormatNumber`]: /functions/lang/formatnumber/ +[filters]: /functions/images/filter/#image-filters - [github.com/disintegration/imaging]: - [Smartcrop]: - [Exif]: ++[github.com/disintegration/imaging]: https://github.com/disintegration/imaging#image-resizing ++[Smartcrop]: https://github.com/muesli/smartcrop#smartcrop ++[Exif]: https://en.wikipedia.org/wiki/Exif +[`Process`]: #process +[`Colors`]: #colors +[`Crop`]: #crop +[`Exif`]: #exif +[`Fill`]: #fill +[`Filter`]: #filter +[`Fit`]: #fit +[`Resize`]: #resize +[site configuration]: #processing-options +[`with`]: /functions/go-template/with/ diff --cc docs/content/en/content-management/markdown-attributes.md index 9c62c4fba,000000000..a465f244d mode 100644,000000..100644 --- a/docs/content/en/content-management/markdown-attributes.md +++ b/docs/content/en/content-management/markdown-attributes.md @@@ -1,115 -1,0 +1,114 @@@ +--- +title: Markdown attributes +description: Use Markdown attributes to add HTML attributes when rendering Markdown to HTML. +categories: [content management] +keywords: [goldmark,markdown] +menu: + docs: + parent: content-management + weight: 240 +weight: 240 +toc: true +--- + +## Overview + +Hugo supports Markdown attributes on images and block elements including blockquotes, fenced code blocks, headings, horizontal rules, lists, paragraphs, and tables. + +For example: + +```text +This is a paragraph. +{class="foo bar" id="baz"} +``` + +With `class` and `id` you can use shorthand notation: + +```text +This is a paragraph. +{.foo .bar #baz} +``` + +Hugo renders both of these to: + +```html +

This is a paragraph.

+``` + +## Block elements + +Update your site configuration to enable Markdown attributes for block-level elements. + +{{< code-toggle file=hugo >}} +[markup.goldmark.parser.attribute] +title = true # default is true +block = true # default is false +{{< /code-toggle >}} + - +## Standalone images + +By default, when the [Goldmark] Markdown renderer encounters a standalone image element (no other elements or text on the same line), it wraps the image element within a paragraph element per the [CommonMark specification]. + +[CommonMark specification]: https://spec.commonmark.org/current/ +[Goldmark]: https://github.com/yuin/goldmark + +If you were to place an attribute list beneath an image element, Hugo would apply the attributes to the surrounding paragraph, not the image. + +To apply attributes to a standalone image element, you must disable the default wrapping behavior: + +{{< code-toggle file=hugo >}} +[markup.goldmark.parser] +wrapStandAloneImageWithinParagraph = false # default is true +{{< /code-toggle >}} + +## Usage + +You may add [global HTML attributes], or HTML attributes specific to the current element type. Consistent with its content security model, Hugo removes HTML event attributes such as `onclick` and `onmouseover`. + +[global HTML attributes]: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes + +The attribute list consists of one or more key-value pairs, separated by spaces or commas, wrapped by braces. You must quote string values that contain spaces. Unlike HTML, boolean attributes must have both key and value. + +For example: + +```text +> This is a blockquote. +{class="foo bar" hidden=hidden} +``` + +Hugo renders this to: + +```html + +``` + +In most cases, place the attribute list beneath the markup element. For headings and fenced code blocks, place the attribute list on the right. + +Element|Position of attribute list +:--|:-- +blockquote | bottom +fenced code block | right +heading | right +horizontal rule | bottom +image | bottom +list | bottom +paragraph | bottom +table | bottom + +For example: + +````text +## Section 1 {class=foo} + +```bash {class=foo linenos=inline} +declare a=1 +echo "${a}" +``` + +This is a paragraph. +{class=foo} +```` + +As shown above, the attribute list for fenced code blocks is not limited to HTML attributes. You can also configure syntax highlighting by passing one or more of [these options](/functions/transform/highlight/#options). diff --cc docs/content/en/content-management/mathematics.md index 3212fe251,000000000..5eda9ffa3 mode 100644,000000..100644 --- a/docs/content/en/content-management/mathematics.md +++ b/docs/content/en/content-management/mathematics.md @@@ -1,228 -1,0 +1,232 @@@ +--- +title: Mathematics in Markdown +linkTitle: Mathematics - description: Include mathematical equations and expressions in your Markdown using LaTeX or TeX typesetting syntax. ++description: Include mathematical equations and expressions in Markdown using LaTeX markup. +categories: [content management] - keywords: [chemical,chemistry,latex,math,mathjax,tex,typesetting] ++keywords: [katex,latex,math,mathjax,typesetting] +menu: + docs: + parent: content-management + weight: 270 +weight: 270 +toc: true +math: true +--- + +{{< new-in 0.122.0 >}} + ++## Overview ++ ++Mathematical equations and expressions written in [LaTeX] are common in academic and scientific publications. Your browser typically renders this mathematical markup using an open-source JavaScript display engine such as [MathJax] or [KaTeX]. ++ ++For example, with this LaTeX markup: ++ ++```text +\[ +\begin{aligned} +KL(\hat{y} || y) &= \sum_{c=1}^{M}\hat{y}_c \log{\frac{\hat{y}_c}{y_c}} \\ +JS(\hat{y} || y) &= \frac{1}{2}(KL(y||\frac{y+\hat{y}}{2}) + KL(\hat{y}||\frac{y+\hat{y}}{2})) +\end{aligned} +\] ++``` + - ## Overview - - Mathematical equations and expressions authored in [LaTeX] or [TeX] are common in academic and scientific publications. Your browser typically renders this mathematical markup using an open-source JavaScript display engine such as [MathJax] or [KaTeX]. - - For example, this is the mathematical markup for the equations displayed at the top of this page: ++The MathJax display engine renders this: + - ```text +\[ +\begin{aligned} +KL(\hat{y} || y) &= \sum_{c=1}^{M}\hat{y}_c \log{\frac{\hat{y}_c}{y_c}} \\ +JS(\hat{y} || y) &= \frac{1}{2}(KL(y||\frac{y+\hat{y}}{2}) + KL(\hat{y}||\frac{y+\hat{y}}{2})) +\end{aligned} +\] - ``` + +Equations and expressions can be displayed inline with other text, or as standalone blocks. Block presentation is also known as "display" mode. + - Whether an equation or expression appears inline, or as a block, depends on the delimiters that surround the mathematical markup. Delimiters are defined in pairs, where each pair consists of an opening and closing delimiter. The opening and closing delimiters may be the same, or different. Common delimiter pairs are shown in [Step 1]. ++Whether an equation or expression appears inline, or as a block, depends on the delimiters that surround the mathematical markup. Delimiters are defined in pairs, where each pair consists of an opening and closing delimiter. The opening and closing delimiters may be the same, or different. + - The approach described below avoids reliance on platform-specific features like shortcodes or code block render hooks. Instead, it utilizes a standardized markup format for mathematical equations and expressions, compatible with the rendering engines used by GitHub, GitLab, [Microsoft VS Code], [Obsidian], [Typora], and others. ++{{% note %}} ++You can configure Hugo to render mathematical markup on the client-side using the MathJax or KaTeX display engine, or you can render the markup while building your site with the [`transform.ToMath`]function. ++ ++The first approach is described below. ++ ++[`transform.ToMath`]: /functions/transform/tomath/ ++{{% /note %}} + +## Setup + - Follow these instructions to include mathematical equations and expressions in your Markdown using LaTeX or TeX typesetting syntax. ++Follow these instructions to include mathematical equations and expressions in your Markdown using LaTeX markup. + +###### Step 1 + +Enable and configure the Goldmark [passthrough extension] in your site configuration. The passthrough extension preserves raw Markdown within delimited snippets of text, including the delimiters themselves. + +{{< code-toggle file=hugo copy=true >}} +[markup.goldmark.extensions.passthrough] +enable = true + +[markup.goldmark.extensions.passthrough.delimiters] +block = [['\[', '\]'], ['$$', '$$']] +inline = [['\(', '\)']] + +[params] +math = true +{{< /code-toggle >}} + +The configuration above enables mathematical rendering on every page unless you set the `math` parameter to `false` in front matter. To enable mathematical rendering as needed, set the `math` parameter to `false` in your site configuration, and set the `math` parameter to `true` in front matter. Use this parameter in your base template as shown in [Step 3]. + +{{% note %}} +The configuration above precludes the use of the `$...$` delimiter pair for inline equations. Although you can add this delimiter pair to the configuration and JavaScript, you will need to double-escape the `$` symbol when used outside of math contexts to avoid unintended formatting. + +See the [inline delimiters](#inline-delimiters) section for details. +{{% /note %}} + +To disable passthrough of inline snippets, omit the `inline` key from the configuration: + +{{< code-toggle file=hugo >}} +[markup.goldmark.extensions.passthrough.delimiters] +block = [['\[', '\]'], ['$$', '$$']] +{{< /code-toggle >}} + +You can define your own opening and closing delimiters, provided they match the delimiters that you set in [Step 2]. + +{{< code-toggle file=hugo >}} +[markup.goldmark.extensions.passthrough.delimiters] +block = [['@@', '@@']] +inline = [['@', '@']] +{{< /code-toggle >}} + +###### Step 2 + +Create a partial template to load MathJax or KaTeX. The example below loads MathJax, or you can use KaTeX as described in the [engines](#engines) section. + +{{< code file=layouts/partials/math.html copy=true >}} + + +{{< /code >}} + +The delimiters above must match the delimiters in your site configuration. + +###### Step 3 + +Conditionally call the partial template from the base template. + +{{< code file=layouts/_default/baseof.html >}} + + ... + {{ if .Param "math" }} + {{ partialCached "math.html" . }} + {{ end }} + ... + +{{< /code >}} + +The example above loads the partial template if you have set the `math` parameter in front matter to `true`. If you have not set the `math` parameter in front matter, the conditional statement falls back to the `math` parameter in your site configuration. + +###### Step 4 + - Include mathematical equations and expressions in your Markdown using LaTeX or TeX typesetting syntax. ++Include mathematical equations and expressions in Markdown using LaTeX markup. + +{{< code file=content/math-examples.md copy=true >}} +This is an inline \(a^*=x-b^*\) equation. + +These are block equations: + +\[a^*=x-b^*\] + +\[ a^*=x-b^* \] + +\[ +a^*=x-b^* +\] + +These are also block equations: + +$$a^*=x-b^*$$ + +$$ a^*=x-b^* $$ + +$$ +a^*=x-b^* +$$ +{{< /code >}} + +If you set the `math` parameter to `false` in your site configuration, you must set the `math` parameter to `true` in front matter. For example: + +{{< code-toggle file=content/math-examples.md fm=true >}} +title = 'Math examples' +date = 2024-01-24T18:09:49-08:00 +[params] +math = true +{{< /code-toggle >}} + +## Inline delimiters + +The configuration, JavaScript, and examples above use the `\(...\)` delimiter pair for inline equations. The `$...$` delimiter pair is a common alternative, but using it may result in unintended formatting if you use the `$` symbol outside of math contexts. + +If you add the `$...$` delimiter pair to your configuration and JavaScript, you must double-escape the `$` when outside of math contexts, regardless of whether mathematical rendering is enabled on the page. For example: + +```text +A \\$5 bill _saved_ is a \\$5 bill _earned_. +``` + +{{% note %}} +If you use the `$...$` delimiter pair for inline equations, and occasionally use the `$` symbol outside of math contexts, you must use MathJax instead of KaTeX to avoid unintended formatting caused by [this KaTeX limitation](https://github.com/KaTeX/KaTeX/issues/437). +{{% /note %}} + +## Engines + - MathJax and KaTeX are open-source JavaScript display engines. Both engines are fast, but at the time of this writing MathJax v3.2.2 is slightly faster than KaTeX v0.16.9. ++MathJax and KaTeX are open-source JavaScript display engines. Both engines are fast, but at the time of this writing MathJax v3.2.2 is slightly faster than KaTeX v0.16.11. + +{{% note %}} +If you use the `$...$` delimiter pair for inline equations, and occasionally use the `$` symbol outside of math contexts, you must use MathJax instead of KaTeX to avoid unintended formatting caused by [this KaTeX limitation](https://github.com/KaTeX/KaTeX/issues/437). + +See the [inline delimiters](#inline-delimiters) section for details. +{{% /note %}} + +To use KaTeX instead of MathJax, replace the partial template from [Step 2] with this: + +{{< code file=layouts/partials/math.html copy=true >}} - - - ++ ++ ++ + +{{< /code >}} + +The delimiters above must match the delimiters in your site configuration. + +## Chemistry + +Both MathJax and KaTeX provide support for chemical equations. For example: + +```text +$$C_p[\ce{H2O(l)}] = \pu{75.3 J // mol K}$$ +``` + +$$C_p[\ce{H2O(l)}] = \pu{75.3 J // mol K}$$ + +As shown in [Step 2] above, MathJax supports chemical equations without additional configuration. To add chemistry support to KaTeX, enable the mhchem extension as described in the KaTeX [documentation](https://katex.org/docs/libs). + +[KaTeX]: https://katex.org/ +[LaTeX]: https://www.latex-project.org/ +[MathJax]: https://www.mathjax.org/ - [Microsoft VS Code]: https://code.visualstudio.com/ - [Obsidian]: https://obsidian.md/ +[Step 1]: #step-1 +[Step 2]: #step-2 +[Step 3]: #step-3 - [TeX]: https://en.wikipedia.org/wiki/TeX - [Typora]: https://typora.io/ - [passthrough extension]: https://github.com/gohugoio/hugo-goldmark-extensions ++[passthrough extension]: /getting-started/configuration-markup/#passthrough diff --cc docs/content/en/content-management/menus.md index ff2011d3d,000000000..15cf505ea mode 100644,000000..100644 --- a/docs/content/en/content-management/menus.md +++ b/docs/content/en/content-management/menus.md @@@ -1,233 -1,0 +1,232 @@@ +--- +title: Menus +description: Create menus by defining entries, localizing each entry, and rendering the resulting data structure. +categories: [content management] +keywords: [menus] +menu: + docs: + parent: content-management + weight: 190 +weight: 190 +toc: true +aliases: [/extras/menus/] +--- + +## Overview + +To create a menu for your site: + +1. Define the menu entries - 2. [Localize] each entry - 3. Render the menu with a [template] ++1. [Localize] each entry ++1. Render the menu with a [template] + +Create multiple menus, either flat or nested. For example, create a main menu for the header, and a separate menu for the footer. + +There are three ways to define menu entries: + +1. Automatically +1. In front matter +1. In site configuration + +{{% note %}} +Although you can use these methods in combination when defining a menu, the menu will be easier to conceptualize and maintain if you use one method throughout the site. +{{% /note %}} + +## Define automatically + - To automatically define a menu entry for each top-level [section] of your site, enable the section pages menu in your site configuration. ++To automatically define a menu entry for each top-level [section](g) of your site, enable the section pages menu in your site configuration. + +{{< code-toggle file=hugo >}} +sectionPagesMenu = "main" +{{< /code-toggle >}} + +This creates a menu structure that you can access with `site.Menus.main` in your templates. See [menu templates] for details. + +## Define in front matter + +To add a page to the "main" menu: + +{{< code-toggle file=content/about.md fm=true >}} +title = 'About' +menus = 'main' +{{< /code-toggle >}} + +Access the entry with `site.Menus.main` in your templates. See [menu templates] for details. + +To add a page to the "main" and "footer" menus: + +{{< code-toggle file=content/contact.md fm=true >}} +title = 'Contact' +menus = ['main','footer'] +{{< /code-toggle >}} + +Access the entry with `site.Menus.main` and `site.Menus.footer` in your templates. See [menu templates] for details. + +{{% note %}} +The configuration key in the examples above is `menus`. The `menu` (singular) configuration key is an alias for `menus`. +{{% /note %}} + +### Properties {#properties-front-matter} + +Use these properties when defining menu entries in front matter: + +identifier +: (`string`) Required when two or more menu entries have the same `name`, or when localizing the `name` using translation tables. Must start with a letter, followed by letters, digits, or underscores. + +name +: (`string`) The text to display when rendering the menu entry. + +params +: (`map`) User-defined properties for the menu entry. + +parent +: (`string`) The `identifier` of the parent menu entry. If `identifier` is not defined, use `name`. Required for child entries in a nested menu. + +post +: (`string`) The HTML to append when rendering the menu entry. + +pre +: (`string`) The HTML to prepend when rendering the menu entry. + +title +: (`string`) The HTML `title` attribute of the rendered menu entry. + +weight +: (`int`) A non-zero integer indicating the entry's position relative the root of the menu, or to its parent for a child entry. Lighter entries float to the top, while heavier entries sink to the bottom. + +### Example {#example-front-matter} + +This front matter menu entry demonstrates some of the available properties: + +{{< code-toggle file=content/products/software.md fm=true >}} +title = 'Software' +[menus.main] +parent = 'Products' +weight = 20 +pre = '' +[menus.main.params] +class = 'center' +{{< /code-toggle >}} + +Access the entry with `site.Menus.main` in your templates. See [menu templates] for details. + +## Define in site configuration + +To define entries for the "main" menu: + +{{< code-toggle file=hugo >}} +[[menus.main]] +name = 'Home' +pageRef = '/' +weight = 10 + +[[menus.main]] +name = 'Products' +pageRef = '/products' +weight = 20 + +[[menus.main]] +name = 'Services' +pageRef = '/services' +weight = 30 +{{< /code-toggle >}} + +This creates a menu structure that you can access with `site.Menus.main` in your templates. See [menu templates] for details. + +To define entries for the "footer" menu: + +{{< code-toggle file=hugo >}} +[[menus.footer]] +name = 'Terms' +pageRef = '/terms' +weight = 10 + +[[menus.footer]] +name = 'Privacy' +pageRef = '/privacy' +weight = 20 +{{< /code-toggle >}} + +This creates a menu structure that you can access with `site.Menus.footer` in your templates. See [menu templates] for details. + +{{% note %}} +The configuration key in the examples above is `menus`. The `menu` (singular) configuration key is an alias for `menus`. +{{% /note %}} + +### Properties {#properties-site-configuration} + +{{% note %}} +The [properties available to entries defined in front matter] are also available to entries defined in site configuration. + +[properties available to entries defined in front matter]: /content-management/menus/#properties-front-matter +{{% /note %}} + +Each menu entry defined in site configuration requires two or more properties: + +- Specify `name` and `pageRef` for internal links +- Specify `name` and `url` for external links + +pageRef +: (`string`) The logical path of the target page, relative to the `content` directory. Omit language code and file extension. Required for *internal* links. + +Kind|pageRef +:--|:-- +home|`/` +page|`/books/book-1` +section|`/books` +taxonomy|`/tags` +term|`/tags/foo` + +url +: (`string`) Required for *external* links. + +### Example {#example-site-configuration} + +This nested menu demonstrates some of the available properties: + +{{< code-toggle file=hugo >}} +[[menus.main]] +name = 'Products' +pageRef = '/products' +weight = 10 + +[[menus.main]] +name = 'Hardware' +pageRef = '/products/hardware' +parent = 'Products' +weight = 1 + +[[menus.main]] +name = 'Software' +pageRef = '/products/software' +parent = 'Products' +weight = 2 + +[[menus.main]] +name = 'Services' +pageRef = '/services' +weight = 20 + +[[menus.main]] +name = 'Hugo' +pre = '' +url = 'https://gohugo.io/' +weight = 30 +[menus.main.params] +rel = 'external' +{{< /code-toggle >}} + +This creates a menu structure that you can access with `site.Menus.main` in your templates. See [menu templates] for details. + +## Localize + +Hugo provides two methods to localize your menu entries. See [multilingual]. + +## Render + +See [menu templates]. + +[localize]: /content-management/multilingual/#menus +[menu templates]: /templates/menu/ +[multilingual]: /content-management/multilingual/#menus - [section]: /getting-started/glossary/#section +[template]: /templates/menu/ diff --cc docs/content/en/content-management/multilingual.md index 165b2402e,000000000..b37fbf94a mode 100644,000000..100644 --- a/docs/content/en/content-management/multilingual.md +++ b/docs/content/en/content-management/multilingual.md @@@ -1,638 -1,0 +1,644 @@@ +--- +title: Multilingual mode +linkTitle: Multilingual +description: Localize your project for each language and region, including translations, images, dates, currencies, numbers, percentages, and collation sequence. Hugo's multilingual framework supports single-host and multihost configurations. +categories: [content management] +keywords: [multilingual,i18n,internationalization] +menu: + docs: + parent: content-management + weight: 230 +weight: 230 +toc: true +aliases: [/content/multilingual/,/tutorials/create-a-multilingual-site/] +--- + +## Configure languages + +This is the default language configuration: + +{{< code-toggle config=languages />}} + +In the above, `en` is the language key. + - +Language keys must conform to the syntax described in [RFC 5646]. For example: + +- `en` +- `en-US` + +Artificial languages with private use subtags as defined in [RFC 5646 § 2.2.7] are also supported. Omit the `art-x-` prefix from the language key. For example: + +- `hugolang` + +{{% note %}} +Private use subtags must not exceed 8 alphanumeric characters. +{{% /note %}} + +[RFC 5646]: https://datatracker.ietf.org/doc/html/rfc5646#section-2.1 +[RFC 5646 § 2.2.7]: https://datatracker.ietf.org/doc/html/rfc5646#section-2.2.7 + +This is an example of a site configuration for a multilingual project. Any key not defined in a `languages` object will fall back to the global value in the root of your site configuration. + +{{< code-toggle file=hugo >}} +defaultContentLanguage = 'de' +defaultContentLanguageInSubdir = true + +[languages.de] +contentDir = 'content/de' +disabled = false +languageCode = 'de-DE' +languageDirection = 'ltr' +languageName = 'Deutsch' +title = 'Projekt Dokumentation' +weight = 1 + +[languages.de.params] +subtitle = 'Referenz, Tutorials und Erklärungen' + +[languages.en] +contentDir = 'content/en' +disabled = false +languageCode = 'en-US' +languageDirection = 'ltr' +languageName = 'English' +title = 'Project Documentation' +weight = 2 + +[languages.en.params] +subtitle = 'Reference, Tutorials, and Explanations' +{{< /code-toggle >}} + +defaultContentLanguage +: (`string`) The project's default language key, conforming to the syntax described in [RFC 5646]. This value must match one of the defined language keys. Examples: + +- `en` +- `en-GB` +- `pt-BR` + +defaultContentLanguageInSubdir +: (`bool`) If `true`, Hugo renders the default language site in a subdirectory matching the `defaultContentLanguage`. Default is `false`. + +contentDir - : (`string`) The content directory for this language. Omit if [translating by file name]. ++: (`string`) The `content` directory for this language. Omit if [translating by file name]. + +disabled +: (`bool`) If `true`, Hugo will not render content for this language. Default is `false`. + +languageCode +: (`string`) The language tag as described in [RFC 5646]. This value does not affect localization or URLs. Hugo uses this value to populate the `language` element in the [built-in RSS template], and the `lang` attribute of the `html` element in the [built-in alias template]. Examples: + +- `en` +- `en-GB` +- `pt-BR` + +languageDirection +: (`string`) The language direction, either left-to-right (`ltr`) or right-to-left (`rtl`). Use this value in your templates with the global [`dir`] HTML attribute. + +languageName +: (`string`) The language name, typically used when rendering a language switcher. + +title +: (`string`) The site title for this language (optional). + +weight +: (`int`) The language weight. When set to a non-zero value, this is the primary sort criteria for this language. + +[`dir`]: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir +[built-in RSS template]: https://github.com/gohugoio/hugo/blob/master/tpl/tplimpl/embedded/templates/_default/rss.xml +[built-in alias template]: https://github.com/gohugoio/hugo/blob/master/tpl/tplimpl/embedded/templates/alias.html +[RFC 5646]: https://datatracker.ietf.org/doc/html/rfc5646#section-2.1 +[translating by file name]: #translation-by-file-name + - ### Changes in Hugo 0.112.0 - - {{< new-in 0.112.0 >}} ++### Site parameters + - In Hugo `v0.112.0` we consolidated all configuration options, and improved how the languages and their parameters are merged with the main configuration. But while testing this on Hugo sites out there, we received some error reports and reverted some of the changes in favor of deprecation warnings: - - 1. `site.Language.Params` is deprecated. Use `site.Params` directly. - 1. Adding custom parameters to the top level language configuration is deprecated. Define custom parameters within `languages.xx.params`. See `color` in the example below. ++Set language-specific site parameters under each language's `params` key: + +{{< code-toggle file=hugo >}} - - title = "My blog" - languageCode = "en-us" ++[params] ++color = "red" + +[languages] - [languages.sv] - title = "Min blogg" - languageCode = "sv" - [languages.en.params] - color = "blue" ++ [languages.de] ++ languageCode = 'de-DE' ++ title = 'Projekt Dokumentation' ++ weight = 1 ++ [languages.de.params] ++ color = 'blue' ++ subtitle = 'Referenz, Tutorials und Erklärungen' ++ [languages.en] ++ languageCode = 'en-US' ++ title = 'Project Documentation' ++ weight = 2 ++ [languages.en.params] ++ subtitle = 'Reference, Tutorials, and Explanations' +{{< /code-toggle >}} + - In the example above, all settings except `color` below `params` map to predefined configuration options in Hugo for the site and its language, and should be accessed via the documented accessors: ++When building the English site: ++ ++```go-html-template ++{{ site.Params.color }} --> red ++{{ site.Params.subtitle }} --> Reference, Tutorials, and Explanations ++``` ++ ++When building the English site: + +```go-html-template - {{ site.Title }} - {{ site.Language.LanguageCode }} - {{ site.Params.color }} ++{{ site.Params.color }} --> blue ++{{ site.Params.subtitle }} --> 'Referenz, Tutorials und Erklärungen' +``` + +### Disable a language + +To disable a language within a `languages` object in your site configuration: + +{{< code-toggle file=hugo >}} +[languages.es] +disabled = true +{{< /code-toggle >}} + +To disable one or more languages in the root of your site configuration: + +{{< code-toggle file=hugo >}} +disableLanguages = ["es", "fr"] +{{< /code-toggle >}} + +To disable one or more languages using an environment variable: + +```sh +HUGO_DISABLELANGUAGES="es fr" hugo +``` + +Note that you cannot disable the default content language. + +### Configure multilingual multihost + - +Hugo supports multiple languages in a multihost configuration. This means you can configure a `baseURL` per `language`. + +{{% note %}} +If a `baseURL` is set on the `language` level, then all languages must have one and they must all be different. +{{% /note %}} + +Example: + +{{< code-toggle file=hugo >}} +[languages] + [languages.en] + baseURL = 'https://en.example.org/' + languageName = 'English' + title = 'In English' + weight = 2 + [languages.fr] + baseURL = 'https://fr.example.org' + languageName = 'Français' + title = 'En Français' + weight = 1 +{{}} + +With the above, the two sites will be generated into `public` with their own root: + +```text +public +├── en +└── fr +``` + +**All URLs (i.e `.Permalink` etc.) will be generated from that root. So the English home page above will have its `.Permalink` set to `https://example.org/`.** + +When you run `hugo server` we will start multiple HTTP servers. You will typically see something like this in the console: + +```text +Web Server is available at 127.0.0.1:1313 (bind address 127.0.0.1) fr +Web Server is available at 127.0.0.1:1314 (bind address 127.0.0.1) en +Press Ctrl+C to stop +``` + +Live reload and `--navigateToChanged` between the servers work as expected. + +## Translate your content + +There are two ways to manage your content translations. Both ensure each page is assigned a language and is linked to its counterpart translations. + +### Translation by file name + +Considering the following example: + +1. `/content/about.en.md` - 2. `/content/about.fr.md` ++1. `/content/about.fr.md` + +The first file is assigned the English language and is linked to the second. +The second file is assigned the French language and is linked to the first. + +Their language is __assigned__ according to the language code added as a __suffix to the file name__. + +By having the same **path and base file name**, the content pieces are __linked__ together as translated pages. + +{{% note %}} +If a file has no language code, it will be assigned the default language. +{{% /note %}} + +### Translation by content directory + - This system uses different content directories for each of the languages. Each language's content directory is set using the `contentDir` parameter. ++This system uses different content directories for each of the languages. Each language's `content` directory is set using the `contentDir` parameter. + +{{< code-toggle file=hugo >}} +languages: + en: + weight: 10 + languageName: "English" + contentDir: "content/english" + fr: + weight: 20 + languageName: "Français" + contentDir: "content/french" +{{< /code-toggle >}} + +The value of `contentDir` can be any valid path -- even absolute path references. The only restriction is that the content directories cannot overlap. + +Considering the following example in conjunction with the configuration above: + +1. `/content/english/about.md` - 2. `/content/french/about.md` ++1. `/content/french/about.md` + +The first file is assigned the English language and is linked to the second. +The second file is assigned the French language and is linked to the first. + - Their language is __assigned__ according to the content directory they are __placed__ in. ++Their language is __assigned__ according to the `content` directory they are __placed__ in. + - By having the same **path and basename** (relative to their language content directory), the content pieces are __linked__ together as translated pages. ++By having the same **path and basename** (relative to their language `content` directory), the content pieces are __linked__ together as translated pages. + +### Bypassing default linking + +Any pages sharing the same `translationKey` set in front matter will be linked as translated pages regardless of basename or location. + +Considering the following example: + +1. `/content/about-us.en.md` - 2. `/content/om.nn.md` - 3. `/content/presentation/a-propos.fr.md` ++1. `/content/om.nn.md` ++1. `/content/presentation/a-propos.fr.md` + +{{< code-toggle >}} +translationKey: "about" +{{< /code-toggle >}} + +By setting the `translationKey` front matter parameter to `about` in all three pages, they will be __linked__ as translated pages. + +### Localizing permalinks + +Because paths and file names are used to handle linking, all translated pages will share the same URL (apart from the language subdirectory). + +To localize URLs: + +- For a regular page, set either [`slug`] or [`url`] in front matter +- For a section page, set [`url`] in front matter + +[`slug`]: /content-management/urls/#slug +[`url`]: /content-management/urls/#url + +For example, a French translation can have its own localized slug. + +{{< code-toggle file=content/about.fr.md fm=true >}} +title: A Propos +slug: "a-propos" +{{< /code-toggle >}} + +At render, Hugo will build both `/about/` and `/fr/a-propos/` without affecting the translation link. + +### Page bundles + +To avoid the burden of having to duplicate files, each Page Bundle inherits the resources of its linked translated pages' bundles except for the content files (Markdown files, HTML files etc...). + +Therefore, from within a template, the page will have access to the files from all linked pages' bundles. + +If, across the linked bundles, two or more files share the same basename, only one will be included and chosen as follows: + +* File from current language bundle, if present. +* First file found across bundles by order of language `Weight`. + +{{% note %}} +Page Bundle resources follow the same language assignment logic as content files, both by file name (`image.jpg`, `image.fr.jpg`) and by directory (`english/about/header.jpg`, `french/about/header.jpg`). +{{%/ note %}} + +## Reference translated content + +To create a list of links to translated content, use a template similar to the following: + +{{< code file=layouts/partials/i18nlist.html >}} +{{ if .IsTranslated }} +

{{ i18n "translations" }}

+ +{{ end }} +{{< /code >}} + +The above can be put in a `partial` (i.e., inside `layouts/partials/`) and included in any template. It will not print anything if there are no translations for a given page. + +The above also uses the [`i18n` function][i18func] described in the next section. + +### List all available languages + +`.AllTranslations` on a `Page` can be used to list all translations, including the page itself. On the home page it can be used to build a language navigator: + +{{< code file=layouts/partials/allLanguages.html >}} + +{{< /code >}} + +## Translation of strings + +See the [`lang.Translate`] template function. + +[`lang.Translate`]: /functions/lang/translate + +## Localization + +The following localization examples assume your site's primary language is English, with translations to French and German. + +{{< code-toggle file=hugo >}} +defaultContentLanguage = 'en' + +[languages] +[languages.en] +contentDir = 'content/en' +languageName = 'English' +weight = 1 +[languages.fr] +contentDir = 'content/fr' +languageName = 'Français' +weight = 2 +[languages.de] +contentDir = 'content/de' +languageName = 'Deutsch' +weight = 3 + +{{< /code-toggle >}} + +### Dates + +With this front matter: + +{{< code-toggle >}} +date = 2021-11-03T12:34:56+01:00 +{{< /code-toggle >}} + +And this template code: + +```go-html-template +{{ .Date | time.Format ":date_full" }} +``` + +The rendered page displays: + +Language|Value +:--|:-- +English|Wednesday, November 3, 2021 +Français|mercredi 3 novembre 2021 +Deutsch|Mittwoch, 3. November 2021 + +See [`time.Format`] for details. + +### Currency + +With this template code: + +```go-html-template +{{ 512.5032 | lang.FormatCurrency 2 "USD" }} +``` + +The rendered page displays: + +Language|Value +:--|:-- +English|$512.50 +Français|512,50 $US +Deutsch|512,50 $ + +See [lang.FormatCurrency] and [lang.FormatAccounting] for details. + +### Numbers + +With this template code: + +```go-html-template +{{ 512.5032 | lang.FormatNumber 2 }} +``` + +The rendered page displays: + +Language|Value +:--|:-- +English|512.50 +Français|512,50 +Deutsch|512,50 + +See [lang.FormatNumber] and [lang.FormatNumberCustom] for details. + +### Percentages + +With this template code: + +```go-html-template +{{ 512.5032 | lang.FormatPercent 2 }} +``` + +The rendered page displays: + +Language|Value +:--|:-- +English|512.50% +Français|512,50 % +Deutsch|512,50 % + +See [lang.FormatPercent] for details. + +## Menus + +Localization of menu entries depends on how you define them: + +- When you define menu entries [automatically] using the section pages menu, you must use translation tables to localize each entry. +- When you define menu entries [in front matter], they are already localized based on the front matter itself. If the front matter values are insufficient, use translation tables to localize each entry. +- When you define menu entries [in site configuration], you must create language-specific menu entries under each language key. If the names of the menu entries are insufficient, use translation tables to localize each entry. + +### Create language-specific menu entries + +#### Method 1 -- Use a single configuration file + +For a simple menu with a small number of entries, use a single configuration file. For example: + +{{< code-toggle file=hugo >}} +[languages.de] +languageCode = 'de-DE' +languageName = 'Deutsch' +weight = 1 + +[[languages.de.menus.main]] +name = 'Produkte' +pageRef = '/products' +weight = 10 + +[[languages.de.menus.main]] +name = 'Leistungen' +pageRef = '/services' +weight = 20 + +[languages.en] +languageCode = 'en-US' +languageName = 'English' +weight = 2 + +[[languages.en.menus.main]] +name = 'Products' +pageRef = '/products' +weight = 10 + +[[languages.en.menus.main]] +name = 'Services' +pageRef = '/services' +weight = 20 +{{< /code-toggle >}} + +#### Method 2 -- Use a configuration directory + +With a more complex menu structure, create a [configuration directory] and split the menu entries into multiple files, one file per language. For example: + +```text +config/ +└── _default/ + ├── menus.de.toml + ├── menus.en.toml + └── hugo.toml +``` + +{{< code-toggle file=config/_default/menus.de >}} +[[main]] +name = 'Produkte' +pageRef = '/products' +weight = 10 +[[main]] +name = 'Leistungen' +pageRef = '/services' +weight = 20 +{{< /code-toggle >}} + +{{< code-toggle file=config/_default/menus.en >}} +[[main]] +name = 'Products' +pageRef = '/products' +weight = 10 +[[main]] +name = 'Services' +pageRef = '/services' +weight = 20 +{{< /code-toggle >}} + +[configuration directory]: /getting-started/configuration/#configuration-directory + +### Use translation tables + +When rendering the text that appears in menu each entry, the [example menu template] does this: + +```go-html-template +{{ or (T .Identifier) .Name | safeHTML }} +``` + +It queries the translation table for the current language using the menu entry's `identifier` and returns the translated string. If the translation table does not exist, or if the `identifier` key is not present in the translation table, it falls back to `name`. + +The `identifier` depends on how you define menu entries: + +- If you define the menu entry [automatically] using the section pages menu, the `identifier` is the page's `.Section`. +- If you define the menu entry [in site configuration] or [in front matter], set the `identifier` property to the desired value. + +For example, if you define menu entries in site configuration: + +{{< code-toggle file=hugo >}} +[[menus.main]] + identifier = 'products' + name = 'Products' + pageRef = '/products' + weight = 10 +[[menus.main]] + identifier = 'services' + name = 'Services' + pageRef = '/services' + weight = 20 +{{< / code-toggle >}} + +Create corresponding entries in the translation tables: + +{{< code-toggle file=i18n/de >}} +products = 'Produkte' +services = 'Leistungen' +{{< / code-toggle >}} + +[example menu template]: /templates/menu/#example +[automatically]: /content-management/menus/#define-automatically +[in front matter]: /content-management/menus/#define-in-front-matter +[in site configuration]: /content-management/menus/#define-in-site-configuration + +## Missing translations + +If a string does not have a translation for the current language, Hugo will use the value from the default language. If no default value is set, an empty string will be shown. + +While translating a Hugo website, it can be handy to have a visual indicator of missing translations. The [`enableMissingTranslationPlaceholders` configuration option][config] will flag all untranslated strings with the placeholder `[i18n] identifier`, where `identifier` is the id of the missing translation. + +{{% note %}} +Hugo will generate your website with these missing translation placeholders. It might not be suitable for production environments. +{{% /note %}} + +For merging of content from other languages (i.e. missing content translations), see [lang.Merge]. + +To track down missing translation strings, run Hugo with the `--printI18nWarnings` flag: + +```sh +hugo --printI18nWarnings | grep i18n +i18n|MISSING_TRANSLATION|en|wordCount +``` + +## Multilingual themes support + +To support Multilingual mode in your themes, some considerations must be taken for the URLs in the templates. If there is more than one language, URLs must meet the following criteria: + +* Come from the built-in `.Permalink` or `.RelPermalink` +* Be constructed with the [`relLangURL`] or [`absLangURL`] template function, or be prefixed with `{{ .LanguagePrefix }}` + +If there is more than one language defined, the `LanguagePrefix` method will return `/en` (or whatever the current language is). If not enabled, it will be an empty string (and is therefore harmless for single-language Hugo websites). + +## Generate multilingual content with `hugo new content` + +If you organize content with translations in the same directory: + +```sh +hugo new content post/test.en.md +hugo new content post/test.de.md +``` + +If you organize content with translations in different directories: + +```sh +hugo new content content/en/post/test.md +hugo new content content/de/post/test.md +``` + +[`abslangurl`]: /functions/urls/abslangurl/ +[config]: /getting-started/configuration/ +[go-i18n-source]: https://github.com/nicksnyder/go-i18n +[go-i18n]: https://github.com/nicksnyder/go-i18n +[Hugo Multilingual Part 1: Content translation]: https://regisphilibert.com/blog/2018/08/hugo-multilingual-part-1-managing-content-translation/ +[i18func]: /functions/lang/translate/ +[lang.FormatAccounting]: /functions/lang/formataccounting/ +[lang.FormatCurrency]: /functions/lang/formatcurrency/ +[lang.FormatNumber]: /functions/lang/formatnumber/ +[lang.FormatNumberCustom]: /functions/lang/formatnumbercustom/ +[lang.FormatPercent]: /functions/lang/formatpercent/ +[lang.Merge]: /functions/lang/merge/ +[menus]: /content-management/menus/ +[OS environment]: /getting-started/configuration/#configure-with-environment-variables +[`rellangurl`]: /functions/urls/rellangurl/ +[`time.Format`]: /functions/time/format/ diff --cc docs/content/en/content-management/page-bundles.md index b83bb0ba5,000000000..3c5b3054b mode 100644,000000..100644 --- a/docs/content/en/content-management/page-bundles.md +++ b/docs/content/en/content-management/page-bundles.md @@@ -1,161 -1,0 +1,155 @@@ +--- +title: Page bundles +description: Use page bundles to logically associate one or more resources with content. +categories: [content management] +keywords: [page,bundle,leaf,branch] +menu : + docs: + parent: content-management + weight: 30 +weight: 30 +toc: true +--- + +## Introduction + +A page bundle is a directory that encapsulates both content and associated resources. + +By way of example, this site has an "about" page and a "privacy" page: + +```text +content/ +├── about/ +│ ├── index.md +│ └── welcome.jpg +└── privacy.md +``` + +The "about" page is a page bundle. It logically associates a resource with content by bundling them together. Resources within a page bundle are [page resources], accessible with the [`Resources`] method on the `Page` object. + +Page bundles are either _leaf bundles_ or _branch bundles_. + +leaf bundle - : A _leaf bundle_ is a directory that contains an index.md file and zero or more resources. Analogous to a physical leaf, a leaf bundle is at the end of a branch. It has no descendants. ++: A _leaf bundle_ is a directory that contains an `index.md` file and zero or more resources. Analogous to a physical leaf, a leaf bundle is at the end of a branch. It has no descendants. + +branch bundle - : A _branch bundle_ is a directory that contains an _index.md file and zero or more resources. Analogous to a physical branch, a branch bundle may have descendants including leaf bundles and other branch bundles. Top level directories with or without _index.md files are also branch bundles. This includes the home page. ++: A _branch bundle_ is a directory that contains an `_index.md` file and zero or more resources. Analogous to a physical branch, a branch bundle may have descendants including leaf bundles and other branch bundles. Top level directories with or without `_index.md` files are also branch bundles. This includes the home page. + +{{% note %}} - In the definitions above and the examples below, the extension of the index file depends on the [content format]. For example, use index.md for Markdown content, index.html for HTML content, index.adoc for AsciiDoc content, etc. - - [content format]: /getting-started/glossary/#content-format ++In the definitions above and the examples below, the extension of the index file depends on the [content format](g). For example, use `index.md` for Markdown content, `index.html` for HTML content, `index.adoc` for AsciiDoc content, etc. +{{% /note %}} + +## Comparison + +Page bundle characteristics vary by bundle type. + +| | Leaf bundle | Branch bundle | +|---------------------|---------------------------------------------------------|---------------------------------------------------------| - | Index file | index.md | _index.md | - | Example | content/about/index.md | content/posts/_index.md | - | [Page kinds] | `page` | `home`, `section`, `taxonomy`, or `term` | - | Template types | [single] | [home], [section], [taxonomy], or [term] | ++| Index file | `index.md` | `_index.md` | ++| Example | `content/about/index.md` | `content/posts/_index.md ` | ++| [Page kinds](g) | `page` | `home`, `section`, `taxonomy`, or `term` | ++| Template types | [single] | [home], [section], [taxonomy], or [term] | +| Descendant pages | None | Zero or more | +| Resource location | Adjacent to the index file or in a nested subdirectory | Same as a leaf bundles, but excludes descendant bundles | - | [Resource types] | `page`, `image`, `video`, etc. | all but `page` | ++| [Resource types](g) | `page`, `image`, `video`, etc. | all but `page` | + +[single]: /templates/types/#single +[home]: /templates/types/#home +[section]: /templates/types/#section +[taxonomy]: /templates/types/#taxonomy +[term]: /templates/types/#term + - Files with [resource type] `page` include content written in Markdown, HTML, AsciiDoc, Pandoc, reStructuredText, and Emacs Org Mode. In a leaf bundle, excluding the index file, these files are only accessible as page resources. In a branch bundle, these files are only accessible as content pages. ++Files with [resource type](g) `page` include content written in Markdown, HTML, AsciiDoc, Pandoc, reStructuredText, and Emacs Org Mode. In a leaf bundle, excluding the index file, these files are only accessible as page resources. In a branch bundle, these files are only accessible as content pages. + +## Leaf bundles + - A _leaf bundle_ is a directory that contains an index.md file and zero or more resources. Analogous to a physical leaf, a leaf bundle is at the end of a branch. It has no descendants. ++A _leaf bundle_ is a directory that contains an `index.md` file and zero or more resources. Analogous to a physical leaf, a leaf bundle is at the end of a branch. It has no descendants. + +```text +content/ +├── about +│ └── index.md +├── posts +│ ├── my-post +│ │ ├── content-1.md +│ │ ├── content-2.md +│ │ ├── image-1.jpg +│ │ ├── image-2.png +│ │ └── index.md +│ └── my-other-post +│ └── index.md +└── another-section + ├── foo.md + └── not-a-leaf-bundle + ├── bar.md + └── another-leaf-bundle + └── index.md +``` + +There are four leaf bundles in the example above: + +about +: This leaf bundle does not contain any page resources. + +my-post - : This leaf bundle contains an index file, two resources of [resource type] `page`, and two resources of resource type `image`. ++: This leaf bundle contains an index file, two resources of [resource type](g) `page`, and two resources of resource type `image`. + +- content-1, content-2 + + These are resources of resource type `page`, accessible via the [`Resources`] method on the `Page` object. Hugo will not render these as individual pages. + +- image-1, image-2 + + These are resources of resource type `image`, accessible via the `Resources` method on the `Page` object + +my-other-post +: This leaf bundle does not contain any page resources. + +another-leaf-bundle +: This leaf bundle does not contain any page resources. + +{{% note %}} - Create leaf bundles at any depth within the content directory, but a leaf bundle may not contain another bundle. Leaf bundles do not have descendants. ++Create leaf bundles at any depth within the `content` directory, but a leaf bundle may not contain another bundle. Leaf bundles do not have descendants. +{{% /note %}} + +## Branch bundles + - A _branch bundle_ is a directory that contains an _index.md file and zero or more resources. Analogous to a physical branch, a branch bundle may have descendants including leaf bundles and other branch bundles. Top level directories with or without _index.md files are also branch bundles. This includes the home page. ++A _branch bundle_ is a directory that contains an `_index.md` file and zero or more resources. Analogous to a physical branch, a branch bundle may have descendants including leaf bundles and other branch bundles. Top level directories with or without `_index.md` files are also branch bundles. This includes the home page. + +```text +content/ +├── branch-bundle-1/ +│ ├── _index.md +│ ├── content-1.md +│ ├── content-2.md +│ ├── image-1.jpg +│ └── image-2.png +├── branch-bundle-2/ +│ ├── a-leaf-bundle/ +│ │ └── index.md +│ └── _index.md +└── _index.md +``` + +There are three branch bundles in the example above: + +home page +: This branch bundle contains an index file, two descendant branch bundles, and no resources. + +branch-bundle-1 - : This branch bundle contains an index file, two resources of [resource type] `page`, and two resources of resource type `image`. ++: This branch bundle contains an index file, two resources of [resource type](g) `page`, and two resources of resource type `image`. + +branch-bundle-2 +: This branch bundle contains an index file and a leaf bundle. + +{{% note %}} - Create branch bundles at any depth within the content directory, but a leaf bundle may not contain another bundle. Leaf bundles do not have descendants. ++Create branch bundles at any depth within the `content` directory, but a leaf bundle may not contain another bundle. Leaf bundles do not have descendants. +{{% /note %}} + - +## Headless bundles + +Use [build options] in front matter to create an unpublished leaf or branch bundle whose content and resources you can include in other pages. + +[`Resources`]: /methods/page/resources/ - [build options]: content-management/build-options/ - [page kinds]: /getting-started/glossary/#page-kind ++[build options]: /content-management/build-options/ +[page resources]: /content-management/page-resources/ - [resource type]: /getting-started/glossary/#resource-type - [resource types]: /getting-started/glossary/#resource-type diff --cc docs/content/en/content-management/related.md index 44b115a64,000000000..6431d12a3 mode 100644,000000..100644 --- a/docs/content/en/content-management/related.md +++ b/docs/content/en/content-management/related.md @@@ -1,178 -1,0 +1,156 @@@ +--- +title: Related content +description: List related content in "See Also" sections. +categories: [content management] +keywords: [content] +menu: + docs: + parent: content-management + weight: 110 +weight: 110 +toc: true +aliases: [/content/related/,/related/] +--- + +Hugo uses a set of factors to identify a page's related content based on front matter parameters. This can be tuned to the desired set of indices and parameters or left to Hugo's default [Related Content configuration](#configure-related-content). + +## List related content + +To list up to 5 related pages (which share the same _date_ or _keyword_ parameters) is as simple as including something similar to this partial in your template: + +{{< code file=layouts/partials/related.html >}} +{{ $related := .Site.RegularPages.Related . | first 5 }} +{{ with $related }} +

See Also

+ +{{ end }} +{{< /code >}} + +The `Related` method takes one argument which may be a `Page` or a options map. The options map have these options: + +indices +: (`slice`) The indices to search within. + +document +: (`page`) The page for which to find related content. Required when specifying an options map. + +namedSlices +: (`slice`) The keywords to search for, expressed as a slice of `KeyValues` using the [`keyVals`] function. + +fragments - : (`slice`) A list of special keywords that is used for indices configured as type "fragments". This will match the [fragment] identifiers of the documents. ++: (`slice`) A list of special keywords that is used for indices configured as type "fragments". This will match the [fragment](g) identifiers of the documents. + - [fragment]: /getting-started/glossary/#fragment +[`keyVals`]: /functions/collections/keyvals/ + +A fictional example using all of the above options: + +```go-html-template +{{ $page := . }} +{{ $opts := dict + "indices" (slice "tags" "keywords") + "document" $page + "namedSlices" (slice (keyVals "tags" "hugo" "rocks") (keyVals "date" $page.Date)) + "fragments" (slice "heading-1" "heading-2") +}} +``` + +{{% note %}} +We improved and simplified this feature in Hugo 0.111.0. Before this we had 3 different methods: `Related`, `RelatedTo` and `RelatedIndices`. Now we have only one method: `Related`. The old methods are still available but deprecated. Also see [this blog article](https://regisphilibert.com/blog/2018/04/hugo-optmized-relashionships-with-related-content/) for a great explanation of more advanced usage of this feature. +{{% /note %}} + +## Index content headings in related content + - {{< new-in 0.111.0 >}} - +Hugo can index the headings in your content and use this to find related content. You can enable this by adding a index of type `fragments` to your `related` configuration: + +{{< code-toggle file=hugo >}} +[related] +threshold = 20 +includeNewer = true +toLower = false +[[related.indices]] +name = "fragmentrefs" +type = "fragments" +applyFilter = true +weight = 80 +{{< /code-toggle >}} + +* The `name` maps to a optional front matter slice attribute that can be used to link from the page level down to the fragment/heading level. - * If `applyFilter`is enabled, the `.HeadingsFiltered` on each page in the result will reflect the filtered headings. This is useful if you want to show the headings in the related content listing: ++* If `applyFilter` is enabled, the `.HeadingsFiltered` on each page in the result will reflect the filtered headings. This is useful if you want to show the headings in the related content listing: + +```go-html-template +{{ $related := .Site.RegularPages.Related . | first 5 }} +{{ with $related }} +

See Also

+
    + {{ range $i, $p := . }} +
  • + {{ .LinkTitle }} + {{ with .HeadingsFiltered }} +
      + {{ range . }} + {{ $link := printf "%s#%s" $p.RelPermalink .ID | safeURL }} +
    • + {{ .Title }} +
      • + {{ end }} +
    + {{ end }} +
    • + {{ end }} +
+{{ end }} +``` + +## Configure related content + +Hugo provides a sensible default configuration of Related Content, but you can fine-tune this in your configuration, on the global or language level if needed. + +### Default configuration + +Without any `related` configuration set on the project, Hugo's Related Content methods will use the following. + +{{< code-toggle config=related />}} + +Custom configuration should be set using the same syntax. + +{{% note %}} +If you add a `related` configuration section, you need to add a complete configuration. It is not possible to just set, say, `includeNewer` and use the rest from the Hugo defaults. +{{% /note %}} + +### Top level configuration options + +threshold +: (`int`) A value between 0-100. Lower value will give more, but maybe not so relevant, matches. + +includeNewer +: (`bool`) Set to `true` to include **pages newer than the current page** in the related content listing. This will mean that the output for older posts may change as new related content gets added. + +toLower +: (`bool`) Set to `true` to lower case keywords in both the indexes and the queries. This may give more accurate results at a slight performance penalty. Note that this can also be set per index. + +### Configuration options per index + +name +: (`string`) The index name. This value maps directly to a page parameter. Hugo supports string values (`author` in the example) and lists (`tags`, `keywords` etc.) and time and date objects. + - type {{< new-in 0.111.0 >}} ++type +: (`string`) One of `basic`(default) or `fragments`. + - applyFilter {{< new-in 0.111.0 >}} ++applyFilter +: (`string`) Apply a `type` specific filter to the result of a search. This is currently only used for the `fragments` type. + +weight +: (`int`) An integer weight that indicates _how important_ this parameter is relative to the other parameters. It can be `0`, which has the effect of turning this index off, or even negative. Test with different values to see what fits your content best. + - cardinalityThreshold {{< new-in 0.111.0 >}} ++cardinalityThreshold +: (`int`) If between 1 and 100, this is a percentage. All keywords that are used in more than this percentage of documents are removed. For example, setting this to `60` will remove all keywords that are used in more than 60% of the documents in the index. If `0`, no keyword is removed from the index. Default is `0`. + +pattern +: (`string`) This is currently only relevant for dates. When listing related content, we may want to list content that is also close in time. Setting "2006" (default value for date indexes) as the pattern for a date index will add weight to pages published in the same year. For busier blogs, "200601" (year and month) may be a better default. + +toLower +: (`bool`) See above. - - ## Performance considerations - - **Fast is Hugo's middle name** and we would not have released this feature had it not been blistering fast. - - This feature has been in the back log and requested by many for a long time. The development got this recent kick start from this Twitter thread: - - {{< tweet user="scott_lowe" id="898398437527363585" >}} - - Scott S. Lowe removed the "Related Content" section built using the `intersect` template function on tags, and the build time dropped from 30 seconds to less than 2 seconds on his 1700 content page sized blog. - - He should now be able to add an improved version of that "Related Content" section without giving up the fast live-reloads. But it's worth noting that: - - * If you don't use any of the `Related` methods, you will not use the Relate Content feature, and performance will be the same as before. - * Calling `.RegularPages.Related` etc. will create one inverted index, also sometimes named posting list, that will be reused for any lookups in that same page collection. Doing that in addition to, as an example, calling `.Pages.Related` will work as expected, but will create one additional inverted index. This should still be very fast, but worth having in mind, especially for bigger sites. - - {{% note %}} - We currently do not index **Page content**. We thought we would release something that will make most people happy before we start solving [Sherlock's last case](https://github.com/joearms/sherlock). - {{% /note %}} diff --cc docs/content/en/content-management/sections.md index 03655c90a,000000000..c7954aade mode 100644,000000..100644 --- a/docs/content/en/content-management/sections.md +++ b/docs/content/en/content-management/sections.md @@@ -1,164 -1,0 +1,164 @@@ +--- +title: Sections +description: Organize content into sections. + +categories: [content management] +keywords: [lists,sections,content types,organization] +menu: + docs: + parent: content-management + weight: 120 +weight: 120 +toc: true +aliases: [/content/sections/] +--- + +## Overview + - A section is a top-level content directory, or any content directory with an _index.md file. A content directory with an _index.md file is also known as a [branch bundle](/getting-started/glossary/#branch-bundle). Section templates receive one or more page [collections](/getting-started/glossary/#collection) in [context](/getting-started/glossary/#context). ++A section is a top-level content directory, or any content directory with an `_index.md` file. A content directory with an `_index.md` file is also known as a [branch bundle](g). Section templates receive one or more page [collections](g) in [context](g). + +{{% note %}} - Although top-level directories without _index.md files are sections, we recommend creating _index.md files in _all_ sections. ++Although top-level directories without `_index.md` files are sections, we recommend creating `_index.md` files in _all_ sections. +{{% /note %}} + +A typical site consists of one or more sections. For example: + +```text +content/ +├── articles/ <-- section (top-level directory) +│ ├── 2022/ +│ │ ├── article-1/ +│ │ │ ├── cover.jpg +│ │ │ └── index.md +│ │ └── article-2.md +│ └── 2023/ +│ ├── article-3.md +│ └── article-4.md +├── products/ <-- section (top-level directory) +│ ├── product-1/ <-- section (has _index.md file) +│ │ ├── benefits/ <-- section (has _index.md file) +│ │ │ ├── _index.md +│ │ │ ├── benefit-1.md +│ │ │ └── benefit-2.md +│ │ ├── features/ <-- section (has _index.md file) +│ │ │ ├── _index.md +│ │ │ ├── feature-1.md +│ │ │ └── feature-2.md +│ │ └── _index.md +│ └── product-2/ <-- section (has _index.md file) +│ ├── benefits/ <-- section (has _index.md file) +│ │ ├── _index.md +│ │ ├── benefit-1.md +│ │ └── benefit-2.md +│ ├── features/ <-- section (has _index.md file) +│ │ ├── _index.md +│ │ ├── feature-1.md +│ │ └── feature-2.md +│ └── _index.md +├── _index.md +└── about.md +``` + +The example above has two top-level sections: articles and products. None of the directories under articles are sections, while all of the directories under products are sections. A section within a section is a known as a nested section or subsection. + +## Explanation + +Sections and non-sections behave differently. + +||Sections|Non-sections +:--|:-:|:-: +Directory names become URL segments|:heavy_check_mark:|:heavy_check_mark: +Have logical ancestors and descendants|:heavy_check_mark:|:x: +Have list pages|:heavy_check_mark:|:x: + +With the file structure from the [example above](#overview): + +1. The list page for the articles section includes all articles, regardless of directory structure; none of the subdirectories are sections. + +1. The articles/2022 and articles/2023 directories do not have list pages; they are not sections. + +1. The list page for the products section, by default, includes product-1 and product-2, but not their descendant pages. To include descendant pages, use the `RegularPagesRecursive` method instead of the `Pages` method in the list template. + +[`Pages`]: /methods/page/pages/ +[`RegularPagesRecursive`]: /methods/page/regularpagesrecursive/ + +1. All directories in the products section have list pages; each directory is a section. + +## Template selection + +Hugo has a defined [lookup order] to determine which template to use when rendering a page. The [lookup rules] consider the top-level section name; subsection names are not considered when selecting a template. + +With the file structure from the [example above](#overview): + +Content directory|Section template +:--|:-- - content/products|layouts/products/list.html - content/products/product-1|layouts/products/list.html - content/products/product-1/benefits|layouts/products/list.html ++`content/products`|`layouts/products/list.html` ++`content/products/product-1`|`layouts/products/list.html` ++`content/products/product-1/benefits`|`layouts/products/list.html` + +Content directory|Single template +:--|:-- - content/products|layouts/products/single.html - content/products/product-1|layouts/products/single.html - content/products/product-1/benefits|layouts/products/single.html ++`content/products`|`layouts/products/single.html` ++`content/products/product-1`|`layouts/products/single.html` ++`content/products/product-1/benefits`|`layouts/products/single.html` + +If you need to use a different template for a subsection, specify `type` and/or `layout` in front matter. + +[lookup rules]: /templates/lookup-order/#lookup-rules +[lookup order]: /templates/lookup-order/ + +## Ancestors and descendants + +A section has one or more ancestors (including the home page), and zero or more descendants. With the file structure from the [example above](#overview): + +```text +content/products/product-1/benefits/benefit-1.md +``` + +The content file (benefit-1.md) has four ancestors: benefits, product-1, products, and the home page. This logical relationship allows us to use the `.Parent` and `.Ancestors` methods to traverse the site structure. + +For example, use the `.Ancestors` method to render breadcrumb navigation. + +{{< code file=layouts/partials/breadcrumb.html >}} + +{{< /code >}} + +With this CSS: + +```css +.breadcrumb ol { + padding-left: 0; +} + +.breadcrumb li { + display: inline; +} + +.breadcrumb li:not(:last-child)::after { + content: "»"; +} +``` + +Hugo renders this, where each breadcrumb is a link to the corresponding page: + +```text +Home » Products » Product 1 » Benefits » Benefit 1 +``` + +[archetype]: /content-management/archetypes/ +[content type]: /content-management/types/ +[directory structure]: /getting-started/directory-structure/ +[section templates]: /templates/types/#section +[leaf bundles]: /content-management/page-bundles/#leaf-bundles +[branch bundles]: /content-management/page-bundles/#branch-bundles diff --cc docs/content/en/content-management/shortcodes.md index afe84e79b,000000000..cd1f2cb43 mode 100644,000000..100644 --- a/docs/content/en/content-management/shortcodes.md +++ b/docs/content/en/content-management/shortcodes.md @@@ -1,641 -1,0 +1,91 @@@ +--- +title: Shortcodes +description: Shortcodes are simple snippets inside your content files calling built-in or custom templates. +categories: [content management] +keywords: [markdown,content,shortcodes] +menu: + docs: + parent: content-management + weight: 100 +weight: 100 +toc: true +aliases: [/extras/shortcodes/] +testparam: "Hugo Rocks!" +--- + +## What a shortcode is + +Hugo loves Markdown because of its simple content format, but there are times when Markdown falls short. Often, content authors are forced to add raw HTML (e.g., video ` + +{{< /code >}} + +{{< code file=youtube-embed.html >}} +
+ +
+{{< /code >}} + +### Single named example: `image` + +Let's say you want to create your own `img` shortcode rather than use Hugo's built-in [`figure` shortcode][figure]. Your goal is to be able to call the shortcode as follows in your content files: + +{{< code file=content-image.md >}} +{{}} +{{< /code >}} + +You have created the shortcode at `/layouts/shortcodes/img.html`, which loads the following shortcode template: + +{{< code file=layouts/shortcodes/img.html >}} + +
+ {{ with .Get "link" }}{{ end }} + + {{ if .Get "link" }}{{ end }} + {{ if or (or (.Get "title") (.Get "caption")) (.Get "attr") }} +
{{ if isset .Params "title" }} +

{{ .Get "title" }}

{{ end }} + {{ if or (.Get "caption") (.Get "attr") }}

+ {{ .Get "caption" }} + {{ with .Get "attrlink" }} {{ end }} + {{ .Get "attr" }} + {{ if .Get "attrlink" }} {{ end }} +

{{ end }} +
+ {{ end }} +
+ +{{< /code >}} + +Would be rendered as: + +{{< code file=img-output.html >}} +
+ +
+

Steve Francia

+
+
+{{< /code >}} + +### Single flexible example: `vimeo` + +```go-html-template +{{}} +{{}} +``` + +Would load the template found at `/layouts/shortcodes/vimeo.html`: + +{{< code file=layouts/shortcodes/vimeo.html >}} +{{ if .IsNamedParams }} +
+ +
+{{ else }} +
+ +
+{{ end }} +{{< /code >}} + +Would be rendered as: + +{{< code file=vimeo-iframes.html >}} +
+ +
+
+ +
+{{< /code >}} + +### Paired example: `highlight` + +The following is taken from `highlight`, which is a [built-in shortcode] that ships with Hugo. + +{{< code file=highlight-example.md >}} +{{}} + + This HTML + +{{}} +{{< /code >}} + +The template for the `highlight` shortcode uses the following code, which is already included in Hugo: + +```go-html-template +{{ .Get 0 | highlight .Inner }} +``` + +The rendered output of the HTML example code block will be as follows: + +{{< code file=syntax-highlighted.html >}} +
<html>
 +    <body> This HTML </body>
 +</html>
 +
+{{< /code >}} + +### Nested shortcode: image gallery + +Hugo's [`.Parent`] shortcode method provides access to the parent shortcode context when the shortcode in question is called within the context of a parent shortcode. This provides an inheritance model. + +The following example is contrived but demonstrates the concept. Assume you have a `gallery` shortcode that expects one named `class` argument: + +{{< code file=layouts/shortcodes/gallery.html >}} +
+ {{ .Inner }} +
+{{< /code >}} + +You also have an `img` shortcode with a single named `src` argument that you want to call inside of `gallery` and other shortcodes, so that the parent defines the context of each `img`: + +{{< code file=layouts/shortcodes/img.html >}} +{{- $src := .Get "src" -}} +{{- with .Parent -}} + +{{- else -}} + +{{- end -}} +{{< /code >}} + +You can then call your shortcode in your content as follows: + +```go-html-template +{{}} + {{}} + {{}} +{{}} +{{}} +``` + +This will output the following HTML. Note how the first two `img` shortcodes inherit the `class` value of `content-gallery` set with the call to the parent `gallery`, whereas the third `img` only uses `src`: + +```html +
+ + +
+ +``` + +## Error handling in shortcodes + +Use the [`errorf`] template function with the [`Name`] and [`Position`] shortcode methods to generate useful error messages: + +{{< code file=layouts/shortcodes/greeting.html >}} +{{ with .Get "name" }} +

Hello, my name is {{ . }}.

+{{ else }} + {{ errorf "The %q shortcode requires a 'name' argument. See %s" .Name .Position }} +{{ end }} +{{< /code >}} + +When the above fails, you will see an `ERROR` message such as: + +```sh +ERROR The "greeting" shortcode requires a 'name' argument. See "/home/user/project/content/_index.md:12:1" +``` + +## Inline shortcodes + +You can also implement your shortcodes inline -- e.g. where you use them in the content file. This can be useful for scripting that you only need in one place. + +This feature is disabled by default, but can be enabled in your site configuration: + +{{< code-toggle file=hugo >}} +[security] +enableInlineShortcodes = true +{{< /code-toggle >}} + +It is disabled by default for security reasons. The security model used by Hugo's template handling assumes that template authors are trusted, but that the content files are not, so the templates are injection-safe from malformed input data. But in most situations you have full control over the content, too, and then `enableInlineShortcodes = true` would be considered safe. But it's something to be aware of: It allows ad-hoc [Go Text templates](https://golang.org/pkg/text/template/) to be executed from the content files. + +And once enabled, you can do this in your content files: + + ```go-html-template + {{}}{{ now }}{{}} + ``` + +The above will print the current date and time. + +Note that an inline shortcode's inner content is parsed and executed as a Go text template with the same context as a regular shortcode template. + +This means that the current page can be accessed via `.Page.Title` etc. This also means that there are no concept of "nested inline shortcodes". + +The same inline shortcode can be reused later in the same content file, with different arguments if needed, using the self-closing syntax: + + ```go-html-template +{{}} +``` + +[`.Parent`]: /methods/shortcode/parent/ +[`errorf`]: /functions/fmt/errorf/ +[`Name`]: /methods/shortcode/name/ +[`Position`]: /methods/shortcode/position/ +[built-in shortcode]: /content-management/shortcodes/ - [figure]: /content-management/shortcodes/#figure ++[figure]: /shortcodes/figure/ +[lookup order]: /templates/lookup-order/ +[source organization]: /getting-started/directory-structure/ +[vimeoexample]: #single-flexible-example-vimeo - [youtubeshortcode]: /content-management/shortcodes/#youtube ++[youtubeshortcode]: /shortcodes/youtube/ diff --cc docs/content/en/templates/sitemap.md index 9fc152210,000000000..166f54933 mode 100644,000000..100644 --- a/docs/content/en/templates/sitemap.md +++ b/docs/content/en/templates/sitemap.md @@@ -1,82 -1,0 +1,82 @@@ +--- +title: Sitemap templates +description: Hugo provides built-in sitemap templates. +categories: [templates] +keywords: [] +menu: + docs: + parent: templates + weight: 140 +weight: 140 +toc: true +aliases: [/layout/sitemap/,/templates/sitemap-template/] +--- + +## Overview + +Hugo's embedded sitemap templates conform to v0.9 of the [sitemap protocol]. + +With a monolingual project, Hugo generates a sitemap.xml file in the root of the [`publishDir`] using the [embedded sitemap template]. + +With a multilingual project, Hugo generates: + +- A sitemap.xml file in the root of each site (language) using the [embedded sitemap template] +- A sitemap.xml file in the root of the [`publishDir`] using the [embedded sitemapindex template] + +[embedded sitemap template]: {{% eturl sitemap %}} +[embedded sitemapindex template]: {{% eturl sitemapindex %}} + +## Configuration + +These are the default sitemap configuration values. They apply to all pages unless overridden in front matter. + +{{< code-toggle config=sitemap />}} + +changefreq +: (`string`) How frequently a page is likely to change. Valid values are `always`, `hourly`, `daily`, `weekly`, `monthly`, `yearly`, and `never`. With the default value of `""` Hugo will omit this field from the sitemap. See [details](https://www.sitemaps.org/protocol.html#changefreqdef). + +disable {{< new-in 0.125.0 >}} +: (`bool`) Whether to disable page inclusion. Default is `false`. Set to `true` in front matter to exclude the page. + +filename +: (`string`) The name of the generated file. Default is `sitemap.xml`. + +priority +: (`float`) The priority of a page relative to any other page on the site. Valid values range from 0.0 to 1.0. With the default value of `-1` Hugo will omit this field from the sitemap. See [details](https://www.sitemaps.org/protocol.html#priority). + +## Override default values + +Override the default values for a given page in front matter. + +{{< code-toggle file=news.md fm=true >}} +title = 'News' +[sitemap] + changefreq = 'weekly' + disable = true + priority = 0.8 +{{}} + +## Override built-in templates + +To override the built-in sitemap.xml template, create a new file in either of these locations: + - - layouts/sitemap.xml - - layouts/_default/sitemap.xml ++- `layouts/sitemap.xml` ++- `layouts/_default/sitemap.xml` + +When ranging through the page collection, access the _change frequency_ and _priority_ with `.Sitemap.ChangeFreq` and `.Sitemap.Priority` respectively. + +To override the built-in sitemapindex.xml template, create a new file in either of these locations: + - - layouts/sitemapindex.xml - - layouts/_default/sitemapindex.xml ++- `layouts/sitemapindex.xml` ++- `layouts/_default/sitemapindex.xml` + +## Disable sitemap generation + +You may disable sitemap generation in your site configuration: + +{{< code-toggle file=hugo >}} +disableKinds = ['sitemap'] +{{}} + +[`publishDir`]: /getting-started/configuration#publishdir - [sitemap protocol]: ++[sitemap protocol]: https://www.sitemaps.org/protocol.html diff --cc docs/content/en/templates/taxonomy.md index d0f24b1b2,000000000..f9f28ee57 mode 100644,000000..100644 --- a/docs/content/en/templates/taxonomy.md +++ b/docs/content/en/templates/taxonomy.md @@@ -1,176 -1,0 +1,169 @@@ +--- +title: Taxonomy templates +description: Create a taxonomy template to render a list of terms. +categories: [templates] +keywords: [] +menu: + docs: + parent: templates + weight: 90 +weight: 90 +toc: true +aliases: [/taxonomies/displaying/,/templates/terms/,/indexes/displaying/,/taxonomies/templates/,/indexes/ordering/, /templates/taxonomies/, /templates/taxonomy-templates/] +--- + - The [taxonomy] template below inherits the site's shell from the [base template], and renders a list of [terms] in the current taxonomy. ++The [taxonomy](g) template below inherits the site's shell from the [base template], and renders a list of [terms](g) in the current taxonomy. + - [taxonomy]: /getting-started/glossary/#taxonomy - [terms]: /getting-started/glossary/#term +[base template]: /templates/types/ + +{{< code file=layouts/_default/taxonomy.html >}} +{{ define "main" }} +

{{ .Title }}

+ {{ .Content }} + {{ range .Pages }} +

{{ .LinkTitle }}

+ {{ end }} +{{ end }} +{{< /code >}} + +Review the [template lookup order] to select a template path that provides the desired level of specificity. + +[template lookup order]: /templates/lookup-order/#taxonomy-templates + +In the example above, the taxonomy and term will be capitalized if their respective pages are not backed by files. You can disable this in your site configuration: + +{{< code-toggle file=hugo >}} +capitalizeListTitles = false +{{< /code-toggle >}} + +## Data object + +Use these methods on the `Data` object within a taxonomy template. + +Singular +: (`string`) Returns the singular name of the taxonomy. + +```go-html-template +{{ .Data.Singular }} → tag +``` + +Plural +: (`string`) Returns the plural name of the taxonomy. + +```go-html-template +{{ .Data.Plural }} → tags +``` + +Terms - : (`page.Taxonomy`) Returns the `Taxonomy` object, consisting of a map of terms and the [weighted pages] associated with each term. - - [weighted pages]: /getting-started/glossary/#weighted-page ++: (`page.Taxonomy`) Returns the `Taxonomy` object, consisting of a map of terms and the [weighted pages](g) associated with each term. + +```go-html-template +{{ $taxonomyObject := .Data.Terms }} +``` + +Once we have the `Taxonomy` object, we can call any of its [methods], allowing us to sort alphabetically or by term count. + +[methods]: /methods/taxonomy/ + +## Sort alphabetically + +The taxonomy template below inherits the site's shell from the base template, and renders a list of terms in the current taxonomy. Hugo sorts the list alphabetically by term, and displays the number of pages associated with each term. + +{{< code file=layouts/_default/taxonomy.html >}} +{{ define "main" }} +

{{ .Title }}

+ {{ .Content }} + {{ range .Data.Terms.Alphabetical }} +

{{ .Page.LinkTitle }} ({{ .Count }})

+ {{ end }} +{{ end }} +{{< /code >}} + +## Sort by term count + +The taxonomy template below inherits the site's shell from the base template, and renders a list of terms in the current taxonomy. Hugo sorts the list by the number of pages associated with each term, and displays the number of pages associated with each term. + +{{< code file=layouts/_default/taxonomy.html >}} +{{ define "main" }} +

{{ .Title }}

+ {{ .Content }} + {{ range .Data.Terms.ByCount }} +

{{ .Page.LinkTitle }} ({{ .Count }})

+ {{ end }} +{{ end }} +{{< /code >}} + +## Include content links + - The [`Alphabetical`] and [`ByCount`] methods used in the previous examples return an [ordered taxonomy], so we can also list the content to which each term is assigned. ++The [`Alphabetical`] and [`ByCount`] methods used in the previous examples return an [ordered taxonomy](g), so we can also list the content to which each term is assigned. + - [ordered taxonomy]: /getting-started/glossary/#ordered-taxonomy +[`Alphabetical`]: /methods/taxonomy/alphabetical/ +[`ByCount`]: /methods/taxonomy/bycount/ + +The taxonomy template below inherits the site's shell from the base template, and renders a list of terms in the current taxonomy. Hugo sorts the list by the number of pages associated with each term, displays the number of pages associated with each term, then lists the content to which each term is assigned. + +{{< code file=layouts/_default/taxonomy.html >}} +{{ define "main" }} +

{{ .Title }}

+ {{ .Content }} + {{ range .Data.Terms.ByCount }} +

{{ .Page.LinkTitle }} ({{ .Count }})

+ + {{ end }} +{{ end }} +{{< /code >}} + +## Display metadata + - Display metadata about each term by creating a corresponding branch bundle in the content directory. ++Display metadata about each term by creating a corresponding branch bundle in the `content` directory. + +For example, create an "authors" taxonomy: + +{{< code-toggle file=hugo >}} +[taxonomies] +author = 'authors' +{{< /code-toggle >}} + - Then create content with one [branch bundle] for each term: - - [branch bundle]: /getting-started/glossary/#branch-bundle ++Then create content with one [branch bundle](g) for each term: + +```text +content/ +└── authors/ + ├── jsmith/ + │ ├── _index.md + │ └── portrait.jpg + └── rjones/ + ├── _index.md + └── portrait.jpg +``` + +Then add front matter to each term page: + +{{< code-toggle file=content/authors/jsmith/_index.md fm=true >}} +title = "John Smith" +affiliation = "University of Chicago" +{{< /code-toggle >}} + +Then create a taxonomy template specific to the "authors" taxonomy: + +{{< code file=layouts/authors/taxonomy.html >}} +{{ define "main" }} +

{{ .Title }}

+ {{ .Content }} + {{ range .Data.Terms.Alphabetical }} +

{{ .Page.LinkTitle }}

+

Affiliation: {{ .Page.Params.Affiliation }}

+ {{ with .Page.Resources.Get "portrait.jpg" }} + {{ with .Fill "100x100" }} + portrait + {{ end }} + {{ end }} + {{ end }} +{{ end }} +{{< /code >}} + +In the example above we list each author including their affiliation and portrait. diff --cc docs/content/en/templates/term.md index 5becd0aa0,000000000..07b8ef29a mode 100644,000000..100644 --- a/docs/content/en/templates/term.md +++ b/docs/content/en/templates/term.md @@@ -1,115 -1,0 +1,112 @@@ +--- +title: Term templates +description: Create a term template to render a list of pages associated with the current term. +categories: [templates] +keywords: [] +menu: + docs: + parent: templates + weight: 100 +weight: 100 +toc: true +--- + - The [term] template below inherits the site's shell from the [base template], and renders a list of pages associated with the current term. ++The [term](g) template below inherits the site's shell from the [base template], and renders a list of pages associated with the current term. + - [term]: /getting-started/glossary/#term +[base template]: /templates/types/ + +{{< code file=layouts/_default/term.html >}} +{{ define "main" }} +

{{ .Title }}

+ {{ .Content }} + {{ range .Pages }} +

{{ .LinkTitle }}

+ {{ end }} +{{ end }} +{{< /code >}} + +Review the [template lookup order] to select a template path that provides the desired level of specificity. + +[template lookup order]: /templates/lookup-order/#taxonomy-templates + +In the example above, the term will be capitalized if its respective page is not backed by a file. You can disable this in your site configuration: + +{{< code-toggle file=hugo >}} +capitalizeListTitles = false +{{< /code-toggle >}} + +## Data object + +Use these methods on the `Data` object within a term template. + +Singular +: (`string`) Returns the singular name of the taxonomy. + +```go-html-template +{{ .Data.Singular }} → tag +``` + +Plural +: (`string`) Returns the plural name of the taxonomy. + +```go-html-template +{{ .Data.Plural }} → tags +``` + +Term +: (`string`) Returns the name of the term. + +```go-html-template +{{ .Data.Term }} → fiction +``` + +## Display metadata + - Display metadata about each term by creating a corresponding branch bundle in the content directory. ++Display metadata about each term by creating a corresponding branch bundle in the `content` directory. + +For example, create an "authors" taxonomy: + +{{< code-toggle file=hugo >}} +[taxonomies] +author = 'authors' +{{< /code-toggle >}} + - Then create content with one [branch bundle] for each term: - - [branch bundle]: /getting-started/glossary/#branch-bundle ++Then create content with one [branch bundle](g) for each term: + +```text +content/ +└── authors/ + ├── jsmith/ + │ ├── _index.md + │ └── portrait.jpg + └── rjones/ + ├── _index.md + └── portrait.jpg +``` + +Then add front matter to each term page: + +{{< code-toggle file=content/authors/jsmith/_index.md fm=true >}} +title = "John Smith" +affiliation = "University of Chicago" +{{< /code-toggle >}} + +Then create a term template specific to the "authors" taxonomy: + +{{< code file=layouts/authors/term.html >}} +{{ define "main" }} +

{{ .Title }}

+

Affiliation: {{ .Params.affiliation }}

+ {{ with .Resources.Get "portrait.jpg" }} + {{ with .Fill "100x100" }} + portrait + {{ end }} + {{ end }} + {{ .Content }} + {{ range .Pages }} +

{{ .LinkTitle }}

+ {{ end }} +{{ end }} +{{< /code >}} + +In the example above we display the author with their affiliation and portrait, then a list of associated content. diff --cc docs/content/en/templates/types/index.md index 934105d88,000000000..0bd72ccc4 mode 100644,000000..100644 --- a/docs/content/en/templates/types/index.md +++ b/docs/content/en/templates/types/index.md @@@ -1,284 -1,0 +1,278 @@@ +--- +title: Template types +linkTitle: Template types +description: Create templates of different types to render your content, resources, and data. +categories: [templates] +keywords: [] +menu: + docs: + parent: templates + weight: 30 +weight: 30 +toc: true +aliases: ['/templates/lists/'] +--- + +[![structural diagram of a website](site-hierarchy.svg)](site-hierarchy.svg) + +## Structure + - Create templates in the layouts directory in the root of your project. ++Create templates in the `layouts` directory in the root of your project. + +Although your site may not require each of these templates, the example below is typical for a site of medium complexity. + +```text +layouts/ +├── _default/ +│ ├── _markup/ +│ │ ├── render-image.html <-- render hook +│ │ └── render-link.html <-- render hook +│ ├── baseof.html +│ ├── home.html +│ ├── section.html +│ ├── single.html +│ ├── taxonomy.html +│ └── term.html +├── articles/ +│ └── card.html <-- content view +├── partials/ +│ ├── footer.html +│ └── header.html +└── shortcodes/ + ├── audio.html + └── video.html +``` + +Hugo's [template lookup order] determines the template path, allowing you to create unique templates for any page. + +[template lookup order]: /templates/lookup-order/ + +{{% note %}} +You must have thorough understanding of the [template lookup order] when creating templates. Template selection is based on template type, page kind, content type, section, language, and output format. + +[template lookup order]: /templates/lookup-order/ +{{% /note %}} + +The purpose of each template type is described below. + +## Base + +Base templates reduce duplicate code by wrapping other templates within a shell. + +For example, the base template below calls the [partial] function to include partial templates for the `head`, `header`, and `footer` elements of each page, and it uses the [block] function to include `home`, `single`, `section`, `taxonomy`, and `term` templates within the `main` element of each page. + +[block]: /functions/go-template/block/ +[partial]: /functions/partials/include/ + +{{< code file=layouts/_default/baseof.html >}} + + + + {{ partial "head.html" . }} + + +
+ {{ partial "header.html" . }} +
+
+ {{ block "main" . }}{{ end }} +
+
+ {{ partial "footer.html" . }} +
+ + +{{< /code >}} + +Learn more about [base templates](/templates/base/). + +## Home + +A home template renders your site's home page. For a single page site this is the only required template. + +For example, the home template below inherits the site's shell from the base template, and renders the home page content with a list of pages. + +{{< code file=layouts/_default/home.html >}} +{{ define "main" }} + {{ .Content }} + {{ range site.RegularPages }} +

{{ .LinkTitle }}

+ {{ end }} +{{ end }} +{{< /code >}} + +{{% include "templates/_common/filter-sort-group.md" %}} + +Learn more about [home templates](/templates/home/). + +## Single + +A single template renders a single page. + +For example, the single template below inherits the site's shell from the base template, and renders the title and content of each page. + +{{< code file=layouts/_default/single.html >}} +{{ define "main" }} +

{{ .Title }}

+ {{ .Content }} +{{ end }} +{{< /code >}} + +Learn more about [single templates](/templates/single/). + +## Section + +A section template typically renders a list of pages within a section. + +For example, the section template below inherits the site's shell from the base template, and renders a list of pages in the current section. + +{{< code file=layouts/_default/section.html >}} +{{ define "main" }} +

{{ .Title }}

+ {{ .Content }} + {{ range .Pages }} +

{{ .LinkTitle }}

+ {{ end }} +{{ end }} +{{< /code >}} + +{{% include "templates/_common/filter-sort-group.md" %}} + +Learn more about [section templates](/templates/section/). + +## Taxonomy + - A taxonomy template renders a list of terms in a [taxonomy]. - - [taxonomy]: /getting-started/glossary/#taxonomy ++A taxonomy template renders a list of terms in a [taxonomy](g). + +For example, the taxonomy template below inherits the site's shell from the base template, and renders a list of terms in the current taxonomy. + +{{< code file=layouts/_default/taxonomy.html >}} +{{ define "main" }} +

{{ .Title }}

+ {{ .Content }} + {{ range .Pages }} +

{{ .LinkTitle }}

+ {{ end }} +{{ end }} +{{< /code >}} + +{{% include "templates/_common/filter-sort-group.md" %}} + +Learn more about [taxonomy templates](/templates/taxonomy/). + +## Term + - A term template renders a list of pages associated with a [term]. - - [term]: /getting-started/glossary/#term ++A term template renders a list of pages associated with a [term](g). + +For example, the term template below inherits the site's shell from the base template, and renders a list of pages associated with the current term. + +{{< code file=layouts/_default/term.html >}} +{{ define "main" }} +

{{ .Title }}

+ {{ .Content }} + {{ range .Pages }} +

{{ .LinkTitle }}

+ {{ end }} +{{ end }} +{{< /code >}} + +{{% include "templates/_common/filter-sort-group.md" %}} + +Learn more about [term templates](/templates/term/). + +## Partial + +A partial template is typically used to render a component of your site, though you may also create partial templates that return values. + +{{% note %}} +Unlike other template types, you cannot create partial templates to target a particular page kind, content type, section, language, or output format. Partial templates do not follow Hugo's [template lookup order]. + +[template lookup order]: /templates/lookup-order/ +{{% /note %}} + +For example, the partial template below renders copyright information. + +{{< code file=layouts/partials/footer.html >}} +

Copyright {{ now.Year }}. All rights reserved.

+{{< /code >}} + +Learn more about [partial templates](/templates/partial/). + +## Content view + +A content view template is similar to a partial template, invoked by calling the [`Render`] method on a `Page` object. Unlike partial templates, content view templates: + +- Automatically inherit the context of the current page +- Follow a lookup order allowing you to target a given content type or section + +[`Render`]: /methods/page/render/ + +For example, the home template below inherits the site's shell from the base template, and renders a card component for each page within the "articles" section of your site. + +{{< code file=layouts/_default/home.html >}} +{{ define "main" }} + {{ .Content }} +
    + {{ range where site.RegularPages "Section" "articles" }} + {{ .Render "card" }} + {{ end }} +
+{{ end }} +{{< /code >}} + +{{< code file=layouts/articles/card.html >}} +
+

{{ .LinkTitle }}

+ {{ .Summary }} +
+{{< /code >}} + +Learn more about [content view templates](/templates/content-view/). + +## Render hook + +A render hook template overrides the conversion of Markdown to HTML. + +For example, the render hook template below adds a `rel` attribute to external links. + +{{< code file=layouts/_default/_markup/render-link.html >}} +{{- $u := urls.Parse .Destination -}} + + {{- with .Text | safeHTML }}{{ . }}{{ end -}} + +{{- /* chomp trailing newline */ -}} +{{< /code >}} + +Learn more about [render hook templates](/render-hooks/). + +## Shortcode + +A shortcode template is used to render a component of your site. Unlike partial templates, shortcode templates are called from content pages. + - For example, the shortcode template below renders an audio element from a [global resource]. - - [global resource]: /getting-started/glossary/#global-resource ++For example, the shortcode template below renders an audio element from a [global resource](g). + +{{< code file=layouts/shortcodes/audio.html >}} +{{ with resources.Get (.Get "src") }} + +{{ end }} +{{< /code >}} + +Call the shortcode from your content page: + +{{< code file=content/example.md >}} +{{}} +{{< /code >}} + +Learn more about [shortcode templates](/templates/shortcode/). + +## Other + +Use other specialized templates to create: + +- [Sitemaps](/templates/sitemap) +- [RSS feeds](/templates/rss/) +- [404 error pages](/templates/404/) +- [robots.txt files](/templates/robots/) diff --cc docs/content/en/tools/migrations.md index 99064e271,000000000..0fc78153f mode 100644,000000..100644 --- a/docs/content/en/tools/migrations.md +++ b/docs/content/en/tools/migrations.md @@@ -1,105 -1,0 +1,105 @@@ +--- +title: Migrate to Hugo +linkTitle: Migrations +description: A list of community-developed tools for migrating from your existing static site generator or content management system to Hugo. +categories: [developer tools] +keywords: [migrations,jekyll,wordpress,drupal,ghost,contentful] +menu: + docs: + parent: developer-tools + weight: 50 +weight: 50 +toc: true +aliases: [/developer-tools/migrations/, /developer-tools/migrated/] +--- + +This section highlights some independently developed projects related to Hugo. These tools extend functionality or help you to get started. + +Take a look at this list of migration tools if you currently use other blogging tools like Jekyll or WordPress but intend to switch to Hugo instead. They'll help you export your content into Hugo-friendly formats. + +## Jekyll + +Alternatively, you can use the [Jekyll import command](/commands/hugo_import_jekyll/). + +[JekyllToHugo](https://github.com/fredrikloch/JekyllToHugo) +: A Small script for converting Jekyll blog posts to a Hugo site. + +[ConvertToHugo](https://github.com/coderzh/ConvertToHugo) +: Convert your blog from Jekyll to Hugo. + +## Octopress + +[octohug](https://github.com/codebrane/octohug) +: Octopress to Hugo migrator. + +## DokuWiki + +[dokuwiki-to-hugo](https://github.com/wgroeneveld/dokuwiki-to-hugo) - : Migrates your DokuWiki source pages from [DokuWiki syntax](https://www.dokuwiki.org/wiki:syntax) to Hugo Markdown syntax. Includes extras like the TODO plugin. Written with extensibility in mind using Python 3. Also generates a TOML header for each page. Designed to copy-paste the wiki directory into your /content directory. ++: Migrates your DokuWiki source pages from [DokuWiki syntax](https://www.dokuwiki.org/wiki:syntax) to Hugo Markdown syntax. Includes extras like the TODO plugin. Written with extensibility in mind using Python 3. Also generates a TOML header for each page. Designed to copy-paste the wiki directory into your `content` directory. + +## WordPress + +[wordpress-to-hugo-exporter](https://github.com/SchumacherFM/wordpress-to-hugo-exporter) +: A one-click WordPress plugin that converts all posts, pages, taxonomies, metadata, and settings to Markdown and YAML which can be dropped into Hugo. (Note: If you have trouble using this plugin, you can [export your site for Jekyll](https://wordpress.org/plugins/jekyll-exporter/) and use Hugo's built-in Jekyll converter listed above.) + +[blog2md](https://github.com/palaniraja/blog2md) +: Works with [exported xml](https://en.support.wordpress.com/export/) file of your free YOUR-TLD.wordpress.com website. It also saves approved comments to `YOUR-POST-NAME-comments.md` file along with posts. + +[wordhugopress](https://github.com/nantipov/wordhugopress) +: A small utility written in Java that exports the entire WordPress site from the database and resource (e.g., images) files stored locally or remotely. Therefore, migration from the backup files is possible. Supports merging multiple WordPress sites into a single Hugo site. + +[wp2hugo](https://github.com/ashishb/wp2hugo) +: A Go-based CLI tool to migrate WordPress website to Hugo while preserving original URLs, GUIDs (for feeds), image URLs, code highlights, table of contents, YouTube embeds, Google Maps embeds, and original WordPress navigation categories. + +## Medium + +[medium2md](https://github.com/gautamdhameja/medium-2-md) +: A simple Medium to Hugo exporter able to import stories in one command, including front matter. + +[medium-to-hugo](https://github.com/bgadrian/medium-to-hugo) +: A CLI tool written in Go to export medium posts into a Hugo-compatible Markdown format. Tags and images are included. All images will be downloaded locally and linked appropriately. + +## Tumblr + +[tumblr-importr](https://github.com/carlmjohnson/tumblr-importr) +: An importer that uses the Tumblr API to create a Hugo static site. + +[tumblr2hugomarkdown](https://github.com/Wysie/tumblr2hugomarkdown) +: Export all your Tumblr content to Hugo Markdown files with preserved original formatting. + +[Tumblr to Hugo](https://github.com/jipiboily/tumblr-to-hugo) +: A migration tool that converts each of your Tumblr posts to a content file with a proper title and path. It also generates a CSV file to help you set up URL redirects. + +## Drupal + +[drupal2hugo](https://github.com/danapsimer/drupal2hugo) +: Convert a Drupal site to Hugo. + +## Joomla + +[hugojoomla](https://github.com/davetcc/hugojoomla) +: This utility written in Java takes a Joomla database and converts all the content into Markdown files. It changes any URLs that are in Joomla's internal format and converts them to a suitable form. + +## Blogger + +[blogimport](https://github.com/natefinch/blogimport) +: A tool to import from Blogger posts to Hugo. + +[blogger-to-hugo](https://pypi.org/project/blogger-to-hugo/) +: Another tool to import Blogger posts to Hugo. It also downloads embedded images so they will be stored locally. + +[blog2md](https://github.com/palaniraja/blog2md) +: Works with [exported xml](https://support.google.com/blogger/answer/41387?hl=en) file of your YOUR-TLD.blogspot.com website. It also saves comments to `YOUR-POST-NAME-comments.md` file along with posts. + +[BloggerToHugo](https://github.com/huanlin/blogger-to-hugo) +: Yet another tool to import Blogger posts to Hugo. For Windows platform only, and .NET Framework 4.5 is required. See README.md before using this tool. + +## Contentful + +[contentful-hugo](https://github.com/ModiiMedia/contentful-hugo) +: A tool to create content-files for Hugo from content on [Contentful](https://www.contentful.com/). + +## BlogML + +[BlogML2Hugo](https://github.com/jijiechen/BlogML2Hugo) +: A tool that helps you convert BlogML xml file to Hugo Markdown files. Users need to take care of links to attachments and images by themselves. This helps the blogs that export BlogML files (e.g. BlogEngine.NET) transform to hugo sites easily. diff --cc docs/content/en/tools/search.md index 614bc511c,000000000..73aea7ce4 mode 100644,000000..100644 --- a/docs/content/en/tools/search.md +++ b/docs/content/en/tools/search.md @@@ -1,59 -1,0 +1,58 @@@ +--- +title: Search tools +linkTitle: Search +description: See some of the open-source and commercial search options for your newly created Hugo website. +categories: [developer tools] +keywords: [search] +menu: + docs: + parent: developer-tools + weight: 40 +weight: 40 +toc: true +--- + +A static website with a dynamic search function? Yes, Hugo provides an alternative to embeddable scripts from Google or other search engines for static websites. Hugo allows you to provide your visitors with a custom search function by indexing your content files directly. + +## Open-source + +[Pagefind](https://github.com/cloudcannon/pagefind) +: A fully static search library that aims to perform well on large sites, while using as little of your users' bandwidth as possible. + +[GitHub Gist for Hugo Workflow](https://gist.github.com/sebz/efddfc8fdcb6b480f567) +: This gist contains a simple workflow to create a search index for your static website. It uses a simple Grunt script to index all your content files and [lunr.js](https://lunrjs.com/) to serve the search results. + +[hugo-lunr](https://www.npmjs.com/package/hugo-lunr) +: A simple way to add site search to your static Hugo site using [lunr.js](https://lunrjs.com/). Hugo-lunr will create an index file of any HTML and Markdown documents in your Hugo project. + +[hugo-lunr-zh](https://www.npmjs.com/package/hugo-lunr-zh) +: A bit like Hugo-lunr, but Hugo-lunr-zh can help you separate the Chinese keywords. + +[GitHub Gist for Fuse.js integration](https://gist.github.com/eddiewebb/735feb48f50f0ddd65ae5606a1cb41ae) +: This gist demonstrates how to leverage Hugo's existing build time processing to generate a searchable JSON index used by [Fuse.js](https://fusejs.io/) on the client-side. Although this gist uses Fuse.js for fuzzy matching, any client-side search tool capable of reading JSON indexes will work. Does not require npm, grunt, or other build-time tools except Hugo! + +[hugo-search-index](https://www.npmjs.com/package/hugo-search-index) +: A library containing Gulp tasks and a prebuilt browser script that implements search. Gulp generates a search index from project Markdown files. + +[hugofastsearch](https://gist.github.com/cmod/5410eae147e4318164258742dd053993) +: A usability and speed update to "GitHub Gist for Fuse.js integration" — global, keyboard-optimized search. + +[JS & Fuse.js tutorial](https://makewithhugo.com/add-search-to-a-hugo-site/) +: A simple client-side search solution, using FuseJS (does not require jQuery). + +[Hugo Lyra](https://github.com/paolomainardi/hugo-lyra) +: Hugo-Lyra is a JavaScript module to integrate [Lyra](https://github.com/LyraSearch/lyra) into a Hugo website. It contains the server-side part to generate the index and the client-side library (optional) to bootstrap the search engine easily. + - [INFINI Pizza for WebAssembly](https://github.com/infinilabs/pizza-docsearch) ++[INFINI Pizza for WebAssembly](https://github.com/infinilabs/pizza-docsearch) +: Pizza is a super-lightweight yet fully featured search engine written in Rust. You can quickly add offline search functionality to your Hugo website in just five minutes with only three lines of code. For a step-by-step guide on integrating it with Hugo, check out [this blog tutorial](https://dev.to/medcl/adding-search-functionality-to-a-hugo-static-site-based-on-infini-pizza-for-webassembly-4h5e). + - +## Commercial + +[Algolia](https://www.algolia.com/) +: Algolia's Search API makes it easy to deliver a great search experience in your apps and websites. Algolia Search provides hosted full-text, numerical, faceted, and geolocalized search. + +[Bonsai](https://www.bonsai.io) +: Bonsai is a fully-managed hosted Elasticsearch service that is fast, reliable, and simple to set up. Easily ingest your docs from Hugo into Elasticsearch following [this guide from the docs](https://bonsai.io/docs/hugo). + +[ExpertRec](https://www.expertrec.com/) +: ExpertRec is a hosted search-as-a-service solution that is fast and scalable. Set-up and integration is extremely easy and takes only a few minutes. The search settings can be modified without coding using a dashboard. diff --cc docs/content/en/troubleshooting/deprecation.md index aa4bb71a2,000000000..81f2724a3 mode 100644,000000..100644 --- a/docs/content/en/troubleshooting/deprecation.md +++ b/docs/content/en/troubleshooting/deprecation.md @@@ -1,50 -1,0 +1,50 @@@ +--- +title: Deprecation +description: The Hugo project follows a formal and consistent process to deprecate functions, methods, and configuration settings. +categories: [troubleshooting] +keywords: [] +menu: + docs: + parent: troubleshooting + weight: 50 +weight: 50 +--- + +When a project _deprecates_ something, they are telling its users: + +1. Don't use Thing One anymore. - 2. Use Thing Two instead. - 3. We're going to remove Thing One at some point in the future. ++1. Use Thing Two instead. ++1. We're going to remove Thing One at some point in the future. + +[reasons for deprecation]: https://en.wikipedia.org/wiki/Deprecation + +Common [reasons for deprecation]: + +- A feature has been replaced by a more powerful alternative. +- A feature contains a design flaw. +- A feature is considered extraneous, and will be removed in the future in order to simplify the system as a whole. +- A future version of the software will make major structural changes, making it impossible or impractical to support older features. +- Standardization or increased consistency in naming. +- A feature that once was available only independently is now combined with its co-feature. + +After the project team deprecates something in code, Hugo will: + +1. Log an INFO message for 6 minor releases[^1] - 2. Log a WARN message for another 6 minor releases - 3. Log an ERROR message and fail the build thereafter ++1. Log a WARN message for another 6 minor releases ++1. Log an ERROR message and fail the build thereafter + +To see the INFO messages, you must use the `--logLevel` command line flag: + +```text +hugo --logLevel info +``` + +To limit the output to deprecation notices: + +```text +hugo --logLevel info | grep deprecate +``` + +Run the above command every time you upgrade Hugo. + +[^1]: For example, v0.1.1 => v0.2.0 is a minor release. diff --cc docs/content/en/troubleshooting/faq.md index 3fd48c62d,000000000..4891c566b mode 100644,000000..100644 --- a/docs/content/en/troubleshooting/faq.md +++ b/docs/content/en/troubleshooting/faq.md @@@ -1,143 -1,0 +1,134 @@@ +--- +title: Frequently asked questions +linkTitle: FAQs +description: These questions are frequently asked by new users. +categories: [troubleshooting] +keywords: [faq] +menu: + docs: + parent: troubleshooting + weight: 70 +weight: 70 - # Use level 6 headings for each question. +--- + +Hugo’s [forum] is an active community of users and developers who answer questions, share knowledge, and provide examples. A quick search of over 20,000 topics will often answer your question. Please be sure to read about [requesting help] before asking your first question. + +These are just a few of the questions most frequently asked by new users. + +###### An error message indicates that a feature is not available. Why? {#feature-not-available} + +{{% include "installation/_common/01-editions.md" %}} + +When you attempt to use a feature that is not available in the edition that you installed, Hugo throws this error: + +```go-html-template +this feature is not available in this edition of Hugo +``` + +To resolve, install a different edition based on the feature table above. See the [installation] section for details. + +###### Why do I see "Page Not Found" when visiting the home page? + - In the content/_index.md file: ++In the `content/_index.md` file: + + - Is `draft` set to `true`? + - Is the `date` in the future? + - Is the `publishDate` in the future? + - Is the `expiryDate` in the past? + +If the answer to any of these questions is yes, either change the field values, or use one of these command line flags: `--buildDrafts`, `--buildFuture`, or `--buildExpired`. + +###### Why is a given page not published? + - In the content/section/page.md file, or in the content/section/page/index.md file: ++In the `content/section/page.md` file, or in the `content/section/page/index.md` file: + - - Is `draft` set to `true`? - - Is the `date` in the future? - - Is the `publishDate` in the future? - - Is the `expiryDate` in the past? ++- Is `draft` set to `true`? ++- Is the `date` in the future? ++- Is the `publishDate` in the future? ++- Is the `expiryDate` in the past? + +If the answer to any of these questions is yes, either change the field values, or use one of these command line flags: `--buildDrafts`, `--buildFuture`, or `--buildExpired`. + +###### Why can't I see any of a page's descendants? + - You may have an index.md file instead of an _index.md file. See [details](/content-management/page-bundles/). ++You may have an `index.md` file instead of an `_index.md` file. See [details](/content-management/page-bundles/). + +###### What is the difference between an index.md file and an _index.md file? + - A directory with an index.md file is a [leaf bundle]. A directory with an _index.md file is a [branch bundle]. See [details](/content-management/page-bundles/). - - [branch bundle]: /getting-started/glossary/#branch-bundle - [leaf bundle]: /getting-started/glossary/#leaf-bundle ++A directory with an `index.md file` is a [leaf bundle](g). A directory with an `_index.md` file is a [branch bundle](g). See [details](/content-management/page-bundles/). + +###### Why is my partial template not rendered as expected? + - You may have neglected to pass the required [context] when calling the partial. For example: ++You may have neglected to pass the required [context](g) when calling the partial. For example: + +```go-html-template +{{/* incorrect */}} +{{ partial "_internal/pagination.html" }} + +{{/* correct */}} +{{ partial "_internal/pagination.html" . }} +``` + +###### In a template, what's the difference between `:=` and `=` when assigning values to variables? + +Use `:=` to initialize a variable, and use `=` to assign a value to a variable that has been previously initialized. See [details](https://pkg.go.dev/text/template#hdr-Variables). + +###### When I paginate a list page, why is the page collection not filtered as specified? + +You are probably invoking the [`Paginate`] or [`Paginator`] method more than once on the same page. See [details](/templates/pagination/). + +###### Why are there two ways to call a shortcode? + +Use the `{{%/* shortcode */%}}` notation if the shortcode template, or the content between the opening and closing shortcode tags, contains Markdown. Otherwise use the\ +`{{}}` notation. See [details](/content-management/shortcodes/). + +###### Can I use environment variables to control configuration? + +Yes. See [details](/getting-started/configuration/#configure-with-environment-variables). + +###### Why am I seeing inconsistent output from one build to the next? + +The most common causes are page collisions (publishing two pages to the same path) and the effects of concurrency. Use the `--printPathWarnings` command line flag to check for page collisions, and create a topic on the [forum] if you suspect concurrency problems. + +###### Why isn't Hugo's development server detecting file changes? + +In its default configuration, Hugo's file watcher may not be able detect file changes when: + +- Running Hugo within Windows Subsystem for Linux (WSL/WSL2) with project files on a Windows partition +- Running Hugo locally with project files on a removable drive +- Running Hugo locally with project files on a storage server accessed via the NFS, SMB, or CIFS protocols + +In these cases, instead of monitoring native file system events, use the `--poll` command line flag. For example, to poll the project files every 700 milliseconds, use `--poll 700ms`. + +###### Why is my page Scratch or Store missing a value? + - The [`Scratch`] and [`Store`] methods on a `Page` object allow you to create a [scratch pad] on the given page to store and manipulate data. Values are often set within a shortcode, a partial template called by a shortcode, or by a Markdown render hook. In all three cases, the scratch pad values are not determinate until Hugo renders the page content. - - [scratch pad]: /getting-started/glossary/#scratch-pad - - If you need to access a scratch pad value from a parent template, and the parent template has not yet rendered the page content, you can trigger content rendering by assigning the returned value to a [noop] variable: ++The [`Scratch`] and [`Store`] methods on a `Page` object allow you to create a [scratch pad](g) on the given page to store and manipulate data. Values are often set within a shortcode, a partial template called by a shortcode, or by a Markdown render hook. In all three cases, the scratch pad values are not determinate until Hugo renders the page content. + - [noop]: /getting-started/glossary/#noop ++If you need to access a scratch pad value from a parent template, and the parent template has not yet rendered the page content, you can trigger content rendering by assigning the returned value to a [noop](g) variable: + +```go-html-template +{{ $noop := .Content }} +{{ .Store.Get "mykey" }} +``` + +You can trigger content rendering with other methods as well. See next FAQ. + +[`Scratch`]: /methods/page/scratch +[`Store`]: /methods/page/store + +###### Which page methods trigger content rendering? + +The following methods on a `Page` object trigger content rendering: `Content`, `ContentWithoutSummary`, `FuzzyWordCount`, `Len`, `Plain`, `PlainWords`, `ReadingTime`, `Summary`, `Truncated`, and `WordCount`. + +{{% note %}} +For other questions please visit the [forum]. A quick search of over 20,000 topics will often answer your question. Please be sure to read about [requesting help] before asking your first question. + +[forum]: https://discourse.gohugo.io +[requesting help]: https://discourse.gohugo.io/t/requesting-help/9132 +{{% /note %}} + +[`Paginate`]: /methods/page/paginate/ +[`Paginator`]: /methods/page/paginator/ - [context]: /getting-started/glossary/#context +[forum]: https://discourse.gohugo.io +[installation]: /installation/ +[requesting help]: https://discourse.gohugo.io/t/requesting-help/9132 diff --cc docs/content/en/troubleshooting/performance.md index a2df1b08e,000000000..2cf64477a mode 100644,000000..100644 --- a/docs/content/en/troubleshooting/performance.md +++ b/docs/content/en/troubleshooting/performance.md @@@ -1,112 -1,0 +1,112 @@@ +--- +title: Performance +description: Tools and suggestions for evaluating and improving performance. +categories: [troubleshooting] +keywords: [] +menu: + docs: + parent: troubleshooting + weight: 60 +weight: 60 +toc: true +aliases: [/troubleshooting/build-performance/] +--- + +## Virus scanning + +Virus scanners are an essential component of system protection, but the performance impact can be severe for applications like Hugo that frequently read and write to disk. For example, with Microsoft Defender Antivirus, build times for some sites may increase by 400% or more. + +Before building a site, your virus scanner has already evaluated the files in your project directory. Scanning them again while building the site is superfluous. To improve performance, add Hugo's executable to your virus scanner's process exclusion list. + +For example, with Microsoft Defender Antivirus: + +**Start** > **Settings** > **Privacy & security** > **Windows Security** > **Open Windows Security** > **Virus & threat protection** > **Manage settings** > **Add or remove exclusions** > **Add an exclusion** > **Process** + +Then type `hugo.exe` add press the **Add** button. + +{{% note %}} +Virus scanning exclusions are common, but use caution when changing these settings. See the [Microsoft Defender Antivirus documentation](https://support.microsoft.com/en-us/topic/how-to-add-a-file-type-or-process-exclusion-to-windows-security-e524cbc2-3975-63c2-f9d1-7c2eb5331e53) for details. +{{% /note %}} + +Other virus scanners have similar exclusion mechanisms. See their respective documentation. + +## Template metrics + +Hugo is fast, but inefficient templates impede performance. Enable template metrics to determine which templates take the most time, and to identify caching opportunities: + +```sh +hugo --templateMetrics --templateMetricsHints +``` + +The result will look something like this: + +```text +Template Metrics: + + cumulative average maximum cache percent cached total + duration duration duration potential cached count count template + ---------- -------- -------- --------- ------- ------ ----- -------- + 36.037476822s 135.990478ms 225.765245ms 11 0 0 265 partials/head.html + 35.920040902s 164.018451ms 233.475072ms 0 0 0 219 articles/single.html + 34.163268129s 128.917992ms 224.816751ms 23 0 0 265 partials/head/meta/opengraph.html + 1.041227437s 3.92916ms 186.303376ms 47 0 0 265 partials/head/meta/schema.html + 805.628827ms 27.780304ms 114.678523ms 0 0 0 29 _default/list.html + 624.08354ms 15.221549ms 108.420729ms 8 0 0 41 partials/utilities/render-page-collection.html + 545.968801ms 775.523µs 105.045775ms 0 0 0 704 _default/summary.html + 334.680981ms 1.262947ms 127.412027ms 100 0 0 265 partials/head/js.html + 272.763205ms 2.050851ms 24.371757ms 0 0 0 133 _default/_markup/render-codeblock.html + 230.490038ms 8.865001ms 177.4615ms 0 0 0 26 shortcodes/template.html + 176.921913ms 176.921913ms 176.921913ms 0 0 0 1 examples.tmpl + 163.951469ms 14.904679ms 70.267953ms 0 0 0 11 articles/list.html + 153.07021ms 577.623µs 73.593597ms 100 0 0 265 partials/head/init.html + 150.910984ms 150.910984ms 150.910984ms 0 0 0 1 _default/single.html + 146.785804ms 146.785804ms 146.785804ms 0 0 0 1 _default/contact.html + 115.364617ms 115.364617ms 115.364617ms 0 0 0 1 authors/term.html + 87.392071ms 329.781µs 10.687132ms 100 0 0 265 partials/head/css.html + 86.803122ms 86.803122ms 86.803122ms 0 0 0 1 _default/home.html +``` + +From left to right, the columns represent: + +cumulative duration +: The cumulative time spent executing the template. + +average duration +: The average time spent executing the template. + +maximum duration +: The maximum time spent executing the template. + +cache potential +: Displayed as a percentage, any partial template with a 100% cache potential should be called with the [`partialCached`] function instead of the [`partial`] function. See the [caching](#caching) section below. + +percent cached +: The number of times the rendered templated was cached divided by the number of times the template was executed. + +cached count +: The number of times the rendered templated was cached. + +total count +: The number of times the template was executed. + +template - : The path to the template, relative to the layouts directory. ++: The path to the template, relative to the `layouts` directory. + +[`partial`]: /functions/partials/include/ +[`partialCached`]: /functions/partials/includecached/ + +{{% note %}} +Hugo builds pages in parallel where multiple pages are generated simultaneously. Because of this parallelism, the sum of "cumulative duration" values is usually greater than the actual time it takes to build a site. +{{% /note %}} + +## Caching + +Some partial templates such as sidebars or menus are executed many times during a site build. Depending on the content within the partial template and the desired output, the template may benefit from caching to reduce the number of executions. The [`partialCached`] template function provides caching capabilities for partial templates. + +{{% note %}} +Note that you can create cached variants of each partial by passing additional arguments to `partialCached` beyond the initial context. See the `partialCached` documentation for more details. +{{% /note %}} + +## Timers + - Use the `debug.Timer` function to determine execution time for a block of code, useful for finding performance bottle necks in templates. See [details](/functions/debug/timer/). ++Use the `debug.Timer` function to determine execution time for a block of code, useful for finding performance bottlenecks in templates. See [details](/functions/debug/timer/). diff --cc docs/data/docs.yaml index 73a17ab06,000000000..dc61df0e8 mode 100644,000000..100644 --- a/docs/data/docs.yaml +++ b/docs/data/docs.yaml @@@ -1,4788 -1,0 +1,4834 @@@ +chroma: + lexers: + - Aliases: + - abap + Name: ABAP + - Aliases: + - abnf + Name: ABNF + - Aliases: + - as + - actionscript + Name: ActionScript + - Aliases: + - as3 + - actionscript3 + Name: ActionScript 3 + - Aliases: + - ada + - ada95 + - ada2005 + Name: Ada + - Aliases: + - agda + Name: Agda + - Aliases: + - al + Name: AL + - Aliases: + - alloy + Name: Alloy + - Aliases: + - ng2 + Name: Angular2 + - Aliases: + - antlr + Name: ANTLR + - Aliases: + - apacheconf + - aconf + - apache + Name: ApacheConf + - Aliases: + - apl + Name: APL + - Aliases: + - applescript + Name: AppleScript + - Aliases: + - aql + Name: ArangoDB AQL + - Aliases: + - arduino + Name: Arduino + - Aliases: + - armasm + Name: ArmAsm ++ - Aliases: ++ - atl ++ Name: ATL + - Aliases: + - autohotkey + - ahk + Name: AutoHotkey + - Aliases: + - autoit + Name: AutoIt + - Aliases: + - awk + - gawk + - mawk + - nawk + Name: Awk + - Aliases: + - ballerina + Name: Ballerina + - Aliases: + - bash + - sh + - ksh + - zsh + - shell + Name: Bash + - Aliases: + - bash-session + - console + - shell-session + Name: Bash Session + - Aliases: + - bat + - batch + - dosbatch + - winbatch + Name: Batchfile ++ - Aliases: ++ - beef ++ Name: Beef + - Aliases: + - bib + - bibtex + Name: BibTeX + - Aliases: + - bicep + Name: Bicep + - Aliases: + - blitzbasic + - b3d + - bplus + Name: BlitzBasic + - Aliases: + - bnf + Name: BNF + - Aliases: + - bqn + Name: BQN + - Aliases: + - brainfuck + - bf + Name: Brainfuck + - Aliases: + - c + Name: C + - Aliases: + - csharp + - c# + Name: C# + - Aliases: + - cpp + - c++ + Name: C++ + - Aliases: + - caddyfile + - caddy + Name: Caddyfile + - Aliases: + - caddyfile-directives + - caddyfile-d + - caddy-d + Name: Caddyfile Directives + - Aliases: + - capnp + Name: Cap'n Proto + - Aliases: + - cassandra + - cql + Name: Cassandra CQL + - Aliases: + - ceylon + Name: Ceylon + - Aliases: + - cfengine3 + - cf3 + Name: CFEngine3 + - Aliases: + - cfs + Name: cfstatement + - Aliases: + - chai + - chaiscript + Name: ChaiScript + - Aliases: + - chapel + - chpl + Name: Chapel + - Aliases: + - cheetah + - spitfire + Name: Cheetah + - Aliases: + - clojure + - clj + - edn + Name: Clojure + - Aliases: + - cmake + Name: CMake + - Aliases: + - cobol + Name: COBOL + - Aliases: + - coffee-script + - coffeescript + - coffee + Name: CoffeeScript + - Aliases: + - common-lisp + - cl + - lisp + Name: Common Lisp + - Aliases: + - coq + Name: Coq + - Aliases: + - cr + - crystal + Name: Crystal + - Aliases: + - css + Name: CSS ++ - Aliases: ++ - csv ++ Name: CSV + - Aliases: + - cue + Name: CUE + - Aliases: + - cython + - pyx + - pyrex + Name: Cython + - Aliases: + - d + Name: D + - Aliases: + - dart + Name: Dart + - Aliases: + - dax + Name: Dax + - Aliases: + - desktop + - desktop_entry + Name: Desktop file + - Aliases: + - diff + - udiff + Name: Diff + - Aliases: + - django + - jinja + Name: Django/Jinja + - Aliases: + - zone + - bind + Name: dns + - Aliases: + - docker + - dockerfile + Name: Docker + - Aliases: + - dtd + Name: DTD + - Aliases: + - dylan + Name: Dylan + - Aliases: + - ebnf + Name: EBNF + - Aliases: + - elixir + - ex + - exs + Name: Elixir + - Aliases: + - elm + Name: Elm + - Aliases: + - emacs + - elisp + - emacs-lisp + Name: EmacsLisp + - Aliases: + - erlang + Name: Erlang + - Aliases: + - factor + Name: Factor + - Aliases: + - fennel + - fnl + Name: Fennel + - Aliases: + - fish + - fishshell + Name: Fish + - Aliases: + - forth + Name: Forth + - Aliases: + - fortran + - f90 + Name: Fortran + - Aliases: + - fortranfixed + Name: FortranFixed + - Aliases: + - fsharp + Name: FSharp + - Aliases: + - gas + - asm + Name: GAS + - Aliases: + - gdscript + - gd + Name: GDScript + - Aliases: + - gdscript3 + - gd3 + Name: GDScript3 + - Aliases: + - genshi + - kid + - xml+genshi + - xml+kid + Name: Genshi + - Aliases: + - html+genshi + - html+kid + Name: Genshi HTML + - Aliases: + - genshitext + Name: Genshi Text + - Aliases: + - cucumber + - Cucumber + - gherkin + - Gherkin + Name: Gherkin + - Aliases: - - gleam> ++ - gleam + Name: Gleam + - Aliases: + - glsl + Name: GLSL + - Aliases: + - gnuplot + Name: Gnuplot + - Aliases: + - go + - golang + Name: Go + - Aliases: + - go-html-template + Name: Go HTML Template + - Aliases: + - go-template + Name: Go Template + - Aliases: + - go-text-template + Name: Go Text Template + - Aliases: + - graphql + - graphqls + - gql + Name: GraphQL + - Aliases: + - groff + - nroff + - man + Name: Groff + - Aliases: + - groovy + Name: Groovy + - Aliases: + - handlebars + - hbs + Name: Handlebars + - Aliases: + - hare + Name: Hare + - Aliases: + - haskell + - hs + Name: Haskell + - Aliases: + - hx + - haxe + - hxsl + Name: Haxe + - Aliases: + - hcl + Name: HCL + - Aliases: + - hexdump + Name: Hexdump + - Aliases: + - hlb + Name: HLB + - Aliases: + - hlsl + Name: HLSL + - Aliases: + - holyc + Name: HolyC + - Aliases: + - html + Name: HTML + - Aliases: + - http + Name: HTTP + - Aliases: + - hylang + Name: Hy + - Aliases: + - idris + - idr + Name: Idris + - Aliases: + - igor + - igorpro + Name: Igor + - Aliases: + - ini + - cfg + - dosini + Name: INI + - Aliases: + - io + Name: Io + - Aliases: + - iscdhcpd + Name: ISCdhcpd + - Aliases: + - j + Name: J + - Aliases: + - java + Name: Java + - Aliases: + - js + - javascript + Name: JavaScript + - Aliases: + - json + Name: JSON ++ - Aliases: ++ - jsonata ++ Name: JSONata ++ - Aliases: ++ - jsonnet ++ Name: Jsonnet + - Aliases: + - julia + - jl + Name: Julia + - Aliases: + - jungle + Name: Jungle + - Aliases: + - kotlin + Name: Kotlin + - Aliases: + - lighty + - lighttpd + Name: Lighttpd configuration file + - Aliases: + - llvm + Name: LLVM + - Aliases: + - lua + Name: Lua + - Aliases: + - make + - makefile + - mf + - bsdmake + Name: Makefile + - Aliases: + - mako + Name: Mako + - Aliases: + - md + - mkd + Name: markdown + - Aliases: + - mason + Name: Mason + - Aliases: + - materialize + - mzsql + Name: Materialize SQL dialect + - Aliases: + - mathematica + - mma + - nb + Name: Mathematica + - Aliases: + - matlab + Name: Matlab + - Aliases: + - mcfunction - Name: mcfunction ++ - mcf ++ Name: MCFunction + - Aliases: + - meson + - meson.build + Name: Meson + - Aliases: + - metal + Name: Metal + - Aliases: + - minizinc + - MZN + - mzn + Name: MiniZinc + - Aliases: + - mlir + Name: MLIR + - Aliases: + - modula2 + - m2 + Name: Modula-2 + - Aliases: + - monkeyc + Name: MonkeyC + - Aliases: + - morrowind + - mwscript + Name: MorrowindScript + - Aliases: + - myghty + Name: Myghty + - Aliases: + - mysql + - mariadb + Name: MySQL + - Aliases: + - nasm + Name: NASM + - Aliases: + - natural + Name: Natural + - Aliases: + - ndisasm + Name: NDISASM + - Aliases: + - newspeak + Name: Newspeak + - Aliases: + - nginx + Name: Nginx configuration file + - Aliases: + - nim + - nimrod + Name: Nim + - Aliases: + - nixos + - nix + Name: Nix ++ - Aliases: ++ - nsis ++ - nsi ++ - nsh ++ Name: NSIS + - Aliases: + - objective-c + - objectivec + - obj-c + - objc + Name: Objective-C + - Aliases: + - objectpascal + Name: ObjectPascal + - Aliases: + - ocaml + Name: OCaml + - Aliases: + - octave + Name: Octave + - Aliases: + - odin + Name: Odin + - Aliases: + - ones + - onesenterprise + - 1S + - 1S:Enterprise + Name: OnesEnterprise + - Aliases: + - openedge + - abl + - progress + - openedgeabl + Name: OpenEdge ABL + - Aliases: + - openscad + Name: OpenSCAD + - Aliases: + - org + - orgmode + Name: Org Mode + - Aliases: + - pacmanconf + Name: PacmanConf + - Aliases: + - perl + - pl + Name: Perl + - Aliases: + - php + - php3 + - php4 + - php5 + Name: PHP + - Aliases: + - phtml + Name: PHTML + - Aliases: + - pig + Name: Pig + - Aliases: + - pkgconfig + Name: PkgConfig + - Aliases: + - plpgsql + Name: PL/pgSQL + - Aliases: + - text + - plain + - no-highlight + Name: plaintext + - Aliases: + - plutus-core + - plc + Name: Plutus Core + - Aliases: + - pony + Name: Pony + - Aliases: + - postgresql + - postgres + Name: PostgreSQL SQL dialect + - Aliases: + - postscript + - postscr + Name: PostScript + - Aliases: + - pov + Name: POVRay + - Aliases: + - powerquery + - pq + Name: PowerQuery + - Aliases: + - powershell + - posh + - ps1 + - psm1 + - psd1 + - pwsh + Name: PowerShell + - Aliases: + - prolog + Name: Prolog + - Aliases: + - promela + Name: Promela + - Aliases: + - promql + Name: PromQL + - Aliases: + - java-properties + Name: properties + - Aliases: + - protobuf + - proto + Name: Protocol Buffer + - Aliases: + - prql + Name: PRQL + - Aliases: + - psl + Name: PSL + - Aliases: + - puppet + Name: Puppet + - Aliases: + - python + - py + - sage + - python3 + - py3 + Name: Python + - Aliases: + - python2 + - py2 + Name: Python 2 + - Aliases: + - qbasic + - basic + Name: QBasic + - Aliases: + - qml + - qbs + Name: QML + - Aliases: + - splus + - s + - r + Name: R + - Aliases: + - racket + - rkt + Name: Racket + - Aliases: + - ragel + Name: Ragel + - Aliases: + - perl6 + - pl6 + - raku + Name: Raku + - Aliases: + - jsx + - react + Name: react + - Aliases: + - reason + - reasonml + Name: ReasonML + - Aliases: + - registry + Name: reg + - Aliases: + - rego + Name: Rego + - Aliases: + - rst + - rest + - restructuredtext + Name: reStructuredText + - Aliases: + - rexx + - arexx + Name: Rexx + - Aliases: + - spec + Name: RPMSpec + - Aliases: + - rb + - ruby + - duby + Name: Ruby + - Aliases: + - rust + - rs + Name: Rust + - Aliases: + - sas + Name: SAS + - Aliases: + - sass + Name: Sass + - Aliases: + - scala + Name: Scala + - Aliases: + - scheme + - scm + Name: Scheme + - Aliases: + - scilab + Name: Scilab + - Aliases: + - scss + Name: SCSS + - Aliases: + - sed + - gsed + - ssed + Name: Sed + - Aliases: + - sieve + Name: Sieve + - Aliases: + - smali + Name: Smali + - Aliases: + - smalltalk + - squeak + - st + Name: Smalltalk + - Aliases: + - smarty + Name: Smarty ++ - Aliases: ++ - snbt ++ Name: SNBT + - Aliases: + - snobol + Name: Snobol + - Aliases: + - sol + - solidity + Name: Solidity + - Aliases: + - sp + Name: SourcePawn + - Aliases: + - sparql + Name: SPARQL + - Aliases: + - sql + Name: SQL + - Aliases: + - squidconf + - squid.conf + - squid + Name: SquidConf + - Aliases: + - sml + Name: Standard ML + - Aliases: null + Name: stas + - Aliases: + - stylus + Name: Stylus + - Aliases: + - svelte + Name: Svelte + - Aliases: + - swift + Name: Swift + - Aliases: + - systemd + Name: SYSTEMD + - Aliases: + - systemverilog + - sv + Name: systemverilog + - Aliases: + - tablegen + Name: TableGen + - Aliases: + - tal + - uxntal + Name: Tal + - Aliases: + - tasm + Name: TASM + - Aliases: + - tcl + Name: Tcl + - Aliases: + - tcsh + - csh + Name: Tcsh + - Aliases: + - termcap + Name: Termcap + - Aliases: + - terminfo + Name: Terminfo + - Aliases: + - terraform + - tf + Name: Terraform + - Aliases: + - tex + - latex + Name: TeX + - Aliases: + - thrift + Name: Thrift + - Aliases: + - toml + Name: TOML + - Aliases: + - tradingview + - tv + Name: TradingView + - Aliases: + - tsql + - t-sql + Name: Transact-SQL + - Aliases: + - turing + Name: Turing + - Aliases: + - turtle + Name: Turtle + - Aliases: + - twig + Name: Twig + - Aliases: + - ts + - tsx + - typescript + Name: TypeScript + - Aliases: + - typoscript + Name: TypoScript + - Aliases: + - typoscriptcssdata + Name: TypoScriptCssData + - Aliases: + - typoscripthtmldata + Name: TypoScriptHtmlData ++ - Aliases: ++ - typst ++ Name: Typst + - Aliases: null + Name: ucode + - Aliases: + - v + - vlang + Name: V + - Aliases: + - vsh + - vshell + Name: V shell + - Aliases: + - vala + - vapi + Name: Vala + - Aliases: + - vb.net + - vbnet + Name: VB.net + - Aliases: + - verilog + - v + Name: verilog + - Aliases: + - vhdl + Name: VHDL + - Aliases: + - vhs + - tape + - cassette + Name: VHS + - Aliases: + - vim + Name: VimL + - Aliases: + - vue + - vuejs + Name: vue + - Aliases: null + Name: WDTE + - Aliases: + - wgsl + Name: WebGPU Shading Language ++ - Aliases: ++ - vtt ++ Name: WebVTT + - Aliases: + - whiley + Name: Whiley + - Aliases: + - xml + Name: XML + - Aliases: + - xorg.conf + Name: Xorg + - Aliases: + - yaml + Name: YAML + - Aliases: + - yang + Name: YANG + - Aliases: + - z80 + Name: Z80 Assembly + - Aliases: + - zed + Name: Zed + - Aliases: + - zig + Name: Zig +config: + HTTPCache: + cache: + for: + excludes: + - '**' + includes: null + polls: + - disable: true + for: + excludes: null + includes: + - '**' + high: 0s + low: 0s + archeTypeDir: archetypes + assetDir: assets + author: {} + baseURL: "" + build: + buildStats: + disableClasses: false + disableIDs: false + disableTags: false + enable: false + cacheBusters: + - source: (postcss|tailwind)\.config\.js + target: (css|styles|scss|sass) + noJSConfigInAssets: false + useResourceCacheWhen: fallback + buildDrafts: false + buildExpired: false + buildFuture: false + cacheDir: "" + caches: + assets: + dir: :resourceDir/_gen + maxAge: -1 + getcsv: + dir: :cacheDir/:project + maxAge: -1 + getjson: + dir: :cacheDir/:project + maxAge: -1 + getresource: + dir: :cacheDir/:project + maxAge: -1 + images: + dir: :resourceDir/_gen + maxAge: -1 + misc: + dir: :cacheDir/:project + maxAge: -1 + modules: + dir: :cacheDir/modules + maxAge: -1 + canonifyURLs: false + capitalizeListTitles: true + cascade: [] + cleanDestinationDir: false + contentDir: content + copyright: "" + dataDir: data + defaultContentLanguage: en + defaultContentLanguageInSubdir: false ++ defaultOutputFormat: html + deployment: + confirm: false + dryRun: false + force: false + invalidateCDN: true + matchers: null + maxDeletes: 256 + order: null + target: "" + targets: null + workers: 10 + disableAliases: false + disableDefaultLanguageRedirect: false + disableHugoGeneratorInject: false + disableKinds: null + disableLanguages: null + disableLiveReload: false + disablePathToLower: false + enableEmoji: false + enableGitInfo: false + enableMissingTranslationPlaceholders: false + enableRobotsTXT: false + environment: production + frontmatter: + date: + - date + - publishdate + - pubdate + - published + - lastmod + - modified + expiryDate: + - expirydate + - unpublishdate + lastmod: + - :git + - lastmod + - modified + - date + - publishdate + - pubdate + - published + publishDate: + - publishdate + - pubdate + - published + - date + hasCJKLanguage: false + i18nDir: i18n + ignoreCache: false + ignoreFiles: [] + ignoreLogs: null + ignoreVendorPaths: "" + imaging: + bgColor: '#ffffff' + hint: photo + quality: 75 + resampleFilter: box + languageCode: "" + languages: + en: + disabled: false + languageCode: "" + languageDirection: "" + languageName: "" + title: "" + weight: 0 + layoutDir: layouts + mainSections: null + markup: + asciidocExt: + attributes: {} + backend: html5 + extensions: [] + failureLevel: fatal + noHeaderOrFooter: true + preserveTOC: false + safeMode: unsafe + sectionNumbers: false + trace: false + verbose: false + workingFolderCurrent: false + defaultMarkdownHandler: goldmark + goldmark: + duplicateResourceFiles: false + extensions: + cjk: + eastAsianLineBreaks: false + eastAsianLineBreaksStyle: simple + enable: false + escapedSpace: false + definitionList: true + extras: + delete: + enable: false + insert: + enable: false + mark: + enable: false + subscript: + enable: false + superscript: + enable: false + footnote: true + linkify: true + linkifyProtocol: https + passthrough: + delimiters: + block: [] + inline: [] + enable: false + strikethrough: true + table: true + taskList: true + typographer: + apostrophe: '’' + disable: false + ellipsis: '…' + emDash: '—' + enDash: '–' + leftAngleQuote: '«' + leftDoubleQuote: '“' + leftSingleQuote: '‘' + rightAngleQuote: '»' + rightDoubleQuote: '”' + rightSingleQuote: '’' + parser: + attribute: + block: false + title: true + autoHeadingID: true + autoHeadingIDType: github + wrapStandAloneImageWithinParagraph: true + renderHooks: + image: + enableDefault: false + link: + enableDefault: false + renderer: + hardWraps: false + unsafe: false + xhtml: false + highlight: + anchorLineNos: false + codeFences: true + guessSyntax: false + hl_Lines: "" + hl_inline: false + lineAnchors: "" + lineNoStart: 1 + lineNos: false + lineNumbersInTable: true + noClasses: true - noHl: false + style: monokai + tabWidth: 4 + wrapperClass: highlight + tableOfContents: + endLevel: 3 + ordered: false + startLevel: 2 + mediaTypes: + application/json: + delimiter: . + suffixes: + - json + application/manifest+json: + delimiter: . + suffixes: + - webmanifest + application/octet-stream: + delimiter: . + application/pdf: + delimiter: . + suffixes: + - pdf + application/rss+xml: + delimiter: . + suffixes: + - xml + - rss + application/toml: + delimiter: . + suffixes: + - toml + application/wasm: + delimiter: . + suffixes: + - wasm + application/xml: + delimiter: . + suffixes: + - xml + application/yaml: + delimiter: . + suffixes: + - yaml + - yml + font/otf: + delimiter: . + suffixes: + - otf + font/ttf: + delimiter: . + suffixes: + - ttf + image/bmp: + delimiter: . + suffixes: + - bmp + image/gif: + delimiter: . + suffixes: + - gif + image/jpeg: + delimiter: . + suffixes: + - jpg + - jpeg + - jpe + - jif + - jfif + image/png: + delimiter: . + suffixes: + - png + image/svg+xml: + delimiter: . + suffixes: + - svg + image/tiff: + delimiter: . + suffixes: + - tif + - tiff + image/webp: + delimiter: . + suffixes: + - webp + text/asciidoc: + delimiter: . + suffixes: + - adoc + - asciidoc + - ad + text/calendar: + delimiter: . + suffixes: + - ics + text/css: + delimiter: . + suffixes: + - css + text/csv: + delimiter: . + suffixes: + - csv + text/html: + delimiter: . + suffixes: + - html + - htm + text/javascript: + delimiter: . + suffixes: + - js + - jsm + - mjs + text/jsx: + delimiter: . + suffixes: + - jsx + text/markdown: + delimiter: . + suffixes: + - md + - mdown + - markdown + text/org: + delimiter: . + suffixes: + - org + text/pandoc: + delimiter: . + suffixes: + - pandoc + - pdc + text/plain: + delimiter: . + suffixes: + - txt + text/rst: + delimiter: . + suffixes: + - rst + text/tsx: + delimiter: . + suffixes: + - tsx + text/typescript: + delimiter: . + suffixes: + - ts + text/x-sass: + delimiter: . + suffixes: + - sass + text/x-scss: + delimiter: . + suffixes: + - scss + video/3gpp: + delimiter: . + suffixes: + - 3gpp + - 3gp + video/mp4: + delimiter: . + suffixes: + - mp4 + video/mpeg: + delimiter: . + suffixes: + - mpg + - mpeg + video/ogg: + delimiter: . + suffixes: + - ogv + video/webm: + delimiter: . + suffixes: + - webm + video/x-msvideo: + delimiter: . + suffixes: + - avi + menus: {} + minify: + disableCSS: false + disableHTML: false + disableJS: false + disableJSON: false + disableSVG: false + disableXML: false + minifyOutput: false + tdewolff: + css: + inline: false + keepCSS2: true + precision: 0 + html: + keepComments: false + keepConditionalComments: false + keepDefaultAttrVals: true + keepDocumentTags: true + keepEndTags: true + keepQuotes: false + keepSpecialComments: true + keepWhitespace: false + templateDelims: + - "" + - "" + js: + keepVarNames: false + precision: 0 + version: 2022 + json: + keepNumbers: false + precision: 0 + svg: + inline: false + keepComments: false + precision: 0 + xml: + keepWhitespace: false + module: + hugoVersion: + extended: false + max: "" + min: "" + imports: null + mounts: + - disableWatch: false + excludeFiles: null + includeFiles: null + lang: "" + source: content + target: content + - disableWatch: false + excludeFiles: null + includeFiles: null + lang: "" + source: data + target: data + - disableWatch: false + excludeFiles: null + includeFiles: null + lang: "" + source: layouts + target: layouts + - disableWatch: false + excludeFiles: null + includeFiles: null + lang: "" + source: i18n + target: i18n + - disableWatch: false + excludeFiles: null + includeFiles: null + lang: "" + source: archetypes + target: archetypes + - disableWatch: false + excludeFiles: null + includeFiles: null + lang: "" + source: assets + target: assets + - disableWatch: false + excludeFiles: null + includeFiles: null + lang: "" + source: static + target: static + noProxy: none + noVendor: "" + params: null + private: '*.*' + proxy: direct + replacements: null + vendorClosest: false + workspace: "off" + newContentEditor: "" + noBuildLock: false + noChmod: false + noTimes: false + outputFormats: + amp: + baseName: index + isHTML: true + isPlainText: false + mediaType: text/html + noUgly: false + notAlternative: false + path: amp + permalinkable: true + protocol: "" + rel: amphtml + root: false + ugly: false + weight: 0 + calendar: + baseName: index + isHTML: false + isPlainText: true + mediaType: text/calendar + noUgly: false + notAlternative: false + path: "" + permalinkable: false + protocol: webcal:// + rel: alternate + root: false + ugly: false + weight: 0 + css: + baseName: styles + isHTML: false + isPlainText: true + mediaType: text/css + noUgly: false + notAlternative: true + path: "" + permalinkable: false + protocol: "" + rel: stylesheet + root: false + ugly: false + weight: 0 + csv: + baseName: index + isHTML: false + isPlainText: true + mediaType: text/csv + noUgly: false + notAlternative: false + path: "" + permalinkable: false + protocol: "" + rel: alternate + root: false + ugly: false + weight: 0 + html: + baseName: index + isHTML: true + isPlainText: false + mediaType: text/html + noUgly: false + notAlternative: false + path: "" + permalinkable: true + protocol: "" + rel: canonical + root: false + ugly: false + weight: 10 + json: + baseName: index + isHTML: false + isPlainText: true + mediaType: application/json + noUgly: false + notAlternative: false + path: "" + permalinkable: false + protocol: "" + rel: alternate + root: false + ugly: false + weight: 0 + markdown: + baseName: index + isHTML: false + isPlainText: true + mediaType: text/markdown + noUgly: false + notAlternative: false + path: "" + permalinkable: false + protocol: "" + rel: alternate + root: false + ugly: false + weight: 0 + robots: + baseName: robots + isHTML: false + isPlainText: true + mediaType: text/plain + noUgly: false + notAlternative: false + path: "" + permalinkable: false + protocol: "" + rel: alternate + root: true + ugly: false + weight: 0 + rss: + baseName: index + isHTML: false + isPlainText: false + mediaType: application/rss+xml + noUgly: true + notAlternative: false + path: "" + permalinkable: false + protocol: "" + rel: alternate + root: false + ugly: false + weight: 0 + sitemap: + baseName: sitemap + isHTML: false + isPlainText: false + mediaType: application/xml + noUgly: false + notAlternative: false + path: "" + permalinkable: false + protocol: "" + rel: sitemap + root: false + ugly: true + weight: 0 + webappmanifest: + baseName: manifest + isHTML: false + isPlainText: true + mediaType: application/manifest+json + noUgly: false + notAlternative: true + path: "" + permalinkable: false + protocol: "" + rel: manifest + root: false + ugly: false + weight: 0 + outputs: + home: + - html + - rss + page: + - html + rss: + - rss + section: + - html + - rss + taxonomy: + - html + - rss + term: + - html + - rss + page: + nextPrevInSectionSortOrder: desc + nextPrevSortOrder: desc + paginate: 0 + paginatePath: "" + pagination: + disableAliases: false + pagerSize: 10 + path: page + panicOnWarning: false + params: {} + permalinks: + page: {} + section: {} + taxonomy: {} + term: {} + pluralizeListTitles: true + printI18nWarnings: false + printPathWarnings: false + printUnusedTemplates: false + privacy: + disqus: + disable: false + googleAnalytics: + disable: false + respectDoNotTrack: false + instagram: + disable: false + simple: false + twitter: + disable: false + enableDNT: false + simple: false + vimeo: + disable: false + enableDNT: false + simple: false ++ x: ++ disable: false ++ enableDNT: false ++ simple: false + youTube: + disable: false + privacyEnhanced: false + publishDir: public + refLinksErrorLevel: "" + refLinksNotFoundURL: "" + related: + includeNewer: false + indices: + - applyFilter: false + cardinalityThreshold: 0 + name: keywords + pattern: "" + toLower: false + type: basic + weight: 100 + - applyFilter: false + cardinalityThreshold: 0 + name: date + pattern: "" + toLower: false + type: basic + weight: 10 + - applyFilter: false + cardinalityThreshold: 0 + name: tags + pattern: "" + toLower: false + type: basic + weight: 80 + threshold: 80 + toLower: false + relativeURLs: false + removePathAccents: false + renderSegments: null + resourceDir: resources + sectionPagesMenu: "" + security: + enableInlineShortcodes: false + exec: + allow: + - ^(dart-)?sass(-embedded)?$ + - ^go$ + - ^git$ + - ^npx$ + - ^postcss$ + - ^tailwindcss$ + osEnv: + - (?i)^((HTTPS?|NO)_PROXY|PATH(EXT)?|APPDATA|TE?MP|TERM|GO\w+|(XDG_CONFIG_)?HOME|USERPROFILE|SSH_AUTH_SOCK|DISPLAY|LANG|SYSTEMDRIVE)$ + funcs: + getenv: + - ^HUGO_ + - ^CI$ + http: + mediaTypes: null + methods: + - (?i)GET|POST + urls: + - .* + segments: {} + server: + headers: null + redirects: + - force: false + from: '**' + status: 404 + to: /404.html + services: + disqus: + shortname: "" + googleAnalytics: + id: "" + instagram: + accessToken: "" + disableInlineCSS: false + rss: + limit: -1 + twitter: + disableInlineCSS: false ++ x: ++ disableInlineCSS: false + sitemap: + changeFreq: "" + disable: false + filename: sitemap.xml + priority: -1 + social: null + staticDir: + - static + staticDir0: null + staticDir1: null + staticDir2: null + staticDir3: null + staticDir4: null + staticDir5: null + staticDir6: null + staticDir7: null + staticDir8: null + staticDir9: null + staticDir10: null + summaryLength: 70 + taxonomies: + category: categories + tag: tags + templateMetrics: false + templateMetricsHints: false + theme: null + themesDir: themes + timeZone: "" + timeout: 30s + title: "" + titleCaseStyle: AP + uglyURLs: false + workingDir: "" +config_helpers: + mergeStrategy: + build: + _merge: none + caches: + _merge: none + cascade: + _merge: none + deployment: + _merge: none + frontmatter: + _merge: none + httpcache: + _merge: none + imaging: + _merge: none + languages: + _merge: none + en: + _merge: none + menus: + _merge: shallow + params: + _merge: deep + markup: + _merge: none + mediatypes: + _merge: shallow + menus: + _merge: shallow + minify: + _merge: none + module: + _merge: none + outputformats: + _merge: shallow + outputs: + _merge: none + page: + _merge: none + pagination: + _merge: none + params: + _merge: deep + permalinks: + _merge: none + privacy: + _merge: none + related: + _merge: none + security: + _merge: none + segments: + _merge: none + server: + _merge: none + services: + _merge: none + sitemap: + _merge: none + taxonomies: + _merge: none +output: + layouts: + - Example: Single page in "posts" section + Kind: page + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/posts/single.html.html + - layouts/posts/single.html + - layouts/_default/single.html.html + - layouts/_default/single.html + - Example: Base template for single page in "posts" section + Kind: page + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/posts/single-baseof.html.html + - layouts/posts/baseof.html.html + - layouts/posts/single-baseof.html + - layouts/posts/baseof.html + - layouts/_default/single-baseof.html.html + - layouts/_default/baseof.html.html + - layouts/_default/single-baseof.html + - layouts/_default/baseof.html + - Example: Single page in "posts" section with layout set to "demolayout" + Kind: page + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/posts/demolayout.html.html + - layouts/posts/single.html.html + - layouts/posts/demolayout.html + - layouts/posts/single.html + - layouts/_default/demolayout.html.html + - layouts/_default/single.html.html + - layouts/_default/demolayout.html + - layouts/_default/single.html + - Example: Base template for single page in "posts" section with layout set to "demolayout" + Kind: page + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/posts/demolayout-baseof.html.html + - layouts/posts/single-baseof.html.html + - layouts/posts/baseof.html.html + - layouts/posts/demolayout-baseof.html + - layouts/posts/single-baseof.html + - layouts/posts/baseof.html + - layouts/_default/demolayout-baseof.html.html + - layouts/_default/single-baseof.html.html + - layouts/_default/baseof.html.html + - layouts/_default/demolayout-baseof.html + - layouts/_default/single-baseof.html + - layouts/_default/baseof.html + - Example: AMP single page in "posts" section + Kind: page + OutputFormat: amp + Suffix: html + Template Lookup Order: + - layouts/posts/single.amp.html + - layouts/posts/single.html + - layouts/_default/single.amp.html + - layouts/_default/single.html + - Example: AMP single page in "posts" section, French language + Kind: page + OutputFormat: amp + Suffix: html + Template Lookup Order: + - layouts/posts/single.fr.amp.html + - layouts/posts/single.amp.html + - layouts/posts/single.fr.html + - layouts/posts/single.html + - layouts/_default/single.fr.amp.html + - layouts/_default/single.amp.html + - layouts/_default/single.fr.html + - layouts/_default/single.html + - Example: Home page + Kind: home + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/index.html.html + - layouts/home.html.html + - layouts/list.html.html + - layouts/index.html + - layouts/home.html + - layouts/list.html + - layouts/_default/index.html.html + - layouts/_default/home.html.html + - layouts/_default/list.html.html + - layouts/_default/index.html + - layouts/_default/home.html + - layouts/_default/list.html + - Example: Base template for home page + Kind: home + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/index-baseof.html.html + - layouts/home-baseof.html.html + - layouts/list-baseof.html.html + - layouts/baseof.html.html + - layouts/index-baseof.html + - layouts/home-baseof.html + - layouts/list-baseof.html + - layouts/baseof.html + - layouts/_default/index-baseof.html.html + - layouts/_default/home-baseof.html.html + - layouts/_default/list-baseof.html.html + - layouts/_default/baseof.html.html + - layouts/_default/index-baseof.html + - layouts/_default/home-baseof.html + - layouts/_default/list-baseof.html + - layouts/_default/baseof.html + - Example: Home page with type set to "demotype" + Kind: home + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/demotype/index.html.html + - layouts/demotype/home.html.html + - layouts/demotype/list.html.html + - layouts/demotype/index.html + - layouts/demotype/home.html + - layouts/demotype/list.html + - layouts/index.html.html + - layouts/home.html.html + - layouts/list.html.html + - layouts/index.html + - layouts/home.html + - layouts/list.html + - layouts/_default/index.html.html + - layouts/_default/home.html.html + - layouts/_default/list.html.html + - layouts/_default/index.html + - layouts/_default/home.html + - layouts/_default/list.html + - Example: Base template for home page with type set to "demotype" + Kind: home + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/demotype/index-baseof.html.html + - layouts/demotype/home-baseof.html.html + - layouts/demotype/list-baseof.html.html + - layouts/demotype/baseof.html.html + - layouts/demotype/index-baseof.html + - layouts/demotype/home-baseof.html + - layouts/demotype/list-baseof.html + - layouts/demotype/baseof.html + - layouts/index-baseof.html.html + - layouts/home-baseof.html.html + - layouts/list-baseof.html.html + - layouts/baseof.html.html + - layouts/index-baseof.html + - layouts/home-baseof.html + - layouts/list-baseof.html + - layouts/baseof.html + - layouts/_default/index-baseof.html.html + - layouts/_default/home-baseof.html.html + - layouts/_default/list-baseof.html.html + - layouts/_default/baseof.html.html + - layouts/_default/index-baseof.html + - layouts/_default/home-baseof.html + - layouts/_default/list-baseof.html + - layouts/_default/baseof.html + - Example: Home page with layout set to "demolayout" + Kind: home + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/demolayout.html.html + - layouts/index.html.html + - layouts/home.html.html + - layouts/list.html.html + - layouts/demolayout.html + - layouts/index.html + - layouts/home.html + - layouts/list.html + - layouts/_default/demolayout.html.html + - layouts/_default/index.html.html + - layouts/_default/home.html.html + - layouts/_default/list.html.html + - layouts/_default/demolayout.html + - layouts/_default/index.html + - layouts/_default/home.html + - layouts/_default/list.html + - Example: AMP home, French language + Kind: home + OutputFormat: amp + Suffix: html + Template Lookup Order: + - layouts/index.fr.amp.html + - layouts/home.fr.amp.html + - layouts/list.fr.amp.html + - layouts/index.amp.html + - layouts/home.amp.html + - layouts/list.amp.html + - layouts/index.fr.html + - layouts/home.fr.html + - layouts/list.fr.html + - layouts/index.html + - layouts/home.html + - layouts/list.html + - layouts/_default/index.fr.amp.html + - layouts/_default/home.fr.amp.html + - layouts/_default/list.fr.amp.html + - layouts/_default/index.amp.html + - layouts/_default/home.amp.html + - layouts/_default/list.amp.html + - layouts/_default/index.fr.html + - layouts/_default/home.fr.html + - layouts/_default/list.fr.html + - layouts/_default/index.html + - layouts/_default/home.html + - layouts/_default/list.html + - Example: JSON home + Kind: home + OutputFormat: json + Suffix: json + Template Lookup Order: + - layouts/index.json.json + - layouts/home.json.json + - layouts/list.json.json + - layouts/index.json + - layouts/home.json + - layouts/list.json + - layouts/_default/index.json.json + - layouts/_default/home.json.json + - layouts/_default/list.json.json + - layouts/_default/index.json + - layouts/_default/home.json + - layouts/_default/list.json + - Example: RSS home + Kind: home + OutputFormat: rss + Suffix: xml + Template Lookup Order: + - layouts/index.rss.xml + - layouts/home.rss.xml + - layouts/rss.xml + - layouts/list.rss.xml + - layouts/index.xml + - layouts/home.xml + - layouts/list.xml + - layouts/_default/index.rss.xml + - layouts/_default/home.rss.xml + - layouts/_default/rss.xml + - layouts/_default/list.rss.xml + - layouts/_default/index.xml + - layouts/_default/home.xml + - layouts/_default/list.xml + - layouts/_internal/_default/rss.xml + - Example: Section list for "posts" + Kind: section + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/posts/posts.html.html + - layouts/posts/section.html.html + - layouts/posts/list.html.html + - layouts/posts/posts.html + - layouts/posts/section.html + - layouts/posts/list.html + - layouts/section/posts.html.html + - layouts/section/section.html.html + - layouts/section/list.html.html + - layouts/section/posts.html + - layouts/section/section.html + - layouts/section/list.html + - layouts/_default/posts.html.html + - layouts/_default/section.html.html + - layouts/_default/list.html.html + - layouts/_default/posts.html + - layouts/_default/section.html + - layouts/_default/list.html + - Example: Section list for "posts" with type set to "blog" + Kind: section + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/blog/posts.html.html + - layouts/blog/section.html.html + - layouts/blog/list.html.html + - layouts/blog/posts.html + - layouts/blog/section.html + - layouts/blog/list.html + - layouts/posts/posts.html.html + - layouts/posts/section.html.html + - layouts/posts/list.html.html + - layouts/posts/posts.html + - layouts/posts/section.html + - layouts/posts/list.html + - layouts/section/posts.html.html + - layouts/section/section.html.html + - layouts/section/list.html.html + - layouts/section/posts.html + - layouts/section/section.html + - layouts/section/list.html + - layouts/_default/posts.html.html + - layouts/_default/section.html.html + - layouts/_default/list.html.html + - layouts/_default/posts.html + - layouts/_default/section.html + - layouts/_default/list.html + - Example: Section list for "posts" with layout set to "demolayout" + Kind: section + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/posts/demolayout.html.html + - layouts/posts/posts.html.html + - layouts/posts/section.html.html + - layouts/posts/list.html.html + - layouts/posts/demolayout.html + - layouts/posts/posts.html + - layouts/posts/section.html + - layouts/posts/list.html + - layouts/section/demolayout.html.html + - layouts/section/posts.html.html + - layouts/section/section.html.html + - layouts/section/list.html.html + - layouts/section/demolayout.html + - layouts/section/posts.html + - layouts/section/section.html + - layouts/section/list.html + - layouts/_default/demolayout.html.html + - layouts/_default/posts.html.html + - layouts/_default/section.html.html + - layouts/_default/list.html.html + - layouts/_default/demolayout.html + - layouts/_default/posts.html + - layouts/_default/section.html + - layouts/_default/list.html + - Example: Section list for "posts" + Kind: section + OutputFormat: rss + Suffix: xml + Template Lookup Order: + - layouts/posts/section.rss.xml + - layouts/posts/rss.xml + - layouts/posts/list.rss.xml + - layouts/posts/section.xml + - layouts/posts/list.xml + - layouts/section/section.rss.xml + - layouts/section/rss.xml + - layouts/section/list.rss.xml + - layouts/section/section.xml + - layouts/section/list.xml + - layouts/_default/section.rss.xml + - layouts/_default/rss.xml + - layouts/_default/list.rss.xml + - layouts/_default/section.xml + - layouts/_default/list.xml + - layouts/_internal/_default/rss.xml + - Example: Taxonomy list for "categories" + Kind: taxonomy + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/categories/category.terms.html.html + - layouts/categories/terms.html.html + - layouts/categories/taxonomy.html.html + - layouts/categories/list.html.html + - layouts/categories/category.terms.html + - layouts/categories/terms.html + - layouts/categories/taxonomy.html + - layouts/categories/list.html + - layouts/category/category.terms.html.html + - layouts/category/terms.html.html + - layouts/category/taxonomy.html.html + - layouts/category/list.html.html + - layouts/category/category.terms.html + - layouts/category/terms.html + - layouts/category/taxonomy.html + - layouts/category/list.html + - layouts/taxonomy/category.terms.html.html + - layouts/taxonomy/terms.html.html + - layouts/taxonomy/taxonomy.html.html + - layouts/taxonomy/list.html.html + - layouts/taxonomy/category.terms.html + - layouts/taxonomy/terms.html + - layouts/taxonomy/taxonomy.html + - layouts/taxonomy/list.html + - layouts/_default/category.terms.html.html + - layouts/_default/terms.html.html + - layouts/_default/taxonomy.html.html + - layouts/_default/list.html.html + - layouts/_default/category.terms.html + - layouts/_default/terms.html + - layouts/_default/taxonomy.html + - layouts/_default/list.html + - Example: Taxonomy list for "categories" + Kind: taxonomy + OutputFormat: rss + Suffix: xml + Template Lookup Order: + - layouts/categories/category.terms.rss.xml + - layouts/categories/terms.rss.xml + - layouts/categories/taxonomy.rss.xml + - layouts/categories/rss.xml + - layouts/categories/list.rss.xml + - layouts/categories/category.terms.xml + - layouts/categories/terms.xml + - layouts/categories/taxonomy.xml + - layouts/categories/list.xml + - layouts/category/category.terms.rss.xml + - layouts/category/terms.rss.xml + - layouts/category/taxonomy.rss.xml + - layouts/category/rss.xml + - layouts/category/list.rss.xml + - layouts/category/category.terms.xml + - layouts/category/terms.xml + - layouts/category/taxonomy.xml + - layouts/category/list.xml + - layouts/taxonomy/category.terms.rss.xml + - layouts/taxonomy/terms.rss.xml + - layouts/taxonomy/taxonomy.rss.xml + - layouts/taxonomy/rss.xml + - layouts/taxonomy/list.rss.xml + - layouts/taxonomy/category.terms.xml + - layouts/taxonomy/terms.xml + - layouts/taxonomy/taxonomy.xml + - layouts/taxonomy/list.xml + - layouts/_default/category.terms.rss.xml + - layouts/_default/terms.rss.xml + - layouts/_default/taxonomy.rss.xml + - layouts/_default/rss.xml + - layouts/_default/list.rss.xml + - layouts/_default/category.terms.xml + - layouts/_default/terms.xml + - layouts/_default/taxonomy.xml + - layouts/_default/list.xml + - layouts/_internal/_default/rss.xml + - Example: Term list for "categories" + Kind: term + OutputFormat: html + Suffix: html + Template Lookup Order: + - layouts/categories/term.html.html + - layouts/categories/category.html.html + - layouts/categories/taxonomy.html.html + - layouts/categories/list.html.html + - layouts/categories/term.html + - layouts/categories/category.html + - layouts/categories/taxonomy.html + - layouts/categories/list.html + - layouts/term/term.html.html + - layouts/term/category.html.html + - layouts/term/taxonomy.html.html + - layouts/term/list.html.html + - layouts/term/term.html + - layouts/term/category.html + - layouts/term/taxonomy.html + - layouts/term/list.html + - layouts/taxonomy/term.html.html + - layouts/taxonomy/category.html.html + - layouts/taxonomy/taxonomy.html.html + - layouts/taxonomy/list.html.html + - layouts/taxonomy/term.html + - layouts/taxonomy/category.html + - layouts/taxonomy/taxonomy.html + - layouts/taxonomy/list.html + - layouts/category/term.html.html + - layouts/category/category.html.html + - layouts/category/taxonomy.html.html + - layouts/category/list.html.html + - layouts/category/term.html + - layouts/category/category.html + - layouts/category/taxonomy.html + - layouts/category/list.html + - layouts/_default/term.html.html + - layouts/_default/category.html.html + - layouts/_default/taxonomy.html.html + - layouts/_default/list.html.html + - layouts/_default/term.html + - layouts/_default/category.html + - layouts/_default/taxonomy.html + - layouts/_default/list.html + - Example: Term list for "categories" + Kind: term + OutputFormat: rss + Suffix: xml + Template Lookup Order: + - layouts/categories/term.rss.xml + - layouts/categories/category.rss.xml + - layouts/categories/taxonomy.rss.xml + - layouts/categories/rss.xml + - layouts/categories/list.rss.xml + - layouts/categories/term.xml + - layouts/categories/category.xml + - layouts/categories/taxonomy.xml + - layouts/categories/list.xml + - layouts/term/term.rss.xml + - layouts/term/category.rss.xml + - layouts/term/taxonomy.rss.xml + - layouts/term/rss.xml + - layouts/term/list.rss.xml + - layouts/term/term.xml + - layouts/term/category.xml + - layouts/term/taxonomy.xml + - layouts/term/list.xml + - layouts/taxonomy/term.rss.xml + - layouts/taxonomy/category.rss.xml + - layouts/taxonomy/taxonomy.rss.xml + - layouts/taxonomy/rss.xml + - layouts/taxonomy/list.rss.xml + - layouts/taxonomy/term.xml + - layouts/taxonomy/category.xml + - layouts/taxonomy/taxonomy.xml + - layouts/taxonomy/list.xml + - layouts/category/term.rss.xml + - layouts/category/category.rss.xml + - layouts/category/taxonomy.rss.xml + - layouts/category/rss.xml + - layouts/category/list.rss.xml + - layouts/category/term.xml + - layouts/category/category.xml + - layouts/category/taxonomy.xml + - layouts/category/list.xml + - layouts/_default/term.rss.xml + - layouts/_default/category.rss.xml + - layouts/_default/taxonomy.rss.xml + - layouts/_default/rss.xml + - layouts/_default/list.rss.xml + - layouts/_default/term.xml + - layouts/_default/category.xml + - layouts/_default/taxonomy.xml + - layouts/_default/list.xml + - layouts/_internal/_default/rss.xml +tpl: + funcs: + cast: + ToFloat: + Aliases: + - float + Args: + - v + Description: ToFloat converts v to a float. + Examples: + - - '{{ "1234" | float | printf "%T" }}' + - float64 + ToInt: + Aliases: + - int + Args: + - v + Description: ToInt converts v to an int. + Examples: + - - '{{ "1234" | int | printf "%T" }}' + - int + ToString: + Aliases: + - string + Args: + - v + Description: ToString converts v to a string. + Examples: + - - '{{ 1234 | string | printf "%T" }}' + - string + collections: + After: + Aliases: + - after + Args: + - "n" + - l + Description: After returns all the items after the first n items in list l. + Examples: [] + Append: + Aliases: + - append + Args: + - args + Description: "Append appends args up to the last one to the slice in the last + argument.\nThis construct allows template constructs like this:\n\n\t{{ + $pages = $pages | append $p2 $p1 }}\n\nNote that with 2 arguments where + both are slices of the same type,\nthe first slice will be appended to the + second:\n\n\t{{ $pages = $pages | append .Site.RegularPages }}" + Examples: [] + Apply: + Aliases: + - apply + Args: + - ctx + - c + - fname + - args + Description: Apply takes an array or slice c and returns a new slice with + the function fname applied over it. + Examples: [] + Complement: + Aliases: + - complement + Args: + - ls + Description: "Complement gives the elements in the last element of ls that + are not in\nany of the others.\n\nAll elements of ls must be slices or arrays + of comparable types.\n\nThe reasoning behind this rather clumsy API is so + we can do this in the templates:\n\n\t{{ $c := .Pages | complement $last4 + }}" + Examples: + - - '{{ slice "a" "b" "c" "d" "e" "f" | complement (slice "b" "c") (slice + "d" "e") }}' + - '[a f]' + Delimit: + Aliases: + - delimit + Args: + - ctx + - l + - sep + - last + Description: |- + Delimit takes a given list l and returns a string delimited by sep. + If last is passed to the function, it will be used as the final delimiter. + Examples: + - - '{{ delimit (slice "A" "B" "C") ", " " and " }}' + - A, B and C + Dictionary: + Aliases: + - dict + Args: + - values + Description: |- + Dictionary creates a new map from the given parameters by + treating values as key-value pairs. The number of values must be even. + The keys can be string slices, which will create the needed nested structure. + Examples: [] + First: + Aliases: + - first + Args: + - limit + - l + Description: First returns the first limit items in list l. + Examples: [] + Group: + Aliases: + - group + Args: + - key + - items + Description: |- + Group groups a set of items by the given key. + This is currently only supported for Pages. + Examples: [] + In: + Aliases: + - in + Args: + - l + - v + Description: In returns whether v is in the list l. l may be an array or + slice. + Examples: + - - '{{ if in "this string contains a substring" "substring" }}Substring found!{{ + end }}' + - Substring found! + Index: + Aliases: + - index + Args: + - item + - args + Description: |- + Index returns the result of indexing its first argument by the following + arguments. Thus "index x 1 2 3" is, in Go syntax, x[1][2][3]. Each + indexed item must be a map, slice, or array. + + Adapted from Go stdlib src/text/template/funcs.go. + + We deviate from the stdlib mostly because of https://github.com/golang/go/issues/14751. + Examples: [] + Intersect: + Aliases: + - intersect + Args: + - l1 + - l2 + Description: |- + Intersect returns the common elements in the given sets, l1 and l2. l1 and + l2 must be of the same type and may be either arrays or slices. + Examples: [] + IsSet: + Aliases: + - isSet + - isset + Args: + - c + - key + Description: |- + IsSet returns whether a given array, channel, slice, or map in c has the given key + defined. + Examples: [] + KeyVals: + Aliases: + - keyVals + Args: + - key + - values + Description: KeyVals creates a key and values wrapper. + Examples: + - - '{{ keyVals "key" "a" "b" }}' + - 'key: [a b]' + Last: + Aliases: + - last + Args: + - limit + - l + Description: Last returns the last limit items in the list l. + Examples: [] + Merge: + Aliases: + - merge + Args: + - params + Description: |- + Merge creates a copy of the final parameter in params and merges the preceding + parameters into it in reverse order. + + Currently only maps are supported. Key handling is case insensitive. + Examples: + - - '{{ dict "title" "Hugo Rocks!" | collections.Merge (dict "title" "Default + Title" "description" "Yes, Hugo Rocks!") | sort }}' + - '[Yes, Hugo Rocks! Hugo Rocks!]' + - - '{{ merge (dict "title" "Default Title" "description" "Yes, Hugo Rocks!") + (dict "title" "Hugo Rocks!") | sort }}' + - '[Yes, Hugo Rocks! Hugo Rocks!]' + - - '{{ merge (dict "title" "Default Title" "description" "Yes, Hugo Rocks!") + (dict "title" "Hugo Rocks!") (dict "extra" "For reals!") | sort }}' + - '[Yes, Hugo Rocks! For reals! Hugo Rocks!]' + NewScratch: + Aliases: + - newScratch + Args: null + Description: |- + NewScratch creates a new Scratch which can be used to store values in a + thread safe way. + Examples: + - - '{{ $scratch := newScratch }}{{ $scratch.Add "b" 2 }}{{ $scratch.Add "b" + 2 }}{{ $scratch.Get "b" }}' + - "4" + Querify: + Aliases: + - querify + Args: + - params + Description: |- + Querify returns a URL query string composed of the given key-value pairs, + encoded and sorted by key. + Examples: + - - '{{ (querify "foo" 1 "bar" 2 "baz" "with spaces" "qux" "this&that=those") + | safeHTML }}' + - bar=2&baz=with+spaces&foo=1&qux=this%26that%3Dthose + - - Search + - Search + - - '{{ slice "foo" 1 "bar" 2 | querify | safeHTML }}' + - bar=2&foo=1 + Reverse: + Aliases: null + Args: null + Description: "" + Examples: null + Seq: + Aliases: + - seq + Args: + - args + Description: "Seq creates a sequence of integers from args. It's named and + used as GNU's seq.\n\nExamples:\n\n\t3 => 1, 2, 3\n\t1 2 4 => 1, 3\n\t-3 + => -1, -2, -3\n\t1 4 => 1, 2, 3, 4\n\t1 -2 => 1, 0, -1, -2" + Examples: + - - '{{ seq 3 }}' + - '[1 2 3]' + Shuffle: + Aliases: + - shuffle + Args: + - l + Description: Shuffle returns list l in a randomized order. + Examples: [] + Slice: + Aliases: + - slice + Args: + - args + Description: Slice returns a slice of all passed arguments. + Examples: + - - '{{ slice "B" "C" "A" | sort }}' + - '[A B C]' + Sort: + Aliases: + - sort + Args: + - ctx + - l + - args + Description: Sort returns a sorted copy of the list l. + Examples: [] + SymDiff: + Aliases: + - symdiff + Args: + - s2 + - s1 + Description: |- + SymDiff returns the symmetric difference of s1 and s2. + Arguments must be either a slice or an array of comparable types. + Examples: + - - '{{ slice 1 2 3 | symdiff (slice 3 4) }}' + - '[1 2 4]' + Union: + Aliases: + - union + Args: + - l1 + - l2 + Description: |- + Union returns the union of the given sets, l1 and l2. l1 and + l2 must be of the same type and may be either arrays or slices. + If l1 and l2 aren't of the same type then l1 will be returned. + If either l1 or l2 is nil then the non-nil list will be returned. + Examples: + - - '{{ union (slice 1 2 3) (slice 3 4 5) }}' + - '[1 2 3 4 5]' + Uniq: + Aliases: + - uniq + Args: + - l + Description: Uniq returns a new list with duplicate elements in the list l + removed. + Examples: + - - '{{ slice 1 2 3 2 | uniq }}' + - '[1 2 3]' + Where: + Aliases: + - where + Args: + - ctx + - c + - key + - args + Description: Where returns a filtered subset of collection c. + Examples: [] + compare: + Conditional: + Aliases: + - cond + Args: + - cond + - v1 + - v2 + Description: |- + Conditional can be used as a ternary operator. + + It returns v1 if cond is true, else v2. + Examples: + - - '{{ cond (eq (add 2 2) 4) "2+2 is 4" "what?" | safeHTML }}' + - 2+2 is 4 + Default: + Aliases: + - default + Args: + - defaultv + - givenv + Description: |- + Default checks whether a givenv is set and returns the default value defaultv if it + is not. "Set" in this context means non-zero for numeric types and times; + non-zero length for strings, arrays, slices, and maps; + any boolean or struct value; or non-nil for any other types. + Examples: + - - '{{ "Hugo Rocks!" | default "Hugo Rules!" }}' + - Hugo Rocks! + - - '{{ "" | default "Hugo Rules!" }}' + - Hugo Rules! + Eq: + Aliases: + - eq + Args: + - first + - others + Description: Eq returns the boolean truth of arg1 == arg2 || arg1 == arg3 + || arg1 == arg4. + Examples: + - - '{{ if eq .Section "blog" }}current-section{{ end }}' + - current-section + Ge: + Aliases: + - ge + Args: + - first + - others + Description: Ge returns the boolean truth of arg1 >= arg2 && arg1 >= arg3 + && arg1 >= arg4. + Examples: + - - '{{ if ge hugo.Version "0.80" }}Reasonable new Hugo version!{{ end }}' + - Reasonable new Hugo version! + Gt: + Aliases: + - gt + Args: + - first + - others + Description: Gt returns the boolean truth of arg1 > arg2 && arg1 > arg3 && + arg1 > arg4. + Examples: [] + Le: + Aliases: + - le + Args: + - first + - others + Description: Le returns the boolean truth of arg1 <= arg2 && arg1 <= arg3 + && arg1 <= arg4. + Examples: [] + Lt: + Aliases: + - lt + Args: + - first + - others + Description: Lt returns the boolean truth of arg1 < arg2 && arg1 < arg3 && + arg1 < arg4. + Examples: [] + LtCollate: + Aliases: null + Args: null + Description: "" + Examples: null + Ne: + Aliases: + - ne + Args: + - first + - others + Description: Ne returns the boolean truth of arg1 != arg2 && arg1 != arg3 + && arg1 != arg4. + Examples: [] + crypto: + FNV32a: + Aliases: null + Args: null + Description: "" + Examples: null + HMAC: + Aliases: + - hmac + Args: + - h + - k + - m + - e + Description: HMAC returns a cryptographic hash that uses a key to sign a message. + Examples: + - - '{{ hmac "sha256" "Secret key" "Hello world, gophers!" }}' + - b6d11b6c53830b9d87036272ca9fe9d19306b8f9d8aa07b15da27d89e6e34f40 + MD5: + Aliases: + - md5 + Args: + - v + Description: MD5 hashes the v and returns its MD5 checksum. + Examples: + - - '{{ md5 "Hello world, gophers!" }}' + - b3029f756f98f79e7f1b7f1d1f0dd53b + - - '{{ crypto.MD5 "Hello world, gophers!" }}' + - b3029f756f98f79e7f1b7f1d1f0dd53b + SHA1: + Aliases: + - sha1 + Args: + - v + Description: SHA1 hashes v and returns its SHA1 checksum. + Examples: + - - '{{ sha1 "Hello world, gophers!" }}' + - c8b5b0e33d408246e30f53e32b8f7627a7a649d4 + SHA256: + Aliases: + - sha256 + Args: + - v + Description: SHA256 hashes v and returns its SHA256 checksum. + Examples: + - - '{{ sha256 "Hello world, gophers!" }}' + - 6ec43b78da9669f50e4e422575c54bf87536954ccd58280219c393f2ce352b46 + css: + PostCSS: + Aliases: + - postCSS + Args: + - args + Description: PostCSS processes the given Resource with PostCSS. + Examples: [] + Quoted: + Aliases: null + Args: null + Description: "" + Examples: null + Sass: + Aliases: + - toCSS + Args: + - args + Description: Sass processes the given Resource with SASS. + Examples: [] + TailwindCSS: + Aliases: null + Args: null + Description: "" + Examples: null + Unquoted: + Aliases: null + Args: null + Description: "" + Examples: null + data: + GetCSV: + Aliases: + - getCSV + Args: + - sep + - args + Description: |- + GetCSV expects the separator sep and one or n-parts of a URL to a resource which + can either be a local or a remote one. + The data separator can be a comma, semi-colon, pipe, etc, but only one character. + If you provide multiple parts for the URL they will be joined together to the final URL. + GetCSV returns nil or a slice slice to use in a short code. + Examples: [] + GetJSON: + Aliases: + - getJSON + Args: + - args + Description: |- + GetJSON expects one or n-parts of a URL in args to a resource which can either be a local or a remote one. + If you provide multiple parts they will be joined together to the final URL. + GetJSON returns nil or parsed JSON to use in a short code. + Examples: [] + debug: + Dump: + Aliases: null + Args: + - val + Description: |- + Dump returns a object dump of val as a string. + Note that not every value passed to Dump will print so nicely, but + we'll improve on that. + + We recommend using the "go" Chroma lexer to format the output + nicely. + + Also note that the output from Dump may change from Hugo version to the next, + so don't depend on a specific output. + Examples: + - - |- + {{ $m := newScratch }} + {{ $m.Set "Hugo" "Rocks!" }} + {{ $m.Values | debug.Dump | safeHTML }} + - |- + { + "Hugo": "Rocks!" + } + TestDeprecationErr: + Aliases: null + Args: null + Description: "" + Examples: null + TestDeprecationInfo: + Aliases: null + Args: null + Description: "" + Examples: null + TestDeprecationWarn: + Aliases: null + Args: null + Description: "" + Examples: null + Timer: + Aliases: null + Args: null + Description: "" + Examples: null + VisualizeSpaces: + Aliases: null + Args: null + Description: "" + Examples: null + diagrams: + Goat: + Aliases: null + Args: null + Description: "" + Examples: null + encoding: + Base64Decode: + Aliases: + - base64Decode + Args: + - content + Description: Base64Decode returns the base64 decoding of the given content. + Examples: + - - '{{ "SGVsbG8gd29ybGQ=" | base64Decode }}' + - Hello world + - - '{{ 42 | base64Encode | base64Decode }}' + - "42" + Base64Encode: + Aliases: + - base64Encode + Args: + - content + Description: Base64Encode returns the base64 encoding of the given content. + Examples: + - - '{{ "Hello world" | base64Encode }}' + - SGVsbG8gd29ybGQ= + Jsonify: + Aliases: + - jsonify + Args: + - args + Description: |- + Jsonify encodes a given object to JSON. To pretty print the JSON, pass a map + or dictionary of options as the first value in args. Supported options are + "prefix" and "indent". Each JSON element in the output will begin on a new + line beginning with prefix followed by one or more copies of indent according + to the indentation nesting. + Examples: + - - '{{ (slice "A" "B" "C") | jsonify }}' + - '["A","B","C"]' + - - '{{ (slice "A" "B" "C") | jsonify (dict "indent" " ") }}' + - |- + [ + "A", + "B", + "C" + ] + fmt: + Errorf: + Aliases: + - errorf + Args: + - format + - args + Description: |- + Errorf formats args according to a format specifier and logs an ERROR. + It returns an empty string. + Examples: + - - '{{ errorf "%s." "failed" }}' + - "" + Erroridf: + Aliases: + - erroridf + Args: + - id + - format + - args + Description: |- + Erroridf formats args according to a format specifier and logs an ERROR and + an information text that the error with the given id can be suppressed in config. + It returns an empty string. + Examples: + - - '{{ erroridf "my-err-id" "%s." "failed" }}' + - "" + Errormf: + Aliases: null + Args: null + Description: "" + Examples: null + Print: + Aliases: + - print + Args: + - args + Description: Print returns a string representation of args. + Examples: + - - '{{ print "works!" }}' + - works! + Printf: + Aliases: + - printf + Args: + - format + - args + Description: Printf returns string representation of args formatted with the + layout in format. + Examples: + - - '{{ printf "%s!" "works" }}' + - works! + Println: + Aliases: + - println + Args: + - args + Description: Println returns string representation of args ending with a + newline. + Examples: + - - '{{ println "works!" }}' + - | + works! + Warnf: + Aliases: + - warnf + Args: + - format + - args + Description: |- + Warnf formats args according to a format specifier and logs a WARNING. + It returns an empty string. + Examples: + - - '{{ warnf "%s." "warning" }}' + - "" + Warnidf: + Aliases: + - warnidf + Args: + - id + - format + - args + Description: |- + Warnidf formats args according to a format specifier and logs an WARNING and + an information text that the warning with the given id can be suppressed in config. + It returns an empty string. + Examples: + - - '{{ warnidf "my-warn-id" "%s." "warning" }}' + - "" + Warnmf: + Aliases: null + Args: null + Description: "" + Examples: null + hash: + FNV32a: + Aliases: null + Args: + - v + Description: FNV32a hashes v using fnv32a algorithm. + Examples: + - - '{{ hash.FNV32a "Hugo Rocks!!" }}' + - "1515779328" + XxHash: + Aliases: + - xxhash + Args: + - v + Description: XxHash returns the xxHash of the input string. + Examples: + - - '{{ hash.XxHash "The quick brown fox jumps over the lazy dog" }}' + - 0b242d361fda71bc + hugo: + Deps: + Aliases: null + Args: null + Description: "" + Examples: null + Generator: + Aliases: null + Args: null + Description: "" + Examples: null + IsDevelopment: + Aliases: null + Args: null + Description: "" + Examples: null + IsExtended: + Aliases: null + Args: null + Description: "" + Examples: null + IsMultiHost: + Aliases: null + Args: null + Description: "" + Examples: null + IsMultihost: + Aliases: null + Args: null + Description: "" + Examples: null + IsMultilingual: + Aliases: null + Args: null + Description: "" + Examples: null + IsProduction: + Aliases: null + Args: null + Description: "" + Examples: null + IsServer: + Aliases: null + Args: null + Description: "" + Examples: null + Store: + Aliases: null + Args: null + Description: "" + Examples: null + Version: + Aliases: null + Args: null + Description: "" + Examples: null + WorkingDir: + Aliases: null + Args: null + Description: "" + Examples: null + images: + AutoOrient: + Aliases: null + Args: null + Description: "" + Examples: null + Brightness: + Aliases: null + Args: null + Description: "" + Examples: null + ColorBalance: + Aliases: null + Args: null + Description: "" + Examples: null + Colorize: + Aliases: null + Args: null + Description: "" + Examples: null + Config: + Aliases: + - imageConfig + Args: + - path + Description: |- + Config returns the image.Config for the specified path relative to the + working directory. + Examples: [] + Contrast: + Aliases: null + Args: null + Description: "" + Examples: null + Dither: + Aliases: null + Args: null + Description: "" + Examples: null + Filter: + Aliases: null + Args: null + Description: "" + Examples: null + Gamma: + Aliases: null + Args: null + Description: "" + Examples: null + GaussianBlur: + Aliases: null + Args: null + Description: "" + Examples: null + Grayscale: + Aliases: null + Args: null + Description: "" + Examples: null + Hue: + Aliases: null + Args: null + Description: "" + Examples: null + Invert: + Aliases: null + Args: null + Description: "" + Examples: null ++ Mask: ++ Aliases: null ++ Args: null ++ Description: "" ++ Examples: null + Opacity: + Aliases: null + Args: null + Description: "" + Examples: null + Overlay: + Aliases: null + Args: null + Description: "" + Examples: null + Padding: + Aliases: null + Args: null + Description: "" + Examples: null + Pixelate: + Aliases: null + Args: null + Description: "" + Examples: null + Process: + Aliases: null + Args: null + Description: "" + Examples: null ++ QR: ++ Aliases: null ++ Args: null ++ Description: "" ++ Examples: null + Saturation: + Aliases: null + Args: null + Description: "" + Examples: null + Sepia: + Aliases: null + Args: null + Description: "" + Examples: null + Sigmoid: + Aliases: null + Args: null + Description: "" + Examples: null + Text: + Aliases: null + Args: null + Description: "" + Examples: null + UnsharpMask: + Aliases: null + Args: null + Description: "" + Examples: null + inflect: + Humanize: + Aliases: + - humanize + Args: + - v + Description: |- + Humanize returns the humanized form of v. + + If v is either an integer or a string containing an integer + value, the behavior is to add the appropriate ordinal. + Examples: + - - '{{ humanize "my-first-post" }}' + - My first post + - - '{{ humanize "myCamelPost" }}' + - My camel post + - - '{{ humanize "52" }}' + - 52nd + - - '{{ humanize 103 }}' + - 103rd + Pluralize: + Aliases: + - pluralize + Args: + - v + Description: Pluralize returns the plural form of the single word in v. + Examples: + - - '{{ "cat" | pluralize }}' + - cats + Singularize: + Aliases: + - singularize + Args: + - v + Description: Singularize returns the singular form of a single word in v. + Examples: + - - '{{ "cats" | singularize }}' + - cat + js: + Babel: + Aliases: + - babel + Args: + - args + Description: Babel processes the given Resource with Babel. + Examples: [] + Batch: + Aliases: null + Args: null + Description: "" + Examples: null + Build: + Aliases: null + Args: null + Description: "" + Examples: null + lang: + FormatAccounting: + Aliases: null + Args: + - precision + - currency + - number + Description: |- + FormatAccounting returns the currency representation of number for the given currency and precision + for the current language in accounting notation. + + The return value is formatted with at least two decimal places. + Examples: + - - '{{ 512.5032 | lang.FormatAccounting 2 "NOK" }}' + - NOK512.50 + FormatCurrency: + Aliases: null + Args: + - precision + - currency + - number + Description: |- + FormatCurrency returns the currency representation of number for the given currency and precision + for the current language. + + The return value is formatted with at least two decimal places. + Examples: + - - '{{ 512.5032 | lang.FormatCurrency 2 "USD" }}' + - $512.50 + FormatNumber: + Aliases: null + Args: + - precision + - number + Description: FormatNumber formats number with the given precision for the + current language. + Examples: + - - '{{ 512.5032 | lang.FormatNumber 2 }}' + - "512.50" + FormatNumberCustom: + Aliases: null + Args: + - precision + - number + - options + Description: |- + FormatNumberCustom formats a number with the given precision. The first + options parameter is a space-delimited string of characters to represent + negativity, the decimal point, and grouping. The default value is `- . ,`. + The second options parameter defines an alternate delimiting character. + + Note that numbers are rounded up at 5 or greater. + So, with precision set to 0, 1.5 becomes `2`, and 1.4 becomes `1`. + + For a simpler function that adapts to the current language, see FormatNumber. + Examples: + - - '{{ lang.FormatNumberCustom 2 12345.6789 }}' + - 12,345.68 + - - '{{ lang.FormatNumberCustom 2 12345.6789 "- , ." }}' + - 12.345,68 + - - '{{ lang.FormatNumberCustom 6 -12345.6789 "- ." }}' + - "-12345.678900" + - - '{{ lang.FormatNumberCustom 0 -12345.6789 "- . ," }}' + - -12,346 + - - '{{ lang.FormatNumberCustom 0 -12345.6789 "-|.| " "|" }}' + - -12 346 + - - '{{ -98765.4321 | lang.FormatNumberCustom 2 }}' + - -98,765.43 + FormatPercent: + Aliases: null + Args: + - precision + - number + Description: |- + FormatPercent formats number with the given precision for the current language. + Note that the number is assumed to be a percentage. + Examples: + - - '{{ 512.5032 | lang.FormatPercent 2 }}' + - 512.50% + Merge: + Aliases: null + Args: null + Description: "" + Examples: null + Translate: + Aliases: + - i18n + - T + Args: + - ctx + - id + - args + Description: Translate returns a translated string for id. + Examples: [] + math: + Abs: + Aliases: null + Args: + - "n" + Description: Abs returns the absolute value of n. + Examples: + - - '{{ math.Abs -2.1 }}' + - "2.1" + Acos: + Aliases: null + Args: + - "n" + Description: Acos returns the arccosine, in radians, of n. + Examples: + - - '{{ math.Acos 1 }}' + - "0" + Add: + Aliases: + - add + Args: + - inputs + Description: Add adds the multivalued addends n1 and n2 or more values. + Examples: + - - '{{ add 1 2 }}' + - "3" + Asin: + Aliases: null + Args: + - "n" + Description: Asin returns the arcsine, in radians, of n. + Examples: + - - '{{ math.Asin 1 }}' + - "1.5707963267948966" + Atan: + Aliases: null + Args: + - "n" + Description: Atan returns the arctangent, in radians, of n. + Examples: + - - '{{ math.Atan 1 }}' + - "0.7853981633974483" + Atan2: + Aliases: null + Args: + - "n" + - m + Description: Atan2 returns the arc tangent of n/m, using the signs of the + two to determine the quadrant of the return value. + Examples: + - - '{{ math.Atan2 1 2 }}' + - "0.4636476090008061" + Ceil: + Aliases: null + Args: + - "n" + Description: Ceil returns the least integer value greater than or equal to + n. + Examples: + - - '{{ math.Ceil 2.1 }}' + - "3" + Cos: + Aliases: null + Args: + - "n" + Description: Cos returns the cosine of the radian argument n. + Examples: + - - '{{ math.Cos 1 }}' + - "0.5403023058681398" + Counter: + Aliases: null + Args: null + Description: "" + Examples: null + Div: + Aliases: + - div + Args: + - inputs + Description: Div divides n1 by n2. + Examples: + - - '{{ div 6 3 }}' + - "2" + Floor: + Aliases: null + Args: + - "n" + Description: Floor returns the greatest integer value less than or equal to + n. + Examples: + - - '{{ math.Floor 1.9 }}' + - "1" + Log: + Aliases: null + Args: + - "n" + Description: Log returns the natural logarithm of the number n. + Examples: + - - '{{ math.Log 1 }}' + - "0" + Max: + Aliases: null + Args: + - inputs + Description: Max returns the greater of all numbers in inputs. Any slices + in inputs are flattened. + Examples: + - - '{{ math.Max 1 2 }}' + - "2" + Min: + Aliases: null + Args: + - inputs + Description: Min returns the smaller of all numbers in inputs. Any slices + in inputs are flattened. + Examples: + - - '{{ math.Min 1 2 }}' + - "1" + Mod: + Aliases: + - mod + Args: + - n1 + - n2 + Description: Mod returns n1 % n2. + Examples: + - - '{{ mod 15 3 }}' + - "0" + ModBool: + Aliases: + - modBool + Args: + - n1 + - n2 + Description: ModBool returns the boolean of n1 % n2. If n1 % n2 == 0, return + true. + Examples: + - - '{{ modBool 15 3 }}' + - "true" + Mul: + Aliases: + - mul + Args: + - inputs + Description: Mul multiplies the multivalued numbers n1 and n2 or more values. + Examples: + - - '{{ mul 2 3 }}' + - "6" + Pi: + Aliases: null + Args: null + Description: Pi returns the mathematical constant pi. + Examples: + - - '{{ math.Pi }}' + - "3.141592653589793" + Pow: + Aliases: + - pow + Args: + - n1 + - n2 + Description: Pow returns n1 raised to the power of n2. + Examples: + - - '{{ math.Pow 2 3 }}' + - "8" + Product: + Aliases: null + Args: null + Description: "" + Examples: null + Rand: + Aliases: null + Args: null + Description: Rand returns, as a float64, a pseudo-random number in the half-open + interval [0.0,1.0). + Examples: + - - '{{ math.Rand }}' + - "0.6312770459590062" + Round: + Aliases: null + Args: + - "n" + Description: Round returns the integer nearest to n, rounding half away from + zero. + Examples: + - - '{{ math.Round 1.5 }}' + - "2" + Sin: + Aliases: null + Args: + - "n" + Description: Sin returns the sine of the radian argument n. + Examples: + - - '{{ math.Sin 1 }}' + - "0.8414709848078965" + Sqrt: + Aliases: null + Args: + - "n" + Description: Sqrt returns the square root of the number n. + Examples: + - - '{{ math.Sqrt 81 }}' + - "9" + Sub: + Aliases: + - sub + Args: + - inputs + Description: Sub subtracts multivalued. + Examples: + - - '{{ sub 3 2 }}' + - "1" + Sum: + Aliases: null + Args: null + Description: "" + Examples: null + Tan: + Aliases: null + Args: + - "n" + Description: Tan returns the tangent of the radian argument n. + Examples: + - - '{{ math.Tan 1 }}' + - "1.557407724654902" + ToDegrees: + Aliases: null + Args: + - "n" + Description: ToDegrees converts radians into degrees. + Examples: + - - '{{ math.ToDegrees 1.5707963267948966 }}' + - "90" + ToRadians: + Aliases: null + Args: + - "n" + Description: ToRadians converts degrees into radians. + Examples: + - - '{{ math.ToRadians 90 }}' + - "1.5707963267948966" + openapi3: + Unmarshal: + Aliases: null + Args: null + Description: "" + Examples: [] + os: + FileExists: + Aliases: + - fileExists + Args: + - i + Description: FileExists checks whether a file exists under the given path. + Examples: + - - '{{ fileExists "foo.txt" }}' + - "false" + Getenv: + Aliases: + - getenv + Args: + - key + Description: |- + Getenv retrieves the value of the environment variable named by the key. + It returns the value, which will be empty if the variable is not present. + Examples: [] + ReadDir: + Aliases: + - readDir + Args: + - i + Description: ReadDir lists the directory contents relative to the configured + WorkingDir. + Examples: + - - '{{ range (readDir "files") }}{{ .Name }}{{ end }}' + - README.txt + ReadFile: + Aliases: + - readFile + Args: + - i + Description: |- + ReadFile reads the file named by filename relative to the configured WorkingDir. + It returns the contents as a string. + There is an upper size limit set at 1 megabytes. + Examples: + - - '{{ readFile "files/README.txt" }}' + - Hugo Rocks! + Stat: + Aliases: null + Args: null + Description: "" + Examples: null + partials: + Include: + Aliases: + - partial + Args: + - ctx + - name + - contextList + Description: |- + Include executes the named partial. + If the partial contains a return statement, that value will be returned. + Else, the rendered output will be returned: + A string if the partial is a text/template, or template.HTML when html/template. + Note that ctx is provided by Hugo, not the end user. + Examples: + - - '{{ partial "header.html" . }}' + - Hugo Rocks! + IncludeCached: + Aliases: + - partialCached + Args: + - ctx + - name + - context + - variants + Description: |- + IncludeCached executes and caches partial templates. The cache is created with name+variants as the key. + Note that ctx is provided by Hugo, not the end user. + Examples: [] + path: + Base: + Aliases: null + Args: null + Description: "" + Examples: null + BaseName: + Aliases: null + Args: null + Description: "" + Examples: null + Clean: + Aliases: null + Args: null + Description: "" + Examples: null + Dir: + Aliases: null + Args: null + Description: "" + Examples: null + Ext: + Aliases: null + Args: null + Description: "" + Examples: null + Join: + Aliases: null + Args: + - elements + Description: |- + Join joins any number of path elements into a single path, adding a + separating slash if necessary. All the input + path elements are passed into filepath.ToSlash converting any Windows slashes + to forward slashes. + The result is Cleaned; in particular, + all empty strings are ignored. + Examples: + - - '{{ slice "my/path" "filename.txt" | path.Join }}' + - my/path/filename.txt + - - '{{ path.Join "my" "path" "filename.txt" }}' + - my/path/filename.txt + - - '{{ "my/path/filename.txt" | path.Ext }}' + - .txt + - - '{{ "my/path/filename.txt" | path.Base }}' + - filename.txt + - - '{{ "my/path/filename.txt" | path.Dir }}' + - my/path + Split: + Aliases: null + Args: + - path + Description: |- + Split splits path immediately following the final slash, + separating it into a directory and file name component. + If there is no slash in path, Split returns an empty dir and + file set to path. + The input path is passed into filepath.ToSlash converting any Windows slashes + to forward slashes. + The returned values have the property that path = dir+file. + Examples: + - - '{{ "/my/path/filename.txt" | path.Split }}' + - /my/path/|filename.txt + - - '{{ "/my/path/filename.txt" | path.Split }}' + - /my/path/|filename.txt + reflect: + IsMap: + Aliases: null + Args: + - v + Description: IsMap reports whether v is a map. + Examples: + - - '{{ if reflect.IsMap (dict "a" 1) }}Map{{ end }}' + - Map + IsSlice: + Aliases: null + Args: + - v + Description: IsSlice reports whether v is a slice. + Examples: + - - '{{ if reflect.IsSlice (slice 1 2 3) }}Slice{{ end }}' + - Slice + resources: + Babel: + Aliases: null + Args: null + Description: "" + Examples: null + ByType: + Aliases: null + Args: null + Description: "" + Examples: null + Concat: + Aliases: null + Args: null + Description: "" + Examples: null + Copy: + Aliases: null + Args: null + Description: "" + Examples: null + ExecuteAsTemplate: + Aliases: null + Args: null + Description: "" + Examples: null + Fingerprint: + Aliases: + - fingerprint + Args: + - args + Description: |- + Fingerprint transforms the given Resource with a MD5 hash of the content in + the RelPermalink and Permalink. + Examples: [] + FromString: + Aliases: null + Args: null + Description: "" + Examples: null + Get: + Aliases: null + Args: + - filename + Description: |- + Get locates the filename given in Hugo's assets filesystem + and creates a Resource object that can be used for further transformations. + Examples: [] + GetMatch: + Aliases: null + Args: null + Description: "" + Examples: null + GetRemote: + Aliases: null + Args: + - args + Description: |- + GetRemote gets the URL (via HTTP(s)) in the first argument in args and creates Resource object that can be used for + further transformations. + + A second argument may be provided with an option map. + + Note: This method does not return any error as a second return value, + for any error situations the error can be checked in .Err. + Examples: [] + Match: + Aliases: null + Args: null + Description: "" + Examples: null + Minify: + Aliases: + - minify + Args: + - r + Description: |- + Minify minifies the given Resource using the MediaType to pick the correct + minifier. + Examples: [] + PostCSS: + Aliases: null + Args: null + Description: "" + Examples: null + PostProcess: + Aliases: null + Args: null + Description: "" + Examples: null + ToCSS: + Aliases: null + Args: null + Description: "" + Examples: null + safe: + CSS: + Aliases: + - safeCSS + Args: + - s + Description: CSS returns the string s as html/template CSS content. + Examples: + - - '{{ "Bat&Man" | safeCSS | safeCSS }}' + - Bat&Man + HTML: + Aliases: + - safeHTML + Args: + - s + Description: HTML returns the string s as html/template HTML content. + Examples: + - - '{{ "Bat&Man" | safeHTML | safeHTML }}' + - Bat&Man + - - '{{ "Bat&Man" | safeHTML }}' + - Bat&Man + HTMLAttr: + Aliases: + - safeHTMLAttr + Args: + - s + Description: HTMLAttr returns the string s as html/template HTMLAttr content. + Examples: [] + JS: + Aliases: + - safeJS + Args: + - s + Description: JS returns the given string as a html/template JS content. + Examples: + - - '{{ "(1*2)" | safeJS | safeJS }}' + - (1*2) + JSStr: + Aliases: + - safeJSStr + Args: + - s + Description: JSStr returns the given string as a html/template JSStr content. + Examples: [] + URL: + Aliases: + - safeURL + Args: + - s + Description: URL returns the string s as html/template URL content. + Examples: + - - '{{ "http://gohugo.io" | safeURL | safeURL }}' + - http://gohugo.io + site: + AllPages: + Aliases: null + Args: null + Description: "" + Examples: null + Author: + Aliases: null + Args: null + Description: "" + Examples: null + Authors: + Aliases: null + Args: null + Description: "" + Examples: null + BaseURL: + Aliases: null + Args: null + Description: "" + Examples: null + BuildDrafts: + Aliases: null + Args: null + Description: "" + Examples: null + CheckReady: + Aliases: null + Args: null + Description: "" + Examples: null + Config: + Aliases: null + Args: null + Description: "" + Examples: null + Copyright: + Aliases: null + Args: null + Description: "" + Examples: null + Current: + Aliases: null + Args: null + Description: "" + Examples: null + Data: + Aliases: null + Args: null + Description: "" + Examples: null + ForEeachIdentityByName: + Aliases: null + Args: null + Description: "" + Examples: null + GetPage: + Aliases: null + Args: null + Description: "" + Examples: null + Home: + Aliases: null + Args: null + Description: "" + Examples: null + Hugo: + Aliases: null + Args: null + Description: "" + Examples: null + IsMultiLingual: + Aliases: null + Args: null + Description: "" + Examples: null + Key: + Aliases: null + Args: null + Description: "" + Examples: null + Language: + Aliases: null + Args: null + Description: "" + Examples: null + LanguageCode: + Aliases: null + Args: null + Description: "" + Examples: null + LanguagePrefix: + Aliases: null + Args: null + Description: "" + Examples: null + Languages: + Aliases: null + Args: null + Description: "" + Examples: null + LastChange: + Aliases: null + Args: null + Description: "" + Examples: null + Lastmod: + Aliases: null + Args: null + Description: "" + Examples: null + MainSections: + Aliases: null + Args: null + Description: "" + Examples: null + Menus: + Aliases: null + Args: null + Description: "" + Examples: null + Pages: + Aliases: null + Args: null + Description: "" + Examples: null + Param: + Aliases: null + Args: null + Description: "" + Examples: null + Params: + Aliases: null + Args: null + Description: "" + Examples: null + RegularPages: + Aliases: null + Args: null + Description: "" + Examples: null + Sections: + Aliases: null + Args: null + Description: "" + Examples: null + ServerPort: + Aliases: null + Args: null + Description: "" + Examples: null + Sites: + Aliases: null + Args: null + Description: "" + Examples: null + Social: + Aliases: null + Args: null + Description: "" + Examples: null + Store: + Aliases: null + Args: null + Description: "" + Examples: null + Taxonomies: + Aliases: null + Args: null + Description: "" + Examples: null + Title: + Aliases: null + Args: null + Description: "" + Examples: null + strings: + Chomp: + Aliases: + - chomp + Args: + - s + Description: Chomp returns a copy of s with all trailing newline characters + removed. + Examples: + - - '{{ chomp "

Blockhead

\n" | safeHTML }}' + -

Blockhead

+ Contains: + Aliases: null + Args: + - s + - substr + Description: Contains reports whether substr is in s. + Examples: + - - '{{ strings.Contains "abc" "b" }}' + - "true" + - - '{{ strings.Contains "abc" "d" }}' + - "false" + ContainsAny: + Aliases: null + Args: + - s + - chars + Description: ContainsAny reports whether any Unicode code points in chars + are within s. + Examples: + - - '{{ strings.ContainsAny "abc" "bcd" }}' + - "true" + - - '{{ strings.ContainsAny "abc" "def" }}' + - "false" + ContainsNonSpace: + Aliases: null + Args: null + Description: "" + Examples: null + Count: + Aliases: null + Args: + - substr + - s + Description: |- + Count counts the number of non-overlapping instances of substr in s. + If substr is an empty string, Count returns 1 + the number of Unicode code points in s. + Examples: + - - '{{ "aabab" | strings.Count "a" }}' + - "3" + CountRunes: + Aliases: + - countrunes + Args: + - s + Description: CountRunes returns the number of runes in s, excluding whitespace. + Examples: [] + CountWords: + Aliases: + - countwords + Args: + - s + Description: CountWords returns the approximate word count in s. + Examples: [] + Diff: + Aliases: null + Args: null + Description: "" + Examples: null + FindRE: + Aliases: + - findRE + Args: + - expr + - content + - limit + Description: |- + FindRE returns a list of strings that match the regular expression. By default all matches + will be included. The number of matches can be limited with an optional third parameter. + Examples: + - - '{{ findRE "[G|g]o" "Hugo is a static side generator written in Go." 1 + }}' + - '[go]' + FindRESubmatch: + Aliases: + - findRESubmatch + Args: + - expr + - content + - limit + Description: |- + FindRESubmatch returns a slice of all successive matches of the regular + expression in content. Each element is a slice of strings holding the text + of the leftmost match of the regular expression and the matches, if any, of + its subexpressions. + + By default all matches will be included. The number of matches can be + limited with the optional limit parameter. A return value of nil indicates + no match. + Examples: + - - '{{ findRESubmatch `(.+?)` `
  • Foo
    • +
  • Bar
    • ` | print | safeHTML }}' + - '[[Foo #foo Foo] [Bar #bar Bar]]' + FirstUpper: + Aliases: null + Args: + - s + Description: FirstUpper converts s making the first character upper case. + Examples: + - - '{{ "hugo rocks!" | strings.FirstUpper }}' + - Hugo rocks! + HasPrefix: + Aliases: + - hasPrefix + Args: + - s + - prefix + Description: HasPrefix tests whether the input s begins with prefix. + Examples: + - - '{{ hasPrefix "Hugo" "Hu" }}' + - "true" + - - '{{ hasPrefix "Hugo" "Fu" }}' + - "false" + HasSuffix: + Aliases: + - hasSuffix + Args: + - s + - suffix + Description: HasSuffix tests whether the input s begins with suffix. + Examples: + - - '{{ hasSuffix "Hugo" "go" }}' + - "true" + - - '{{ hasSuffix "Hugo" "du" }}' + - "false" + Repeat: + Aliases: null + Args: + - "n" + - s + Description: Repeat returns a new string consisting of n copies of the string + s. + Examples: + - - '{{ "yo" | strings.Repeat 4 }}' + - yoyoyoyo + Replace: + Aliases: + - replace + Args: + - s + - old + - new + - limit + Description: |- + Replace returns a copy of the string s with all occurrences of old replaced + with new. The number of replacements can be limited with an optional fourth + parameter. + Examples: + - - '{{ replace "Batman and Robin" "Robin" "Catwoman" }}' + - Batman and Catwoman + - - '{{ replace "aabbaabb" "a" "z" 2 }}' + - zzbbaabb + ReplaceRE: + Aliases: + - replaceRE + Args: + - pattern + - repl + - s + - "n" + Description: |- + ReplaceRE returns a copy of s, replacing all matches of the regular + expression pattern with the replacement text repl. The number of replacements + can be limited with an optional fourth parameter. + Examples: + - - '{{ replaceRE "a+b" "X" "aabbaabbab" }}' + - XbXbX + - - '{{ replaceRE "a+b" "X" "aabbaabbab" 1 }}' + - Xbaabbab + RuneCount: + Aliases: null + Args: + - s + Description: RuneCount returns the number of runes in s. + Examples: [] + SliceString: + Aliases: + - slicestr + Args: + - a + - startEnd + Description: |- + SliceString slices a string by specifying a half-open range with + two indices, start and end. 1 and 4 creates a slice including elements 1 through 3. + The end index can be omitted, it defaults to the string's length. + Examples: + - - '{{ slicestr "BatMan" 0 3 }}' + - Bat + - - '{{ slicestr "BatMan" 3 }}' + - Man + Split: + Aliases: + - split + Args: + - a + - delimiter + Description: Split slices an input string into all substrings separated by + delimiter. + Examples: [] + Substr: + Aliases: + - substr + Args: + - a + - nums + Description: |- + Substr extracts parts of a string, beginning at the character at the specified + position, and returns the specified number of characters. + + It normally takes two parameters: start and length. + It can also take one parameter: start, i.e. length is omitted, in which case + the substring starting from start until the end of the string will be returned. + + To extract characters from the end of the string, use a negative start number. + + In addition, borrowing from the extended behavior described at http://php.net/substr, + if length is given and is negative, then that many characters will be omitted from + the end of string. + Examples: + - - '{{ substr "BatMan" 0 -3 }}' + - Bat + - - '{{ substr "BatMan" 3 3 }}' + - Man + Title: + Aliases: + - title + Args: + - s + Description: |- + Title returns a copy of the input s with all Unicode letters that begin words + mapped to their title case. + Examples: + - - '{{ title "Bat man" }}' + - Bat Man + - - '{{ title "somewhere over the rainbow" }}' + - Somewhere Over the Rainbow + ToLower: + Aliases: + - lower + Args: + - s + Description: |- + ToLower returns a copy of the input s with all Unicode letters mapped to their + lower case. + Examples: + - - '{{ lower "BatMan" }}' + - batman + ToUpper: + Aliases: + - upper + Args: + - s + Description: |- + ToUpper returns a copy of the input s with all Unicode letters mapped to their + upper case. + Examples: + - - '{{ upper "BatMan" }}' + - BATMAN + Trim: + Aliases: + - trim + Args: + - s + - cutset + Description: |- + Trim returns converts the strings s removing all leading and trailing characters defined + contained. + Examples: + - - '{{ trim "++Batman--" "+-" }}' + - Batman + TrimLeft: + Aliases: null + Args: + - cutset + - s + Description: |- + TrimLeft returns a slice of the string s with all leading characters + contained in cutset removed. + Examples: + - - '{{ "aabbaa" | strings.TrimLeft "a" }}' + - bbaa + TrimPrefix: + Aliases: null + Args: + - prefix + - s + Description: |- + TrimPrefix returns s without the provided leading prefix string. If s doesn't + start with prefix, s is returned unchanged. + Examples: + - - '{{ "aabbaa" | strings.TrimPrefix "a" }}' + - abbaa + - - '{{ "aabbaa" | strings.TrimPrefix "aa" }}' + - bbaa + TrimRight: + Aliases: null + Args: + - cutset + - s + Description: |- + TrimRight returns a slice of the string s with all trailing characters + contained in cutset removed. + Examples: + - - '{{ "aabbaa" | strings.TrimRight "a" }}' + - aabb + TrimSpace: + Aliases: null + Args: null + Description: "" + Examples: null + TrimSuffix: + Aliases: null + Args: + - suffix + - s + Description: |- + TrimSuffix returns s without the provided trailing suffix string. If s + doesn't end with suffix, s is returned unchanged. + Examples: + - - '{{ "aabbaa" | strings.TrimSuffix "a" }}' + - aabba + - - '{{ "aabbaa" | strings.TrimSuffix "aa" }}' + - aabb + Truncate: + Aliases: + - truncate + Args: + - s + - options + Description: Truncate truncates the string in s to the specified length. + Examples: + - - '{{ "this is a very long text" | truncate 10 " ..." }}' + - this is a ... + - - '{{ "With [Markdown](/markdown) inside." | markdownify | truncate 14 }}' + - With Markdown … + templates: + Defer: + Aliases: null + Args: + - args + Description: Defer defers the execution of a template block. + Examples: [] + DoDefer: + Aliases: + - doDefer + Args: + - ctx + - id + - optsv + Description: |- + DoDefer defers the execution of a template block. + For internal use only. + Examples: [] + Exists: + Aliases: null + Args: + - name + Description: |- + Exists returns whether the template with the given name exists. + Note that this is the Unix-styled relative path including filename suffix, + e.g. partials/header.html + Examples: + - - '{{ if (templates.Exists "partials/header.html") }}Yes!{{ end }}' + - Yes! + - - '{{ if not (templates.Exists "partials/doesnotexist.html") }}No!{{ end + }}' + - No! + time: + AsTime: + Aliases: null + Args: + - v + - args + Description: |- + AsTime converts the textual representation of the datetime string into + a time.Time interface. + Examples: + - - '{{ (time "2015-01-21").Year }}' + - "2015" + Duration: + Aliases: + - duration + Args: + - unit + - number + Description: |- + Duration converts the given number to a time.Duration. + Unit is one of nanosecond/ns, microsecond/us/µs, millisecond/ms, second/s, minute/m or hour/h. + Examples: + - - '{{ mul 60 60 | duration "second" }}' + - 1h0m0s + Format: + Aliases: + - dateFormat + Args: + - layout + - v + Description: |- + Format converts the textual representation of the datetime string in v into + time.Time if needed and formats it with the given layout. + Examples: + - - 'dateFormat: {{ dateFormat "Monday, Jan 2, 2006" "2015-01-21" }}' + - 'dateFormat: Wednesday, Jan 21, 2015' + Now: + Aliases: + - now + Args: null + Description: Now returns the current local time or `clock` time + Examples: [] + ParseDuration: + Aliases: null + Args: + - s + Description: |- + ParseDuration parses the duration string s. + A duration string is a possibly signed sequence of + decimal numbers, each with optional fraction and a unit suffix, + such as "300ms", "-1.5h" or "2h45m". + Valid time units are "ns", "us" (or "µs"), "ms", "s", "m", "h". + See https://golang.org/pkg/time/#ParseDuration + Examples: + - - '{{ "1h12m10s" | time.ParseDuration }}' + - 1h12m10s + transform: + CanHighlight: + Aliases: null + Args: null + Description: "" + Examples: null + Emojify: + Aliases: + - emojify + Args: + - s + Description: |- + Emojify returns a copy of s with all emoji codes replaced with actual emojis. + + See http://www.emoji-cheat-sheet.com/ + Examples: + - - '{{ "I :heart: Hugo" | emojify }}' + - I ❤️ Hugo + HTMLEscape: + Aliases: + - htmlEscape + Args: + - s + Description: HTMLEscape returns a copy of s with reserved HTML characters + escaped. + Examples: + - - '{{ htmlEscape "Cathal Garvey & The Sunshine Band " | + safeHTML }}' + - Cathal Garvey & The Sunshine Band <cathal@foo.bar> + - - '{{ htmlEscape "Cathal Garvey & The Sunshine Band " }}' + - Cathal Garvey &amp; The Sunshine Band &lt;cathal@foo.bar&gt; + - - '{{ htmlEscape "Cathal Garvey & The Sunshine Band " | + htmlUnescape | safeHTML }}' + - Cathal Garvey & The Sunshine Band + HTMLUnescape: + Aliases: + - htmlUnescape + Args: + - s + Description: |- + HTMLUnescape returns a copy of s with HTML escape requences converted to plain + text. + Examples: + - - '{{ htmlUnescape "Cathal Garvey & The Sunshine Band <cathal@foo.bar>" + | safeHTML }}' + - Cathal Garvey & The Sunshine Band + - - '{{ "Cathal Garvey &amp; The Sunshine Band &lt;cathal@foo.bar&gt;" + | htmlUnescape | htmlUnescape | safeHTML }}' + - Cathal Garvey & The Sunshine Band + - - '{{ "Cathal Garvey &amp; The Sunshine Band &lt;cathal@foo.bar&gt;" + | htmlUnescape | htmlUnescape }}' + - Cathal Garvey & The Sunshine Band <cathal@foo.bar> + - - '{{ htmlUnescape "Cathal Garvey & The Sunshine Band <cathal@foo.bar>" + | htmlEscape | safeHTML }}' + - Cathal Garvey & The Sunshine Band <cathal@foo.bar> + Highlight: + Aliases: + - highlight + Args: + - s + - lang + - opts + Description: |- + Highlight returns a copy of s as an HTML string with syntax + highlighting applied. + Examples: [] + HighlightCodeBlock: + Aliases: null + Args: null + Description: "" + Examples: null + Markdownify: + Aliases: + - markdownify + Args: + - ctx + - s + Description: Markdownify renders s from Markdown to HTML. + Examples: + - - '{{ .Title | markdownify }}' + - BatMan + Plainify: + Aliases: + - plainify + Args: + - s + Description: Plainify returns a copy of s with all HTML tags removed. + Examples: + - - '{{ plainify "Hello world, gophers!" }}' + - Hello world, gophers! + Remarshal: + Aliases: null + Args: + - format + - data + Description: |- + Remarshal is used in the Hugo documentation to convert configuration + examples from YAML to JSON, TOML (and possibly the other way around). + The is primarily a helper for the Hugo docs site. + It is not a general purpose YAML to TOML converter etc., and may + change without notice if it serves a purpose in the docs. + Format is one of json, yaml or toml. + Examples: + - - '{{ "title = \"Hello World\"" | transform.Remarshal "json" | safeHTML + }}' + - | + { + "title": "Hello World" + } + ToMath: + Aliases: null + Args: null + Description: "" + Examples: null + Unmarshal: + Aliases: + - unmarshal + Args: + - args + Description: |- + Unmarshal unmarshals the data given, which can be either a string, json.RawMessage + or a Resource. Supported formats are JSON, TOML, YAML, and CSV. + You can optionally provide an options map as the first argument. + Examples: + - - '{{ "hello = \"Hello World\"" | transform.Unmarshal }}' + - map[hello:Hello World] + - - '{{ "hello = \"Hello World\"" | resources.FromString "data/greetings.toml" + | transform.Unmarshal }}' + - map[hello:Hello World] + XMLEscape: + Aliases: null + Args: + - s + Description: |- + XMLEscape returns the given string, removing disallowed characters then + escaping the result to its XML equivalent. + Examples: + - - '{{ transform.XMLEscape "

    abc

    " }}' + - '<p>abc</p>' + urls: + AbsLangURL: + Aliases: + - absLangURL + Args: + - s + Description: |- + AbsLangURL the string s and converts it to an absolute URL according + to a page's position in the project directory structure and the current + language. + Examples: [] + AbsURL: + Aliases: + - absURL + Args: + - s + Description: AbsURL takes the string s and converts it to an absolute URL. + Examples: [] + Anchorize: + Aliases: + - anchorize + Args: + - s + Description: |- + Anchorize creates sanitized anchor name version of the string s that is compatible + with how your configured markdown renderer does it. + Examples: + - - '{{ "This is a title" | anchorize }}' + - this-is-a-title + JoinPath: + Aliases: null + Args: + - elements + Description: |- + JoinPath joins the provided elements into a URL string and cleans the result + of any ./ or ../ elements. If the argument list is empty, JoinPath returns + an empty string. + Examples: + - - '{{ urls.JoinPath "https://example.org" "foo" }}' + - https://example.org/foo + - - '{{ urls.JoinPath (slice "a" "b") }}' + - a/b + Parse: + Aliases: null + Args: null + Description: "" + Examples: null + Ref: + Aliases: + - ref + Args: + - p + - args + Description: Ref returns the absolute URL path to a given content item from + Page p. + Examples: [] + RelLangURL: + Aliases: + - relLangURL + Args: + - s + Description: |- + RelLangURL takes the string s and prepends the relative path according to a + page's position in the project directory structure and the current language. + Examples: [] + RelRef: + Aliases: + - relref + Args: + - p + - args + Description: RelRef returns the relative URL path to a given content item + from Page p. + Examples: [] + RelURL: + Aliases: + - relURL + Args: + - s + Description: |- + RelURL takes the string s and prepends the relative path according to a + page's position in the project directory structure. + Examples: [] + URLize: + Aliases: + - urlize + Args: + - s + Description: URLize returns the strings s formatted as an URL. + Examples: [] diff --cc docs/data/embedded_template_urls.toml index 359105e60,000000000..f75b14f12 mode 100644,000000..100644 --- a/docs/data/embedded_template_urls.toml +++ b/docs/data/embedded_template_urls.toml @@@ -1,39 -1,0 +1,42 @@@ +# Used by the embedded template URL (eturl.html) shortcode. +# Quoted all keys because some are not valid identifiers. + +# BaseURL +'base_url' = 'https://github.com/gohugoio/hugo/blob/master/tpl/tplimpl/embedded/templates' + +# Templates +'alias' = 'alias.html' +'disqus' = 'disqus.html' +'google_analytics' = 'google_analytics.html' +'opengraph' = 'opengraph.html' +'pagination' = 'pagination.html' +'robots' = '_default/robots.txt' +'rss' = '_default/rss.xml' +'schema' = 'schema.html' +'sitemap' = '_default/sitemap.xml' +'sitemapindex' = '_default/sitemapindex.xml' +'twitter_cards' = 'twitter_cards.html' + +# Render hooks +'render-codeblock-goat' = '_default/_markup/render-codeblock-goat.html' +'render-image' = '_default/_markup/render-image.html' +'render-link' = '_default/_markup/render-link.html' +'render-table' = '_default/_markup/render-table.html' + +# Shortcodes - 'comment' = 'shortcodes/comment.html' +'details' = 'shortcodes/details.html' +'figure' = 'shortcodes/figure.html' +'gist' = 'shortcodes/gist.html' +'highlight' = 'shortcodes/highlight.html' +'instagram' = 'shortcodes/instagram.html' +'param' = 'shortcodes/param.html' +'qr' = 'shortcodes/qr.html' +'ref' = 'shortcodes/ref.html' +'relref' = 'shortcodes/relref.html' +'twitter' = 'shortcodes/twitter.html' ++'twitter_simple' = 'shortcodes/twitter_simple.html' +'vimeo' = 'shortcodes/vimeo.html' ++'vimeo_simple' = 'shortcodes/vimeo_simple.html' ++'x' = 'shortcodes/x.html' ++'x_simple' = 'shortcodes/x_simple.html' +'youtube' = 'shortcodes/youtube.html' diff --cc docs/go.mod index bb45d109d,000000000..56a48deac mode 100644,000000..100644 --- a/docs/go.mod +++ b/docs/go.mod @@@ -1,5 -1,0 +1,5 @@@ +module github.com/gohugoio/hugoDocs + +go 1.22.0 + - require github.com/gohugoio/gohugoioTheme v0.0.0-20250106044328-feb60697e056 // indirect ++require github.com/gohugoio/gohugoioTheme v0.0.0-20250116152525-2d382cae7743 // indirect diff --cc docs/go.sum index abc8fbaa0,000000000..af9b5febf mode 100644,000000..100644 --- a/docs/go.sum +++ b/docs/go.sum @@@ -1,2 -1,0 +1,2 @@@ - github.com/gohugoio/gohugoioTheme v0.0.0-20250106044328-feb60697e056 h1:nPfHricsQXtVewK865bX2LDLhUImhIZEuajlYPM2Bho= - github.com/gohugoio/gohugoioTheme v0.0.0-20250106044328-feb60697e056/go.mod h1:GOYeAPQJ/ok8z7oz1cjfcSlsFpXrmx6VkzQ5RpnyhZM= ++github.com/gohugoio/gohugoioTheme v0.0.0-20250116152525-2d382cae7743 h1:gjoqq8+RnGwpuU/LQVYGGR/LsDplrfUjOabWwoROYsM= ++github.com/gohugoio/gohugoioTheme v0.0.0-20250116152525-2d382cae7743/go.mod h1:GOYeAPQJ/ok8z7oz1cjfcSlsFpXrmx6VkzQ5RpnyhZM= diff --cc docs/hugoreleaser.yaml index 000000000,000000000..9f8671e06 new file mode 100644 --- /dev/null +++ b/docs/hugoreleaser.yaml @@@ -1,0 -1,0 +1,29 @@@ ++project: hugoDocs ++release_settings: ++ name: ${HUGORELEASER_TAG} ++ type: github ++ repository: hugoDocs ++ repository_owner: gohugoio ++ draft: true ++ prerelease: false ++ release_notes_settings: ++ generate: true ++ generate_on_host: false ++ short_threshold: 10 ++ short_title: What's Changed ++ groups: ++ - regexp: snapcraft:|Merge commit|Merge branch|netlify:|release:|Squashed ++ ignore: true ++ - title: Typo fixes ++ regexp: typo ++ ordinal: 20 ++ - title: Dependency Updates ++ regexp: deps ++ ordinal: 30 ++ - title: Improvements ++ regexp: .* ++ ordinal: 10 ++releases: ++ - paths: ++ - archives/** ++ path: myrelease diff --cc docs/layouts/_default/_markup/render-link.html index 000000000,000000000..a0ee6b190 new file mode 100644 --- /dev/null +++ b/docs/layouts/_default/_markup/render-link.html @@@ -1,0 -1,0 +1,317 @@@ ++{{- /* Last modified: 2025-01-19T14:44:56-08:00 */}} ++ ++{{- /* ++Copyright 2025 Veriphor LLC ++ ++Licensed under the Apache License, Version 2.0 (the "License"); you may not ++use this file except in compliance with the License. You may obtain a copy of ++the License at ++ ++https://www.apache.org/licenses/LICENSE-2.0 ++ ++Unless required by applicable law or agreed to in writing, software ++distributed under the License is distributed on an "AS IS" BASIS, WITHOUT ++WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the ++License for the specific language governing permissions and limitations under ++the License. ++*/}} ++ ++{{- /* ++This render hook resolves internal destinations by looking for a matching: ++ ++ 1. Content page ++ 2. Page resource (a file in the current page bundle) ++ 3. Section resource (a file in the current section) ++ 4. Global resource (a file in the assets directory) ++ ++It skips the section resource lookup if the current page is a leaf bundle. ++ ++External destinations are not modified. ++ ++You must place global resources in the assets directory. If you have placed ++your resources in the static directory, and you are unable or unwilling to move ++them, you must mount the static directory to the assets directory by including ++both of these entries in your site configuration: ++ ++ [[module.mounts]] ++ source = 'assets' ++ target = 'assets' ++ ++ [[module.mounts]] ++ source = 'static' ++ target = 'assets' ++ ++By default, if this render hook is unable to resolve a destination, including a ++fragment if present, it passes the destination through without modification. To ++emit a warning or error, set the error level in your site configuration: ++ ++ [params.render_hooks.link] ++ errorLevel = 'warning' # ignore (default), warning, or error (fails the build) ++ ++When you set the error level to warning, and you are in a development ++environment, you can visually highlight broken internal links: ++ ++ [params.render_hooks.link] ++ errorLevel = 'warning' # ignore (default), warning, or error (fails the build) ++ highlightBroken = true # true or false (default) ++ ++This will add a "broken" class to anchor elements with invalid src attributes. ++Add a rule to your CSS targeting the broken links: ++ ++ a.broken { ++ background: #ff0; ++ border: 2px solid #f00; ++ padding: 0.1em 0.2em; ++ } ++ ++This render hook may be unable to resolve destinations created with the ref and ++relref shortcodes. Unless you set the error level to ignore you should not use ++either of these shortcodes in conjunction with this render hook. ++ ++@context {string} Destination The link destination. ++@context {page} Page A reference to the page containing the link. ++@context {string} PlainText The link description as plain text. ++@context {string} Text The link description. ++@context {string} Title The link title. ++ ++@returns {template.html} ++*/}} ++ ++{{- /* Initialize. */}} ++{{- $renderHookName := "link" }} ++ ++{{- /* Verify minimum required version. */}} ++{{- $minHugoVersion := "0.141.0" }} ++{{- if lt hugo.Version $minHugoVersion }} ++ {{- errorf "The %q render hook requires Hugo v%s or later." $renderHookName $minHugoVersion }} ++{{- end }} ++ ++{{- /* Error level when unable to resolve destination: ignore, warning, or error. */}} ++{{- $errorLevel := or site.Params.render_hooks.link.errorLevel "ignore" | lower }} ++ ++{{- /* If true, adds "broken" class to broken links. Applicable in development environment when errorLevel is warning. */}} ++{{- $highlightBrokenLinks := or site.Params.render_hooks.link.highlightBroken false }} ++ ++{{- /* Validate error level. */}} ++{{- if not (in (slice "ignore" "warning" "error") $errorLevel) }} ++ {{- errorf "The %q render hook is misconfigured. The errorLevel %q is invalid. Please check your site configuration." $renderHookName $errorLevel }} ++{{- end }} ++ ++{{- /* Determine content path for warning and error messages. */}} ++{{- $contentPath := .Page.String }} ++ ++{{- /* Parse destination. */}} ++{{- $u := urls.Parse .Destination }} ++ ++{{- /* Set common message. */}} ++{{- $msg := printf "The %q render hook was unable to resolve the destination %q in %s" $renderHookName $u.String $contentPath }} ++ ++{{- /* Set attributes for anchor element. */}} ++{{- $attrs := dict "href" $u.String }} ++{{- if eq $u.String "g" }} ++ {{- /* Destination is a glossary term. */}} ++ {{- $ctx := dict ++ "contentPath" $contentPath ++ "errorLevel" $errorLevel ++ "renderHookName" $renderHookName ++ "text" .Text ++ }} ++ {{- $attrs = partial "inline/h-rh-l/get-glossary-link-attributes.html" $ctx }} ++{{- else if $u.IsAbs }} ++ {{- /* Destination is a remote resource. */}} ++ {{- $attrs = merge $attrs (dict "rel" "external") }} ++{{- else }} ++ {{- with $u.Path }} ++ {{- with $p := or ($.PageInner.GetPage .) ($.PageInner.GetPage (strings.TrimRight "/" .)) }} ++ {{- /* Destination is a page. */}} ++ {{- $href := .RelPermalink }} ++ {{- with $u.RawQuery }} ++ {{- $href = printf "%s?%s" $href . }} ++ {{- end }} ++ {{- with $u.Fragment }} ++ {{- $ctx := dict ++ "contentPath" $contentPath ++ "errorLevel" $errorLevel ++ "page" $p ++ "parsedURL" $u ++ "renderHookName" $renderHookName ++ }} ++ {{- partial "inline/h-rh-l/validate-fragment.html" $ctx }} ++ {{- $href = printf "%s#%s" $href . }} ++ {{- end }} ++ {{- $attrs = dict "href" $href }} ++ {{- else with $.PageInner.Resources.Get $u.Path }} ++ {{- /* Destination is a page resource; drop query and fragment. */}} ++ {{- $attrs = dict "href" .RelPermalink }} ++ {{- else with (and (ne $.Page.BundleType "leaf") ($.Page.CurrentSection.Resources.Get $u.Path)) }} ++ {{- /* Destination is a section resource, and current page is not a leaf bundle. */}} ++ {{- $attrs = dict "href" .RelPermalink }} ++ {{- else with resources.Get $u.Path }} ++ {{- /* Destination is a global resource; drop query and fragment. */}} ++ {{- $attrs = dict "href" .RelPermalink }} ++ {{- else }} ++ {{- if eq $errorLevel "warning" }} ++ {{- warnf $msg }} ++ {{- if and $highlightBrokenLinks hugo.IsDevelopment }} ++ {{- $attrs = merge $attrs (dict "class" "broken") }} ++ {{- end }} ++ {{- else if eq $errorLevel "error" }} ++ {{- errorf $msg }} ++ {{- end }} ++ {{- end }} ++ {{- else }} ++ {{- with $u.Fragment }} ++ {{- /* Destination is on the same page; prepend relative permalink. */}} ++ {{- $ctx := dict ++ "contentPath" $contentPath ++ "errorLevel" $errorLevel ++ "page" $.Page ++ "parsedURL" $u ++ "renderHookName" $renderHookName ++ }} ++ {{- partial "inline/h-rh-l/validate-fragment.html" $ctx }} ++ {{- $attrs = dict "href" (printf "%s#%s" $.Page.RelPermalink .) }} ++ {{- else }} ++ {{- if eq $errorLevel "warning" }} ++ {{- warnf $msg }} ++ {{- if and $highlightBrokenLinks hugo.IsDevelopment }} ++ {{- $attrs = merge $attrs (dict "class" "broken") }} ++ {{- end }} ++ {{- else if eq $errorLevel "error" }} ++ {{- errorf $msg }} ++ {{- end }} ++ {{- end }} ++ {{- end }} ++{{- end }} ++ ++{{- /* Render anchor element. */ -}} ++{{ .Text }} ++ ++{{- define "partials/inline/h-rh-l/validate-fragment.html" }} ++ {{- /* ++ Validates the fragment portion of a link destination. ++ ++ @context {string} contentPath The page containing the link. ++ @context {string} errorLevel The error level when unable to resolve destination; ignore (default), warning, or error. ++ @context {page} page The page corresponding to the link destination ++ @context {struct} parsedURL The link destination parsed by urls.Parse. ++ @context {string} renderHookName The name of the render hook. ++ */}} ++ ++ {{- /* Initialize. */}} ++ {{- $contentPath := .contentPath }} ++ {{- $errorLevel := .errorLevel }} ++ {{- $p := .page }} ++ {{- $u := .parsedURL }} ++ {{- $renderHookName := .renderHookName }} ++ ++ {{- /* Validate. */}} ++ {{- with $u.Fragment }} ++ {{- if $p.Fragments.Identifiers.Contains . }} ++ {{- if gt ($p.Fragments.Identifiers.Count .) 1 }} ++ {{- $msg := printf "The %q render hook detected duplicate heading IDs %q in %s" $renderHookName . $contentPath }} ++ {{- if eq $errorLevel "warning" }} ++ {{- warnf $msg }} ++ {{- else if eq $errorLevel "error" }} ++ {{- errorf $msg }} ++ {{- end }} ++ {{- end }} ++ {{- else }} ++ {{- /* Determine target path for warning and error message. */}} ++ {{- $targetPath := "" }} ++ {{- with $p.File }} ++ {{- $targetPath = .Path }} ++ {{- else }} ++ {{- $targetPath = .Path }} ++ {{- end }} ++ {{- /* Set common message. */}} ++ {{- $msg := printf "The %q render hook was unable to find heading ID %q in %s. See %s" $renderHookName . $targetPath $contentPath }} ++ {{- if eq $targetPath $contentPath }} ++ {{- $msg = printf "The %q render hook was unable to find heading ID %q in %s" $renderHookName . $targetPath }} ++ {{- end }} ++ {{- /* Throw warning or error. */}} ++ {{- if eq $errorLevel "warning" }} ++ {{- warnf $msg }} ++ {{- else if eq $errorLevel "error" }} ++ {{- errorf $msg }} ++ {{- end }} ++ {{- end }} ++ {{- end }} ++{{- end }} ++ ++{{- define "partials/inline/h-rh-l/get-glossary-link-attributes.html" }} ++ {{- /* ++ Returns the anchor element attributes for a link to the given glossary term. ++ ++ It first checks for the existence of a glossary page for the given term. If ++ no page is found, it then checks for a glossary page for the singular form of ++ the term. If neither page exists it throws a warning or error dependent on ++ the errorLevel setting ++ ++ The returned href attribute does not point to the glossary term page. ++ Instead, via its fragment, it points to an entry on the glossary page. ++ ++ @context {string} contentPath The page containing the link. ++ @context {string} errorLevel The error level when unable to resolve destination; ignore (default), warning, or error. ++ @context {string} renderHookName The name of the render hook. ++ @context {string} text The link text. ++ */}} ++ ++ {{- /* Get context.. */}} ++ {{- $contentPath := .contentPath }} ++ {{- $errorLevel := .errorLevel }} ++ {{- $renderHookName := .renderHookName }} ++ {{- $text := .text | transform.Plainify | strings.ToLower }} ++ ++ {{- /* Initialize. */}} ++ {{- $glossaryPath := "/getting-started/glossary" }} ++ {{- $termGiven := $text }} ++ {{- $termActual := "" }} ++ {{- $termSingular := inflect.Singularize $termGiven }} ++ ++ {{- /* Verify that the glossary page exists. */}} ++ {{- $glossaryPage := site.GetPage $glossaryPath }} ++ {{- if not $glossaryPage }} ++ {{- errorf "The %q render hook was unable to find %s: see %s" $renderHookName $glossaryPath $contentPath }} ++ {{- end }} ++ ++ {{- /* Theres a better way to handle this, but it works for now. */}} ++ {{- $cheating := dict ++ "chaining" "chain" ++ "localize" "localization" ++ "localized" "localization" ++ "paginating" "paginate" ++ "walking" "walk" ++ }} ++ ++ {{- /* Verify that a glossary term page exists for the given term. */}} ++ {{- if site.GetPage (urls.JoinPath $glossaryPath ($termGiven | urlize)) }} ++ {{- $termActual = $termGiven }} ++ {{- else if site.GetPage (urls.JoinPath $glossaryPath ($termSingular | urlize)) }} ++ {{- $termActual = $termSingular }} ++ {{- else }} ++ {{- $termToTest := index $cheating $termGiven }} ++ {{- if site.GetPage (urls.JoinPath $glossaryPath ($termToTest | urlize)) }} ++ {{- $termActual = $termToTest }} ++ {{- end }} ++ {{- end }} ++ ++ {{- if not $termActual }} ++ {{- errorf "The %q render hook was unable to find a glossary page for either the singular or plural form of the term %q: see %s" $renderHookName $termGiven $contentPath }} ++ {{- end }} ++ ++ {{- /* Create the href attribute. */}} ++ {{- $href := ""}} ++ {{- if $termActual }} ++ {{- $href = fmt.Printf "%s#%s" $glossaryPage.RelPermalink (anchorize $termActual) }} ++ {{- end }} ++ ++ {{- return (dict "href" $href) }} ++{{- end -}} diff --cc docs/layouts/shortcodes/glossary-term.html index 000000000,000000000..92ad93340 new file mode 100644 --- /dev/null +++ b/docs/layouts/shortcodes/glossary-term.html @@@ -1,0 -1,0 +1,20 @@@ ++{{- /* ++Renders the definition of the given glossary term. ++ ++@param {string} (.Get 0) The glossary term. ++@returns {template.HTML} ++ ++@example {{% glossary-term float %}} ++@example {{% glossary-term "floating point" %}} ++*/}} ++ ++{{- with .Get 0 }} ++ {{- $path := printf "/getting-started/glossary/%s" (urlize .) }} ++ {{- with site.GetPage $path }} ++{{ .RenderShortcodes }}{{/* Do not indent. */}} ++ {{- else }} ++ {{- errorf "The glossary term (%s) shortcode was unable to find %s: see %s" $.Name $path $.Position }} ++ {{- end }} ++{{- else }} ++ {{- errorf "The glossary term (%s) shortcode requires one positional parameter: see %s" $.Name $.Position }} ++{{- end }} diff --cc docs/layouts/shortcodes/glossary.html index 000000000,000000000..3273efd8c new file mode 100644 --- /dev/null +++ b/docs/layouts/shortcodes/glossary.html @@@ -1,0 -1,0 +1,43 @@@ ++{{- /* ++Renders the glossary of terms. ++ ++When you call this shortcode using the {{% %}} notation, the glossary terms are ++Markdown headings (level 6) which means they are members of .Page.Fragments. ++This allows the link render hook to verify links to glossary terms. ++ ++Yes, the terms themselves are pages, but we don't want to link to the pages, at ++least not right now. Instead, we want to link to the fragments rendered by this ++shortcode. ++ ++@returns {template.HTML} ++ ++@example {{% glossary %}} ++*/}} ++{{- $path := "/getting-started/glossary" }} ++{{- with site.GetPage $path }} ++ {{- with $p := .Pages.ByTitle }} ++ ++ {{- /* Build and render alphabetical index. */}} ++ {{- $m := dict }} ++ {{- range $p }} ++ {{- $k := substr .Title 0 1 | strings.ToUpper }} ++ {{- if index $m $k }} ++ {{- continue }} ++ {{- end }} ++ {{- $anchor := path.BaseName .Path | anchorize }} ++ {{- $m = merge $m (dict $k $anchor) }} ++ {{- end }} ++ {{- range $k, $v := $m }} ++[{{ $k }}](#{{ $v }}) {{/* Do not indent. */}} ++ {{- end }} ++ ++ {{- /* Render glossary terms. */}} ++ {{- range $p }} ++###### {{ .Title }}{{/* Do not indent. */}} ++{{ .RenderShortcodes }}{{/* Do not indent. */}} ++ {{- end }} ++ ++ {{- end }} ++{{- else }} ++ {{- errorf "The %q shortcode was unable to get %s: see %s" .Name $path .Position}} ++{{- end }} diff --cc docs/netlify.toml index f1269e32d,000000000..52699de3a mode 100644,000000..100644 --- a/docs/netlify.toml +++ b/docs/netlify.toml @@@ -1,30 -1,0 +1,30 @@@ +[build] + publish = "public" + command = "hugo --gc --minify" + + [build.environment] - HUGO_VERSION = "0.140.2" ++ HUGO_VERSION = "0.142.0" + +[context.production.environment] + HUGO_ENV = "production" + HUGO_ENABLEGITINFO = "true" + +[context.split1] + command = "hugo --gc --minify --enableGitInfo" + + [context.split1.environment] + HUGO_ENV = "production" + +[context.deploy-preview] + command = "hugo --gc --minify --buildFuture -b $DEPLOY_PRIME_URL" + +[context.branch-deploy] + command = "hugo --gc --minify -b $DEPLOY_PRIME_URL" + +[context.next.environment] + HUGO_ENABLEGITINFO = "true" + +[[redirects]] + from = "/npmjs/*" + to = "/npmjs/" + status = 200