Drone Spots Info

MediaWiki:Common.css: Unterschied zwischen den Versionen

Die Seite wurde neu angelegt: „→Fester, kleiner Sidebar-Wrapper: .infobox-container { float: right !important; clear: right !important; width: 22em; →<< kleiner machen hier: max-width: 100%; margin: 0 0 1rem 1rem; →Abstand zum Fließtext links/unten: } →Infobox-Basis: table.infobox { background: #fff; border: 1px solid #d9d9e3; border-collapse: separate; border-spacing: 0; width: 100%; →füllt den Wrapper (22em): b…“
 
Keine Bearbeitungszusammenfassung
 
(4 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
/* Fester, kleiner Sidebar-Wrapper */
/* =========================
  Infobox-Wrapper
  ========================= */
.infobox-container {
.infobox-container {
   float: right !important;
   float: right !important;
   clear: right !important;
   clear: right !important;
   width: 22em;             /* << kleiner machen hier */
   width: 22em;
   max-width: 100%;
   max-width: 100%;
   margin: 0 0 1rem 1rem;   /* Abstand zum Fließtext links/unten */
   margin: 0 0 1rem 1rem;
  box-sizing: border-box;
}
}


/* Infobox-Basis */
/* =========================
  Infobox-Basis
  ========================= */
table.infobox {
table.infobox {
   background: #fff;
  width: 100%;
   background: #ffffff;
  color: #111827;
   border: 1px solid #d9d9e3;
   border: 1px solid #d9d9e3;
   border-collapse: separate;
   border-collapse: separate;
   border-spacing: 0;
   border-spacing: 0;
  width: 100%;              /* füllt den Wrapper (22em) */
  box-shadow: 0 6px 24px rgba(0,0,0,.06), 0 2px 8px rgba(0,0,0,.04);
   border-radius: 12px;
   border-radius: 12px;
   overflow: hidden;
   overflow: hidden;
   font-size: 90%;
   font-size: 90%;
  line-height: 1.35;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.06), 0 2px 8px rgba(0, 0, 0, 0.04);
}
}


/* Titel */
/* =========================
  Titelzeile
  ========================= */
table.infobox .infobox-title {
table.infobox .infobox-title {
   background: linear-gradient(180deg, #e9efff 0%, #dfe7ff 100%);
   background: linear-gradient(180deg, #e9efff 0%, #dfe7ff 100%);
Zeile 27: Zeile 36:
   text-align: center;
   text-align: center;
   font-weight: 700;
   font-weight: 700;
   padding: .7rem .9rem;
  font-size: 1.05em;
   padding: 0.75rem 0.9rem;
   border-bottom: 1px solid #d9d9e3;
   border-bottom: 1px solid #d9d9e3;
}
}


/* Bild */
/* =========================
  optionales Bildfeld
  ========================= */
table.infobox .infobox-media {
table.infobox .infobox-media {
   text-align: center;
   text-align: center;
   padding: .6rem .9rem .4rem;
   padding: 0.7rem 0.9rem 0.5rem;
   background: #fbfcff;
   background: #fbfcff;
   border-bottom: 1px solid #d9d9e3;
   border-bottom: 1px solid #d9d9e3;
}
}


/* Zellen */
table.infobox .infobox-media img {
table.infobox th, table.infobox td {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}
 
/* =========================
  Standardzellen
  ========================= */
table.infobox th,
table.infobox td {
   vertical-align: top;
   vertical-align: top;
   padding: .5rem .9rem;
   padding: 0.55rem 0.9rem;
  line-height: 1.35;
   border-top: 1px solid #ececf3;
   border-top: 1px solid #ececf3;
}
}
table.infobox th {
table.infobox th {
   width: 46%;
   width: 42%;
   color: #6b7280;
   color: #6b7280;
   font-weight: 600;
   font-weight: 600;
  text-align: left;
  background: #fcfcfe;
}
table.infobox td {
  background: #ffffff;
  word-break: break-word;
}
}


/* leichte Zebra-Optik */
/* Zebra nur für Datenzeilen */
table.infobox tr:nth-child(even) th,
table.infobox tbody tr:nth-child(even) th,
table.infobox tr:nth-child(even) td {
table.infobox tbody tr:nth-child(even) td {
   background: #fafafa;
   background: #fafafa;
}
}


/* Mobile: Sidebar auf volle Breite unter den Text */
/* Erste Inhaltszeile nicht doppelt trennen, falls direkt nach Titel/Bild */
table.infobox tr:first-child th,
table.infobox tr:first-child td {
  border-top: none;
}
 
/* Links innerhalb der Infobox */
table.infobox a {
  word-break: break-word;
}
 
/* =========================
  Mobile Darstellung
  ========================= */
@media (max-width: 768px) {
@media (max-width: 768px) {
   .infobox-container {
   .infobox-container {
Zeile 65: Zeile 106:
     width: 100%;
     width: 100%;
     margin: 0 0 1rem 0;
     margin: 0 0 1rem 0;
  }
  table.infobox th,
  table.infobox td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }
  table.infobox th {
    padding-bottom: 0.2rem;
  }
  table.infobox td {
    padding-top: 0.2rem;
   }
   }
}
}
Abgerufen von „https://dronespots.info/MediaWiki:Common.css“