quick fixes for the previous commit
This commit is contained in:
parent
23719ec405
commit
0e749e5bfa
5 changed files with 33 additions and 31 deletions
|
@ -132,7 +132,7 @@ export const Tree: Component<TreeProps> = props => {
|
||||||
target="_blank"
|
target="_blank"
|
||||||
rel="noreferrer"
|
rel="noreferrer"
|
||||||
>
|
>
|
||||||
QtQuick Type Reference
|
QtQuick Types
|
||||||
</a>
|
</a>
|
||||||
</span>
|
</span>
|
||||||
</Accordion.ItemTrigger>
|
</Accordion.ItemTrigger>
|
||||||
|
|
|
@ -1,9 +1,5 @@
|
||||||
---
|
---
|
||||||
import BaseLayout from "@layouts/BaseLayout.astro";
|
import BaseLayout from "@layouts/BaseLayout.astro";
|
||||||
|
|
||||||
function handleCardClick(target: string): void {
|
|
||||||
window.location.href = target;
|
|
||||||
}
|
|
||||||
---
|
---
|
||||||
<BaseLayout title="Quickshell" description="A fully user customizable desktop shell" image="/quickshell.png">
|
<BaseLayout title="Quickshell" description="A fully user customizable desktop shell" image="/quickshell.png">
|
||||||
<div class="main-page_hero">
|
<div class="main-page_hero">
|
||||||
|
@ -12,18 +8,18 @@ function handleCardClick(target: string): void {
|
||||||
<h3>Based on QtQuick</h3>
|
<h3>Based on QtQuick</h3>
|
||||||
</section>
|
</section>
|
||||||
<section class="main-page_links">
|
<section class="main-page_links">
|
||||||
<button type="button" class="main-page_link-card" onclick={() => handleCardClick("/docs/configuration")}>
|
<a href="/docs/configuration" class="main-page_link-card">
|
||||||
<h3><a href="/docs/configuration">Configuration</a></h3>
|
<h3>Configuration</h3>
|
||||||
</button>
|
</a>
|
||||||
<button class="main-page_link-card">
|
<a href="/docs/types" class="main-page_link-card">
|
||||||
<h3><a href="/docs/types">Type Definitions</a></h3>
|
<h3>Type Definitions</h3>
|
||||||
</button>
|
</a>
|
||||||
<button class="main-page_link-card">
|
<a href="https://git.outfoxxed.me/outfoxxed/quickshell-examples" class="main-page_link-card">
|
||||||
<h3><a href="https://git.outfoxxed.me/outfoxxed/quickshell-examples">Examples</a></h3>
|
<h3>Examples</h3>
|
||||||
</button>
|
</a>
|
||||||
<button class="main-page_link-card">
|
<a href="https://git.outfoxxed.me/outfoxxed/quickshell" class="main-page_link-card">
|
||||||
<h3><a href="https://git.outfoxxed.me/outfoxxed/quickshell">Source</a></h3>
|
<h3>Source</h3>
|
||||||
</button>
|
</a>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
</BaseLayout>
|
</BaseLayout>
|
||||||
|
|
|
@ -35,7 +35,7 @@
|
||||||
font-size: 1.614rem;
|
font-size: 1.614rem;
|
||||||
max-height: 500px;
|
max-height: 500px;
|
||||||
|
|
||||||
& > svg {
|
&>svg {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
width: 24px;
|
width: 24px;
|
||||||
}
|
}
|
||||||
|
@ -51,7 +51,6 @@
|
||||||
|
|
||||||
& .toc-mobile {
|
& .toc-mobile {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
overflow-y: scroll;
|
|
||||||
top: 2.6rem;
|
top: 2.6rem;
|
||||||
right: -1rem;
|
right: -1rem;
|
||||||
width: 0;
|
width: 0;
|
||||||
|
@ -65,17 +64,17 @@
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
transition:
|
transition: width 0.3s ease,
|
||||||
width 0.3s ease,
|
height 0.3s ease,
|
||||||
height 0.3s ease,
|
background-color 0.3s ease,
|
||||||
background-color 0.3s ease,
|
backdrop-filter 0.3s ease,
|
||||||
backdrop-filter 0.3s ease,
|
padding 0.3s ease;
|
||||||
padding 0.3s ease;
|
|
||||||
|
|
||||||
&.shown {
|
&.shown {
|
||||||
|
overflow-y: scroll;
|
||||||
padding: 0.3rem;
|
padding: 0.3rem;
|
||||||
width: var(--width);
|
width: var(--width);
|
||||||
height: 50svh;
|
height: max(min(100svh, 800px), calc(100svh - 8rem));
|
||||||
background-color: hsl(var(--bg-900) / 0.6);
|
background-color: hsl(var(--bg-900) / 0.6);
|
||||||
backdrop-filter: blur(3px) saturate(180%);
|
backdrop-filter: blur(3px) saturate(180%);
|
||||||
display: flex;
|
display: flex;
|
||||||
|
@ -86,8 +85,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 1280px) {
|
@media (max-width: 1280px) {
|
||||||
.toc-toggle {
|
@media (min-width: 768px) {
|
||||||
--width: 70svw;
|
.toc-toggle {
|
||||||
|
--width: 25svw;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -120,7 +121,7 @@
|
||||||
list-style: none;
|
list-style: none;
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
& > .toc_a {
|
&>.toc_a {
|
||||||
color: hsl(var(--green) 72 60);
|
color: hsl(var(--green) 72 60);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -117,7 +117,7 @@ footer {
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
z-index: 10;
|
z-index: 10;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 3rem;
|
height: 3.5rem;
|
||||||
font-size: min(1.112rem, max(1svw, 0.8rem));
|
font-size: min(1.112rem, max(1svw, 0.8rem));
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|
|
@ -45,21 +45,26 @@
|
||||||
width: 75%;
|
width: 75%;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
gap: 2rem;
|
gap: 2rem;
|
||||||
|
z-index: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.main-page_link-card {
|
.main-page_link-card {
|
||||||
all: unset;
|
all: unset;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 9.67rem;
|
height: 9.67rem;
|
||||||
border-radius: 9px;
|
border-radius: 9px;
|
||||||
text-align: center;
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
border: 1px solid transparent;
|
border: 1px solid transparent;
|
||||||
transition: border-color 0.3s;
|
transition: border-color 0.3s;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
&::before {
|
&::before {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue