content, css: image: I SURE HOPE THIS WORKS

1 files changed, 4 insertions, 15 deletions

diff --git a/src/static/css/features.css b/src/static/css/features.css
index f5842704..c25f669c 100644
--- a/src/static/css/features.css
+++ b/src/static/css/features.css
@@ -629,8 +629,7 @@
     border-radius: 0 0 4px 4px;
   }
 
-  .cover-artwork:has(.image-details),
-  .cover-artwork.has-image-details {
+  .cover-artwork:has(.image-details) {
     border-radius: 0 0 6px 6px;
   }
 
@@ -664,8 +663,7 @@
     border-color: var(--dim-color);
   }
 
-  .cover-artwork:not(:has(.image-details)),
-  .cover-artwork:not(.has-image-details) {
+  .cover-artwork:not(:has(.image-details)) {
     /* Hacky: `overflow: hidden` hides tag tooltips, so it can't be applied
      * if we've got tags/details visible. But it's okay, because we only
      * need to apply it if it *doesn't* - that's when the rounded border
@@ -1035,6 +1033,7 @@
 
   .grid-item .image-container {
     width: 100%;
+    aspect-ratio: 1 / 1;
   }
 
   .grid-item .image {
@@ -1316,11 +1315,6 @@
     overflow: hidden;
   }
 
-  .square .image-link {
-    width: 100%;
-    height: 100%;
-  }
-
   .image-inner-area {
     position: relative;
     width: 100%;
@@ -1340,11 +1334,6 @@
     object-fit: cover;
   }
 
-  .square .image {
-    width: 100%;
-    height: 100%;
-  }
-
   .image-link .image {
     display: block;
     max-width: 100%;
@@ -1633,7 +1622,7 @@
   }
 
   #image-overlay-image-layout {
-    display: block;
+    display: flex;
     position: relative;
     max-height: 100%;
     margin: 4px 3px;