mirror of
https://github.com/gohugoio/hugo.git
synced 2026-08-24 15:28:54 +00:00
Update toc for testing fade at bottom on PC
This commit is contained in:
@@ -26,7 +26,7 @@ Before you begin writing your content in markdown, Blackfriday has a known issue
|
||||
|
||||
You can configure multiple aspects of Blackfriday. For more information, see [how to configure your Hugo projects][config]:
|
||||
|
||||
{{< readfile file="content/readfiles/bfconfig.md" markdown="true" >}}
|
||||
{{< bfconfig >}}
|
||||
|
||||
## Extending Markdown
|
||||
|
||||
|
||||
@@ -36,8 +36,7 @@ Once `hugo` is installed, make sure to run the `help` command to verify `hugo` i
|
||||
|
||||
```bash
|
||||
hugo help
|
||||
```
|
||||
```
|
||||
|
||||
hugo is the main command, used to build your Hugo site.
|
||||
|
||||
Hugo is a Fast and Flexible Static Site Generator
|
||||
@@ -52,7 +51,7 @@ You can check the version of Hugo you're currently using with the `hugo version`
|
||||
hugo version
|
||||
```
|
||||
|
||||
```
|
||||
```bash
|
||||
Hugo Static Site Generator v0.18.1 BuildDate: 2016-12-30T05:02:43-05:00
|
||||
```
|
||||
|
||||
@@ -66,7 +65,7 @@ hugo new site bookshelf
|
||||
|
||||
Change into the newly created `bookshelf` directory. Listing the new directory's content will show the following:
|
||||
|
||||
```
|
||||
```bash
|
||||
.
|
||||
├── archetypes
|
||||
├── config.toml
|
||||
@@ -161,7 +160,7 @@ hugo server
|
||||
|
||||
You should see something similar to the following output:
|
||||
|
||||
```
|
||||
```bash
|
||||
Built site for language en:
|
||||
0 of 1 draft rendered
|
||||
0 future content
|
||||
@@ -192,7 +191,7 @@ hugo server --buildDrafts
|
||||
|
||||
You should now see something similar to the following:
|
||||
|
||||
```
|
||||
```bash
|
||||
Built site for language en:
|
||||
1 of 1 draft rendered
|
||||
0 future content
|
||||
@@ -248,7 +247,7 @@ hugo server --theme=hugo_theme_robust --buildDrafts
|
||||
|
||||
You should see an output to the console similar to the following:
|
||||
|
||||
```
|
||||
```bash
|
||||
Built site for language en:
|
||||
1 of 1 draft rendered
|
||||
0 future content
|
||||
@@ -269,7 +268,7 @@ Press Ctrl+C to stop
|
||||
If Hugo doesn't find the specified theme in the `themes` directory,
|
||||
it will throw an exception:
|
||||
|
||||
```
|
||||
```bash
|
||||
FATAL: 2016/02/14 Unable to find theme Directory: /Users/yourusername/bookshelf/themes/robust
|
||||
```
|
||||
|
||||
@@ -519,7 +518,7 @@ Now, commenting will be enabled in your blog.
|
||||
To generate a website that can be deployed to GitHub pages, we first need to change the `baseURL` in our configuration as follows:
|
||||
|
||||
```toml
|
||||
baseURL = "https://<your GitHub username>.github.io/bookshelf/"
|
||||
baseURL = "https://<yourgithubusername>.github.io/bookshelf/"
|
||||
```
|
||||
|
||||
Then type the following command while in the root directory of your Hugo project:
|
||||
|
||||
@@ -1,12 +1,16 @@
|
||||
<!-- TOCs need to be declared explicitly in the front matter of content/*.md -->
|
||||
{{if .Params.toc }}
|
||||
<aside id="toc">
|
||||
<div class="toc-inner-wrapper">
|
||||
<header class="toc-header">
|
||||
<a href="#{{.Title | urlize}}">
|
||||
<h3 class="{{.Section}}">{{.Title}}</h3>
|
||||
</a>
|
||||
</header>
|
||||
{{.TableOfContents}}
|
||||
|
||||
</div>
|
||||
<div class="fade"></div>
|
||||
</aside>
|
||||
<a href="#" id="toc-toggle"></a>
|
||||
{{end}}
|
||||
@@ -88,13 +88,9 @@ pre {
|
||||
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;
|
||||
}
|
||||
}
|
||||
@@ -131,8 +127,6 @@ button.download-button {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
z-index: 4;
|
||||
// min-width: 90px;
|
||||
// width: auto;
|
||||
@include size(30px);
|
||||
padding: {
|
||||
left: 4px;
|
||||
|
||||
@@ -5,10 +5,12 @@
|
||||
font-size: .9em;
|
||||
weight: inherit;
|
||||
font-weight: $code-font-base-weight;
|
||||
position: relative;
|
||||
overflow-y: visible;
|
||||
z-index: 1;
|
||||
}
|
||||
> pre {
|
||||
position: relative;
|
||||
}
|
||||
pre > code,
|
||||
.code {
|
||||
background-color: $code-block-background-color;
|
||||
@@ -55,17 +57,31 @@ code[class^="language-"] {
|
||||
}
|
||||
}
|
||||
|
||||
// .copy-button + .code-copy-content {
|
||||
// .filename + .code-copy-content {
|
||||
// code[class^="language-"] {
|
||||
// &:after {
|
||||
// // display: none;
|
||||
// position: absolute;
|
||||
// top: -4px;
|
||||
// top: -16px;
|
||||
// right: 4px;
|
||||
// z-index:99999999;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
.copy-button + .code-copy-content {
|
||||
code[class^="language-"] {
|
||||
&:after {
|
||||
// display: none;
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
right: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// .copy-button {
|
||||
// display: none!important;
|
||||
// }
|
||||
code.language-html:after {
|
||||
font-family: 'FontAwesome';
|
||||
content: '\f13b';
|
||||
@@ -95,6 +111,7 @@ code.language-bash:after,
|
||||
code.language-sh:after {
|
||||
font-family: 'fontello';
|
||||
content: '\e804';
|
||||
right: 6px;
|
||||
}
|
||||
|
||||
code.language-toml:after {
|
||||
@@ -119,7 +136,7 @@ code.language-markdown:after {
|
||||
.copy-button + .code-copy-content {
|
||||
code[class^="language-"] {
|
||||
&:after {
|
||||
display:none;
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: -8px;
|
||||
right: 4px;
|
||||
@@ -129,7 +146,7 @@ code.language-markdown:after {
|
||||
|
||||
.filename {
|
||||
font-family: $code-font-family;
|
||||
color: lighten($base-font-color, 45%);
|
||||
color: lighten($base-font-color, 25%);
|
||||
padding-left: 1em;
|
||||
padding-top: .25em;
|
||||
font-size: .7em;
|
||||
@@ -173,13 +190,6 @@ code.language-markdown:after {
|
||||
display: none!important;
|
||||
}
|
||||
|
||||
.code:hover {
|
||||
.copy-button,
|
||||
.download-button {
|
||||
transition: all .3s ease-in-out;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.tooltipped {
|
||||
position: absolute;
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
.all-contents {
|
||||
// border-top: 1px solid $hugo-blue;
|
||||
padding-top:1em;
|
||||
font-size:.9em;
|
||||
font-size:.95em;
|
||||
}
|
||||
|
||||
.contents-list {
|
||||
|
||||
@@ -39,18 +39,32 @@ aside#toc {
|
||||
opacity: 1;
|
||||
}
|
||||
@include MQ(XL) {
|
||||
.toc-inner-wrapper {
|
||||
position: relative;
|
||||
min-height: calc(100vh - #{$site-header-height} - #{$site-footer-height-l-plus});
|
||||
max-height: calc(100vh - #{$site-header-height} - #{$site-footer-height-l-plus});
|
||||
overflow-y:scroll;
|
||||
}
|
||||
box-shadow: none;
|
||||
top: $site-header-height;
|
||||
// left: calc(#{$site-navigation-width} + #{$content-max-width} + 4em);
|
||||
right: 0px;
|
||||
bottom: auto;
|
||||
opacity: 1;
|
||||
min-height: calc(100vh - #{$site-header-height} - #{$site-footer-height-l-plus});
|
||||
max-height: calc(100vh - #{$site-header-height} - #{$site-footer-height-l-plus});
|
||||
transform: scale(1);
|
||||
// border-left: 1px solid $hugo-gray-light;
|
||||
border-radius: 0px;
|
||||
margin-right:1.5em;
|
||||
margin-right: 1.5em;
|
||||
.fade {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
background-color: orange;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -58,6 +72,7 @@ nav#TableOfContents {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
height: auto;
|
||||
overflow-y:scroll;
|
||||
li code {
|
||||
font-family: $base-font-family;
|
||||
}
|
||||
@@ -152,9 +167,6 @@ nav#TableOfContents {
|
||||
}
|
||||
}
|
||||
}
|
||||
// ul {
|
||||
// display: none;
|
||||
// }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -134,6 +134,7 @@ header.content-header {
|
||||
margin-top: 1em;
|
||||
}
|
||||
em {
|
||||
font-weight: bolder;
|
||||
// font-weight: bolder;
|
||||
font-weight: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,7 @@
|
||||
.site-navigation::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.site-navigation {
|
||||
transition: transform .3s ease-in-out;
|
||||
position: fixed;
|
||||
@@ -10,9 +14,9 @@
|
||||
transform:translateX(-#{$site-navigation-width});
|
||||
padding: 0px;
|
||||
z-index: 9;
|
||||
display:flex;
|
||||
flex-direction:column;
|
||||
align-items:center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
&.navigation-open {
|
||||
transition: transform .3s ease-in-out;
|
||||
transform: translateX(0px);
|
||||
@@ -26,16 +30,16 @@
|
||||
ul.top-menu {
|
||||
margin-top: $site-header-height + 30px;
|
||||
// display: inline-block;
|
||||
width:85%;
|
||||
width: 85%;
|
||||
@include MQ(L) {
|
||||
margin-top: $site-header-height + 10px;
|
||||
}
|
||||
a {
|
||||
color: $base-font-color;
|
||||
font-weight: $base-font-weight;
|
||||
width:100%;
|
||||
width: 100%;
|
||||
&:hover {
|
||||
color:$hugo-pink;
|
||||
color: $hugo-pink;
|
||||
}
|
||||
}
|
||||
li {
|
||||
@@ -48,9 +52,9 @@
|
||||
}
|
||||
a.top-menu-item-link {
|
||||
font-size: 16px;
|
||||
width:100%;
|
||||
width: 100%;
|
||||
i.fa.fa-angle-double-right {
|
||||
margin-left:.25em;
|
||||
margin-left: .25em;
|
||||
}
|
||||
&.active-section {
|
||||
color: $hugo-pink;
|
||||
@@ -68,7 +72,7 @@
|
||||
padding-left: .5em;
|
||||
padding-bottom: .66em;
|
||||
li {
|
||||
line-height:1.3;
|
||||
line-height: 1.3;
|
||||
}
|
||||
a.submenu-item-link {
|
||||
font-size: 14px;
|
||||
@@ -81,8 +85,8 @@
|
||||
> code {
|
||||
color: $hugo-blue;
|
||||
> em {
|
||||
font-style:normal;
|
||||
family:$base-font-family;
|
||||
font-style: normal;
|
||||
family: $base-font-family;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -92,16 +96,16 @@
|
||||
}
|
||||
|
||||
.nav-buttons {
|
||||
display:block;
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-width: 200px;
|
||||
a {
|
||||
margin-bottom: .5em;
|
||||
display: inline-block;
|
||||
width: 200px;
|
||||
max-width: 200px;
|
||||
position:relative;
|
||||
position: relative;
|
||||
font-size: .9em;
|
||||
}
|
||||
}
|
||||
@@ -165,6 +169,7 @@
|
||||
border: 2px solid $hugo-pink;
|
||||
}
|
||||
}
|
||||
|
||||
.top {
|
||||
left: 15%;
|
||||
top: 20%;
|
||||
|
||||
@@ -30,7 +30,7 @@
|
||||
li {
|
||||
display: flex;
|
||||
a {
|
||||
color: $hugo-gray-light;
|
||||
color: $hugo-gray;
|
||||
&:hover {
|
||||
color: $hugo-pink;
|
||||
}
|
||||
|
||||
Vendored
+2
-2
File diff suppressed because one or more lines are too long
@@ -31,6 +31,15 @@ $(document).ready(function() {
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// var mySequence = [
|
||||
// { e: $element1, p: { translateX: 100 }, o: { duration: 1000 } },
|
||||
// /* The call below will run at the same time as the first call. */
|
||||
// { e: $element2, p: { translateX: 200 }, o: { duration: 1000, sequenceQueue: false },
|
||||
// /* As normal, the call below will run once the second call is complete. */
|
||||
// { e: $element3, p: { translateX: 300 }, o: { duration: 1000 }
|
||||
// ];
|
||||
// $.Velocity.RunSequence(mySequence);
|
||||
// terminalElements = document.querySelectorAll('span.terminal-line');
|
||||
|
||||
// function terminals_init() {
|
||||
|
||||
Reference in New Issue
Block a user