MediaWiki:Common.css: Unterschied zwischen den Versionen
Aus Dornheim Anatomy
Becher (Diskussion | Beiträge) (Die Seite wurde geleert.) Markierung: Geleert |
Becher (Diskussion | Beiträge) |
||
Zeile 1: | Zeile 1: | ||
+ | /* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ | ||
+ | /* temporäres Ausschalten der Nav-bar*/ | ||
+ | #mw-navigation { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | /* Logo Anpassung*/ | ||
+ | |||
+ | .p-navbar .navbar-brand img { | ||
+ | height: 1rem !important; | ||
+ | } | ||
+ | |||
+ | /*CSS Anpassungen für die Hauptseite*/ | ||
+ | |||
+ | .page-Hauptseite #firstHeading { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | /* weitere Anpassungen*/ | ||
+ | |||
+ | body { | ||
+ | background-image: url("images/b/be/Hintergrund4.png"); | ||
+ | background-repeat: no-repeat; | ||
+ | background-size: cover; | ||
+ | } | ||
+ | |||
+ | .pfad { | ||
+ | position: absolute; | ||
+ | top: 0; | ||
+ | } | ||
+ | |||
+ | .n-mainpage-description { | ||
+ | display: none; | ||
+ | } | ||
+ | .mw-welcome-bar{ | ||
+ | display: none !important; | ||
+ | } | ||
+ | |||
+ | .background-image p { | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | .gallery a { | ||
+ | height: 60px; | ||
+ | width: 60px; | ||
+ | float: right; | ||
+ | margin: 1px; | ||
+ | background-color: #fff; | ||
+ | border: 1px solid #c8ccd1; | ||
+ | display: flex; | ||
+ | } | ||
+ | |||
+ | .gallery a img { | ||
+ | max-height: 100%; | ||
+ | display: block; | ||
+ | margin: auto; | ||
+ | } | ||
+ | |||
+ | p { | ||
+ | padding: 0 0.5em; | ||
+ | text-align: justify; | ||
+ | |||
+ | } | ||
+ | |||
+ | .welcome h1 { | ||
+ | border: none; | ||
+ | font-size: xxx-large; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | |||
+ | .welcome { | ||
+ | background-color: #ddd7c0; | ||
+ | } | ||
+ | |||
+ | *, ::before, ::after { | ||
+ | box-sizing: unset; | ||
+ | } | ||
+ | |||
+ | .clearfix:after { | ||
+ | content: ""; | ||
+ | display: table; | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | .p-navbar { | ||
+ | background-color: #C2BFAD; | ||
+ | color: #010b15 !important; | ||
+ | padding: 1rem !important; | ||
+ | } | ||
+ | |||
+ | .p-navbar a:visited{ | ||
+ | color: #000 | ||
+ | } | ||
+ | |||
+ | .button_new { | ||
+ | border: none; | ||
+ | background-color: #edece7; | ||
+ | } | ||
+ | |||
+ | .button_new a:hover, .button_new a:focus { | ||
+ | text-decoration: none; | ||
+ | border-bottom: 3px solid #a2a9b1; | ||
+ | } | ||
+ | |||
+ | .button_new a[href].new:hover { | ||
+ | text-decoration: none; | ||
+ | border-bottom: 3px solid #a2a9b1; | ||
+ | } | ||
+ | |||
+ | .button_new a:active { | ||
+ | text-decoration: none; | ||
+ | border-bottom: 1px solid #a2a9b1; | ||
+ | } | ||
+ | .nav-link { | ||
+ | color: #010b15 !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | .container-fluid { | ||
+ | background-color: #C2BFAD; | ||
+ | color: #010b15; | ||
+ | } | ||
+ | |||
+ | .container { | ||
+ | width: 90%; | ||
+ | } | ||
+ | |||
+ | .clear { | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | img, video { | ||
+ | max-width: 100%; | ||
+ | height: auto; | ||
+ | } | ||
+ | |||
+ | .navbar-tools-more-tools a { | ||
+ | color: #000; | ||
+ | } | ||
+ | |||
+ | .navbar-tools a { | ||
+ | color: #000; | ||
+ | } | ||
+ | |||
+ | .p-search { | ||
+ | position: absolute; | ||
+ | left: 45%; | ||
+ | } | ||
+ | |||
+ | .form-control { | ||
+ | padding-top: 0.1em; | ||
+ | padding-bottom: 0.1em; | ||
+ | } | ||
+ | |||
+ | .col { | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | .duo { | ||
+ | background-color: #000; | ||
+ | width: 50%; | ||
+ | } | ||
+ | |||
+ | /*Segmenter Anpassung*/ | ||
+ | |||
+ | iframe img { | ||
+ | width: 100%; | ||
+ | height: 100%; | ||
+ | } | ||
+ | |||
+ | iframe body div.embedding-ovl.centered { | ||
+ | width: 470px !important; | ||
+ | } | ||
+ | |||
+ | /*Inhaltsverzeichnis*/ | ||
+ | .toc { | ||
+ | float: left; | ||
+ | } | ||
+ | |||
+ | .inhaltsvz .toc { | ||
+ | float: right; | ||
+ | } | ||
+ | |||
+ | h2, h4 { | ||
+ | clear: both; | ||
+ | } | ||
+ | |||
+ | .prev { | ||
+ | float: right; | ||
+ | max-width: 30%; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /* language-menu*/ | ||
+ | .mw-pt-languages-label { | ||
+ | background-color: transparent; | ||
+ | display: block; | ||
+ | width: auto; | ||
+ | text-align: left; | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | padding-right: 0.5em; | ||
+ | } | ||
+ | |||
+ | .mw-pt-languages { | ||
+ | background-color: transparent; | ||
+ | position: relative; | ||
+ | bottom: 20px; | ||
+ | z-index: 100; | ||
+ | border: none; | ||
+ | display: flex; | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | } | ||
+ | |||
+ | .mw-pt-languages-list { | ||
+ | display: block; | ||
+ | padding: 0; | ||
+ | margin: 0; | ||
+ | } | ||
+ | |||
+ | .mw-pt-progress--complete, .mw-pt-progress--stub { | ||
+ | background-image: unset; | ||
+ | } | ||
+ | |||
+ | .mw-pt-translate-header { | ||
+ | position: absolute; | ||
+ | bottom: 0; | ||
+ | color: #000; | ||
+ | border-bottom: none; | ||
+ | z-index: 100; | ||
+ | } | ||
+ | |||
+ | /*.mw-pt-translate-header a{ | ||
+ | color: #fff; | ||
+ | } | ||
+ | |||
+ | .mw-pt-translate-header a:hover{ | ||
+ | color: #000; | ||
+ | } | ||
+ | |||
+ | .mw-pt-translate-header span a[href].external{ | ||
+ | color: #fff; | ||
+ | } | ||
+ | |||
+ | .mw-pt-translate-header span a[href].external:hover{ | ||
+ | color: #000; | ||
+ | }*/ | ||
+ | |||
+ | |||
+ | /*Footer Area*/ | ||
+ | #footer-icons { | ||
+ | display: none !important; | ||
+ | } | ||
+ | |||
+ | .mb-2, .mt-4 { | ||
+ | margin-top: 0 !important; | ||
+ | margin-bottom: 0 !important; | ||
+ | } | ||
+ | |||
+ | .container-fluid { | ||
+ | margin: 0; | ||
+ | padding: 0; | ||
+ | } | ||
+ | |||
+ | .footer-places div a { | ||
+ | padding: 0 0.5em; | ||
+ | } | ||
+ | |||
+ | .mb-2 .nav-item { | ||
+ | z-index: 100; | ||
+ | } | ||
+ | |||
+ | .mb-2 .row:nth-of-type(1) { | ||
+ | width: 15%; | ||
+ | float: left; | ||
+ | } | ||
+ | |||
+ | .mb-2 .row:nth-of-type(2) { | ||
+ | display: block; | ||
+ | } | ||
+ | |||
+ | .p-navbar .navbar-nav .dropdown-menu > div > a:first-child:last-child { | ||
+ | width: 80%; | ||
+ | } | ||
+ | |||
+ | .mb-2 .nav-item .nav-link { | ||
+ | color: #c2bfad !important; | ||
+ | } | ||
+ | |||
+ | .mb-2 .nav-item .nav-link:hover { | ||
+ | color: #000 !important; | ||
+ | } | ||
+ | #footer-info div { | ||
+ | position: relative; | ||
+ | margin: 0 auto; | ||
+ | } | ||
+ | |||
+ | .footer-places, .footer-info { | ||
+ | margin-top: 0.5em; | ||
+ | } | ||
+ | |||
+ | .footer-places { | ||
+ | width: 70%; | ||
+ | } | ||
+ | |||
+ | .footer-places div { | ||
+ | margin: 1.5em auto; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /* Button*/ | ||
+ | .mw-ui-button { | ||
+ | margin-top: 0.5em; | ||
+ | } | ||
+ | |||
+ | /*Test responsiver Segmenter*/ | ||
+ | |||
+ | iframe { | ||
+ | max-width: 90%; | ||
+ | } | ||
+ | |||
+ | /*CSS Anpassungen responsives Design*/ | ||
+ | |||
+ | .p-navbar .navbar-nav.right { | ||
+ | margin-top: 0 !important; | ||
+ | } | ||
+ | |||
+ | .navbar-collapse { | ||
+ | flex-direction: row !important; | ||
+ | } | ||
+ | |||
+ | @media (min-width:752px) { | ||
+ | .navbar-expand-cmln, .p-navbar.collapsible { | ||
+ | flex-flow:row nowrap; | ||
+ | justify-content:flex-end; | ||
+ | } | ||
+ | .navbar-expand-cmln .navbar-nav, .p-navbar.collapsible .navbar-nav { | ||
+ | flex-direction:row; | ||
+ | } | ||
+ | .navbar-expand-cmln .navbar-nav .dropdown-menu, .p-navbar.collapsible .navbar-nav .dropdown-menu { | ||
+ | position:absolute; | ||
+ | } | ||
+ | .navbar-expand-cmln .navbar-nav .nav-link, .p-navbar.collapsible .navbar-nav .nav-link, .p-navbar.collapsible .navbar-nav .p-navbar .navbar-tool > a, .p-navbar .p-navbar.collapsible .navbar-nav .navbar-tool > a, .navbar-expand-cmln .navbar-nav .p-navbar .navbar-tool > a, .p-navbar .navbar-expand-cmln .navbar-nav .navbar-tool > a { | ||
+ | padding-right:1rem; | ||
+ | padding-left:1rem; | ||
+ | } | ||
+ | .navbar-expand-cmln > .container, .p-navbar.collapsible > .container, .navbar-expand-cmln > .container-fluid, .p-navbar.collapsible > .container-fluid { | ||
+ | flex-wrap:nowrap; | ||
+ | } | ||
+ | .navbar-expand-cmln .navbar-collapse, .p-navbar.collapsible .navbar-collapse { | ||
+ | display:flex !important; | ||
+ | flex-basis:auto; | ||
+ | } | ||
+ | .navbar-collapse, .p-navbar.collapsible .navbar-collapse { | ||
+ | flex-direction: row !important; | ||
+ | } | ||
+ | |||
+ | .navbar-expand-cmln .navbar-toggler, .p-navbar.collapsible .navbar-toggler { | ||
+ | display:none !important; | ||
+ | } | ||
+ | .p-navbar { | ||
+ | align-content: flex-end !important; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media only screen and (max-width:760px) { | ||
+ | .duo { | ||
+ | width: 100%; | ||
+ | } | ||
+ | .welcome h1 { | ||
+ | font-size: xx-large; | ||
+ | padding: 0 0.5em; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media only screen and (max-width: 1200px) { | ||
+ | .mw-pt-languages { | ||
+ | margin-left: 1em; | ||
+ | } | ||
+ | .mw-pt-translate-header { | ||
+ | margin-left: 1em; | ||
+ | margin-right: 1em; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media only screen and (max-width:520px) { | ||
+ | .mw-pt-languages { | ||
+ | font-size: small; | ||
+ | bottom: 35px; | ||
+ | } | ||
+ | .welcome h1 { | ||
+ | font-size: x-large; | ||
+ | padding: 0.5em 0.5em 0 0.5em; | ||
+ | } | ||
+ | } | ||
+ | |||
+ | @media only screen and (max-width:420px) { | ||
+ | .footer-places { | ||
+ | width: 100%; | ||
+ | flex-direction: column; | ||
+ | } | ||
+ | .footer-places div { | ||
+ | margin: 0 auto; | ||
+ | } | ||
+ | .mb-2 .nav-item { | ||
+ | bottom: -20px; | ||
+ | } | ||
+ | } |
Version vom 5. März 2020, 15:41 Uhr
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ /* temporäres Ausschalten der Nav-bar*/ #mw-navigation { display: none; } /* Logo Anpassung*/ .p-navbar .navbar-brand img { height: 1rem !important; } /*CSS Anpassungen für die Hauptseite*/ .page-Hauptseite #firstHeading { display: none; } /* weitere Anpassungen*/ body { background-image: url("images/b/be/Hintergrund4.png"); background-repeat: no-repeat; background-size: cover; } .pfad { position: absolute; top: 0; } .n-mainpage-description { display: none; } .mw-welcome-bar{ display: none !important; } .background-image p { padding: 0; } .gallery a { height: 60px; width: 60px; float: right; margin: 1px; background-color: #fff; border: 1px solid #c8ccd1; display: flex; } .gallery a img { max-height: 100%; display: block; margin: auto; } p { padding: 0 0.5em; text-align: justify; } .welcome h1 { border: none; font-size: xxx-large; font-weight: bold; } .welcome { background-color: #ddd7c0; } *, ::before, ::after { box-sizing: unset; } .clearfix:after { content: ""; display: table; clear: both; } .p-navbar { background-color: #C2BFAD; color: #010b15 !important; padding: 1rem !important; } .p-navbar a:visited{ color: #000 } .button_new { border: none; background-color: #edece7; } .button_new a:hover, .button_new a:focus { text-decoration: none; border-bottom: 3px solid #a2a9b1; } .button_new a[href].new:hover { text-decoration: none; border-bottom: 3px solid #a2a9b1; } .button_new a:active { text-decoration: none; border-bottom: 1px solid #a2a9b1; } .nav-link { color: #010b15 !important; } .container-fluid { background-color: #C2BFAD; color: #010b15; } .container { width: 90%; } .clear { clear: both; } img, video { max-width: 100%; height: auto; } .navbar-tools-more-tools a { color: #000; } .navbar-tools a { color: #000; } .p-search { position: absolute; left: 45%; } .form-control { padding-top: 0.1em; padding-bottom: 0.1em; } .col { padding: 0; } .duo { background-color: #000; width: 50%; } /*Segmenter Anpassung*/ iframe img { width: 100%; height: 100%; } iframe body div.embedding-ovl.centered { width: 470px !important; } /*Inhaltsverzeichnis*/ .toc { float: left; } .inhaltsvz .toc { float: right; } h2, h4 { clear: both; } .prev { float: right; max-width: 30%; } /* language-menu*/ .mw-pt-languages-label { background-color: transparent; display: block; width: auto; text-align: left; padding: 0; margin: 0; padding-right: 0.5em; } .mw-pt-languages { background-color: transparent; position: relative; bottom: 20px; z-index: 100; border: none; display: flex; padding: 0; margin: 0; } .mw-pt-languages-list { display: block; padding: 0; margin: 0; } .mw-pt-progress--complete, .mw-pt-progress--stub { background-image: unset; } .mw-pt-translate-header { position: absolute; bottom: 0; color: #000; border-bottom: none; z-index: 100; } /*.mw-pt-translate-header a{ color: #fff; } .mw-pt-translate-header a:hover{ color: #000; } .mw-pt-translate-header span a[href].external{ color: #fff; } .mw-pt-translate-header span a[href].external:hover{ color: #000; }*/ /*Footer Area*/ #footer-icons { display: none !important; } .mb-2, .mt-4 { margin-top: 0 !important; margin-bottom: 0 !important; } .container-fluid { margin: 0; padding: 0; } .footer-places div a { padding: 0 0.5em; } .mb-2 .nav-item { z-index: 100; } .mb-2 .row:nth-of-type(1) { width: 15%; float: left; } .mb-2 .row:nth-of-type(2) { display: block; } .p-navbar .navbar-nav .dropdown-menu > div > a:first-child:last-child { width: 80%; } .mb-2 .nav-item .nav-link { color: #c2bfad !important; } .mb-2 .nav-item .nav-link:hover { color: #000 !important; } #footer-info div { position: relative; margin: 0 auto; } .footer-places, .footer-info { margin-top: 0.5em; } .footer-places { width: 70%; } .footer-places div { margin: 1.5em auto; } /* Button*/ .mw-ui-button { margin-top: 0.5em; } /*Test responsiver Segmenter*/ iframe { max-width: 90%; } /*CSS Anpassungen responsives Design*/ .p-navbar .navbar-nav.right { margin-top: 0 !important; } .navbar-collapse { flex-direction: row !important; } @media (min-width:752px) { .navbar-expand-cmln, .p-navbar.collapsible { flex-flow:row nowrap; justify-content:flex-end; } .navbar-expand-cmln .navbar-nav, .p-navbar.collapsible .navbar-nav { flex-direction:row; } .navbar-expand-cmln .navbar-nav .dropdown-menu, .p-navbar.collapsible .navbar-nav .dropdown-menu { position:absolute; } .navbar-expand-cmln .navbar-nav .nav-link, .p-navbar.collapsible .navbar-nav .nav-link, .p-navbar.collapsible .navbar-nav .p-navbar .navbar-tool > a, .p-navbar .p-navbar.collapsible .navbar-nav .navbar-tool > a, .navbar-expand-cmln .navbar-nav .p-navbar .navbar-tool > a, .p-navbar .navbar-expand-cmln .navbar-nav .navbar-tool > a { padding-right:1rem; padding-left:1rem; } .navbar-expand-cmln > .container, .p-navbar.collapsible > .container, .navbar-expand-cmln > .container-fluid, .p-navbar.collapsible > .container-fluid { flex-wrap:nowrap; } .navbar-expand-cmln .navbar-collapse, .p-navbar.collapsible .navbar-collapse { display:flex !important; flex-basis:auto; } .navbar-collapse, .p-navbar.collapsible .navbar-collapse { flex-direction: row !important; } .navbar-expand-cmln .navbar-toggler, .p-navbar.collapsible .navbar-toggler { display:none !important; } .p-navbar { align-content: flex-end !important; } } @media only screen and (max-width:760px) { .duo { width: 100%; } .welcome h1 { font-size: xx-large; padding: 0 0.5em; } } @media only screen and (max-width: 1200px) { .mw-pt-languages { margin-left: 1em; } .mw-pt-translate-header { margin-left: 1em; margin-right: 1em; } } @media only screen and (max-width:520px) { .mw-pt-languages { font-size: small; bottom: 35px; } .welcome h1 { font-size: x-large; padding: 0.5em 0.5em 0 0.5em; } } @media only screen and (max-width:420px) { .footer-places { width: 100%; flex-direction: column; } .footer-places div { margin: 0 auto; } .mb-2 .nav-item { bottom: -20px; } }