Vorlage:Infobar/style.css: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
RaWen (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
RaWen (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
Zeile 23: | Zeile 23: | ||
.infobar-text { | .infobar-text { | ||
margin: auto; | |||
padding: 0; | padding: 0; | ||
display: flex; | display: flex; | ||
Zeile 38: | Zeile 39: | ||
.solo { | .solo { | ||
line-height: 1.4 !important | line-height: 1.4 !important;} | ||
.inline { | .inline { |
Version vom 2. April 2024, 23:05 Uhr
/* Grundlegende Stile für alle Infobars (längliche Infoboxen am Ende von Artikeln) */
.infobar {
max-width: 400px;
background-color: #f4f4f4; /* Basis-Hintergrundfarbe als Fallback */
display: flex;
flex-direction: row;
gap: 1.8em;
border-radius: 6px;
padding: 1em;
margin-bottom: 1.2em;
color: #333; /* Basis-Textfarbe als Fallback */}
.infobar-icon {
max-width: 50px;
max-height: 50px;
margin: auto 0;
display: flex;
flex-shrink: 0 !important;}
.infobar-icon img {
max-width: 100%;
max-height: 100%;}
.infobar-text {
margin: auto;
padding: 0;
display: flex;
flex-wrap: wrap;
column-gap: 0.6em;
row-gap: 0;
font-size: 90%;
width: 100%;
color: inherit; /* Textfarbe von der übergeordneten .infobar erben */}
.infobar-text .head {
line-height: 1;
flex-basis: 100%;
font-size: 110%;}
.solo {
line-height: 1.4 !important;}
.inline {
flex-basis: max-content !important;}
.infobar-text .item {
height: max-content;
display: inline-block;
padding: 0.05em 1em;
background-color: #fff; /* Hintergrundfarbe der Pillen-Items als Fallback */
border-radius: 12px;
font-size: 95%;}
.margin {
margin: 0.5em 0 0 0; /* Abstand nach oben für Items */}
.boxless {
flex-basis: 100% !important;
height: max-content !important;
display: inline-block !important;
padding: 0.05em 0 !important;
background-color: inherit !important;
border-radius: 0 !important;}
.shapeless {
padding: 0.05em 1em 0.05em 0 !important;
background-color: inherit !important; /* Hintergrundfarbe der Pillen-Items leeren */
border-radius: 0 !important;}
.infobar-img {
flex-shrink: 0;
padding: 0;
align-self: center;}
.infobar-img img {
box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.15); /* Subtiler Schatten */
width: 60px;
height: 60px;
border-radius: 6px;
object-fit: cover;}