quickshell-web/src/styles/docs/docs.css
2024-10-17 22:14:27 +03:00

132 lines
1.8 KiB
CSS

@import "./docs-config.css";
@import "./docs-types.css";
.docslayout-root {
margin-inline: 0.618rem;
margin-top: 3.5rem;
display: flex;
justify-content: center;
flex-direction: row;
flex-grow: 1;
transition: filter 0.3s;
}
.docslayout-inner {
flex-grow: 1;
}
.docs {
display: flex;
flex-direction: row;
}
.dim-content-toc .docslayout-root,
.dim-content-nav .docslayout-root {
filter: brightness(50%);
pointer-events: none;
}
.docs-content {
flex-grow: 1;
& section {
margin-block: 1.618rem;
}
& p {
margin-block: 0.618rem;
}
& hr {
margin-top: 0;
margin-bottom: 0.318rem;
}
}
.c-breadcrumbs {
--color-link-breadcrumbs: hsl(var(--accent-600));
margin-top: 0.5rem;
margin-bottom: 0.318rem;
max-width: 100svw;
}
.heading {
&>[id] {
width: max-content;
}
& .heading-hashtag {
display: inline-block;
margin-right: 0.1rem;
& svg {
width: 1.2em;
height: 1.2em;
opacity: 0.5;
transition: opacity 0.5s;
&:hover {
opacity: 1;
cursor: pointer;
}
}
}
& .heading-text {
display: inline-block;
vertical-align: top;
}
}
hr {
opacity: 0.3;
}
ul {
margin-left: 2.478rem;
}
.markdown-alert {
margin-block: 0.618rem;
&>*:not(:first-child) {
margin-block: 0.724rem;
}
}
.markdown-alert-title {
text-transform: lowercase;
text-transform: capitalize;
margin-block: 0 !important;
}
@media (min-width: 40rem) {
.docs-content {
margin-inline: 1.272rem;
& p {
margin-block: 1.217rem;
}
}
.c-breadcrumbs {
margin-top: 1.056rem;
margin-inline: 1.272rem;
}
}
@media (min-width: 85rem) {
.docslayout-inner {
max-width: 80rem;
}
.docs {
display: flex;
flex-direction: row;
}
.docslayout-inner {
min-width: 33.8rem;
}
}