fix card layout

vue/src/components/RssFeeds.vue

@@ -50,7 +50,7 @@ onMounted(async () => {
           <p v-if="!feed.readable" class="feed-original-link">
             <a :href="feed.url" target="_blank" rel="noopener noreferrer">Read original article &#8599;</a>
           </p>
-          <p class="feed-content" :class="{ 'feed-content--clamped': layout === 'cards' && !feed.readable }" v-html='feed.content'></p>
+          <p class="feed-content" v-html='feed.content'></p>
         </div>
       </template>
     </div>
@@ -89,22 +89,20 @@ onMounted(async () => {
 </template>
 
 <style scoped>
-.article--cards {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
-  align-items: start;
-  gap: 1rem;
-}
-
+/* Plain vertical stack of bordered "cards" — deliberately not flex/grid, and
+   with no truncation/max-height: normal block flow lets each card grow to fit
+   its own full content (images included), with no cross-element interaction. */
 .article--cards .observe {
-  display: flex;
-  flex-direction: column;
   border: 1px solid var(--color-border);
   border-radius: 8px;
   overflow: hidden;
   background: var(--color-background-soft);
 }
 
+.article--cards .observe + .observe {
+  margin-top: 1rem;
+}
+
 .article--cards .feed-title {
   border-bottom: none;
 }
@@ -114,19 +112,15 @@ onMounted(async () => {
   padding: 0 1em 0.5em;
 }
 
-.article--cards .feed-content {
-  flex: 1;
-}
-
-.article--cards .feed-content--clamped {
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 4;
-  overflow: hidden;
-}
-
-.article--cards .feed-content img {
-  display: none;
+/* `v-html` content isn't part of the component's render output, so it never
+   gets the scoped `data-v-*` attribute — `:deep()` is required for this rule
+   to actually reach the injected <img> tags (without it, the selector silently
+   never matches). Cap the height so a large article photo reads as a tidy
+   preview thumbnail; the card itself is left to grow to whatever height its
+   content (image included) naturally needs — no clamping, no max-height. */
+.article--cards .feed-content :deep(img) {
+  max-height: 220px;
+  width: auto;
 }
 
 .feed-original-link a {