metadata formatting

css/components/islandora_mods.css

@@ -42,7 +42,7 @@ h3.tl-headline-date {
   color: #333;
 }
 .tl-text h2.tl-headline {
-font-size: 2rem;
+  font-size: 2rem;
 }
 .tl-slidenav-previous .tl-slidenav-title,
 .tl-slidenav-next .tl-slidenav-title {
@@ -59,6 +59,54 @@ h2.tl-headline {
 h2.tl-headline:hover {
   color: #fff !important;
 }
+/* ============================================================
+   Browse page
+   ============================================================ */
+
+.newspaper-browse .views-row {
+  display: flex;
+  align-items: center;
+  gap: 1em;
+  border-bottom: 1px solid #ccc;
+  padding-bottom: 2em;
+  margin-block: 2em;
+  h3 {
+    margin: 0 0 0.5em;
+  }
+  .views-field-thumbnail__target-id {
+    width: 150px; /* whatever fixed width you want */
+    flex-shrink: 0; /* prevents the image from shrinking */
+  }
+  .views-field-title {
+    flex: 1; /* takes up all remaining space */
+    min-width: 0; /* prevents text overflow issues */
+  }
+}
+.views-view-newspaper-issues {
+  /* display: flex; */
+  border: 1px solid #ccc;
+  padding: 0.5em;
+  display: inline-block;
+  background: #f5f5f5;
+  .views-row {
+  }
+}
+
+details.views-view-newspaper-group li.views-row {
+  display: flex;
+}
+details.views-view-newspaper-group {
+}
+
+ul.views-view-newspaper-issues
+  .views-field-field-media-use
+  .field-content:after {
+  content: " :  ";
+}
+ul.views-view-newspaper-issues .views-field-field-media-use .field-content {
+  width: 10em;
+}
+
 /* ============================================================
    COLLECTION GRID
    ============================================================ */
@@ -266,6 +314,9 @@ form#views-exposed-form-newspapers-view-block-1 {
     text-decoration: none;
   }
 }
+ul.views-view-newspaper-issues {
+  columns: 3;
+}
 /* ============================================================
    BROWSE PAGE
    ============================================================ */
@@ -347,7 +398,7 @@ article .text-content img {
   text-decoration: none;
 }
 .tl-slider-container-mask {
-    background: #F8F8F8;
+  background: #f8f8f8;
   border: 1px solid #ccc;
   border-top: 0;
 }