hypnagaga/.storybook/preview.scss

143 lines
2.4 KiB
SCSS

@use './syntax.scss';
body {
font-family: 'Nunito Sans', Helvetica, Arial, sans-serif;
}
table.docblock-argstable {
p {
font-family: inherit;
font-size: inherit;
}
ul {
padding-inline-start: 20px;
}
}
div.sbdocs :where(p:not(.sb-anchor, .sb-unstyled, .sb-unstyled p)) {
font-size: 16px;
}
div.sbdocs-content {
h1:not(.sbdocs-preview *) {
font-family: 'Knowledge', sans-serif;
}
& > h2,
& > div > div > h2 {
margin-top: 4rem;
margin-bottom: 2rem;
&:first-of-type {
margin-top: 4rem;
margin-bottom: 2rem;
}
}
.docblock-source {
margin: 1rem 0;
}
& > div > :where(p, ul, ol),
.sb-anchor > div > :where(p, ul, ol) {
font-size: 18px;
line-height: 29px;
font-family: 'Knowledge', sans-serif;
.highlight {
background-color: rgb(254, 254, 160);
padding: 0 4px;
}
.bold {
font-weight: bold;
}
a {
font-family: 'Knowledge', sans-serif;
color: #0071a1;
text-decoration: none;
text-underline-offset: 2px;
&:hover {
text-decoration: underline;
}
}
}
}
.sbdocs-content {
blockquote:not(.sb-unstyled *) {
background-color: #ededed;
padding: 15px 20px;
border: 1px solid #ccc;
border-radius: 4px;
margin: 2rem auto;
p {
font-size: 16px;
line-height: 22px;
}
}
}
.sbdocs-content div.sbdocs:not(.sb-unstyled) {
font-family: 'Knowledge', sans-serif;
h1 {
font-family: 'Knowledge', sans-serif;
}
p,
ul,
li {
font-size: 18px;
line-height: 29px;
font-family: 'Knowledge', sans-serif;
.highlight {
background-color: rgb(254, 254, 160);
padding: 0 4px;
}
.bold {
font-weight: bold;
}
}
a {
font-family: 'Knowledge', sans-serif;
color: #0071a1;
text-decoration: none;
text-underline-offset: 2px;
&:hover {
text-decoration: underline;
}
}
&:not(.sbdocs-preview) {
code {
font-size: 90%;
margin-left: 2px;
margin-right: 2px;
background-color: #efefef;
padding: 2px 4px;
}
img {
display: block;
margin-top: 1rem;
margin-bottom: 2rem;
}
blockquote {
code {
background-color: #d9d9d9;
}
}
}
}
.sbdocs.sbdocs-wrapper {
padding-top: 1rem;
}
div.reset-article {
width: calc(100% + 30px);
margin-left: -15px;
}