fix(card): make the UI more responsive

There is a good chance that the `value` which will
be rendered in markdown is very large.
In such cases, the consumer may limit the `height` or
`max-height` of the component, which will result in
the content to overflow out of the card.
The component should have a more responsive UI
when its size is more limited by the consumer.

src/components/card/card.scss

@@ -55,7 +55,6 @@ section {
 }
 
 img {
-    flex-shrink: 0;
     transition: filter 0.6s ease;
     object-fit: cover;
     border-radius: calc(
@@ -66,6 +65,8 @@ img {
     }
 
     :host(limel-card[orientation='landscape']) & {
+        flex-shrink: 0;
+
         max-width: 40%;
         height: 100%;
     }
@@ -78,10 +79,12 @@ img {
 }
 
 limel-markdown {
+    overflow-y: auto;
     padding: 0.5rem 0.75rem;
 }
 
 header {
+    flex-shrink: 0;
     display: flex;
     justify-content: center;
 
@@ -131,8 +134,8 @@ header {
 }
 
 limel-action-bar {
+    flex-shrink: 0;
     --action-bar-background-color: transparent;
-    padding: 0.5rem;
     margin-left: auto;
 }