feat: 💄 add styles for details/summary tags
This commit is contained in:
parent
30fb6427c3
commit
21a00ac9cd
1 changed files with 27 additions and 0 deletions
|
@ -34,6 +34,33 @@ a:not(nav a, .button) {
|
||||||
@apply font-normal text-inherit underline decoration-sky-600 decoration-2 underline-offset-4 transition-colors duration-300 hover:text-sky-600;
|
@apply font-normal text-inherit underline decoration-sky-600 decoration-2 underline-offset-4 transition-colors duration-300 hover:text-sky-600;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
details {
|
||||||
|
@apply overflow-clip rounded-xl shadow-xl border border-solid border-sky-500 bg-sky-200 text-sky-500 dark:bg-sky-950 dark:text-sky-500;
|
||||||
|
|
||||||
|
margin: 1.25em 0;
|
||||||
|
|
||||||
|
@media (min-width: 768px) {
|
||||||
|
margin: 1.3333333em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 1024px) {
|
||||||
|
margin: 1.2em 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
> :not(summary) {
|
||||||
|
@apply px-4 last:pb-4 sm:px-6 sm:last:pb-6;
|
||||||
|
}
|
||||||
|
|
||||||
|
&[open] summary {
|
||||||
|
@apply border-b border-solid border-sky-500;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
summary {
|
||||||
|
@apply cursor-pointer p-4;
|
||||||
|
font-family: var(--font-heading);
|
||||||
|
}
|
||||||
|
|
||||||
dt {
|
dt {
|
||||||
@apply font-normal;
|
@apply font-normal;
|
||||||
font-family: var(--font-heading);
|
font-family: var(--font-heading);
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue