blogs/hugo
1
0
Fork 0
mirror of https://github.com/gohugoio/hugo.git synced 2026-09-02 03:32:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update content and URLs of About section

Browse Source 
Also add new section lookup for v0.20.
This commit is contained in:
Ryan Watters
2017-03-02 12:49:09 -06:00
parent 0b1c31fe2a
commit aa3ce7abd0
26 changed files with 723 additions and 679 deletions
Download Patch File Download Diff File Expand all files Collapse all files
config.toml
+1 -1
View File
@@ -57,7 +57,7 @@ watch = true
[params]
organizationname = ""
sitedescription = ""
release = "0.19"
release = "0.20 (beta)"
# Add GA Tracking Code Here. This leverages a built-in (ie, "internal") partial from HUGO: https://gohugo.io/extras/analytics#configuring-google-analytics
googleanalyticstrackingcode = ""
## Critical Render Path. If true, site style will be embedded in a <style> tag in each html <head> as part of Gulp Build. False puts a typical <link> to the stylesheet in <head>>
content/about-hugo/_index.md
-14
View File
@@ -1,14 +0,0 @@
---
title: About Hugo
linktitle: Overview
description: Hugo's features, roadmap, license, and motivation.
date: 2017-02-01
publishdate: 2017-02-01
lastmod: 2017-02-01
categories: []
tags: []
weight: 01
draft: false
aliases: []
toc: false
---
content/about/_index.md
+16
View File
@@ -0,0 +1,16 @@
---
title: About Hugo
linktitle: Overview
description: Hugo's features, roadmap, license, and motivation.
date: 2017-02-01
publishdate: 2017-02-01
lastmod: 2017-02-01
categories: []
tags: []
weight: 01
draft: false
aliases: [/about-hugo/]
toc: false
---
Hugo is not just a static site generator: it's a powerful templating engine written in Golang, an enthusiastic community of open-source developers, and, most importantly, it's a tool that allows website creation to be fun again.
content/about-hugo/benefits.md → content/about/benefits.md
+2 -2
View File
@@ -1,11 +1,11 @@
---
title: The Benefits of Static Site Generators
linktitle: The Benefits of Static
description: Learn why static site generators have become such a popular option for developers. Benefits include performance, security, ease of use, and exportability of content.
description: Learn the benefits of static site generators, including performance, security, ease of use, and exportability of content.
date: 2017-02-01
publishdate: 2017-02-01
lastmod: 2017-02-01
tags: [ssg,static,performance, security]
tags: [ssg,static,performance,security]
weight: 30
draft: false
aliases: []
content/about-hugo/features.md → content/about/features.md
+2 -3
View File
@@ -7,9 +7,8 @@ publishdate: 2017-02-01
lastmod: 2017-02-01
weight: 20
draft: false
aliases: [/about-hugo/features]
aliases: [/about/features]
toc: true
notesforauthors:
---
## General
@@ -67,7 +66,7 @@ See what's coming next in the [Hugo roadmap][].
[Google Analytics]: https://google-analytics.com/
[homepage]: /templates/homepage/
[hostanywhere]: /hosting-and-deployment/
[Hugo roadmap]: /about-hugo/roadmap
[Hugo roadmap]: /about/roadmap
[install]: /getting-started/installing/
[LiveReload]: /getting-started/using-hugo/
[organization for your projects]: /getting-started/directory-structure/
content/about-hugo/license.md → content/about/license.md
+1 -2
View File
@@ -4,11 +4,10 @@ linktitle: License
description: Hugo v0.15 and later are released under the Apache 2.0 license.
date: 2016-02-01
publishdate: 2016-02-01
lastmod: 2016-02-01
lastmod: 2016-03-02
categories: ["about hugo"]
tags: ["license","apache"]
weight: 60
draft: false
aliases: [/meta/license]
toc: true
---
content/about-hugo/roadmap.md → content/about/roadmap.md
View File
content/about-hugo/what-is-hugo.md → content/about/what-is-hugo.md
+3 -3
View File
@@ -1,14 +1,14 @@
---
title: What is Hugo
linktitle: What is Hugo
description: Hugo is the world's fastest static site generator, a powerful templating engine written in Golang, and an enthusiastic community of open-source developers. Most importantly, Hugo is here so that making websites can be fun again.
description: Hugo is the world's fastest static site generator and written in Golang.
date: 2017-02-01
publishdate: 2017-02-01
lastmod: 2017-02-01
layout: single
weight: 10
draft: false
aliases: [/overview/introduction/,/about-hugo/why-i-built-hugo/]
aliases: [/overview/introduction/,/about/why-i-built-hugo/]
toc: true
---
@@ -68,5 +68,5 @@ I wanted to develop a fast and full-featured website framework without any depen
[Nanoc]: http://nanoc.ws/
[Nanoc]: https://nanoc.ws/
[rackspace]: https://www.rackspace.com/cloud/files
[static site generator]: /about-hugo/benefits/
[static site generator]: /about/benefits/
[Surge]: https://surge.sh
content/concept.md
+1 -1
View File
@@ -212,7 +212,7 @@ Site showcase has stayed more or less as is, including styling, etc. However...
### About Hugo
* Content is more or less the same, but I've cleaned up a lot of the language, and copy edited for consistency throughout. I've also added in some extra frills (e.g. resources that extoll and teach more about the benefits of SSGs on [/about-hugo/benefist](/about-hugo/benefits/)).
* Content is more or less the same, but I've cleaned up a lot of the language, and copy edited for consistency throughout. I've also added in some extra frills (e.g. resources that extoll and teach more about the benefits of SSGs on [/about/benefist](/about/benefits/)).
* Release notes are now in the "News" section, although I'm still iffy on this decision. I can gladly move this back into "About" to give it a higher degree of discoverability in the menu.
### Getting Started
content/getting-started/quick-start.md
+3 -3
View File
@@ -81,7 +81,7 @@ Change into the newly created `bookshelf` directory. Listing the new directory's
You'll see the `bookshelf` directory has 6 subdirectories and 1 file. Let's look at each of them quickly. (See [Directory Structure][hugodirectories].)
* `archetypes`: [Archetypes][archetypes] allow you to preconfigure [front matter][frontmatter] for content files for easier scaffolding of content from the command line using `hugo new`.
* `archetypes`: [Archetypes][archetypes] allow you to preconfigure [front matter][fm] for content files for easier scaffolding of content from the command line using `hugo new`.
* `config.toml`: Hugo uses `.toml` as its default configuration format but also accepts `.yml` and `.json`. The configuration settings mentioned in the `config.toml` are applied to the full website an include important global variables such as the `baseURL` and `title` of your website. (See [Configuration][configuration].)
* `content`: This single directory houses all of the content for your website. Each subdirectory in content is considered a [section][]. If your website has sections for posts, events, and tutorials, you would create `content/posts`, `content/events`, and `content/tutorials`.
* `data`: This directory is used to store files of serialized data (YAML, TOML, or JSON) that can be used in [data templates][datatemplates] and your [website's menu][sitemenu].
@@ -131,7 +131,7 @@ draft = true
+++
```
The text bracketed by `+++` is the TOML [front matter][frontmatter] for the content. Front matter enables you to define embedded metadata that travels with the content file. Since we have not configured any [archetypes][archetypes] for our project, Hugo has used its built-in base archetype, which includes the following three values in the front matter:
The text bracketed by `+++` is the TOML [front matter][fm] for the content. Front matter enables you to define embedded metadata that travels with the content file. Since we have not configured any [archetypes][archetypes] for our project, Hugo has used its built-in base archetype, which includes the following three values in the front matter:
* `date` specifies the date and time at which post was created from the command line
* `title` specifies the title for the post, which Hugo will infer from the file name
@@ -562,7 +562,7 @@ Here's what you should look into next:
[createtheme]: /themes/creating-a-theme/
[datatemplates]: /templates/data-templates/
[forum]: https://discuss.gohugo.io
[frontmatter]: /content-management/front-matter/
[fm]: /content-management/front-matter/
[hostinganddeploy]: /hosting-and-deployment/
[hugodirectories]: /getting-started/directory-structure/
[install]: /getting-started/installing/
content/news/press-and-articles.md
+1 -1
View File
@@ -110,7 +110,7 @@ Hugo has been featured in the following Blog Posts, Press, and Media.
| [Hugo: Beyond the Defaults](http://npf.io/2014/08/hugo-beyond-the-defaults/) | Nate Finch | 2014-08-08 |
| [First Impressions of Hugo](https://peteraba.com/blog/first-impressions-of-hugo/) | Peter Aba | 2014-06-06 |
| [New Site Workflow](http://vurt.co.uk/post/new_website/) | Giles Paterson | 2014-08-05 |
| [How I Learned to Stop Worrying and Love the (Static) Web](http://cognition.ca/post/about-hugo/) | Joshua McKenty | 2014-08-4 |
| [How I Learned to Stop Worrying and Love the (Static) Web](http://cognition.ca/post/about/) | Joshua McKenty | 2014-08-4 |
| [Hugo - Static Site Generator](http://kenwoo.io/blog/hugo---static-site-generator/) | Kenny Woo | 2014-08-03 |
| [Hugo Is Friggin' Awesome](http://npf.io/2014/08/hugo-is-awesome/) | Nate Finch | 2014-08-01 |
| [<span lang="zh-CN">再次搬家</span> <small>(Move from WordPress to Hugo)</small>](http://www.chingli.com/misc/move-from-wordpress-to-hugo/) | <span lang="zh-CN">青砾</span> (chingli) | 2014-07-12 |
content/news/release-notes.md
+1 -1
View File
@@ -706,7 +706,7 @@ This release represents over 110 code commits from 29 different contributors.
* A bunch of [additional template functions](/layout/functions/)
* Watching very large sites now works on Mac
* RSS generation improved. Limited to 50 items by default, can limit further in [template](/layout/rss/)
* Boolean params now supported in [frontmatter](/content/front-matter/)
* Boolean params now supported in [fm](/content/front-matter/)
* Launched website [showcase](/showcase/). Show off your own hugo site!
* A bunch of [bug fixes](https://github.com/spf13/hugo/commits/master)
content/templates/section-templates.md
+50 -16
View File
@@ -14,13 +14,13 @@ toc: true
wip: true
---
Section page templates are lists and therefore have all the variables and methods available to [list pages][lists].
Templates used for section pages are *lists* and therefore have all the variables and methods available to [list pages][lists].
{{% warning "Section Pages Pull Content from `_index.md`" %}}
To effectively leverage section page templates, you should first understand the Hugo [content organization](/content-management/organization/), and specifically the purpose of `_index.md`.
{{% /warning %}}
{{% note "Section Pages Pull Content from `_index.md`" %}}
To effectively leverage section page templates, you should first understand Hugo's [content organization](/content-management/organization/) and, specifically, the purpose of `_index.md` for adding content and front matter to section and other list pages.
{{% /note %}}
### Section Template Lookup Order
## Section Template Lookup Order
The [lookup order][lookup] for section pages is as follows:
@@ -33,15 +33,17 @@ The [lookup order][lookup] for section pages is as follows:
5. `/themes/<THEME>/layouts/_default/section.html`
6. `/themes/<THEME>/layouts/_default/list.html`
Note that a sections list page can also have a content file with frontmatter, see [Source Organization](/overview/source-directory/}}).
## `.Site.GetPage`
Every `Page` in Hugo has a `.Kind` attribute. `Kind` can easily be combined with [`where`](/functions/where/) in your templates to create kind-specific lists of content, but there are times where you may want to fetch the index page of a single section by the section's path.
Every `Page` in Hugo has a `.Kind` attribute. `Kind` can easily be combined with the [`where` function](/functions/where/) in your templates to create kind-specific lists of content. This method is ideal for creating lists, but there are times where you may want to fetch just the index page of a single section via the section's path.
[`.GetPage`](/function/getpage/) looks up an index page (i.e `_index.md`) of a given `Kind` and `path`. This method is only supported in section page templates but *may* support [single page templates][singlepages] in the future.
The [`.GetPage` function](/function/getpage/) looks up an index page of a given `Kind` and `path`.
`.Site.GetPage` takes two arguments: `kind` and `kind value`.
{{% note %}}
`.GetPage` is only supported in section page templates but *may* be supported in [single page templates][singlepages] in the future.
{{% /note %}}
You can call `.Site.GetPage` with two arguments: `kind` and `kind value`.
The valid values for 'kind' are as follows:
@@ -50,18 +52,50 @@ The valid values for 'kind' are as follows:
3. `taxonomy`
4. `taxonomyTerm`
### `.Site.GetPage` Example
### Example `.Site.GetPage` Example
The `.Site.GetPage` example assumes the following project directory structure:
The `.Site.GetPage` example that follows assumes the following project directory structure:
{{% code file="grab-blog-section-index-page-title.html" %}}
```golang
{{ with .Site.GetPage "section" "blog" }}{{ .Title }}{{ end }}
```bash
.
└── content
├── blog
│   ├── _index.md # "title: My Hugo Blog" in the front matter
│   ├── post-1.md
│   ├── post-2.md
│   └── post-3.md
└── events #Note there is no _index.md file in "events"
├── event-1.md
└── event-2.md
```
`.Site.GetPage` will return `nil` if no `_index.md` page is found. Therefore, if `content/blog/_index.md` does not exist, the template will output the section name:
{{% code file="grab-blog-section-title.html" %}}
```html
<h1>{{ with .Site.GetPage "section" "blog" }}{{ .Title }}{{ end }}</h1>
```
{{% /code %}}
`.Site.GetPage` will return `nil` if no `_index.md` page is found. If `content/blog/_index.md` does not exist, the template will output a blank section where `{{.Title}}` should have been in the preceding example.
Since `blog` has a section content page (i.e., `_index.md`) with front matter to pull from, the above code will return the following result:
```html
<h1>My Hugo Blog</h1>
```
If we try the same code with the `events` section, however:
{{% code file="grab-events-section-title.html" %}}
```html
<h1>{{ with .Site.GetPage "section" "events" }}{{ .Title }}{{ end }}</h1>
```
{{% /code %}}
We get the following output in our HTML at render time because `events` does *not* have an `_index.md` from which to pull your "title:" field specified in the front matter:
```html
<h1>Events</h1>
```
[lists]: /templates/lists/
[lookup]: /templates/lookup-order/
data/sitenavigation.yml
+1 -1
View File
@@ -1,7 +1,7 @@
about:
order: 1
title: "About Hugo"
url: "about-hugo"
url: "about"
haschildren: true
sortsubpagesby: "weight"
desc: "Hugo's features, roadmap, and license, as well as the motivation behind creating Hugo"
dev-and-design-resources/about-hugo.afdesign → dev-and-design-resources/about.afdesign
View File
layouts/_default/single.html
+2 -2
View File
@@ -9,9 +9,9 @@
{{- partial "content-header-links.html" . -}}
{{- partial "tags.html" . -}}
<!-- temporary WIP badge; should be removed before site launch -->
{{- if .Params.wip -}}
<!-- {{- if .Params.wip -}}
<div id="beingreviewed">WIP</div>
{{- end -}}
{{- end -}} -->
{{ $title := .Title }}
</header>
<div class="body-copy" data-section={{.Section | urlize}}>
layouts/partials/head/site-style.html
+1 -1
View File
@@ -1,6 +1,6 @@
<link rel="stylesheet" href="/css/style.min.css">
<script src="https://use.typekit.net/bmc1jgv.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>
<script>try{Typekit.load({ async: false });}catch(e){}</script>
{{if .Site.Params.usefontawesome}}
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
{{end}}
pipeline/js/scripts/highlight.pack.js
+1 -1
View File
@@ -354,7 +354,7 @@ hljs.registerLanguage("bash", function(e) {
var t = { cN: "variable", v: [{ b: /\$[\w\d#@][\w\d_]*/ }, { b: /\$\{(.*?)}/ }] },
s = { cN: "string", b: /"/, e: /"/, c: [e.BE, t, { cN: "variable", b: /\$\(/, e: /\)/, c: [e.BE] }] },
a = { cN: "string", b: /'/, e: /'/ };
return { aliases: ["sh", "zsh", "git"], l: /-?[a-z\._]+/, k: { keyword: "hugo if \| then else elif fi for while in do done case esac function yoursite.com", literal: "true -b branch false posts events authors", built_in: "draft break cd checkout continue eval exec exit export getopts hash pwd readonly new return shift test times trap umask unset alias bind builtin caller command declare echo enable help let local logout mapfile printf read readarray source type typeset ulimit unalias set shopt autoload bg bindkey bye cap chdir clone comparguments compcall compctl compdescribe compfiles compgroups compquote comptags comptry compvalues dirs disable disown echotc echoti emulate fc fg float functions getcap getln history integer jobs kill limit log noglob popd print pushd pushln rehash sched setcap setopt stat suspend ttyctl unfunction unhash unlimit unsetopt vared wait whence where which yoursite zcompile zformat zftp zle zmodload zparseopts zprof zpty zregexparse zsocket zstyle ztcp", _: "-ne -eq -lt -gt -f -d -e -s -l -a" }, c: [{ cN: "meta", b: /^#![^\n]+sh\s*$/, r: 10 }, { cN: "function", b: /\w[\w\d_]*\s*\(\s*\)\s*\{/, rB: !0, c: [e.inherit(e.TM, { b: /\w[\w\d_]*/ })], r: 0 }, e.HCM, s, a, t] }
return { aliases: ["sh", "zsh", "git"], l: /-?[a-z\._]+/, k: { keyword: "hugo if \| then else elif fi for while in do done case esac function yoursite.com", literal: "true -b branch false", built_in: "draft break cd checkout continue eval exec exit export getopts hash pwd readonly new return shift test times trap umask unset alias bind builtin caller command declare echo enable help let local logout mapfile printf read readarray source type typeset ulimit unalias set shopt autoload bg bindkey bye cap chdir clone comparguments compcall compctl compdescribe compfiles compgroups compquote comptags comptry compvalues dirs disable disown echotc echoti emulate fc fg float functions getcap getln history integer jobs kill limit log noglob popd print pushd pushln rehash sched setcap setopt stat suspend ttyctl unfunction unhash unlimit unsetopt vared wait whence where which yoursite zcompile zformat zftp zle zmodload zparseopts zprof zpty zregexparse zsocket zstyle ztcp", _: "-ne -eq -lt -gt -f -d -e -s -l -a" }, c: [{ cN: "meta", b: /^#![^\n]+sh\s*$/, r: 10 }, { cN: "function", b: /\w[\w\d_]*\s*\(\s*\)\s*\{/, rB: !0, c: [e.inherit(e.TM, { b: /\w[\w\d_]*/ })], r: 0 }, e.HCM, s, a, t] }
});
hljs.registerLanguage("http", function(e) {
var t = "HTTP/[0-9\\.]+";
pipeline/scss/components/_code-OLD.scss
+467
View File
@@ -0,0 +1,467 @@
//General code styling for inline code (ie, within body copy and not in a separate code block)
code,
pre {
font-family: $code-font-family;
margin: 0px;
font-weight: $code-font-base-weight;
color: inherit;
}
.body-copy > pre {
@include card(3);
text-shadow: none;
padding: 0px;
margin: .5em 0px 32px 0px;
overflow: auto;
& > code {
color: $hugo-white;
}
}
.body-copy {
p {
code {
display: inline-block;
padding-top: .15em;
}
}
}
.body-copy {
p,
td,
li {
code {
font-size: .85em;
display: inline-block;
color: inherit;
font-family: "robotomono", courier, monospace;
padding-left: .25em;
padding-right: .25em;
text-transform: none;
line-height: 1.2;
margin-bottom: .15em;
margin-top: 0px;
padding-top: 3px;
vertical-align: middle;
background-color: #ededed;
border: none;
outline: none;
z-index: -1;
padding-bottom: 3px;
border: none;
outline: none;
z-index: -1;
background-color: darken($inline-code-background-color, 5%);
@include MQ(retina) {
//lighten code background color for retina displays
background-color: $inline-code-background-color;
}
}
}
//for definitions lists
dd,
dt {
code {
//darken code background color for non-retina displays
background-color: darken($inline-code-background-color, 5%);
color: $inline-code-text-color;
font-family: $code-font-family;
@include MQ(retina) {
//lighten code background color for retina displays
background-color: $inline-code-background-color;
}
}
}
p > a code,
li > a code,
td > a code {
color: $hugo-pink;
}
> pre {
padding-bottom: 20px;
padding-top: 20px;
background-color: $code-block-background-color;
font-family: $code-font-family;
color: $code-block-base-font-color;
}
li > code,
li > span > code {
white-space: pre-wrap;
/* css-3 */
white-space: -moz-pre-wrap;
/* Mozilla, since 1999 */
white-space: -pre-wrap;
/* Opera 4-6 */
white-space: -o-pre-wrap;
/* Opera 7 */
word-wrap: break-word;
}
}
//for clipboard.js tooltip and button
div.code-copy {
position: relative;
margin-top: 1em;
margin-bottom: 32px;
background-color: $code-block-background-color;
&.input {
padding-bottom: 24px;
}
.code-copy-content {
padding-top: .5em;
&.output-content {
padding-bottom: .5em;
}
}
}
p + .code-copy {
margin-top: 0em;
}
button.copy-button,
button.download-button {
display: block;
box-shadow: none;
padding: 0px;
transition: all .2s ease-in-out;
background-color: $code-copy-button-color;
box-sizing: border-box;
position: absolute;
bottom: 0px;
z-index: 4;
// min-width: 90px;
// width: auto;
@include size(30px);
padding: {
left: 4px;
right: 4px;
}
height: 1.5em;
border-width: 0px;
border-radius: 0px;
font-weight: $code-font-bold-weight;
color: $code-copy-button-text-color;
font-size: 14px;
line-height: 24px;
height: 24px;
vertical-align: middle;
text-align: center;
text-transform:uppercase;
&:hover {
background-color: $hugo-blue;
box-shadow: none;
}
&:active,
&:focus {
outline: none;
position: absolute;
}
}
// .button.copy-button {
// opacity: 0;
// }
h1,
h2,
h3,
h4,
h5,
h6 {
code {
font-weight: $code-font-bold-weight;
font-size: .95em;
}
}
//hide copy button on iPad and iPhone
button.copy-button {
@include MQ(retinaPortrait) {
display: none;
}
@include MQ(retinaLandscape) {
display: none;
}
}
button.download-button {
display: none;
@include MQ(M) {
display: block;
}
}
a[role="button"].see-code-source {
position: absolute;
top: 1.75em;
right: 0px;
border-radius: 0px;
background: transparent;
text-transform: uppercase;
color: darken($hugo-white, 5%);
font-size: 14px;
}
a[href*="bitbucket"].see-code-source:after {
content: '\f171';
font-family: 'FontAwesome';
display: inline-block;
font-size: 1.3em;
color: inherit;
margin-left: .2em;
}
a[href*="github"].see-code-source:after {
content: '\f09b';
font-family: 'FontAwesome';
display: inline-block;
font-size: 1.3em;
color: inherit;
margin-left: .2em;
}
a[href*="gitlab"].see-code-source:after {
content: '\f296';
font-family: 'FontAwesome';
display: inline-block;
font-size: 1.3em;
color: inherit;
margin-left: .2em;
}
button.copy-button {
display: none;
@include MQ(M) {
display: block;
right: 0px;
}
i.icon-clipboard {
display: inline;
}
}
div.code-copy {
position: relative;
@include card(3);
transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
border-radius: 0px;
}
div.code-copy-header {
position: relative;
height: 1.5em;
line-height: 1.5em;
background-color: $code-editor-header-base-bg-color;
border-radius: 0px;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
&.output {
background-color: $output-example-color;
}
&.examplesite {
background-color: $examplesite-codeblock-shortcode-header-bg-color;
}
span.filename {
text-align: center;
color: $code-filename-color;
font-weight: 100;
font-size: 12px;
font-family: $systemfonts;
i.icon-website {
color: inherit;
font-weight: bold;
font-size: 18px;
}
}
[class^="icon-"] {
color: $code-filename-color;
}
//corrects odd placement of terminal icon
i.icon-sh.input,
i.icon-bash.input {
padding-right: .5em;
}
}
.tooltipped {
position: relative;
background-color: $code-tooltip-bg-color;
padding-right: 2em;
}
.tooltipped:after {
position: absolute;
z-index: 1000000;
display: none;
padding: 2px 4px;
font-size: .8em;
font-weight: $base-font-bold-weight;
font-family: $heading-font-family;
color: $hugo-white;
text-align: center;
text-transform: uppercase;
text-decoration: none;
text-shadow: none;
letter-spacing: normal;
word-wrap: break-word;
white-space: pre;
pointer-events: none;
content: attr(aria-label);
background-color: $code-tooltip-bg-color;
border-color: $code-tooltip-bg-color;
border-radius: 0px;
-webkit-font-smoothing: subpixel-antialiased
}
.tooltipped:before {
position: absolute;
z-index: 1000001;
display: none;
width: 0;
height: 0;
color: $code-tooltip-bg-color;
pointer-events: none;
content: "";
border: 5px solid transparent;
}
.tooltipped:hover:before,
.tooltipped:hover:after,
.tooltipped:active:before,
.tooltipped:active:after,
.tooltipped:focus:before,
.tooltipped:focus:after {
display: inline-block;
text-decoration: none;
}
.tooltipped-multiline:hover:after,
.tooltipped-multiline:active:after,
.tooltipped-multiline:focus:after {
display: table-cell;
}
.tooltipped-s:after,
.tooltipped-se:after,
.tooltipped-sw:after {
top: 100%;
right: 50%;
margin-top: 5px;
text-align: center;
}
.tooltipped-s:before,
.tooltipped-se:before,
.tooltipped-sw:before {
top: auto;
right: 50%;
bottom: -5px;
margin-right: -5px;
border-bottom-color: $code-tooltip-bg-color;
text-align: center;
}
.tooltipped-se:after {
right: auto;
left: 50%;
margin-left: -15px;
text-align: center;
}
.tooltipped-sw:after {
margin-right: -15px
}
.tooltipped-n:after,
.tooltipped-ne:after,
.tooltipped-nw:after {
right: 50%;
bottom: 100%;
margin-bottom: 5px
}
.tooltipped-n:before,
.tooltipped-ne:before,
.tooltipped-nw:before {
top: -5px;
right: 50%;
bottom: auto;
margin-right: -5px;
border-top-color: $code-tooltip-bg-color;
}
.tooltipped-ne:after {
right: auto;
left: 50%;
margin-left: -15px
}
.tooltipped-nw:after {
margin-right: -15px
}
.tooltipped-s:after,
.tooltipped-n:after {
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%)
}
.tooltipped-w:after {
right: 100%;
bottom: 50%;
margin-right: 5px;
-webkit-transform: translateY(50%);
-ms-transform: translateY(50%);
transform: translateY(50%)
}
.tooltipped-w:before {
top: 50%;
bottom: 50%;
left: -5px;
margin-top: -5px;
border-left-color: $code-tooltip-bg-color;
}
.tooltipped-e:after {
bottom: 50%;
left: 100%;
margin-left: 5px;
-webkit-transform: translateY(50%);
-ms-transform: translateY(50%);
transform: translateY(50%)
}
.tooltipped-e:before {
top: 50%;
right: -5px;
bottom: 50%;
margin-top: -5px;
border-right-color: $code-tooltip-bg-color;
}
.tooltipped-multiline:after {
width: max-content;
max-width: 250px;
word-break: break-word;
word-wrap: normal;
white-space: pre-line;
border-collapse: separate
}
.tooltipped-multiline.tooltipped-s:after,
.tooltipped-multiline.tooltipped-n:after {
right: auto;
left: 50%;
transform: translateX(-50%)
}
.tooltipped-multiline.tooltipped-w:after,
.tooltipped-multiline.tooltipped-e:after {
right: 100%
}
pipeline/scss/components/_code.scss
+131 -275
View File
@@ -1,296 +1,154 @@
//General code styling for inline code (ie, within body copy and not in a separate code block)
code,
pre {
font-family: $code-font-family;
margin: 0px;
font-weight: $code-font-base-weight;
color: inherit;
}
.body-copy > pre {
@include card(3);
text-shadow: none;
padding: 0px;
margin: .5em 0px 32px 0px;
overflow: auto;
& > code {
color: $hugo-white;
}
}
.body-copy {
p {
code {
display: inline-block;
padding-top: .15em;
}
code,
pre {
font-family: $code-font-family;
font-size: .9em;
weight: inherit;
font-weight: $code-font-base-weight;
position: relative;
overflow-y: visible;
z-index:1;
}
}
.body-copy {
p,
td,
li {
code {
font-size: .85em;
display: inline-block;
color: inherit;
font-family: "robotomono", courier, monospace;
padding-left: .25em;
padding-right: .25em;
text-transform: none;
line-height: 1.2;
margin-bottom: .15em;
margin-top: 0px;
padding-top: 3px;
vertical-align: middle;
background-color: #ededed;
border: none;
outline: none;
z-index: -1;
padding-bottom: 3px;
border: none;
outline: none;
z-index: -1;
background-color: darken($inline-code-background-color, 5%);
@include MQ(retina) {
//lighten code background color for retina displays
background-color: $inline-code-background-color;
}
}
}
//for definitions lists
dd,
dt {
code {
//darken code background color for non-retina displays
background-color: darken($inline-code-background-color, 5%);
color: $inline-code-text-color;
font-family: $code-font-family;
@include MQ(retina) {
//lighten code background color for retina displays
background-color: $inline-code-background-color;
}
}
}
p > a code,
li > a code,
td > a code {
color: $hugo-pink;
pre > code,
.code {
background-color: $code-block-background-color;
}
> pre {
padding-bottom: 20px;
padding-top: 20px;
background-color: $code-block-background-color;
font-family: $code-font-family;
color: $code-block-base-font-color;
overflow-x: scroll;
}
li > code,
li > span > code {
white-space: pre-wrap;
/* css-3 */
white-space: -moz-pre-wrap;
/* Mozilla, since 1999 */
white-space: -pre-wrap;
/* Opera 4-6 */
white-space: -o-pre-wrap;
/* Opera 7 */
word-wrap: break-word;
}
}
//for clipboard.js tooltip and button
div.code-copy {
position: relative;
margin-top: 1em;
margin-bottom: 32px;
background-color: $code-block-background-color;
&.input {
padding-bottom: 24px;
}
.code-copy-content {
padding-top: .5em;
&.output-content {
padding-bottom: .5em;
ol,
ul,
div,
strong,
em,
span,
p,
dd,
dt,
{
code {
background-color: $inline-code-background-color;
@include MQ(retina) {
background-color: $inline-code-background-color;
}
}
}
}
p + .code-copy {
margin-top: 0em;
}
button.copy-button,
button.download-button {
.code {
display: block;
box-shadow: none;
padding: 0px;
transition: all .2s ease-in-out;
background-color: $code-copy-button-color;
box-sizing: border-box;
position: absolute;
bottom: 0px;
z-index: 4;
// min-width: 90px;
// width: auto;
@include size(30px);
padding: {
left: 4px;
right: 4px;
}
height: 1.5em;
border-width: 0px;
border-radius: 0px;
font-weight: $code-font-bold-weight;
color: $code-copy-button-text-color;
font-size: 14px;
line-height: 24px;
height: 24px;
vertical-align: middle;
text-align: center;
text-transform:uppercase;
&:hover {
background-color: $hugo-blue;
box-shadow: none;
}
&:active,
&:focus {
outline: none;
position: relative;
overflow: hidden;
padding: .5em;
overflow-y: visible;
}
code[class^="language-"] {
&:after {
display: block;
position: absolute;
top: 4px;
right: 4px;
color: lighten($base-font-color, 25%);
font-family: 'fontello';
content: '\f121';
}
}
// .button.copy-button {
// opacity: 0;
// }
h1,
h2,
h3,
h4,
h5,
h6 {
code {
font-weight: $code-font-bold-weight;
font-size: .95em;
}
}
//hide copy button on iPad and iPhone
button.copy-button {
@include MQ(retinaPortrait) {
display: none;
}
@include MQ(retinaLandscape) {
display: none;
}
}
button.download-button {
display: none;
@include MQ(M) {
display: block;
}
}
a[role="button"].see-code-source {
position: absolute;
top: 1.75em;
right: 0px;
border-radius: 0px;
background: transparent;
text-transform: uppercase;
color: darken($hugo-white, 5%);
font-size: 14px;
}
a[href*="bitbucket"].see-code-source:after {
content: '\f171';
font-family: 'FontAwesome';
display: inline-block;
font-size: 1.3em;
color: inherit;
margin-left: .2em;
}
a[href*="github"].see-code-source:after {
content: '\f09b';
font-family: 'FontAwesome';
display: inline-block;
font-size: 1.3em;
color: inherit;
margin-left: .2em;
}
a[href*="gitlab"].see-code-source:after {
content: '\f296';
font-family: 'FontAwesome';
display: inline-block;
font-size: 1.3em;
color: inherit;
margin-left: .2em;
}
button.copy-button {
display: none;
@include MQ(M) {
display: block;
right: 0px;
}
i.icon-clipboard {
display: inline;
}
}
div.code-copy {
position: relative;
@include card(3);
transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
border-radius: 0px;
}
div.code-copy-header {
position: relative;
height: 1.5em;
line-height: 1.5em;
background-color: $code-editor-header-base-bg-color;
border-radius: 0px;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
&.output {
background-color: $output-example-color;
}
&.examplesite {
background-color: $examplesite-codeblock-shortcode-header-bg-color;
}
span.filename {
text-align: center;
color: $code-filename-color;
font-weight: 100;
font-size: 12px;
font-family: $systemfonts;
i.icon-website {
color: inherit;
font-weight: bold;
font-size: 18px;
.copy-button + .code-copy-content {
code[class^="language-"] {
&:after {
display: none;
position: absolute;
top: -14px;
right: 4px;
}
}
[class^="icon-"] {
color: $code-filename-color;
}
code.language-html:after {
font-family: 'FontAwesome';
content: '\f13b';
}
code.language-js:after {
font-family: 'fontello';
content: '\e802';
font-size: 16px;
top: 2px;
}
code.language-hugo:after,
code.language-go:after,
code.language-golang:after {
font-family: 'fontello';
content: '\e81f';
}
code.language-sass:after,
code.language-scss:after {
font-family: 'fontello';
content: '\e803';
}
.filename {
font-family: $code-font-family;
color: lighten($base-font-color, 45%);
padding-left: 1em;
padding-top: .25em;
font-size: .7em;
background-color: $code-block-background-color;
width: 100%;
font-style: italic;
margin-bottom: 0px;
}
.code-icon {
position: absolute;
top: 2px;
right: 4px;
}
.copy-button {
transition: opacity .3s ease-in-out;
opacity: 1;
position: absolute;
right: 1px;
top: 1px;
background-color: white;
color: $base-font-color;
border-radius: 0px;
@include card(1);
height: 30px;
width: auto;
font-size: 12px;
display: block;
z-index: 999;
&:hover {
@include card(3);
}
//corrects odd placement of terminal icon
i.icon-sh.input,
i.icon-bash.input {
padding-right: .5em;
span.button-text {
text-transform: uppercase;
margin-left: 3px;
}
}
.download-button {
display: none!important;
}
.code:hover {
.copy-button,
.download-button {
transition: all .3s ease-in-out;
opacity: 1;
}
}
.tooltipped {
position: relative;
background-color: $code-tooltip-bg-color;
padding-right: 2em;
position: absolute;
// background-color: $code-tooltip-bg-color;
// padding-right: 2em;
}
.tooltipped:after {
@@ -368,12 +226,12 @@ div.code-copy-header {
.tooltipped-se:after {
right: auto;
left: 50%;
margin-left: -15px;
// margin-left: -15px;
text-align: center;
}
.tooltipped-sw:after {
margin-right: -15px
// margin-right: -15px
}
.tooltipped-n:after,
@@ -446,8 +304,6 @@ div.code-copy-header {
}
.tooltipped-multiline:after {
width: -webkit-max-content;
width: -moz-max-content;
width: max-content;
max-width: 250px;
word-break: break-word;
pipeline/scss/components/_new-code.scss
-327
View File
@@ -1,327 +0,0 @@
.body-copy {
code,
pre {
font-family: $code-font-family;
font-size: .9em;
weight: inherit;
font-weight: $code-font-base-weight;
position: relative;
overflow-y: visible;
z-index:1;
}
pre > code,
.code {
background-color: $code-block-background-color;
}
> pre {
overflow-x: scroll;
}
ol,
ul,
div,
strong,
em,
span,
p,
dd,
dt,
{
code {
background-color: $inline-code-background-color;
@include MQ(retina) {
background-color: $inline-code-background-color;
}
}
}
}
.code {
display: block;
position: relative;
overflow: hidden;
padding: .5em;
overflow-y: visible;
}
code[class^="language-"] {
&:after {
display: block;
position: absolute;
top: 4px;
right: 4px;
color: lighten($base-font-color, 25%);
font-family: 'fontello';
content: '\f121';
}
}
.copy-button + .code-copy-content {
code[class^="language-"] {
&:after {
display: none;
position: absolute;
top: -14px;
right: 4px;
}
}
}
code.language-html:after {
font-family: 'FontAwesome';
content: '\f13b';
}
code.language-js:after {
font-family: 'fontello';
content: '\e802';
font-size: 16px;
top: 2px;
}
code.language-hugo:after,
code.language-go:after,
code.language-golang:after {
font-family: 'fontello';
content: '\e81f';
}
code.language-sass:after,
code.language-scss:after {
font-family: 'fontello';
content: '\e803';
}
.filename {
font-family: $code-font-family;
color: lighten($base-font-color, 45%);
padding-left: 1em;
padding-top: .25em;
font-size: .7em;
background-color: $code-block-background-color;
width: 100%;
font-style: italic;
margin-bottom: 0px;
}
.code-icon {
position: absolute;
top: 2px;
right: 4px;
}
.copy-button {
transition: opacity .3s ease-in-out;
opacity: 1;
position: absolute;
right: 1px;
top: 1px;
background-color: white;
color: $base-font-color;
border-radius: 0px;
@include card(1);
height: 30px;
width: auto;
font-size: 12px;
display: block;
z-index: 999;
&:hover {
@include card(3);
}
span.button-text {
text-transform: uppercase;
margin-left: 3px;
}
}
.download-button {
display: none!important;
}
.code:hover {
.copy-button,
.download-button {
transition: all .3s ease-in-out;
opacity: 1;
}
}
.tooltipped {
position: absolute;
// background-color: $code-tooltip-bg-color;
// padding-right: 2em;
}
.tooltipped:after {
position: absolute;
z-index: 1000000;
display: none;
padding: 2px 4px;
font-size: .8em;
font-weight: $base-font-bold-weight;
font-family: $heading-font-family;
color: $hugo-white;
text-align: center;
text-transform: uppercase;
text-decoration: none;
text-shadow: none;
letter-spacing: normal;
word-wrap: break-word;
white-space: pre;
pointer-events: none;
content: attr(aria-label);
background-color: $code-tooltip-bg-color;
border-color: $code-tooltip-bg-color;
border-radius: 0px;
-webkit-font-smoothing: subpixel-antialiased
}
.tooltipped:before {
position: absolute;
z-index: 1000001;
display: none;
width: 0;
height: 0;
color: $code-tooltip-bg-color;
pointer-events: none;
content: "";
border: 5px solid transparent;
}
.tooltipped:hover:before,
.tooltipped:hover:after,
.tooltipped:active:before,
.tooltipped:active:after,
.tooltipped:focus:before,
.tooltipped:focus:after {
display: inline-block;
text-decoration: none;
}
.tooltipped-multiline:hover:after,
.tooltipped-multiline:active:after,
.tooltipped-multiline:focus:after {
display: table-cell;
}
.tooltipped-s:after,
.tooltipped-se:after,
.tooltipped-sw:after {
top: 100%;
right: 50%;
margin-top: 5px;
text-align: center;
}
.tooltipped-s:before,
.tooltipped-se:before,
.tooltipped-sw:before {
top: auto;
right: 50%;
bottom: -5px;
margin-right: -5px;
border-bottom-color: $code-tooltip-bg-color;
text-align: center;
}
.tooltipped-se:after {
right: auto;
left: 50%;
// margin-left: -15px;
text-align: center;
}
.tooltipped-sw:after {
// margin-right: -15px
}
.tooltipped-n:after,
.tooltipped-ne:after,
.tooltipped-nw:after {
right: 50%;
bottom: 100%;
margin-bottom: 5px
}
.tooltipped-n:before,
.tooltipped-ne:before,
.tooltipped-nw:before {
top: -5px;
right: 50%;
bottom: auto;
margin-right: -5px;
border-top-color: $code-tooltip-bg-color;
}
.tooltipped-ne:after {
right: auto;
left: 50%;
margin-left: -15px
}
.tooltipped-nw:after {
margin-right: -15px
}
.tooltipped-s:after,
.tooltipped-n:after {
-webkit-transform: translateX(50%);
-ms-transform: translateX(50%);
transform: translateX(50%)
}
.tooltipped-w:after {
right: 100%;
bottom: 50%;
margin-right: 5px;
-webkit-transform: translateY(50%);
-ms-transform: translateY(50%);
transform: translateY(50%)
}
.tooltipped-w:before {
top: 50%;
bottom: 50%;
left: -5px;
margin-top: -5px;
border-left-color: $code-tooltip-bg-color;
}
.tooltipped-e:after {
bottom: 50%;
left: 100%;
margin-left: 5px;
-webkit-transform: translateY(50%);
-ms-transform: translateY(50%);
transform: translateY(50%)
}
.tooltipped-e:before {
top: 50%;
right: -5px;
bottom: 50%;
margin-top: -5px;
border-right-color: $code-tooltip-bg-color;
}
.tooltipped-multiline:after {
width: max-content;
max-width: 250px;
word-break: break-word;
word-wrap: normal;
white-space: pre-line;
border-collapse: separate
}
.tooltipped-multiline.tooltipped-s:after,
.tooltipped-multiline.tooltipped-n:after {
right: auto;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%)
}
.tooltipped-multiline.tooltipped-w:after,
.tooltipped-multiline.tooltipped-e:after {
right: 100%
}
pipeline/scss/style.scss
+2 -4
View File
@@ -19,10 +19,8 @@
@import 'components/anchors';
@import 'components/images';
@import 'components/admonitions';
// @import 'vendor/highlightjs';
@import 'vendor/highlightjs-new';
// @import 'components/code';
@import 'components/new-code';
@import 'vendor/highlightjs';
@import 'components/code';
@import 'components/icons';
@import 'components/tags';
@import 'algolia/main';
pipeline/scss/vendor/_highlightjs-new.scss → pipeline/scss/vendor/_highlightjs-OLD.scss
Vendored
+10 -10
View File
@@ -14,12 +14,12 @@ Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-lic
.hljs,
.hljs-tag,
.hljs-subst {
color: $hugo-black;
color: $hugo-white;
}
.hljs-strong,
.hljs-emphasis {
color: $hugo-gray;
color: $hugo-gray-light;
}
.hljs-bullet,
@@ -28,14 +28,14 @@ Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-lic
.hljs-regexp,
.hljs-literal,
.hljs-link {
color: saturate($hugo-blue,10%);
color: $hugo-blue;
}
.hljs-code,
.hljs-title,
.hljs-section,
.hljs-selector-class {
color: $hugo-green;
color: $hugo-green-light;
}
.hljs-strong {
@@ -50,17 +50,17 @@ Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-lic
.hljs-selector-tag,
.hljs-name,
.hljs-attr {
color: $hugo-pink;
color: $hugo-pink-light;
}
.hljs-symbol,
.hljs-attribute {
color: saturate($hugo-blue,10%);
color: $hugo-blue-light;
}
.hljs-params,
.hljs-class .hljs-title {
color: $hugo-black;
color: $hugo-white;
}
.hljs-string,
@@ -73,15 +73,15 @@ Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-lic
.hljs-addition,
.hljs-variable,
.hljs-template-variable {
color: saturate($hugo-blue,10%);
color: $hugo-yellow;
}
.hljs-comment,
.hljs-deletion,
.hljs-meta {
color: $hugo-gray;
color: $hugo-gray-light;
}
.language-toml.hljs .hljs-section {
color:$hugo-pink;
color:$hugo-pink-light;
}
pipeline/scss/vendor/_highlightjs.scss
Vendored
+10 -10
View File
@@ -14,12 +14,12 @@ Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-lic
.hljs,
.hljs-tag,
.hljs-subst {
color: $hugo-white;
color: $hugo-black;
}
.hljs-strong,
.hljs-emphasis {
color: $hugo-gray-light;
color: $hugo-gray;
}
.hljs-bullet,
@@ -28,14 +28,14 @@ Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-lic
.hljs-regexp,
.hljs-literal,
.hljs-link {
color: $hugo-blue;
color: saturate($hugo-blue,10%);
}
.hljs-code,
.hljs-title,
.hljs-section,
.hljs-selector-class {
color: $hugo-green-light;
color: $hugo-green;
}
.hljs-strong {
@@ -50,17 +50,17 @@ Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-lic
.hljs-selector-tag,
.hljs-name,
.hljs-attr {
color: $hugo-pink-light;
color: $hugo-pink;
}
.hljs-symbol,
.hljs-attribute {
color: $hugo-blue-light;
color: saturate($hugo-blue,10%);
}
.hljs-params,
.hljs-class .hljs-title {
color: $hugo-white;
color: $hugo-black;
}
.hljs-string,
@@ -73,15 +73,15 @@ Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-lic
.hljs-addition,
.hljs-variable,
.hljs-template-variable {
color: $hugo-yellow;
color: saturate($hugo-blue,10%);
}
.hljs-comment,
.hljs-deletion,
.hljs-meta {
color: $hugo-gray-light;
color: $hugo-gray;
}
.language-toml.hljs .hljs-section {
color:$hugo-pink-light;
color:$hugo-pink;
}
static/images/hugo-icons/about.svg
+16
View File
@@ -0,0 +1,16 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" viewBox="0 0 512 512" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;">
<circle cx="256" cy="256" r="256" style="fill:rgb(115,115,115);"/>
<g transform="matrix(1.46332,0,0,1.46332,-118.606,-118.61)">
<circle cx="256" cy="256" r="153.078" style="fill:rgb(0,131,192);"/>
</g>
<g>
<g transform="matrix(1.09423,0,0,1.09423,49.0285,-23.754)">
<path d="M163.148,383.941L163.148,209.344L215.148,209.344L215.148,383.941L163.148,383.941ZM161.426,127.384L216.87,127.384L216.87,176.285L161.426,176.285L161.426,127.384Z" style="fill:rgb(252,216,4);fill-rule:nonzero;"/>
</g>
<g transform="matrix(0.547116,0,0,1.09423,167.681,-23.754)">
<path d="M163.148,383.941L163.148,209.344L215.148,209.344L215.148,383.941L163.148,383.941ZM161.426,127.384L216.87,127.384L216.87,176.285L161.426,176.285L161.426,127.384Z" style="fill:rgb(235,185,81);fill-rule:nonzero;"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

static/js/script.min.js
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long