MediaWiki: Common.css: Unterschied zwischen den Versionen

Aktuelle Version vom 7. November 2024, 11:43 Uhr

/* Das folgende CSS wird für alle Benutzeroberflächen geladen. */

/* fix google maps little man in responsive skin */
.gm-style img {
	max-width: none;
}

a {
  color: #337ab7;
}

/* Restore old look after upgrade from 1.30 to 1.39 which included Tweeki/Bootstrap updates */
:root {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

html {
  font-size: 18px;
}

@media screen and (min-width: 576px) {
  html {
    font-size: 14px;
  }
}

#mw-navigation {
  padding: 0 4px 0 4px !important;
  background-image: linear-gradient(to bottom, #fff 0, #f8f8f8 100%);
  background-color: #f8f8f8;
  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);
}

@media screen and (min-width: 576px) {
  #mw-navigation {
    padding: 0 !important;
  }
}

#sidebar-left {
  margin-top: 20px;
}

@media (min-width: 1000px) {
  #sidebar-left {
	flex: 0 0 20% !important;
  }
}

@media (min-width: 1200px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 1170px !important;
    }
}


/** Make Accordion look similar to old Tweeki / Boostrap 3 **/
.accordion .card {
  margin-bottom: 5px;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
}
.accordion .card .card-header {
  background-image: -webkit-linear-gradient(top, #f5f5f5 0, #e8e8e8 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#e8e8e8));
  background-image: linear-gradient(to bottom, #f5f5f5 0, #e8e8e8 100%);
  background-repeat: repeat-x;
  padding: 0 !important;
}

.accordion .card .card-header h2 {
  font-size: 16px;
  margin-top: 0 !important;
}

.accordion .card .card-header h2 button {
  color: #333333;
  width: 100%;
  text-align: left;
  box-shadow: none !important;
}


/*Tabellen*/
table.wikitable {
	background-color: #ffffff;
	width: 100%;
}

table.wikitable>tr>th,
table.wikitable>*>tr>th {
	background-color: #E6960A;
	border-color: #000000;
	max-width: 40%;
}

/*Überschrift-Farben*/
h1 {
	color: #E6960A;
}

/*Ü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: #2779AA;
}

/****TWEEKI-Anpassungen**************/

/* Ausblenden roter Links im Tweeki-Skin (genauer: subpages-tweeki) */
.subpages-tweeki a.new {
	display: none
}

.navbar-brand {
  color: var(--bs-nav-link-color)
}

.navbar-collapse {
  margin-top: 3px;
}

/*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 {
		display: none;
	}
}

@media (max-width: 1000px) {
	#sidebar-left {
		display: none !important;
	}

	.footer-sticky {
		display: block;
	}

    .col-md-9 {
        flex: unset !important;
        max-width: unset !important;
    }
}

@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;
}

/*
.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:first-of-type .btn-primary

/*.nav-pills li:first-of-type a */
	{
	background-color: #0A0A78 !important;
	border-color: #0A0A78 !important;
	color: #FFFFFF !important;
	padding: 15px;
}

#sidebar-left div:nth-of-type(2) .btn-primary,
#sidebar-left div:nth-of-type(3) .btn-primary

/*.nav-pills li:nth-of-type(2) a, .nav-pills li:nth-of-type(3) a*/
	{
	background-color: #64A0C8 !important;
	border-color: #64A0C8 !important;
	color: #FFFFFF !important;
	padding: 15px;
}

#sidebar-left div:nth-of-type(3) {
	margin-bottom: 10px
}

/*.nav-pills li:nth-of-type(4)*/
	{
	margin-left: 0px;
}

#sidebar-left div:nth-of-type(4) .btn-primary

/*.nav-pills li:nth-of-type(4) a */
	{
	background-color: #646464 !important;
	border-color: #646464 !important;
	color: #FFFFFF !important;
}

#sidebar-left div:nth-of-type(5) .btn-primary,
#sidebar-left div:nth-of-type(6) .btn-primary

/*.nav-pills li:nth-of-type(5) a, .nav-pills li:nth-of-type(6) a */
	{
	background-color: #DCDCDC !important;
	border-color: #DCDCDC !important;
	color: #222222 !important;
}

#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 {
	display: 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
}
*/

/*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;
	}
}

/* TabberNeue */
.tabber__panel {
  padding-top: 1rem;
}