quickshell/quickshell-web
3
1
Fork 0
Code Issues Projects Activity

collapsible button width fix

Browse source
This commit is contained in:
Xanazf 2024-10-18 04:34:22 +03:00
parent 1545e59dc9
commit 15a61fd4bd
Signed by: Xanazf
GPG key ID: 4E4A5AD1FB748427
2 changed files with 19 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/navigation/sidebars/toc/Table.tsx
View file

@ -43,11 +43,11 @@ export const Table: Component<{
<For each={typeTOC.properties}>
{prop => (
<li class="types-item props-item">
<Tag />
<a
class="type-anchor"
href={`#${prop}`}
>
<Tag />
{prop}
</a>
</li>
@ -60,11 +60,11 @@ export const Table: Component<{
<For each={typeTOC.functions}>
{func => (
<li class="types-item func-item">
<RoundBrackets />
<a
class="type-anchor"
href={`#${func}`}
>
<RoundBrackets />
{func}
</a>
</li>
@ -77,11 +77,11 @@ export const Table: Component<{
<For each={typeTOC.signals}>
{signal => (
<li class="types-item signals-item">
<PowerCord />
<a
class="type-anchor"
href={`#${signal}`}
>
<PowerCord />
{signal}
</a>
</li>
@ -94,11 +94,11 @@ export const Table: Component<{
<For each={typeTOC.variants}>
{variant => (
<li class="types-item vars-item">
<FourDiamonds />
<a
class="type-anchor"
href={`#${variant}`}
>
<FourDiamonds />
{variant}
</a>
</li>

20
src/styles/docs/toc/types-toc.css
View file

@ -51,19 +51,29 @@
& .types-item {
margin-block: 10px;
display: flex;
align-items: center;
gap: 0.478rem;
width: 100%;
transition: background-color 0.3s;
padding: 0.117rem;
padding-left: 0.338rem;
border-radius: 5px;
& svg {
opacity: 0.6;
width: 1.2em;
height: 1.2em;
width: 1.3rem;
height: 1.3rem;
transition: opacity 0.5s;
}
& a {
display: flex;
align-items: center;
gap: 0.287rem;
width: 100%;
}
&:hover {
cursor: pointer;
background-color: hsla(0 0 100 / 0.07);
& svg {
opacity: 1;