From 60571a0fba8bc1e6de02509075824c90147ee68d Mon Sep 17 00:00:00 2001
From: Wesley B <62723358+wesleyboar@users.noreply.github.com>
Date: Thu, 9 Nov 2023 16:45:51 -0600
Subject: [PATCH] hotfix: update pills too large or missing (#347)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: update pill too large

* fix: news pill styles misplaced

* fix: "ORIGINAL MESSAGE" → "Original Message" pill

---------

Co-authored-by: Jake Rosenberg <jrosenberg@tacc.utexas.edu>
---
 .../user_news/templates/user_news/includes/read_item.html  | 4 +++-
 .../css/for-core-styles/components/c-news--list.css        | 6 ++----
 .../tup_cms/css/for-core-styles/components/c-news.css      | 6 ++++++
 .../static/tup_cms/css/for-tup-cms/components/c-update.css | 7 ++-----
 4 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/apps/tup-cms/src/apps/user_news/templates/user_news/includes/read_item.html b/apps/tup-cms/src/apps/user_news/templates/user_news/includes/read_item.html
index 2b7269766..77a169f73 100644
--- a/apps/tup-cms/src/apps/user_news/templates/user_news/includes/read_item.html
+++ b/apps/tup-cms/src/apps/user_news/templates/user_news/includes/read_item.html
@@ -18,7 +18,9 @@ <h2 class="c-news__subtitle">{{ article.subtitle }}</h2>
     {% if article.updates %}
     {% include './updates.html' with updates=article.updates %}
     <header class="c-update__header">
-      <h3 class="c-update__title">{% trans "Original Message" %}</h3>
+      <h3 class="c-update__title">
+        <span class="c-pill">{% trans "Original Message" %}</span>
+      </h3>
       <span>{% trans "Published" %}</span>&nbsp;
       <time datetime="{{ article.postDateTime }}">
           {{ article.postDate }}
diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-core-styles/components/c-news--list.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-core-styles/components/c-news--list.css
index f0f9c16fe..7a7e63000 100644
--- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-core-styles/components/c-news--list.css
+++ b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-core-styles/components/c-news--list.css
@@ -142,11 +142,9 @@
   display: none;
 }
 
-/* To style "Update" pill in title */
-.c-news .c-pill {
+/* To style a pill (e.g. "Update" pill in a title) */
+.c-news--list .c-pill:not(:first-child) {
   margin-left: 0.5ch;
-  vertical-align: middle;
-  transform: translateY(-0.125em);
 }
 
 
diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-core-styles/components/c-news.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-core-styles/components/c-news.css
index 269790ff0..22f9dc74d 100644
--- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-core-styles/components/c-news.css
+++ b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-core-styles/components/c-news.css
@@ -117,3 +117,9 @@
 .c-news__data address {
   display: inline;
 }
+
+/* To style a pill (e.g. "Update" pill in a title) */
+.c-news .c-pill {
+  vertical-align: middle;
+  transform: translateY(-0.125em);
+}
diff --git a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-update.css b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-update.css
index 543020f31..1bded9437 100644
--- a/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-update.css
+++ b/apps/tup-cms/src/taccsite_custom/tup_cms/static/tup_cms/css/for-tup-cms/components/c-update.css
@@ -3,11 +3,8 @@
   vertical-align: middle;
   transform: translateY(-0.125em);
 }
-
-/* To style "Update" pill in big article page title */
-.c-update__title .c-pill {
-  font-size: var(--global-font-size--large);
-  min-width: unset; /* overwrite .c-pill */
+.c-update__title .c-pill:not([class*="c-pill--"]) {
+  background-color: var(--global-color-primary--light);
 }
 
 /* To reduce space between "Original Update" and its content */