Vorlage:Bildrechte/style.css: Unterschied zwischen den Versionen

← Zum vorherigen Versionsunterschied

@@ Zeile 1: / Zeile 1: @@
-/* Container für Überschrift+Content-Box */
+/* Container für Content-Box */
 .content-box {
      position: relative;
      display: inline-block;
-     margin-bottom: 1.5rem;
+     margin: 1rem 0;
-    z-index: 1;
      transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);
      transform-origin: center;
      width: 100%;
      max-width: 500px;
-}
-.content-box:hover {
-    transform: scale(1.01);
-    border-color: rgba(0,0,0,0.12);
-    z-index: 2;
-}
-/* Header-Tab */
-.box-header {
-  position: relative;
-  width: max-content;
-  max-width: 85%;
-  padding: 0.7rem 0.8rem;
-  background: rgba(0,0,0,0.08);
-  border-radius: 6px 6px 0 0;
-  margin: 0;
-  margin-bottom: -5px;
-}
-.box-header h2 {
-  font-size: 0.9rem;
-  margin: -2px 0 0 0;
-  padding: 0;
-  font-weight: bold;
-  border-bottom: 0;
-  color: #222;
-  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
 }
@@ Zeile 54: / Zeile 25: @@
    align-items: center;
    justify-content: center;
-   padding-top: 0.5rem;
+   padding: 0.5rem 0 0 0;
    height: 70px;
-  padding-bottom: 0.5rem;
 }
@@ Zeile 160: / Zeile 130: @@
 }
-.details {
+/* Details-Container */
-  margin: 1rem 0;
+.details-container {
    border-top: 1px solid rgba(0,0,0,0.08);
-  padding-top: 1rem;
 }
-.detail-row {
+/* Grid-Layout für Details */
-   display: flex;
+.details-grid {
-   justify-content: space-between;
+   display: grid;
-   margin-bottom: 0.5rem;
+   grid-template-columns: 1fr 3fr;
+   margin: 0;
+  padding: 0;
 }
 .detail-label {
    font-weight: bold;
+  margin: 0;
+  font-size: 0.85rem;
+  padding: 0.5rem 0;
+  color: #333;
+}
+.detail-value {
+  margin: 0;
+  font-size: 0.85rem;
+  padding: 0.5rem 0;
+}
+/* Trennlinien zwischen den Zeilen */
+.details-grid dt:not(:last-of-type),
+.details-grid dd:not(:last-of-type) {
+  border-bottom: 1px solid rgba(0,0,0,0.05);
 }
 .footer {
-  margin-top: 1rem;
    border-top: 1px solid rgba(0,0,0,0.08);
    padding-top: 0.5rem;
@@ Zeile 194: / Zeile 180: @@
      display: block;
      width: auto;
-  }
-  /* Box-Header bleibt bei Textbreite */
-  .box-header {
-    max-width: 85%;
    }
 }
@@ Zeile 222: / Zeile 203: @@
    }
-   .detail-row {
+  .details-grid {
-     flex-direction: column;
+    grid-template-columns: 1fr;
+    gap: 0.2rem;
+  }
+   .detail-label {
+     border-bottom: none !important;
+    padding-bottom: 0;
    }
    .detail-value {
-     margin-top: 0.5rem;
+    padding-top: 0;
+     margin-bottom: 0.5rem;
+  }
+  .details-grid dd:not(:last-child) {
+    border-bottom: 1px solid rgba(0,0,0,0.05);
+    padding-bottom: 0.5rem;
+    margin-bottom: 0.5rem;
    }
 }
@@ Zeile 233: / Zeile 227: @@
 /* Print Styles */
 @media print {
-  .box-header,
    .box-content {
      box-shadow: none;
-  }
-  .box-content {
      border: 1px solid #000;
      page-break-inside: avoid;