1
1
Fork 0
This repository has been archived on 2022-03-02. You can view files and clone it, but cannot push or open issues or pull requests.
natenom-websites/scss/import/blog.scss

330 lines
8 KiB
SCSS
Raw Normal View History

2020-10-09 21:48:10 +02:00
// :root
:root {
2020-12-30 21:53:03 +01:00
--branding--title--text-transform: initial !important;
--global--color-background: #{$white} !important;
--global--color-dark-gray: #{$blog_body-bg} !important;
2020-12-30 21:53:03 +01:00
//--global--color-primary: var(--global--color-white) !important;
--global--font-size-page-title: 39px !important;
--global--font-size-xl: 30px !important;
--responsive--aligndefault-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 600px) !important;
}
// general
2020-10-09 21:48:10 +02:00
body {
#page {
header#masthead {
2021-01-02 23:34:18 +01:00
padding-top: var(--global--spacing-vertical);
padding-bottom: var(--global--spacing-vertical);
row-gap: 10px;
.site-logo {
border: 0;
width: unset;
margin: unset;
padding: 0;
margin-right: 20px;
img.custom-logo {
max-width: 32px;
}
}
2020-12-30 21:53:03 +01:00
.site-branding {
.site-description {
2021-01-02 23:34:18 +01:00
font-size: .6em;
2020-12-30 21:53:03 +01:00
font-style: italic;
}
}
nav#site-navigation {
.primary-menu-container {
ul#primary-menu-list {
.menu-item {
2020-10-10 19:45:15 +02:00
a {
text-decoration-style: solid;
2020-12-30 21:53:03 +01:00
text-decoration: underline;
&:hover {
text-decoration-style: dotted;
}
p.menu-item-description {
display: none;
2020-10-09 21:48:10 +02:00
}
}
}
}
}
}
}
2021-01-02 23:51:59 +01:00
aside.widget-area {
margin-top: calc(2 * var(--global--spacing-vertical));
}
2020-12-30 21:53:03 +01:00
footer {
.site-info {
display: none;
}
}
2020-10-09 21:48:10 +02:00
}
}
2021-01-02 23:34:18 +01:00
@media (max-width: 481px) {
body {
#page {
header#masthead {
nav#site-navigation {
top: 32px;
}
}
}
}
}
@media (min-width: 482px) {
body {
#page {
header#masthead {
.site-branding {
display: grid;
grid-gap: 20px;
grid-template-columns: auto auto;
.site-description {
margin: auto;
}
}
}
}
}
}
body:not(.is-dark-theme) {
#page {
header#masthead {
.site-logo {
filter: invert(80%);
}
}
}
}
2020-12-30 21:53:03 +01:00
// post preview
2020-10-09 21:48:10 +02:00
2020-12-30 21:53:03 +01:00
body {
&.home,
&.tag,
&.category,
2021-01-02 23:34:18 +01:00
&.search {
2020-12-30 21:53:03 +01:00
#page {
#content {
#primary {
#main {
article.post {
header.entry-header {
2021-02-17 16:42:53 +01:00
figure.post-thumbnail {
max-width: calc(.5 * var(--responsive--alignwide-width));
2021-02-17 16:42:53 +01:00
a.post-thumbnail-inner {
img.attachment-post-thumbnail {
margin-top: 40px;
}
}
}
2020-12-30 21:53:03 +01:00
h2.entry-title {
line-height: 42px;
max-width: var(--responsive--alignfull-width);
text-align: center;
width: var(--responsive--alignwide-width);
a {
font-size: 39px;
}
}
}
.entry-content {
h2 {
font-size: 30px;
line-height: 35px;
}
2021-01-02 23:34:18 +01:00
a.more-link {
background: var(--button--color-background);
border: var(--button--border-width) solid var(--button--color-background);
color: var(--button--color-text);
font-weight: var(--button--font-weight);
padding: 10px 40px;
text-decoration: none;
&:hover {
background: transparent;
color: var(--button--color-text-hover);
2020-12-30 21:53:03 +01:00
}
2020-10-09 21:48:10 +02:00
}
}
}
2020-12-30 21:53:03 +01:00
}
}
}
}
}
}
2021-01-02 23:51:59 +01:00
// tag / category / search header
2020-12-30 21:53:03 +01:00
body {
&.tag,
&.category,
2021-01-02 23:51:59 +01:00
&.search {
2020-12-30 21:53:03 +01:00
#page {
#content {
#primary {
#main {
header.page-header {
2021-01-02 23:51:59 +01:00
border-bottom: 3px solid $nom-blue;
2020-12-30 21:53:03 +01:00
h1 {
font-weight: 400;
2020-10-09 21:48:10 +02:00
}
2020-12-30 21:53:03 +01:00
}
}
}
}
}
}
}
2021-01-02 23:34:18 +01:00
// search
body.search {
#page {
#content {
#primary {
#main {
article.post {
.entry-content {
a.more-link {
float: left;
padding: 5.5px 40px;
margin-top: 30px;
}
}
}
}
}
}
}
}
2020-12-30 21:53:03 +01:00
// post
body {
&.post-template-cover,
2020-12-30 21:53:03 +01:00
&.single-post {
#page {
#content {
#primary {
#main {
article.post {
header.entry-header {
h1.entry-title {
font-size: 39px;
font-weight: 400;
line-height: 42px;
margin-bottom: -20px;
text-align: center;
2020-10-10 17:09:26 +02:00
text-decoration: none;
2020-12-30 21:53:03 +01:00
}
}
.entry-content {
p.has-drop-cap::first-letter {
font-size: 7.2rem;
}
figure {
figcaption {
color: var(--global--color-primary);
}
}
2021-02-13 20:16:33 +01:00
.wp-block-quote {
border-left: 3px solid $nom-blue;
&::before {
content: "";
}
cite {
color: var(--global--color-primary);
}
p {
font-weight: normal;
font-style: italic;
}
}
.wp-block-image {
margin-top: inherit;
margin-bottom: inherit;
}
2020-12-30 21:53:03 +01:00
.yarpp-related {
margin: 3em auto 0 auto !important;
ol {
color: rgb(155, 155, 170);
list-style: none;
margin: 0;
padding-left: 0;
li {
margin: 15px 0;
a {
font-weight: normal !important;
text-decoration: underline;
&:hover {
text-decoration-style: dotted;
}
}
}
2020-10-10 19:45:15 +02:00
}
}
}
}
}
}
}
}
}
}
2020-10-11 12:41:49 +02:00
2020-12-30 21:53:03 +01:00
// lightbox plugin
#slb_viewer_wrap {
#slb_viewer_slb_default {
.slb_viewer_layout {
.slb_container {
padding: 0 !important; // kein Rand
box-shadow: none !important; // kein »glow« bzw. Schatten
.slb_details {
.inner {
.slb_data {
2020-12-30 22:09:01 +01:00
background: var(--global--color-background);
2020-12-30 21:53:03 +01:00
.slb_data_content {
display: grid;
2021-01-04 22:57:35 +01:00
grid-template-areas: "title status" "desc desc";
margin: 10px;
2020-12-30 21:53:03 +01:00
.slb_data_title {
2020-12-30 22:09:01 +01:00
color: var(--global--color-primary);
font-family: var(--global--font-primary);
font-size: var(--global--font-size-xs);
2020-12-30 21:53:03 +01:00
font-weight: 500;
2021-01-04 22:57:35 +01:00
grid-area: title;
2020-12-30 21:53:03 +01:00
letter-spacing: 0;
2021-01-04 22:57:35 +01:00
margin: 0;
2020-12-30 21:53:03 +01:00
}
2020-12-30 22:09:01 +01:00
.slb_group_status {
color: var(--global--color-primary);
font-family: var(--global--font-primary);
font-size: var(--global--font-size-xss);
font-style: unset;
2021-01-04 22:57:35 +01:00
grid-area: status;
margin: auto 0;
text-align: center;
}
.slb_data_desc {
2021-01-04 22:57:35 +01:00
color: var(--global--color-primary);
font-family: var(--global--font-primary);
font-size: var(--global--font-size-xss);
grid-area: desc;
margin: 0;
2020-12-30 22:09:01 +01:00
}
}
}
}
}
}
}
}
}