diff options
| author | Armand Philippot <git@armandphilippot.com> | 2022-02-10 19:15:21 +0100 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2022-02-10 19:36:39 +0100 |
| commit | f8cfa5e6e3ae74b84bb94ca3f982554709d2f7d0 (patch) | |
| tree | e4ac7e11e8016cbb323b26a0c44c785249464ea4 /src/components/Widgets/ToC | |
| parent | dd0081f361b97abf54b958d4e04840cf84b9be3b (diff) | |
chore: improve widgets
* Make all widgets expanded by default. This way, without Javascript,
thematics and topics are still available.
* Improve collapse/expand transition.
* Remove widget scrollbar: the height was sometimes weird because of
that. Except for ToC on large devices.
Diffstat (limited to 'src/components/Widgets/ToC')
| -rw-r--r-- | src/components/Widgets/ToC/ToC.module.scss | 39 | ||||
| -rw-r--r-- | src/components/Widgets/ToC/ToC.tsx | 2 |
2 files changed, 1 insertions, 40 deletions
diff --git a/src/components/Widgets/ToC/ToC.module.scss b/src/components/Widgets/ToC/ToC.module.scss deleted file mode 100644 index c2e7f97..0000000 --- a/src/components/Widgets/ToC/ToC.module.scss +++ /dev/null @@ -1,39 +0,0 @@ -@use "@styles/abstracts/functions" as fun; -@use "@styles/abstracts/mixins" as mix; - -.item { - width: 100%; - margin: 0; - - &::before { - display: none; - } -} - -.link { - display: flex; - flex-flow: row nowrap; - width: 100%; - padding: var(--spacing-2xs) var(--spacing-sm); - background: none; - border-bottom: fun.convert-px(1) solid var(--color-border-light); - text-decoration: underline solid transparent 0; - transition: all 0.16s ease-in-out 0s, text-decoration-color 0s; - - &:hover, - &:focus { - background: var(--color-bg-secondary); - } - - &:focus { - color: var(--color-primary); - text-decoration-color: var(--color-primary-light); - text-decoration-thickness: 0.25ex; - } - - &:active { - background: var(--color-bg-tertiary); - text-decoration-color: transparent; - text-decoration-thickness: 0; - } -} diff --git a/src/components/Widgets/ToC/ToC.tsx b/src/components/Widgets/ToC/ToC.tsx index c499478..8a2d493 100644 --- a/src/components/Widgets/ToC/ToC.tsx +++ b/src/components/Widgets/ToC/ToC.tsx @@ -25,7 +25,7 @@ const ToC = () => { }; return ( - <ExpandableWidget title={title} expand={true} withBorders={true}> + <ExpandableWidget title={title} kind="toc" expand={true} withBorders={true}> <OrderedList items={getItems(headingsTree)} /> </ExpandableWidget> ); |
