Work Package Card: normalize priority label width

Cuts off after a certain threshold.

Using a fixed width leads to a more structured and calm visual design.
The price is that a bit of space is wasted for priorities with shorter
names.

app/components/open_project/common/work_package_card_component.html.erb

@@ -60,10 +60,10 @@ See COPYRIGHT and LICENSE files for more details.
       <%= render(
             Primer::Beta::Text.new(
               tag: :span,
-              classes: "__hl_inline_priority_#{work_package.priority.id} __hl_inline__small_dot no-wrap"
+              classes: "op-work-package-card--priority __hl_inline_priority_#{work_package.priority.id} __hl_inline__small_dot no-wrap"
             )
           ) do %>
-        <span class="op-work-package-card--priority-name"><%= work_package.priority.name %></span>
+        <span class="op-work-package-card--priority-name ml-1"><%= work_package.priority.name %></span>
       <% end %>
     <% end %>
 

app/components/open_project/common/work_package_card_component.sass

@@ -38,6 +38,17 @@
   margin-bottom: var(--base-size-4)
   container-type: inline-size
 
+  .op-work-package-card--priority
+    display: inline-flex
+    align-items: center
+
+    &-name
+      display: inline-block
+      width: 90px
+      overflow: hidden
+      text-overflow: ellipsis
+      white-space: nowrap
+
   &_with-footer
     grid-template-rows: auto auto auto
     grid-template-areas: "info_line actions" "subject subject" "footer footer"