LukeParke/website
1
0
Fork 0
mirror of https://github.com/LukeHagar/website.git synced 2025-12-11 04:22:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: add scroll indicator to sidebar

Browse Source
This commit is contained in:
Arman
2023-09-18 16:38:38 +02:00
parent 2cd389ff2c
commit 31c97a7f8b
4 changed files with 42 additions and 821 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/lib/layouts/DocsTutorial.svelte
View File

@@ -125,7 +125,11 @@
<ol class="aw-references-menu-list">
{#each tutorials as tutorial}
<li class="aw-references-menu-item">
<a href={tutorial.href} class="aw-references-menu-link">
<a
href={tutorial.href}
class="aw-references-menu-link"
class:tutorial-scroll-indicator={currentStep === tutorial.step}
>
<span class="aw-numeric-badge">{tutorial.step}</span>
<span class="aw-caption-400">{tutorial.title}</span>
</a>
@@ -175,3 +179,18 @@
</aside>
</article>
</main>
<style lang="scss">
.tutorial-scroll-indicator {
position: relative;
&::before {
position: absolute;
content: '';
top: 0;
left: -1.5rem;
height: 100%;
width: 2px;
background-color: hsl(var(--p-references-menu-link-color-text));
}
}
</style>