Add explicit height to images, make image credit colour darker to imp…

…rove contrast

article/templates/article/objects/fw_article_featured_media.html

@@ -9,6 +9,8 @@
         {% image featured_image_object.image width-1500 format-webp as featured_image %}
         <img
             class="article-attachment"
+            width="{{ featured_image_object.width }}"
+            height="{{ featured_image_object.height }}"
             data-id="{{ featured_image_object.image.id }}"
             data-caption="{{ featured_image_object.caption }}"
             data-url="{{ featured_image.url }}"

images/templates/images/stream_blocks/image_block.html

@@ -4,7 +4,7 @@
 <div class="image-attachment attachment {{ self.style }} {{ self.width }} {% if self.click_to_enlarge %}setup-modal image-modal{% endif %}" >
     {% image self.image width-1000 format-webp as image %}
     {% image self.image original as ogImage %}
-    <img class="article-attachment" decoding="async" data-id="{{ image.id }}" data-caption="{{ self.caption }}" data-credit="{{ self.credit }}" data-url="{{ image.url }}" src="{{ image.url }}" alt="{% if self.alt_text %}{{ self.alt_text }}{% else %}{{self.caption}}{% endif %}" />
+    <img class="article-attachment" width="{{image.width}}" height="{{image.height}}" decoding="async" data-id="{{ image.id }}" data-caption="{{ self.caption }}" data-credit="{{ self.credit }}" data-url="{{ image.url }}" src="{{ image.url }}" alt="{% if self.alt_text %}{{ self.alt_text }}{% else %}{{self.caption}}{% endif %}" />
 
     {% if self.click_to_enlarge %}
     <button class="open-modal" aria-label="Enlarge image"></button>

infinitefeed/templates/infinitefeed/sidebar/sidebar_single_issue_block.html

@@ -4,7 +4,7 @@
         <h3 class="issueText">{{ self.date }}</h3>
         {% if self.show_image and self.image %}
             {% image self.image width-700 format-webp as mag %}
-            <img class="issue_img" src="{{mag.url}}" loading='lazy' alt="{{self.date}} Issue">
+            <img class="issue_img" src="{{mag.url}}" width="{{mag.width}}" height="{{mag.height}}" loading='lazy' alt="{{self.date}} Issue">
         {% endif %}
     </a>
 </li>

ubyssey/static_src/src/styles/modules/_core.scss

@@ -324,7 +324,7 @@ div.image-inner {
 span.credit {
   margin-left: 0.5em;
   font-style: italic;
-  color: #969696;
+  color: #888;
   white-space: pre;
 }
 

ubyssey/static_src/src/styles/modules/article/_embeds.scss

@@ -379,6 +379,7 @@ div.article-content {
 .image-attachment {
   img {
     width: 100%;
+    height: auto;
   }
 
   a {