MediaWiki: Common.css: Unterschied zwischen den Versionen
Aus UDI
Zpd (Diskussion | Beiträge) (Die Seite wurde geleert.) Markierungen: Geleert Zurückgesetzt |
Zpd (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung Markierung: Manuelle Zurücksetzung |
||
| Zeile 1: | Zeile 1: | ||
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */ | |||
@font-face { | |||
font-family: TeuthoBD; | |||
src: url("/udi/index.php/Datei:SMFTEUTH2.woff2"); | |||
} | |||
@font-face { | |||
font-family: TeuthoUC; | |||
src: url("/udi/images/udi/d/d7/SMFTEUTH2.woff2") format('woff2'); | |||
} | |||
html { | |||
font-size: 14px; | |||
} | |||
#mw-navigation { | |||
padding: 0 !important; | |||
border-color: #e7e7e7; | |||
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075); | |||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075); | |||
} | |||
.Lautform{ | |||
font-family: TeuthoUC; | |||
font-size: 1.3em; | |||
} | |||
/* fix google maps little man in responsive skin */ | |||
.gm-style img { | |||
max-width: none; | |||
} | |||
/*Offset for custom pins in leaflet maps*/ | |||
.map-custom-pins .leaflet-marker-icon { | |||
margin-left: -12px; | |||
margin-top: -40px; | |||
} | |||
.map-custom-pins .leaflet-popup-pane { | |||
margin-top: -35px!important; | |||
} | |||
/*No-Break-Text*/ | |||
span.nobr { | |||
white-space: nowrap; | |||
} | |||
/*Tabellen*/ | |||
table.wikitable { | |||
background-color:#ffffff; | |||
width: 100%; | |||
} | |||
table.wikitable > tr > th, table.wikitable > * > tr > th{ | |||
background-color:#FD9D9D; | |||
border-color:#000000; | |||
max-width: 40%; | |||
} | |||
/*Überschrift-Farben*/ | |||
h1 { | |||
color:#000000; | |||
} | |||
/*Überschrift-Größe*/ | |||
h1 span[dir=auto] { | |||
font-weight:400; | |||
} | |||
/*Eigenschaften-Timeline*/ | |||
.timeline-event-bubble-body { | |||
font-size: 90%; | |||
} | |||
.timeline-event-bubble-time{ | |||
color: #aaa; | |||
visibility: hidden; | |||
} | |||
td, th {vertical-align: top;} | |||
.links.sidebar { | |||
display: block; | |||
width: 120px; | |||
float: right; | |||
margin-left:10px; | |||
font-size: 80%; | |||
} | |||
/*************************tabs**********************/ | |||
#headertabs.round .ui-corner-top { | |||
-moz-border-radius-topleft: 3px; | |||
-webkit-border-top-left-radius: 3px; | |||
-moz-border-radius-topright: 3px; | |||
-webkit-border-top-right-radius: 3px; | |||
border-top-left-radius: 3px 3px; | |||
border-top-right-radius: 3px 3px; | |||
} | |||
#headertabs.round .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { | |||
border: 1px solid #DDD; | |||
font-weight: normal; | |||
color: #FD9D9D; | |||
} | |||
/****TWEEKI-Anpassungen**************/ | |||
/*Je nach Bildbreite wird das Subnav oder die linke Sidebar verwendet*/ | |||
/*Dazu wird die Breite des Inhalts eingeblendet*/ | |||
@media (min-width: 1000px) { | |||
/*.nav-pills{ | |||
display:none; | |||
}*/ | |||
#navbar>ul>li:nth-of-type(3){ | |||
display:none; | |||
} | |||
.footer-sticky a img{ | |||
display:none; | |||
} | |||
} | |||
@media (max-width: 1000px) { | |||
#sidebar-left{ | |||
display:none; | |||
} | |||
.footer-sticky{ | |||
display:block; | |||
} | |||
} | |||
/*Hier nicht nötig, solange kein Suchfeld angezeigt wird*/ | |||
/* | |||
@media (max-width: 1000px) and (min-width: 768px) { | |||
.navbar-form .form-control { | |||
width:180px; | |||
} | |||
.nav>li>a { | |||
padding-left:10px; | |||
padding-right:10px; | |||
font-size:80%; | |||
} | |||
} | |||
*/ | |||
.btn { | |||
font-size:12px; | |||
} | |||
.btn-primary { | |||
background-image: none; | |||
box-shadow: none; | |||
text-shadow: none; | |||
} | |||
#sidebar-left{ | |||
width:20%; | |||
} | |||
/* | |||
.nav-pills{ | |||
margin: auto; | |||
float:none!important; | |||
} | |||
.nav-pills li { | |||
width:32%; | |||
} | |||
.nav-pills a { | |||
margin-bottom:3px; | |||
margin-left:2px; | |||
text-align: center; | |||
} | |||
/* | |||
#sidebar-left .btn-primary:hover { | |||
-webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5); | |||
-moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5); | |||
box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5); | |||
} | |||
/* | |||
.nav-pills a:hover { | |||
-webkit-box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.5); | |||
-moz-box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.5); | |||
box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.5); | |||
} | |||
*/ | |||
/*Farbe und Design der Seitenleiste (inklusive Logo)/Navbar*/ | |||
/*Leider notwendig: Important-Modifikator zum Verhindern des Farbwechsels | |||
beim Hovern über den Link für eine bereits aktiven Seite */ | |||
#sidebar-left div .btn-primary | |||
/*.nav-pills li a*/ { | |||
background-color: #FD9D9D!important; | |||
border-color: #FD9D9D!important; | |||
color:#000000!important; | |||
padding: 15px; | |||
} | |||
#sidebar-left div.active .btn-primary | |||
/*.nav-pills li.active a */{ | |||
background-color: #FD9D9D!important; | |||
border-color: #FD9D9D!important; | |||
color:#000000!important; | |||
padding: 15px; | |||
} | |||
/*.nav-pills li:nth-of-type(4) { | |||
margin-left:16%; | |||
}*/ | |||
#sidebar-left div:nth-of-type(7){ | |||
margin-top:20px; | |||
} | |||
#sidebar-left div:nth-of-type(7) .btn-primary{ | |||
display:none; | |||
} | |||
.tab-content{ | |||
padding-left:10px; | |||
/* | |||
border-left-width: 1px; | |||
border-left-style: solid; | |||
border-left-color: #ddd #ddd transparent; | |||
*/ | |||
} | |||
/*Footer*/ | |||
#footer { | |||
background:none | |||
} | |||
/*Anpassung der Suchen | |||
.mw-search-profile-tabs{ | |||
display:none | |||
} | |||
.smw-ask-actions .smw-ask-action-btn, .smw-ask-actions p, .smw-ask-actions hr{ | |||
display:none | |||
} | |||
searchresults .mw-search-createlink strong{ | |||
display:none | |||
} | |||
*/ | |||
/*Drilldown-Tabs angleichen*/ | |||
ul#drilldown-categories-tabs { | |||
border-bottom: 1px solid #ddd!important; | |||
margin-left:0px!important; | |||
padding-left:0px!important; | |||
padding-bottom: 8px!important; | |||
} | |||
ul#drilldown-categories-tabs li { | |||
border-color: #ddd #ddd transparent!important; | |||
border-radius: 4px 4px 0 0; | |||
line-height: 1.42857; | |||
display: block; | |||
margin-left:0px!important; | |||
padding: 10px 15px!important; | |||
margin-right: 0px!important; | |||
font-size: 100%!important | |||
} | |||
/*Schriftskalierung*/ | |||
@media (min-width: 1000px) { | |||
.mw-body, .btn, .btn-group { | |||
font-size:100%; | |||
} | |||
.mw-body h2, .mw-body .h2, .mw-body h1, .mw-body h1{ | |||
font-size:28px; | |||
} | |||
.mw-body h2, .mw-body .h2{ | |||
margin-bottom: 10px; | |||
margin-top: 20px; | |||
} | |||
.mw-body h3, .mw-body .h3 { | |||
font-size:24px; | |||
margin-bottom: 5px; | |||
margin-top: 10px; | |||
} | |||
} | |||
@media (min-width: 800px) and (max-width: 1000px) { | |||
.mw-body, .btn, .btn-group { | |||
font-size:90% | |||
} | |||
.mw-body h2, .mw-body .h2, .mw-body h1, .mw-body .h1 { | |||
font-size:24px; | |||
} | |||
mw-body h2, .mw-body .h2{ | |||
margin-bottom: 8px; | |||
margin-top: 16px; | |||
} | |||
.mw-body h3, .mw-body .h3 { | |||
font-size:20px; | |||
margin-bottom: 4px; | |||
margin-top: 8px; | |||
} | |||
} | |||
@media (min-width: 600px) and (max-width: 800px) { | |||
.mw-body, .btn, .btn-group { | |||
font-size:80%; | |||
} | |||
.mw-body h2, .mw-body .h2, .mw-body h1, .mw-body .h1 { | |||
font-size:20px; | |||
} | |||
mw-body h2, .mw-body .h2{ | |||
margin-bottom: 6px; | |||
margin-top: 12px; | |||
} | |||
.mw-body h3, .mw-body .h3 { | |||
font-size:16px; | |||
margin-bottom: 3px; | |||
margin-top: 6px; | |||
} | |||
} | |||
@media (min-width: 400px) and (max-width: 600px) { | |||
.mw-body, .btn, .btn-group { | |||
font-size:70%; | |||
} | |||
.mw-body h2, .mw-body .h2, .mw-body h1, .mw-body .h1 { | |||
font-size:16px; | |||
} | |||
mw-body h2, .mw-body .h2{ | |||
margin-bottom: 4px; | |||
margin-top: 8px; | |||
} | |||
.mw-body h3, .mw-body .h3 { | |||
font-size:14px; | |||
margin-bottom: 2px; | |||
margin-top: 4px; | |||
} | |||
} | |||
@media (max-width: 400px) { | |||
.mw-body, .btn, .btn-group { | |||
font-size:60%; | |||
} | |||
.mw-body h2, .mw-body .h2, .mw-body h1, .mw-body .h1 { | |||
font-size:14px; | |||
} | |||
mw-body h2, .mw-body .h2{ | |||
margin-bottom: 2px; | |||
margin-top: 4px; | |||
} | |||
.mw-body h3, .mw-body .h3 { | |||
font-size:12px; | |||
margin-bottom: 1px; | |||
margin-top: 2px; | |||
} | |||
} | |||
/*Drilldown-Anpassungen für Filter*/ | |||
.drilldown-filter-values .ui-widget .ui-button-icon { | |||
display:none; | |||
} | |||
.drilldown-filter-values .ui-widget .ui-autocomplete-input { | |||
width:70%; | |||
} | |||
.drilldown-filter-values .ui-widget { | |||
display:inline; | |||
} | |||
.drilldown-filter .drilldown-filter-label { | |||
font-size:20px; | |||
} | |||
.drilldown-filter { | |||
margin-bottom:5px; | |||
} | |||
/*****************---ERSTE SEITE------------*/ | |||
body.page-Hauptseite h1.firstHeading { display:none; } | |||
#hauptseite table { | |||
background: transparent; | |||
background-color: white; | |||
} | |||
.formtable { | |||
border: 1px solid #1C86EE; | |||
padding: 1em; | |||
width: 100%; | |||
background-color: #F0F8FF; | |||
} | |||
#boxhead { | |||
font-weight: bold; | |||
padding-bottom: 0.5em; | |||
border-bottom: 1px solid darkgrey; | |||
} | |||
.hauptseite-links, | |||
.hauptseite-rechts { | |||
margin-bottom: 1em; | |||
} | |||
.hauptseite-links { | |||
margin-right: 0.5em; | |||
} | |||
.hauptseite-rechts { | |||
margin-left: 0.5em; | |||
} | |||
.hauptseite-links h2, | |||
.hauptseite-rechts h2 { | |||
text-indent: 0.8em; | |||
} | |||
.chart-float-left { | |||
margin-left:0px; | |||
margin-right:10px; | |||
float:left; | |||
clear:both; | |||
} | |||
.chart-float-right { | |||
float:right; | |||
margin-left:10px; | |||
margin-bottom:10px; | |||
clear:both; | |||
} | |||
/*****************---ERSTE SEITE------------*/ | |||
.nav-tabs>li.active>span, .nav-tabs>li.active>span:focus, .nav-tabs>li>span:hover { | |||
cursor: default; | |||
background-color: color: #555;; | |||
border: 1px solid #ddd; | |||
border-bottom-color: transparent;} | |||
.nav-tabs>li>span{color: #3366CC;} | |||
.nav>li>span { | |||
position: relative; | |||
display: block; | |||
padding: 10px 15px; | |||
} | |||
.nav-tabs>li>span[data-toggle="tab"] { | |||
cursor:pointer; | |||
} | |||
#closeActiveTab { | |||
background-color: #FD9D9D!important; | |||
border-color: #FD9D9D!important; | |||
color:#000000!important; | |||
} | |||
Version vom 29. Oktober 2024, 16:08 Uhr
/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */
@font-face {
font-family: TeuthoBD;
src: url("/udi/index.php/Datei:SMFTEUTH2.woff2");
}
@font-face {
font-family: TeuthoUC;
src: url("/udi/images/udi/d/d7/SMFTEUTH2.woff2") format('woff2');
}
html {
font-size: 14px;
}
#mw-navigation {
padding: 0 !important;
border-color: #e7e7e7;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
}
.Lautform{
font-family: TeuthoUC;
font-size: 1.3em;
}
/* fix google maps little man in responsive skin */
.gm-style img {
max-width: none;
}
/*Offset for custom pins in leaflet maps*/
.map-custom-pins .leaflet-marker-icon {
margin-left: -12px;
margin-top: -40px;
}
.map-custom-pins .leaflet-popup-pane {
margin-top: -35px!important;
}
/*No-Break-Text*/
span.nobr {
white-space: nowrap;
}
/*Tabellen*/
table.wikitable {
background-color:#ffffff;
width: 100%;
}
table.wikitable > tr > th, table.wikitable > * > tr > th{
background-color:#FD9D9D;
border-color:#000000;
max-width: 40%;
}
/*Überschrift-Farben*/
h1 {
color:#000000;
}
/*Überschrift-Größe*/
h1 span[dir=auto] {
font-weight:400;
}
/*Eigenschaften-Timeline*/
.timeline-event-bubble-body {
font-size: 90%;
}
.timeline-event-bubble-time{
color: #aaa;
visibility: hidden;
}
td, th {vertical-align: top;}
.links.sidebar {
display: block;
width: 120px;
float: right;
margin-left:10px;
font-size: 80%;
}
/*************************tabs**********************/
#headertabs.round .ui-corner-top {
-moz-border-radius-topleft: 3px;
-webkit-border-top-left-radius: 3px;
-moz-border-radius-topright: 3px;
-webkit-border-top-right-radius: 3px;
border-top-left-radius: 3px 3px;
border-top-right-radius: 3px 3px;
}
#headertabs.round .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
border: 1px solid #DDD;
font-weight: normal;
color: #FD9D9D;
}
/****TWEEKI-Anpassungen**************/
/*Je nach Bildbreite wird das Subnav oder die linke Sidebar verwendet*/
/*Dazu wird die Breite des Inhalts eingeblendet*/
@media (min-width: 1000px) {
/*.nav-pills{
display:none;
}*/
#navbar>ul>li:nth-of-type(3){
display:none;
}
.footer-sticky a img{
display:none;
}
}
@media (max-width: 1000px) {
#sidebar-left{
display:none;
}
.footer-sticky{
display:block;
}
}
/*Hier nicht nötig, solange kein Suchfeld angezeigt wird*/
/*
@media (max-width: 1000px) and (min-width: 768px) {
.navbar-form .form-control {
width:180px;
}
.nav>li>a {
padding-left:10px;
padding-right:10px;
font-size:80%;
}
}
*/
.btn {
font-size:12px;
}
.btn-primary {
background-image: none;
box-shadow: none;
text-shadow: none;
}
#sidebar-left{
width:20%;
}
/*
.nav-pills{
margin: auto;
float:none!important;
}
.nav-pills li {
width:32%;
}
.nav-pills a {
margin-bottom:3px;
margin-left:2px;
text-align: center;
}
/*
#sidebar-left .btn-primary:hover {
-webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5);
box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5);
}
/*
.nav-pills a:hover {
-webkit-box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.5);
box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.5);
}
*/
/*Farbe und Design der Seitenleiste (inklusive Logo)/Navbar*/
/*Leider notwendig: Important-Modifikator zum Verhindern des Farbwechsels
beim Hovern über den Link für eine bereits aktiven Seite */
#sidebar-left div .btn-primary
/*.nav-pills li a*/ {
background-color: #FD9D9D!important;
border-color: #FD9D9D!important;
color:#000000!important;
padding: 15px;
}
#sidebar-left div.active .btn-primary
/*.nav-pills li.active a */{
background-color: #FD9D9D!important;
border-color: #FD9D9D!important;
color:#000000!important;
padding: 15px;
}
/*.nav-pills li:nth-of-type(4) {
margin-left:16%;
}*/
#sidebar-left div:nth-of-type(7){
margin-top:20px;
}
#sidebar-left div:nth-of-type(7) .btn-primary{
display:none;
}
.tab-content{
padding-left:10px;
/*
border-left-width: 1px;
border-left-style: solid;
border-left-color: #ddd #ddd transparent;
*/
}
/*Footer*/
#footer {
background:none
}
/*Anpassung der Suchen
.mw-search-profile-tabs{
display:none
}
.smw-ask-actions .smw-ask-action-btn, .smw-ask-actions p, .smw-ask-actions hr{
display:none
}
searchresults .mw-search-createlink strong{
display:none
}
*/
/*Drilldown-Tabs angleichen*/
ul#drilldown-categories-tabs {
border-bottom: 1px solid #ddd!important;
margin-left:0px!important;
padding-left:0px!important;
padding-bottom: 8px!important;
}
ul#drilldown-categories-tabs li {
border-color: #ddd #ddd transparent!important;
border-radius: 4px 4px 0 0;
line-height: 1.42857;
display: block;
margin-left:0px!important;
padding: 10px 15px!important;
margin-right: 0px!important;
font-size: 100%!important
}
/*Schriftskalierung*/
@media (min-width: 1000px) {
.mw-body, .btn, .btn-group {
font-size:100%;
}
.mw-body h2, .mw-body .h2, .mw-body h1, .mw-body h1{
font-size:28px;
}
.mw-body h2, .mw-body .h2{
margin-bottom: 10px;
margin-top: 20px;
}
.mw-body h3, .mw-body .h3 {
font-size:24px;
margin-bottom: 5px;
margin-top: 10px;
}
}
@media (min-width: 800px) and (max-width: 1000px) {
.mw-body, .btn, .btn-group {
font-size:90%
}
.mw-body h2, .mw-body .h2, .mw-body h1, .mw-body .h1 {
font-size:24px;
}
mw-body h2, .mw-body .h2{
margin-bottom: 8px;
margin-top: 16px;
}
.mw-body h3, .mw-body .h3 {
font-size:20px;
margin-bottom: 4px;
margin-top: 8px;
}
}
@media (min-width: 600px) and (max-width: 800px) {
.mw-body, .btn, .btn-group {
font-size:80%;
}
.mw-body h2, .mw-body .h2, .mw-body h1, .mw-body .h1 {
font-size:20px;
}
mw-body h2, .mw-body .h2{
margin-bottom: 6px;
margin-top: 12px;
}
.mw-body h3, .mw-body .h3 {
font-size:16px;
margin-bottom: 3px;
margin-top: 6px;
}
}
@media (min-width: 400px) and (max-width: 600px) {
.mw-body, .btn, .btn-group {
font-size:70%;
}
.mw-body h2, .mw-body .h2, .mw-body h1, .mw-body .h1 {
font-size:16px;
}
mw-body h2, .mw-body .h2{
margin-bottom: 4px;
margin-top: 8px;
}
.mw-body h3, .mw-body .h3 {
font-size:14px;
margin-bottom: 2px;
margin-top: 4px;
}
}
@media (max-width: 400px) {
.mw-body, .btn, .btn-group {
font-size:60%;
}
.mw-body h2, .mw-body .h2, .mw-body h1, .mw-body .h1 {
font-size:14px;
}
mw-body h2, .mw-body .h2{
margin-bottom: 2px;
margin-top: 4px;
}
.mw-body h3, .mw-body .h3 {
font-size:12px;
margin-bottom: 1px;
margin-top: 2px;
}
}
/*Drilldown-Anpassungen für Filter*/
.drilldown-filter-values .ui-widget .ui-button-icon {
display:none;
}
.drilldown-filter-values .ui-widget .ui-autocomplete-input {
width:70%;
}
.drilldown-filter-values .ui-widget {
display:inline;
}
.drilldown-filter .drilldown-filter-label {
font-size:20px;
}
.drilldown-filter {
margin-bottom:5px;
}
/*****************---ERSTE SEITE------------*/
body.page-Hauptseite h1.firstHeading { display:none; }
#hauptseite table {
background: transparent;
background-color: white;
}
.formtable {
border: 1px solid #1C86EE;
padding: 1em;
width: 100%;
background-color: #F0F8FF;
}
#boxhead {
font-weight: bold;
padding-bottom: 0.5em;
border-bottom: 1px solid darkgrey;
}
.hauptseite-links,
.hauptseite-rechts {
margin-bottom: 1em;
}
.hauptseite-links {
margin-right: 0.5em;
}
.hauptseite-rechts {
margin-left: 0.5em;
}
.hauptseite-links h2,
.hauptseite-rechts h2 {
text-indent: 0.8em;
}
.chart-float-left {
margin-left:0px;
margin-right:10px;
float:left;
clear:both;
}
.chart-float-right {
float:right;
margin-left:10px;
margin-bottom:10px;
clear:both;
}
/*****************---ERSTE SEITE------------*/
.nav-tabs>li.active>span, .nav-tabs>li.active>span:focus, .nav-tabs>li>span:hover {
cursor: default;
background-color: color: #555;;
border: 1px solid #ddd;
border-bottom-color: transparent;}
.nav-tabs>li>span{color: #3366CC;}
.nav>li>span {
position: relative;
display: block;
padding: 10px 15px;
}
.nav-tabs>li>span[data-toggle="tab"] {
cursor:pointer;
}
#closeActiveTab {
background-color: #FD9D9D!important;
border-color: #FD9D9D!important;
color:#000000!important;
}