Files
vvveb-cms/static/Vvvebjs/demo/landing/scss/post-style.scss

179 lines
2.4 KiB
SCSS
Raw Normal View History

2026-05-17 21:09:32 +08:00
$max-width: 40rem !default;
@mixin max-width {
max-width:$max-width;
margin-left:auto;
margin-right:auto;
}
@mixin quotes {
&:before, &:after {
font-family: 'Line Awesome Free';
font-weight: 900;
font-style:normal;
}
&:before {
content:"\f10d ";
}
&:after {
content:" \f10e";
}
}
h1, h2, h3, h4, h5, h6 {
//line-height:1.4;
//font-weight:600;
//color: var(--bs-body-color);
word-break: break-word;
}
.post-title, .post-title a {
text-decoration:none;
color:var(--bs-body-color);
h1, h2, h3 {
font-weight:600;
//display:block;
}
/*
h3 {
font-size:1.2rem;
line-height:1.4rem;
}
*/
&:hover {
text-decoration:underline;
}
}
a.post-title {
display:block;
}
.post-content {
font-size: 1.2rem;
line-height: 1.6;
font-family: var(--bs-font-sans-serif);
//font-family: 'Noto Serif', serif;
//font-family: 'Roboto Slab', serif;
/*
> * {
margin-bottom:1rem;
}
*/
> p, > h1, > h2, > h3, > h4, > h5, > h6, > blockquote, > span, > ul, pre, > ol, > details {
@include max-width();
}
h1, h2 {
font-weight:600;
}
blockquote {
font-style: italic;
padding-bottom: 3px;
padding-right: 20px;
padding-left: 20px;
letter-spacing: .01rem;
border-left: 4px solid var(--bs-border-color);
margin-top:2rem;
margin-bottom:2rem;
//border-left: 4px solid var(--bs-light-gray);
> p {
@include quotes();
}
i {
font-size:2rem;
color:var(--bs-gray);;
}
}
q {
@include quotes();
}
img, svg, video {
vertical-align: middle;
max-width: 100%;
margin: 0 auto;
height: auto;
}
iframe {
vertical-align: middle;
max-width: 100%;
margin: 0 auto;
display:block;
}
div.iframe {
display:flex;
justify-content: center;
position:relative;
}
.align-left {
margin-right:1rem;
}
.align-right {
margin-left:1rem;
}
pre {
padding:0 1rem 1rem;
background:var(--bs-secondary-bg);
code {
background:transparent;
}
}
table {
//@extend .table;
}
}
.align-left {
float:left;
margin-bottom: 25px;
max-width: 50%;
margin:.5em 1em .5em 0;
}
.align-right {
float:right;
margin-bottom: 25px;
max-width: 50%;
margin:.5em 0 .5em 1em;
}
.align-center {
margin-left: auto;
margin-right: auto;
}
img.align-center {
display: block;
}
figure.align-center{
display:table;
}
.tags, .comments-form, .post-comments {
@include max-width();
}