diff options
| -rw-r--r-- | assets/sass/_sidebar.scss | 15 | ||||
| -rw-r--r-- | exampleSite/config.toml | 1 | ||||
| -rw-r--r-- | layouts/_default/single.html | 3 | ||||
| -rw-r--r-- | layouts/index.html | 3 | ||||
| -rw-r--r-- | layouts/partials/head.html | 3 | ||||
| -rw-r--r-- | layouts/partials/scripts.html | 33 | ||||
| -rw-r--r-- | layouts/tags/list.html | 3 |
7 files changed, 58 insertions, 3 deletions
diff --git a/assets/sass/_sidebar.scss b/assets/sass/_sidebar.scss index 4d2b854..9053ac1 100644 --- a/assets/sass/_sidebar.scss +++ b/assets/sass/_sidebar.scss @@ -17,8 +17,12 @@ @include link-secondary(); - #widget-pages, #widget-tags, #widget-links { - div, ul { + #widget-pages, + #widget-tags, + #widget-links { + + div, + ul { margin: 0.5em 0em 0.5em 0em; } } @@ -33,4 +37,11 @@ width: 50%; } } +} + +#container-progress { + position: fixed; + width: 3em; + right: 1em; + bottom: 1em; }
\ No newline at end of file diff --git a/exampleSite/config.toml b/exampleSite/config.toml index 6ba90df..66bc4c3 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -33,6 +33,7 @@ paginate = 10 cdnLazyloadSRC = "https://cdn.jsdelivr.net/gh/amzrk2/poal-jsdelivr/lazyload/dsr_loading.svg" # Custom css & js CDN cdnVanillaLazyloadJS = "https://cdn.jsdelivr.net/npm/vanilla-lazyload@15.1.1/dist/lazyload.min.js" + cdnJQueryJS = "https://cdn.jsdelivr.net/npm/jquery@3.2.1/dist/jquery.min.js" [markup] [markup.highlight] diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 0d564b0..506127b 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -29,6 +29,9 @@ <div class="col-md-3 col-12 float-left" id="sidebar"> {{ partial "sidebar.html" . }} </div> + <div id="container-progress"> + <div id="progress"></div> + </div> </div> </main> {{ end }}
\ No newline at end of file diff --git a/layouts/index.html b/layouts/index.html index d20006b..158c982 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -31,6 +31,9 @@ <div class="col-md-3 col-12 float-left" id="sidebar"> {{ partial "sidebar.html" . }} </div> + <div id="container-progress"> + <div id="progress"></div> + </div> </div> </main> {{ end }}
\ No newline at end of file diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 8d035ce..749c213 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -17,7 +17,8 @@ {{ $style := $sass | resources.ToCSS }} <link rel="stylesheet" href="{{ $style.Permalink }}"> <script src="{{ .Site.Params.cdnVanillaLazyloadJS }}"></script> - +<script src="{{ .Site.Params.cdnJQueryJS }}"></script> +<script src="{{ .Site.Params.cdnProgessJS }}"></script> {{ if or .Params.math .Site.Params.math }} {{ partial "math.html" . }} {{ end }}
\ No newline at end of file diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html index 4caf7ba..c5efc63 100644 --- a/layouts/partials/scripts.html +++ b/layouts/partials/scripts.html @@ -1,4 +1,37 @@ <script> + $(function () { + var bar = new ProgressBar.Circle('#progress', { + color: '#8AA2D3', + strokeWidth: 15, + trailColor: '#E5E2E4', + trailWidth: 15, + text: { + autoStyleContainer: false + }, + fill: '#E5E2E4', + step: function (state, circle) { + var value = Math.round(circle.value() * 100); + if (value == 0 || value == 100) { + circle.setText(''); + } else { + circle.setText(value); + } + } + }); + var scrolled = ($(window).scrollTop() / ($(document).height() - $(window).height() - 1)); + bar.animate(scrolled); + $(window).scroll(function () { + scrolled = ($(window).scrollTop() / ($(document).height() - $(window).height() - 1)); + if (scrolled < 0.0005) { + scrolled = 0; + } else if (scrolled > 1) { + scrolled = 1; + } + bar.set(scrolled); + }); + }); +</script> +<script> var lazyLoadInstance = new LazyLoad({ elements_selector: ".lazy" }); diff --git a/layouts/tags/list.html b/layouts/tags/list.html index 9fa241d..30cca51 100644 --- a/layouts/tags/list.html +++ b/layouts/tags/list.html @@ -37,6 +37,9 @@ <div class="col-md-3 col-12 float-left" id="sidebar"> {{ partial "sidebar.html" . }} </div> + <div id="container-progress"> + <div id="progress"></div> + </div> </div> </main> {{ end }}
\ No newline at end of file |