fix module listing style
This commit is contained in:
parent
cafdf14928
commit
84703e3117
|
@ -31,7 +31,7 @@ const details = route.data.details
|
||||||
---
|
---
|
||||||
|
|
||||||
<DocsLayout
|
<DocsLayout
|
||||||
title={route.type + " Type Documentation"}
|
title={route.type + " Module Types"}
|
||||||
description="Quickshell Type Documentation"
|
description="Quickshell Type Documentation"
|
||||||
>
|
>
|
||||||
<div class="docs-content">
|
<div class="docs-content">
|
||||||
|
|
|
@ -6,20 +6,26 @@ const routes = await getTypeData();
|
||||||
|
|
||||||
const modules = [...new Set(routes.map(route => route.type))];
|
const modules = [...new Set(routes.map(route => route.type))];
|
||||||
---
|
---
|
||||||
<DocsLayout title="Quickshell Type Definitions" description="Quickshell Type Documentation">
|
<DocsLayout title="Quickshell Module Listing" description="Quickshell Type Documentation">
|
||||||
<h2>Type Definitions</h2>
|
<div class="docs-content">
|
||||||
<div class="root-nav">
|
<hr/>
|
||||||
{modules.map(moduleEntry => {
|
<h2>Module Listing</h2>
|
||||||
const indexData = routes.filter(route => route.name === "index")
|
<section>
|
||||||
const indexSingled = indexData.filter(indexEntry => indexEntry.type === moduleEntry)[0]
|
<span>All modules included with Quickshell</span>
|
||||||
const description = indexSingled.data.description
|
<div class="root-nav" data-pagefind-ignore>
|
||||||
return (
|
{modules.map(moduleEntry => {
|
||||||
<div class="root-nav-entry">
|
const indexData = routes.filter(route => route.name === "index")
|
||||||
<a class="root-nav-link" href={`/docs/types/${moduleEntry}`}>
|
const indexSingled = indexData.filter(indexEntry => indexEntry.type === moduleEntry)[0]
|
||||||
{moduleEntry}
|
const description = indexSingled.data.description
|
||||||
</a>
|
return (
|
||||||
<span class="root-nav-desc">{description}</span>
|
<div class="root-nav-entry">
|
||||||
</div>)
|
<a class="root-nav-link" href={`/docs/types/${moduleEntry}`}>
|
||||||
})}
|
{moduleEntry}
|
||||||
|
</a>
|
||||||
|
<span class="root-nav-desc">{description}</span>
|
||||||
|
</div>)
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</div>
|
</div>
|
||||||
</DocsLayout>
|
</DocsLayout>
|
||||||
|
|
|
@ -19,29 +19,6 @@
|
||||||
&:not(:last-child) {
|
&:not(:last-child) {
|
||||||
border-bottom: 1px solid hsla(var(--blue) 10 15 / 0.6);
|
border-bottom: 1px solid hsla(var(--blue) 10 15 / 0.6);
|
||||||
}
|
}
|
||||||
|
|
||||||
& .root-nav-link {
|
|
||||||
font-size: 1.137rem;
|
|
||||||
max-height: 2rem;
|
|
||||||
position: relative;
|
|
||||||
text-decoration: none;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
&::before {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 1px;
|
|
||||||
background: linear-gradient(
|
|
||||||
90deg,
|
|
||||||
transparent 25%,
|
|
||||||
hsla(var(--accent-500) / 0.88) 50%,
|
|
||||||
transparent 75%
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -353,27 +330,6 @@ html.dark .typevariants {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 0.60fr 1.40fr;
|
grid-template-columns: 0.60fr 1.40fr;
|
||||||
|
|
||||||
& .root-nav-link {
|
|
||||||
justify-self: start;
|
|
||||||
height: max-content;
|
|
||||||
|
|
||||||
&::before {
|
|
||||||
width: 0;
|
|
||||||
background: linear-gradient(
|
|
||||||
to right,
|
|
||||||
hsla(var(--accent-400) / 0.5) var(--percent),
|
|
||||||
hsla(var(--accent-400) / 0) 100%
|
|
||||||
);
|
|
||||||
animation: percentToZero 250ms ease-in-out forwards;
|
|
||||||
transition: width 0.25s ease-in-out;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover::before {
|
|
||||||
animation: percentToFifty 250ms ease-in-out forwards;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
& .root-nav-desc {
|
& .root-nav-desc {
|
||||||
padding-left: 1rem;
|
padding-left: 1rem;
|
||||||
border-left: 1px solid hsl(var(--blue) 10 15 / 0.6);
|
border-left: 1px solid hsl(var(--blue) 10 15 / 0.6);
|
||||||
|
|
Loading…
Reference in a new issue