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
2020-10-11 12:41:49 +02:00

419 lines
9.4 KiB
SCSS

//
// main
//
body {
position: relative;
top: 32px !important; // WordPress nach unten verlegen, damit Topbar besser wird
h1,
h2 {
font-size: 3rem !important; // smaller
}
h3 {
font-size: 2.5rem !important; // smaller
}
h4 {
font-size: 2rem !important; // smaller
}
h5 {
font-size: 1.5rem !important; // smaller
}
header {
.header-inner {
.header-navigation-wrapper {
nav.primary-menu-wrapper {
ul.primary-menu {
li.menu-item {
a {
color: $blau-light !important;
}
}
}
}
}
}
.search-modal {
top: 32px; // Suchleiste nach unten versetzen, damit sie unter der Topbar angezeigt werden
}
}
.menu-modal {
top: 32px; // Menu oben nach unten versetzen, damit sie unter der Topbar angezeigt werden
.menu-modal-inner {
.menu-wrapper {
.menu-top,
.menu-bottom {
nav.expanded-menu {
ul.modal-menu {
li.menu-item {
.ancestor-wrapper {
a {
color: $blau-light !important;
}
}
}
}
}
}
}
}
}
main {
article {
header.entry-header {
padding-bottom: 40px; // Abstand zw. Artikelbildern und Überschrit verkleinern
.entry-header-inner {
.entry-categories {
.entry-categories-inner {
a {
color: $blau-light;
}
}
}
.post-meta-wrapper {
ul.post-meta {
li.post-author {
display: none; // Autor im Beitragsheader ausblenden
}
}
}
}
}
.featured-media {
margin-top: 0;
.featured-media-inner {
.wp-caption-text {
display: none; // Bildbeschreibungen nur unter Artikelbildern werden ausgeblendet
}
}
}
.post-inner {
padding-top: 40px; // Abstand zw. Artikelbildern und Inhalt verkleinern
.entry-content {
a {
color: $blau-light !important;
}
.wp-block-quote {
border-color: $blau-light;
}
.read-more-button-wrap {
a.more-link {
.faux-button { // Button: "Weiterlesen"
background: $blau;
color: rgb(245, 245, 255);
font-weight: initial;
padding: 10px 40px; // Groesse aendern
text-transform: none; // nicht unterstrichen
transition: background .2s;
&:hover {
text-decoration: none;
background: $blau-dark;
}
}
}
}
}
}
}
.pagination-wrapper {
nav.pagination {
.nav-links {
a {
color: $blau-light;
}
}
}
}
}
.footer-nav-widgets-wrapper {
.footer-inner {
.footer-menu-wrapper {
.footer-menu {
.menu-item {
a {
color: $blau-light !important;
}
}
}
}
.footer-widgets-outer-wrapper {
.footer-widgets-wrapper {
.footer-widgets {
.widget.widget_tag_cloud {
.widget-content {
.tagcloud {
a.tag-cloud-link {
color: $grau !important;
}
}
}
}
.widget_nav_menu {
.widget-content {
.menu-datenschutz-impressum-faq-container {
.menu {
.menu-item {
a {
color: $blau-light !important;
}
}
}
}
}
}
.widget_archive {
.widget-content {
select {
background: rgb(58, 66, 89);
border: 0;
color: rgb(245, 245, 255);
padding: 5px 10px;
}
}
}
}
}
}
}
}
}
//
// article / post
//
body.post-template,
body.post-template-default {
main {
article.post {
.post-inner {
.entry-content {
.yarpp-related {
margin: 3em auto 0 auto !important;
ol {
color: rgb(155, 155, 170);
list-style: none;
margin: 0;
li {
border-bottom: 1px solid rgb(53, 59, 68);
margin: 15px 0;
a {
font-weight: normal !important;
}
}
}
}
}
.post-meta-wrapper {
.post-meta {
.post-tags {
.meta-text {
color: $grau !important;
}
}
}
}
}
.pagination-single {
.pagination-single-inner {
.previous-post,
.next-post {
color: $blau-light !important;
}
}
}
.comments-wrapper {
.comments {
.comments-inner {
article.comment-body {
footer.comment-footer-meta {
.comment-reply {
a.comment-reply-link { // Button: "Kommentieren"
background: $blau ;
color: rgb(245, 245, 255);
font-weight: initial;
text-transform: none;
transition: background .2s;
&:hover {
background: $blau-dark;
text-decoration: none;
}
}
}
}
}
}
}
.comment-respond {
.section-inner {
.comment-form-comment {
textarea#comment {
background: rgb(37, 45, 57);
border: 0;
color: rgb(255, 255, 255);
}
}
.comment-form-author,
.comment-form-email,
.comment-form-url {
input {
&#author,
&#email,
&#url {
background: rgb(37, 45, 57);
border: 0;
color: rgb(255, 255, 255);
}
}
}
.form-submit {
.submit { // Button "Kommentar abschicken"
background: $blau;
color: rgb(245, 245, 255);
font-weight: initial;
padding: 10px 40px; // Groesse aendern
text-transform: none; // nicht unterstrichen
transition: background .2s;
&:hover {
background: $blau-dark;
text-decoration: none;
}
}
}
}
}
}
}
}
}
//
// article / post: cover template
//
body.post-template.template-cover {
header {
.header-inner {
.header-navigation-wrapper {
nav.primary-menu-wrapper {
ul.primary-menu {
li.menu-item {
a {
color: rgb(255, 255, 255) !important;
}
}
}
}
}
}
}
main {
article.post {
.cover-header {
background-position: center -182.5px;
.cover-header-inner-wrapper {
min-height: 60vh; // Cover Hoehe bei Cover Template nur noch 6/10 statt 10/10
.cover-header-inner {
.cover-color-overlay {
color: rgb(37, 45, 57); // Cover-Farbe (falls kein Hex-Code angegeben werden kann)
}
header.entry-header {
.entry-header-inner {
.entry-categories {
.entry-categories-inner {
a {
color: rgb(255, 255, 255);
}
}
}
}
}
}
}
}
}
}
}
//
// page (e.g. https://blog.natenom.com/natenom/)
//
body.page-template {
main {
article.page {
.post-inner {
}
}
}
}
//
// category (e.g. https://blog.natenom.com/category/allgemein/)
//
body.category {
main {
article.post {
.featured-media {
}
}
}
}
//
// tag (e.g. https://blog.natenom.com/tag/fahrrad/)
//
body.tag {
main {
article.post {
.featured-media {
}
}
}
}
//
// tag (e.g. https://blog.natenom.com/2020/08/)
//
body.archive {
main {
header.archive-header {
.archive-header-inner {
h1.archive-title {
.color-accent {
color: rgb(255, 255, 255);
}
}
}
}
}
}
//
// 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 {
.slb_data_content {
.slb_data_title {
margin: 10px 20px 5px 20px; // gleichmaessiger Rand
}
}
}
}
}
}
}
}
}