Update toc for testing fade at bottom on PC

This commit is contained in:
Ryan Watters
2017-03-02 18:30:59 -06:00
parent d5b49fe3c4
commit 395b208678
12 changed files with 88 additions and 54 deletions
+1 -1
View File
@@ -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
+8 -9
View File
@@ -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:
+4
View File
@@ -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}}
-6
View File
@@ -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;
+22 -12
View File
@@ -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 -1
View File
@@ -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;
// }
}
}
}
+2 -1
View File
@@ -134,6 +134,7 @@ header.content-header {
margin-top: 1em;
}
em {
font-weight: bolder;
// font-weight: bolder;
font-weight: inherit;
}
}
+20 -15
View File
@@ -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%;
+1 -1
View File
@@ -30,7 +30,7 @@
li {
display: flex;
a {
color: $hugo-gray-light;
color: $hugo-gray;
&:hover {
color: $hugo-pink;
}
+2 -2
View File
File diff suppressed because one or more lines are too long
+9
View File
@@ -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() {