1
1
Fork 0
This commit is contained in:
Vrifox 2020-10-11 18:33:06 +02:00
parent 48bc12bdc1
commit 3faa0e498c
7 changed files with 143 additions and 302 deletions

View file

@ -1,17 +1,18 @@
// //
// Settings // settings
// //
$type: blog; $type: blog;
// //
// Import // import
// //
@import 'import/colors.scss'; @import 'import/colors.scss';
@import 'import/blog-meta.scss'; @import 'import/blog-meta.scss';
@import 'import/edit-warning.scss';
@import 'import/blog.scss'; @import 'import/blog.scss';
@import 'import/globaltopbar.scss'; @import 'import/globaltopbar.scss'; // @natenom: remove this to disable globaltopbar

View file

@ -5,7 +5,6 @@
body { body {
position: relative; position: relative;
top: 32px !important; // WordPress nach unten verlegen, damit Topbar besser wird
h1, h1,
h2 { h2 {
font-size: 3rem !important; // smaller font-size: 3rem !important; // smaller
@ -26,29 +25,26 @@ body {
ul.primary-menu { ul.primary-menu {
li.menu-item { li.menu-item {
a { a {
color: $blau-light !important; color: $nom-blue-light !important;
} }
} }
} }
} }
} }
} }
.search-modal {
top: 32px; // Suchleiste nach unten versetzen, damit sie unter der Topbar angezeigt werden
}
} }
.menu-modal { .menu-modal {
top: 32px; // Menu oben nach unten versetzen, damit sie unter der Topbar angezeigt werden
.menu-modal-inner { .menu-modal-inner {
.menu-wrapper { .menu-wrapper {
.menu-top, .menu-top,
.menu-bottom { .menu-bottom {
nav.expanded-menu { nav.expanded-menu,
nav.mobile-menu {
ul.modal-menu { ul.modal-menu {
li.menu-item { li.menu-item {
.ancestor-wrapper { .ancestor-wrapper {
a { a {
color: $blau-light !important; color: $nom-blue-light !important;
} }
} }
} }
@ -66,7 +62,7 @@ body {
.entry-categories { .entry-categories {
.entry-categories-inner { .entry-categories-inner {
a { a {
color: $blau-light; color: $nom-blue-light;
} }
} }
} }
@ -91,15 +87,15 @@ body {
padding-top: 40px; // Abstand zw. Artikelbildern und Inhalt verkleinern padding-top: 40px; // Abstand zw. Artikelbildern und Inhalt verkleinern
.entry-content { .entry-content {
a { a {
color: $blau-light !important; color: $nom-blue-light !important;
} }
.wp-block-quote { .wp-block-quote {
border-color: $blau-light; border-color: $nom-blue-light;
} }
.read-more-button-wrap { .read-more-button-wrap {
a.more-link { a.more-link {
.faux-button { // Button: "Weiterlesen" .faux-button { // Button: "Weiterlesen"
background: $blau; background: $nom-blue;
color: rgb(245, 245, 255); color: rgb(245, 245, 255);
font-weight: initial; font-weight: initial;
padding: 10px 40px; // Groesse aendern padding: 10px 40px; // Groesse aendern
@ -107,7 +103,7 @@ body {
transition: background .2s; transition: background .2s;
&:hover { &:hover {
text-decoration: none; text-decoration: none;
background: $blau-dark; background: $nom-blue-dark;
} }
} }
} }
@ -119,7 +115,7 @@ body {
nav.pagination { nav.pagination {
.nav-links { .nav-links {
a { a {
color: $blau-light; color: $nom-blue-light;
} }
} }
} }
@ -131,7 +127,7 @@ body {
.footer-menu { .footer-menu {
.menu-item { .menu-item {
a { a {
color: $blau-light !important; color: $nom-blue-light !important;
} }
} }
} }
@ -143,7 +139,7 @@ body {
.widget-content { .widget-content {
.tagcloud { .tagcloud {
a.tag-cloud-link { a.tag-cloud-link {
color: $grau !important; color: $grey !important;
} }
} }
} }
@ -154,7 +150,7 @@ body {
.menu { .menu {
.menu-item { .menu-item {
a { a {
color: $blau-light !important; color: $nom-blue-light !important;
} }
} }
} }
@ -208,7 +204,7 @@ body.post-template-default {
.post-meta { .post-meta {
.post-tags { .post-tags {
.meta-text { .meta-text {
color: $grau !important; color: $grey !important;
} }
} }
} }
@ -218,7 +214,7 @@ body.post-template-default {
.pagination-single-inner { .pagination-single-inner {
.previous-post, .previous-post,
.next-post { .next-post {
color: $blau-light !important; color: $nom-blue-light !important;
} }
} }
} }
@ -229,13 +225,13 @@ body.post-template-default {
footer.comment-footer-meta { footer.comment-footer-meta {
.comment-reply { .comment-reply {
a.comment-reply-link { // Button: "Kommentieren" a.comment-reply-link { // Button: "Kommentieren"
background: $blau ; background: $nom-blue ;
color: rgb(245, 245, 255); color: rgb(245, 245, 255);
font-weight: initial; font-weight: initial;
text-transform: none; text-transform: none;
transition: background .2s; transition: background .2s;
&:hover { &:hover {
background: $blau-dark; background: $nom-blue-dark;
text-decoration: none; text-decoration: none;
} }
} }
@ -268,14 +264,14 @@ body.post-template-default {
} }
.form-submit { .form-submit {
.submit { // Button "Kommentar abschicken" .submit { // Button "Kommentar abschicken"
background: $blau; background: $nom-blue;
color: rgb(245, 245, 255); color: rgb(245, 245, 255);
font-weight: initial; font-weight: initial;
padding: 10px 40px; // Groesse aendern padding: 10px 40px; // Groesse aendern
text-transform: none; // nicht unterstrichen text-transform: none; // nicht unterstrichen
transition: background .2s; transition: background .2s;
&:hover { &:hover {
background: $blau-dark; background: $nom-blue-dark;
text-decoration: none; text-decoration: none;
} }
} }

View file

@ -1,4 +1,8 @@
$blau: rgb(70, 136, 222); $blog_body-bg: rgb(33, 39, 48);
$blau-dark: rgb(50, 116, 202);
$blau-light: rgb(110, 176, 255); // #6db0ff // nom == natenom
$grau: rgb(155, 155, 170); $nom-blue: rgb(70, 136, 222); // #4588de
$nom-blue-dark: rgb(50, 116, 202);
$nom-blue-light: rgb(110, 176, 255); // #6db0ff
$grey: rgb(155, 155, 170);
$grey-light: rgb(155, 155, 170);

View file

@ -0,0 +1,6 @@
/*
*
* Don't edit this css file, instead edit the scss.
* https://git.vrifox.cc/vrifox/natenom-superscss
*
*/

View file

@ -1,38 +1,37 @@
//
// settings
//
$gtb_height: 32px; // gtb == globaltopbar
//
// globaltopbar
//
@media screen { @media screen {
body {
padding-top: 32px;
}
#page {
top: 32px;
}
.header-main {
min-height: 48px;
}
#global__header { #global__header {
background-color: #212730; -moz-box-sizing: border-box;
border-bottom: 3px #4588de solid; -webkit-box-sizing: border-box;
background: $blog_body-bg;
border-bottom: 3px $nom-blue solid;
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
font-size:14px; font-size: 14px;
text-align: left;
top: -32px;
left: 0; left: 0;
line-height: 1.5; line-height: 1.5;
margin: 0; margin: 0;
overflow-x: auto; overflow-x: auto;
overflow-y: hidden; overflow-y: hidden;
position: absolute; position: absolute;
text-align: left;
transition: background .2s, color .2s;
top: -$gtb_height;
vertical-align: middle; vertical-align: middle;
width: 100%;
white-space: nowrap; white-space: nowrap;
z-index:999999; width: 100%;
-moz-box-sizing: border-box; z-index: 9999;
-webkit-box-sizing: border-box;
ul { ul {
display: flex; display: flex;
flex: 1; flex: 1;
@ -41,7 +40,7 @@ body {
display: flex; display: flex;
margin: 0; margin: 0;
a { a {
color: #bbb; color: $grey-light;
font-size: 14px; font-size: 14px;
font-weight: normal; font-weight: normal;
margin: 0 1px; margin: 0 1px;
@ -50,7 +49,7 @@ body {
&:hover, &:hover,
&:active, &:active,
&:focus { &:focus {
background: #4588de; background: $nom-blue;
color: #fff; color: #fff;
text-decoration: none; text-decoration: none;
} }
@ -63,250 +62,95 @@ body {
} }
} }
@media print {
body {
#dokuwiki__site {
.site {
#global__header {
display: none;
}
}
}
}
}
//
// globaltopbar blog
//
@if $type == blog {
body {
top: $gtb_height; // WordPress nach unten verschieben, damit globaltopbar sichtbar wird
header {
.search-modal {
top: $gtb_height; // Suchleiste nach unten versetzen, damit sie unter der Topbar angezeigt werden
}
}
.menu-modal {
top: $gtb_height; // Menu oben nach unten versetzen, damit sie unter der Topbar angezeigt werden
}
}
}
//
// globaltopbar wiki
//
@if $type == wiki { @if $type == wiki {
@media only screen and (min-width: 601px) {
/* changes specific for www.dokuwiki.org */
#dokuwiki__header {
padding-top: 3em;
}
#dokuwiki__usertools {
top: 3em;
}
/* changes specific for bugs.dokuwiki.org */
div#container div#showtask {
top: 40px;
}
}
}
@media only screen and (max-width: 600px) {
body { body {
@if $type == wiki { margin-top: $gtb_height; // DokuWiki nach unten verschieben, damit globaltopbar sichtbar wird
padding-top: 0; overflow-x: hidden;
#dokuwiki__site {
.site {
#dokuwiki__header {
.group {
.tools {
#dokuwiki__usertools {
top: 15px + $gtb_height; // 'em' and 'px' are incompatible units
}
}
} }
} }
#global__header { #global__header {
position: absolute;
overflow: auto;
}
.global__header-right {
left: 0;
position: relative;
}
.header-main {
margin-top: 0px;
}
}
@media print {
#global__header {
display: none;
}
}
//
//
//
@media screen {
#global__header {
position: absolute;
top: 0;
left: 0;
text-align: left;
vertical-align: middle;
line-height: 1.5;
background-color: #212730;
width: 100%;
margin: 0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
white-space: none;
overflow-x: auto;
overflow-y: hidden;
display: flex;
border-bottom: 3px #4588de solid;
}
#global__header h2 {
position: absolute;
/* left: -99999em;*/
top: 0; top: 0;
overflow: hidden; ul {
display: inline;
}
#global__header ul,
#global__header li {
margin: 0;
padding: 0; padding: 0;
list-style: none; }
display: flex; }
line-height: 1.5; }
}
} }
#global__header ul { @media only screen and (min-width: 601px) {
flex: 1; body {
} #dokuwiki__site {
.site {
#global__header a {
color: #bbb;
text-decoration: none;
font-size: 14px;
padding: 4px 8px;
margin: 0 1px;
font-weight: normal;
}
#global__header a:hover,
#global__header a:active,
#global__header a:focus {
color: #fff;
text-decoration: underline;
background: #4588de;
text-decoration: none;
}
#global__header form {
float: right;
margin: 0 0 0 20px;
}
#global__header input {
background-color: #333;
background-image: none;
border: 1px solid #bbb;
color: #fff;
box-shadow: none;
border-radius: 2px;
margin: 0;
line-height: normal;
padding: 1px 0 1px 0;
height: auto;
}
#global__header input.button {
border: none;
color: #bbb;
}
#global__header input.button:hover,
#global__header input.button:active,
#global__header input.button:focus {
color: #fff;
text-decoration: underline;
}
/* new wg qrcode */
.global__header-right {
justify-content: flex-end;
}
.global__header-qr:hover:after {
right: 0;
}
.global__header-qr:after {
content: '';
/*background: url(https://wiki.natenom.de/.cdn/getmumble/qrcode_www.natenom.com_de_meinmumbleserver);*/
position: fixed;
background-size: cover;
height: 111px;
top: 31px;
width: 111px;
right: -150px;
transition: 1s all;
box-shadow: 0 0 8px rgba(0,0,0,0.5);
}
/* end: new wg qrcode */
} /* /@media */
@media only screen and (min-width: 601px) {
/* changes specific for www.dokuwiki.org */
#dokuwiki__header { #dokuwiki__header {
padding-top: 3em; padding-top: 3em;
} .group {
.tools {
#dokuwiki__usertools { #dokuwiki__usertools {
top: 3em; top: 12px + $gtb_height; // 'em' and 'px' are incompatible units
}
}
}
}
}
}
} }
/* changes specific for bugs.dokuwiki.org */ /* changes specific for bugs.dokuwiki.org */
div#container div#showtask { div#container div#showtask {
top: 40px; top: 40px;
} }
} /* /@media */ }
@media only screen and (max-width: 600px) { @media only screen and (max-width: 600px) {
body { body {
padding-top: 0; padding-top: 0;
} }
#global__header {
position: static;
/* white-space: normal;*/
overflow: auto;
} }
#global__header form {
float: none;
display: block;
margin: 0 0 .4em;
}
.global__header-right {
position: relative;
left: 0;
}
} /* /@media */
@media print {
#global__header {
display: none;
}
} /* /@media */
#global__header a#global__header__link-donate {
color: #c16666;
display: none;
}
#global__header a#global__header__link-donate:hover {
background: #c16666;
color: #fff;
}
/* topbar oben */
#global__header {
position: absolute;
white-space: nowrap;
}
#dokuwiki__site {
margin-top: 32px !important;
}
#dokuwiki__usertools {
top: calc(2em + 32px) !important;
}
@only screen and (min-width: 601px) {
#dokuwiki__usertools {
top: calc(3em + 32px) !important;
}
} }

View file

@ -35,12 +35,6 @@
min-height: 22px; /* make sure icons are not cut off (most icons are 16x16) */ min-height: 22px; /* make sure icons are not cut off (most icons are 16x16) */
} }
/* for IE7 */
*+html .dokuwiki .topbar ul li,
*+html .dokuwiki .topbar ul li a {
display: inline;
}
/* changes specific for the default "dokuwiki" template, /* changes specific for the default "dokuwiki" template,
other templates need other changes! */ other templates need other changes! */
#dokuwiki__header { #dokuwiki__header {
@ -50,11 +44,6 @@
top: 2em; top: 2em;
} }
/* IE8 needs this in the default template */
.dokuwiki .topbar ul li img {
max-width: none;
}
} /* /@media */ } /* /@media */

View file

@ -1,16 +1,17 @@
// //
// Settings // settings
// //
$type: wiki; $type: wiki;
// //
// Import // import
// //
@import 'import/colors.scss'; @import 'import/colors.scss';
@import 'import/edit-warning.scss';
@import 'import/wiki.scss'; @import 'import/wiki.scss';
@import 'import/globaltopbar.scss'; @import 'import/globaltopbar.scss'; // @natenom: remove this to disable globaltopbar