diff --git a/src/components/navigation/sidebars/nav/Tree.tsx b/src/components/navigation/sidebars/nav/Tree.tsx index 10cf243..5dbc1ae 100644 --- a/src/components/navigation/sidebars/nav/Tree.tsx +++ b/src/components/navigation/sidebars/nav/Tree.tsx @@ -102,13 +102,11 @@ export const Tree: Component = props => { : "" } > -

- - {submodule.name} - -

+ + {submodule.name} + )} diff --git a/src/components/type/Properties.astro b/src/components/type/Properties.astro index 21765e2..b66fb62 100644 --- a/src/components/type/Properties.astro +++ b/src/components/type/Properties.astro @@ -41,8 +41,11 @@ const { propsKeys, propsData } = Astro.props; { item }{ linkText }{genericType && (<{genericType}>)} + >{ linkText }{genericType && + (<{genericType}> + )}

{ propData.flags && propData.flags.length > 0 ? ( diff --git a/src/pages/docs/types/[type]/[name].astro b/src/pages/docs/types/[type]/[name].astro index 9cb83ae..93743f3 100644 --- a/src/pages/docs/types/[type]/[name].astro +++ b/src/pages/docs/types/[type]/[name].astro @@ -57,9 +57,8 @@ const details = data.details

{route.name}: - {data.super ? ( + {data.super?.name ? ( @@ -70,11 +69,11 @@ const details = data.details ) }

+ import {data.module} { route && data ? (
- import {data.module} {data.flags ? (
{data.flags.map(flag => ( diff --git a/src/pages/docs/types/[type]/index.astro b/src/pages/docs/types/[type]/index.astro index 2072ae0..8879ed7 100644 --- a/src/pages/docs/types/[type]/index.astro +++ b/src/pages/docs/types/[type]/index.astro @@ -34,21 +34,26 @@ const details = route.data.details title={route.type + " Type Documentation"} description="Quickshell Type Documentation" > -
-

{route.type[0].toUpperCase() + route.type.slice(1)} Definitions

-
- {route.data.contains!.map((childName:string) => - ( -
- - {childName} - - {children[childName] || "See Configuration"} +
+
+

{route.type[0].toUpperCase() + route.type.slice(1)} Definitions

+
+ {route.data.description} +
+ {route.data.contains!.map((childName:string) => + ( +
+ + {childName} + + {children[childName] || "See Configuration"} +
+ ) + )}
- ) - )} + {details && } +
- {details ? : ({route.data.description})} diff --git a/src/styles/css-config/base.css b/src/styles/css-config/base.css index 244b9b0..cfbae03 100644 --- a/src/styles/css-config/base.css +++ b/src/styles/css-config/base.css @@ -56,8 +56,10 @@ html { --nav-selected-bkg: var(--blue) 100 90; --nav-selected-text: var(--blue) 60 60; --nav-indicator-bkg: var(--blue) 45 80; - --overlay-bkg: var(--blue) 10 93; + --overlay-bkg: var(--blue) 25 93; --overlay-bkg-border: var(--blue) 10 75; + --footer-bkg: var(--blue) 32 92; + --footer-bkg-border: var(--blue) 32 84; } html.dark { @@ -103,13 +105,10 @@ html.dark { --nav-selected-bkg: var(--blue) 40 13; --nav-selected-text: var(--blue) 100 70; --nav-indicator-bkg: var(--blue) 30 30; - --overlay-bkg: var(--blue) 66 7; - --overlay-bkg-1: var(--blue) 66 9; - --overlay-bkg-2: var(--blue) 60 12; - --overlay-bkg-green: var(--green) 66 7; - --overlay-bkg-green-1: var(--green) 66 9; - --overlay-bkg-green-2: var(--green) 45 21; - --overlay-bkg-border: var(--blue) 17 13; + --overlay-bkg: var(--blue) 75 5; + --overlay-bkg-border: var(--blue) 45 15; + --footer-bkg: var(--blue) 66 5; + --footer-bkg-border: var(--blue) 75 21; } * { diff --git a/src/styles/docs/docs-types.css b/src/styles/docs/docs-types.css index 0c70320..ae55d92 100644 --- a/src/styles/docs/docs-types.css +++ b/src/styles/docs/docs-types.css @@ -5,16 +5,13 @@ border-radius: 6px; border: 1px solid hsla(var(--blue) 10 15 / 0.6); margin-top: 1rem; - margin-inline: 1.272rem; & .root-nav-entry { position: relative; display: grid; grid-template-columns: 1fr; - grid-template-rows: 42px; text-wrap: pretty; padding: 0.5rem 1rem; - padding-top: 1.5rem; &:not(:last-child) { border-bottom: 1px solid hsla(var(--blue) 10 15 / 0.6); @@ -239,7 +236,7 @@ html.dark .typeprops { & .typeprop-root { border: 1px solid hsla(var(--prop-color) / 0.3); - &:hover { + &:hover, &:target { border: 1px solid hsla(var(--prop-color) / 0.6); } } @@ -281,7 +278,7 @@ html.dark .typefuncs { & .typefunc-root { border: 1px solid hsla(var(--func-color) / 0.3); - &:hover { + &:hover, &:target { border: 1px solid hsla(var(--func-color) / 0.6); } } @@ -333,7 +330,7 @@ html.dark .typesignals { & .typesignal-root { border: 1px solid hsla(var(--signal-color) / 0.3); - &:hover { + &:hover, &:target { border: 1px solid hsla(var(--signal-color) / 0.6); } } @@ -371,7 +368,7 @@ html.dark .typevariants { & .typevariant-root { border: 1px solid hsla(var(--var-color) / 0.3); - &:hover { + &:hover, &:target { border: 1px solid hsla(var(--var-color) / 0.6); } } @@ -381,7 +378,7 @@ html.dark .typevariants { .root-nav { & .root-nav-entry { display: grid; - grid-template-columns: 0.70fr 1.30fr; + grid-template-columns: 0.60fr 1.40fr; & .root-nav-link { justify-self: start; @@ -406,13 +403,7 @@ html.dark .typevariants { & .root-nav-desc { padding-left: 1rem; - - &::before { - content: ""; - position: absolute; - inset: -1rem 0 0 0; - border-left: 1px solid hsla(var(--blue) 10 15 / 0.6); - } + border-left: 1px solid hsl(var(--blue) 10 15 / 0.6); } } } @@ -431,10 +422,6 @@ html.dark .typevariants { } @media (min-width: 85rem) { - .root-nav { - min-width: 45svw; - } - .types-nav { display: block; position: fixed; diff --git a/src/styles/docs/docs.css b/src/styles/docs/docs.css index ea79a02..c81c32a 100644 --- a/src/styles/docs/docs.css +++ b/src/styles/docs/docs.css @@ -40,6 +40,7 @@ .c-breadcrumbs { --color-link-breadcrumbs: hsl(var(--accent-600)); + margin-top: 0.5rem; margin-bottom: 0.318rem; max-width: 100svw; } diff --git a/src/styles/docs/nav/nav-tree.css b/src/styles/docs/nav/nav-tree.css index edbc384..8f09d40 100644 --- a/src/styles/docs/nav/nav-tree.css +++ b/src/styles/docs/nav/nav-tree.css @@ -82,10 +82,6 @@ html.dark .nav-shevron { &>a { width: 100%; margin-left: 0.2rem; - - &:hover { - text-decoration: none; - } } } diff --git a/src/styles/docs/nav/nav.css b/src/styles/docs/nav/nav.css index c06484e..da386f6 100644 --- a/src/styles/docs/nav/nav.css +++ b/src/styles/docs/nav/nav.css @@ -32,8 +32,8 @@ scrollbar-width: none; font-size: 1.2rem; -ms-overflow-style: none; - background: hsla(var(--blue) 75 5); - border-right: 1px solid hsl(var(--blue) 45 15); + background: hsla(var(--overlay-bkg)); + border-right: 1px solid hsl(var(--overlay-bkg-border)); &::-webkit-scrollbar { display: none; diff --git a/src/styles/docs/toc/toc.css b/src/styles/docs/toc/toc.css index d0de965..7fffe54 100644 --- a/src/styles/docs/toc/toc.css +++ b/src/styles/docs/toc/toc.css @@ -59,7 +59,7 @@ scrollbar-width: none; -ms-overflow-style: none; background-color: hsl(var(--overlay-bkg)); - border-left: solid hsl(var(--overlay-bkg-border)) 1px; + border-left: 1px solid hsl(var(--overlay-bkg-border)); &::-webkit-scrollbar { display: none; diff --git a/src/styles/global.css b/src/styles/global.css index 5e81ade..cce1e2a 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -33,6 +33,11 @@ a { } } +[id] { + /*offset for header*/ + scroll-margin-top: 4rem; +} + html.dark { & .header { background-color: hsl(var(--secondary-900)); @@ -119,9 +124,8 @@ footer { padding: 1rem; overflow: hidden; flex-shrink: 0; - background: hsla(var(--blue) 66 5); + background: hsl(var(--footer-bkg)); - /*border-top: 1px solid hsl(var(--bg-800));*/ &::before { content: ""; position: absolute; @@ -132,7 +136,7 @@ footer { background: linear-gradient( 90deg, transparent 0%, - hsl(var(--blue) 75 21) 50%, + hsl(var(--footer-bkg-border)) 50%, transparent 100% ); }