red-ui/paligo-styles/manual.scss

156 lines
2.3 KiB
SCSS

@import '../apps/red-ui/src/assets/styles/variables';
@import 'manual-sidebar';
.toolbar {
box-shadow: none;
padding: 21px 24px;
margin-bottom: 50px;
}
.topic-content {
.breadcrumb-container {
// if paligo exports with sticky header, the breadcrumbs disappear under the header without this margin
margin-top: 40px;
}
.breadcrumb {
font-size: 14px;
line-height: 18px;
font-weight: 600;
a {
color: $accent;
&:hover {
color: $primary;
text-decoration: underline;
}
}
.breadcrumb-node {
color: $primary;
}
}
}
main article {
margin-top: 0;
margin-bottom: 0;
padding: 0;
}
#topic-content > section > .titlepage h2.title {
margin: 0 0 24px;
@include heading-3;
}
.image-viewport {
margin: auto;
img {
margin: 16px auto;
box-shadow: 0 3px 12px 5px rgb(40 50 65 / 14%);
}
}
.pager {
margin-top: 30px;
margin-bottom: 30px;
padding: 0;
}
.pager li > a,
.pager li > span {
@include button;
}
.warning,
.note,
.important,
.caution,
.tip {
margin-top: 32px;
margin-bottom: 32px;
padding: 16px 24px 16px 68px;
background-color: $white;
border-left: 4px solid $primary;
&:before {
color: $primary;
width: 20px;
height: 20px;
text-align: center;
left: 24px;
top: calc(50% - 15px);
}
h3 {
padding: 0;
@include heading-5;
margin-bottom: 8px;
}
p {
line-height: 20px;
}
}
.topic-content > section > p {
margin: 24px 0;
}
.mediaobject {
margin-top: 20px;
img {
border-radius: 4px;
margin: 0;
}
.caption > p {
font-size: 14px;
text-align: center;
font-style: italic;
margin: 0;
}
}
.inlinemediaobject {
vertical-align: unset;
}
main ol,
main ul {
margin: 0 0 24px;
}
.section-toc {
@include card;
li:first-child {
margin-top: 16px;
}
li:last-child {
margin-bottom: 8px;
}
}
// FAQ
.question {
font-weight: 600;
> td > p {
margin: 32px 0 18px 0;
}
> td:first-child {
padding-right: 4px;
}
}
.fixed-toolbar article.topic :target.question:before {
content: none;
}