mirror of
https://github.com/nunocoracao/blowfish.git
synced 2025-01-22 14:35:43 -06:00
✨ Progress Indicator in TOC
This commit is contained in:
Nuno Coração
parent
d569a0146e
commit
62dbfc51c5
8 changed files with 95 additions and 17 deletions
|
|
@ -684,6 +684,11 @@ select {
|
|||
max-width: 65ch;
|
||||
}
|
||||
|
||||
.prose :where(p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
.prose :where([class~="lead"]):not(:where([class~="not-prose"] *)) {
|
||||
color: var(--tw-prose-lead);
|
||||
font-size: 1.25em;
|
||||
|
|
@ -1051,11 +1056,6 @@ select {
|
|||
line-height: 1.75;
|
||||
}
|
||||
|
||||
.prose :where(p):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 1.25em;
|
||||
margin-bottom: 1.25em;
|
||||
}
|
||||
|
||||
.prose :where(video):not(:where([class~="not-prose"] *)) {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 2em;
|
||||
|
|
@ -1175,6 +1175,17 @@ select {
|
|||
display: none;
|
||||
}
|
||||
|
||||
.prose :where(a.active):not(:where([class~="not-prose"] *)) {
|
||||
text-decoration-color: rgba(var(--color-primary-600), 1);
|
||||
text-decoration-line: underline;
|
||||
text-decoration-thickness: 3px;
|
||||
text-underline-offset: 4px;
|
||||
}
|
||||
|
||||
.prose-invert :where(a.active):not(:where([class~="not-prose"] *)) {
|
||||
text-decoration-color: rgba(var(--color-primary-400), 1);
|
||||
}
|
||||
|
||||
.sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
|
|
@ -1433,10 +1444,6 @@ select {
|
|||
margin-right: -0.5rem;
|
||||
}
|
||||
|
||||
.mr-1 {
|
||||
margin-right: 0.25rem;
|
||||
}
|
||||
|
||||
.ml-auto {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
|
@ -3426,6 +3433,10 @@ body:has(#menu-controller:checked) {
|
|||
background-color: rgba(var(--color-neutral-700), 1);
|
||||
}
|
||||
|
||||
.dark .dark\:prose-invert :where(a.active):not(:where([class~="not-prose"] *)) {
|
||||
text-decoration-color: rgba(var(--color-primary-400), 1);
|
||||
}
|
||||
|
||||
.dark .dark\:text-neutral-500 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgba(var(--color-neutral-500), var(--tw-text-opacity));
|
||||
|
|
|
|||
|
|
@ -0,0 +1 @@
|
|||
//for future
|
||||
2
assets/lib/jquery/jquery.slim.min.js
vendored
Normal file
2
assets/lib/jquery/jquery.slim.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -1,24 +1,57 @@
|
|||
<details open class="mt-0 overflow-hidden rounded-lg ltr:-ml-5 ltr:pl-5 rtl:-mr-5 rtl:pr-5 hidden lg:block">
|
||||
<summary
|
||||
class="block py-1 text-lg font-semibold cursor-pointer bg-neutral-100 text-neutral-800 ltr:-ml-5 ltr:pl-5 rtl:-mr-5 rtl:pr-5 dark:bg-neutral-700 dark:text-neutral-100 lg:hidden"
|
||||
>
|
||||
class="block py-1 text-lg font-semibold cursor-pointer bg-neutral-100 text-neutral-800 ltr:-ml-5 ltr:pl-5 rtl:-mr-5 rtl:pr-5 dark:bg-neutral-700 dark:text-neutral-100 lg:hidden">
|
||||
{{ i18n "article.table_of_contents" }}
|
||||
</summary>
|
||||
<div
|
||||
class="min-w-[220px] py-2 border-dotted border-neutral-300 ltr:-ml-5 ltr:border-l ltr:pl-5 rtl:-mr-5 rtl:border-r rtl:pr-5 dark:border-neutral-600"
|
||||
>
|
||||
class="min-w-[220px] py-2 border-dotted border-neutral-300 ltr:-ml-5 ltr:border-l ltr:pl-5 rtl:-mr-5 rtl:border-r rtl:pr-5 dark:border-neutral-600">
|
||||
{{ .TableOfContents | emojify }}
|
||||
</div>
|
||||
</details>
|
||||
<details class="mt-0 overflow-hidden rounded-lg ltr:-ml-5 ltr:pl-5 rtl:-mr-5 rtl:pr-5 lg:hidden">
|
||||
<summary
|
||||
class="py-1 text-lg font-semibold cursor-pointer bg-neutral-100 text-neutral-800 ltr:-ml-5 ltr:pl-5 rtl:-mr-5 rtl:pr-5 dark:bg-neutral-700 dark:text-neutral-100 lg:hidden"
|
||||
>
|
||||
class="py-1 text-lg font-semibold cursor-pointer bg-neutral-100 text-neutral-800 ltr:-ml-5 ltr:pl-5 rtl:-mr-5 rtl:pr-5 dark:bg-neutral-700 dark:text-neutral-100 lg:hidden">
|
||||
{{ i18n "article.table_of_contents" }}
|
||||
</summary>
|
||||
<div
|
||||
class="py-2 border-dotted border-neutral-300 ltr:-ml-5 ltr:border-l ltr:pl-5 rtl:-mr-5 rtl:border-r rtl:pr-5 dark:border-neutral-600"
|
||||
>
|
||||
class="py-2 border-dotted border-neutral-300 ltr:-ml-5 ltr:border-l ltr:pl-5 rtl:-mr-5 rtl:border-r rtl:pr-5 dark:border-neutral-600">
|
||||
{{ .TableOfContents | emojify }}
|
||||
</div>
|
||||
</details>
|
||||
<script>
|
||||
|
||||
(function () {
|
||||
var $toc = $('#TableOfContents');
|
||||
if ($toc.length > 0) {
|
||||
var $window = $(window);
|
||||
|
||||
function onScroll() {
|
||||
var currentScroll = $window.scrollTop();
|
||||
var h = $('.anchor');
|
||||
var id = "";
|
||||
h.each(function (i, e) {
|
||||
e = $(e);
|
||||
if (e.offset().top - $(window).height()/2 <= currentScroll) {
|
||||
id = e.attr('id');
|
||||
}
|
||||
});
|
||||
var active = $toc.find('a.active');
|
||||
if (active.length == 1 && active.eq(0).attr('href') == '#' + id) return true;
|
||||
active.each(function (i, e) {
|
||||
$(e).removeClass('active').siblings('ul').hide();
|
||||
});
|
||||
$toc.find('a[href="#' + id + '"]').parentsUntil('#TableOfContents').each(function (i, e) {
|
||||
console.log($(e).children('a'))
|
||||
$(e).children('a').addClass('active').parents('ul').show();
|
||||
});
|
||||
}
|
||||
|
||||
$window.on('scroll', onScroll);
|
||||
$(document).ready(function () {
|
||||
$toc.find('a').parent('li').find('ul').hide();
|
||||
onScroll();
|
||||
});
|
||||
}
|
||||
})();
|
||||
|
||||
</script>
|
||||
|
|
@ -1,3 +1,7 @@
|
|||
{{/* jQuery */}}
|
||||
{{ $jqueryLib := resources.Get "lib/jquery/jquery.slim.min.js" }}
|
||||
<script src="{{ $jqueryLib.RelPermalink }}" integrity="{{ $jqueryLib.Data.Integrity }}"></script>
|
||||
|
||||
{{/* Mermaid */}}
|
||||
{{ if .Page.HasShortcode "mermaid" }}
|
||||
{{ $mermaidLib := resources.Get "lib/mermaid/mermaid.min.js" }}
|
||||
|
|
|
|||
13
package-lock.json
generated
13
package-lock.json
generated
|
|
@ -19,6 +19,7 @@
|
|||
"@tailwindcss/typography": "^0.5.9",
|
||||
"chart.js": "^4.1.2",
|
||||
"fuse.js": "^6.6.2",
|
||||
"jquery": "^3.6.3",
|
||||
"katex": "^0.16.4",
|
||||
"mermaid": "^9.3.0",
|
||||
"prettier": "^2.8.2",
|
||||
|
|
@ -904,6 +905,12 @@
|
|||
"node": ">=0.12.0"
|
||||
}
|
||||
},
|
||||
"node_modules/jquery": {
|
||||
"version": "3.6.3",
|
||||
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.3.tgz",
|
||||
"integrity": "sha512-bZ5Sy3YzKo9Fyc8wH2iIQK4JImJ6R0GWI9kL1/k7Z91ZBNgkRXE6U0JfHIizZbort8ZunhSI3jw9I6253ahKfg==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
|
|
@ -2224,6 +2231,12 @@
|
|||
"resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
|
||||
"integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng=="
|
||||
},
|
||||
"jquery": {
|
||||
"version": "3.6.3",
|
||||
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.6.3.tgz",
|
||||
"integrity": "sha512-bZ5Sy3YzKo9Fyc8wH2iIQK4JImJ6R0GWI9kL1/k7Z91ZBNgkRXE6U0JfHIizZbort8ZunhSI3jw9I6253ahKfg==",
|
||||
"dev": true
|
||||
},
|
||||
"js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
|
|
|
|||
|
|
@ -37,6 +37,7 @@
|
|||
"@tailwindcss/typography": "^0.5.9",
|
||||
"chart.js": "^4.1.2",
|
||||
"fuse.js": "^6.6.2",
|
||||
"jquery": "^3.6.3",
|
||||
"katex": "^0.16.4",
|
||||
"mermaid": "^9.3.0",
|
||||
"prettier": "^2.8.2",
|
||||
|
|
@ -80,6 +81,10 @@
|
|||
{
|
||||
"from": "node_modules/typeit/dist/index.umd.js",
|
||||
"to": "assets/lib/typeit/typeit.umd.js"
|
||||
},
|
||||
{
|
||||
"from": "node_modules/jquery/dist/jquery.slim.min.js",
|
||||
"to": "assets/lib/jquery/jquery.slim.min.js"
|
||||
}
|
||||
],
|
||||
"dependencies": {
|
||||
|
|
|
|||
|
|
@ -136,6 +136,12 @@ module.exports = {
|
|||
'p::after': {
|
||||
display: 'none'
|
||||
},
|
||||
'a.active': {
|
||||
"text-decoration-color": theme("colors.primary.600 / 1"),
|
||||
"text-decoration-line": "underline",
|
||||
"text-decoration-thickness": "3px",
|
||||
"text-underline-offset": "4px"
|
||||
}
|
||||
},
|
||||
},
|
||||
invert: {
|
||||
|
|
@ -153,6 +159,9 @@ module.exports = {
|
|||
code:{
|
||||
backgroundColor: theme("colors.neutral.700 / 1"),
|
||||
},
|
||||
'a.active': {
|
||||
"text-decoration-color": theme("colors.primary.400 / 1")
|
||||
}
|
||||
},
|
||||
},
|
||||
}),
|
||||
|
|
|
|||
Loading…
Reference in a new issue