Merge remote-tracking branch 'upstream/pull/4297'

gravitystorm · Nov 14, 2023 · 1ce5d7d · 1ce5d7d
2 parents ab54ab9 + 562e7e7
commit 1ce5d7d
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 37 deletions.
diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
@@ -706,45 +706,16 @@ tr.turn:hover {
   }
 
   .browse-tag-list {
-    background-color: $offwhite;
     table-layout: fixed;
-    border-collapse: separate;
-    border-spacing: 0;
-    width: 100%;
-    margin-bottom: $spacer;
-
-    th, td {
-      border-bottom: 1px solid $grey;
-    }
+    white-space: pre-wrap;
 
     tr:last-child th, tr:last-child td {
       border-bottom: 0;
     }
 
-    .browse-tag-k,
-    .browse-tag-v {
-      width: 50%;
-      padding: 6px 10px;
-      word-wrap: break-word;
-      white-space: pre-wrap;
-    }
-
-    .browse-tag-k {
-      font-weight: 500;
-      background-color: $offwhite;
-    }
-
-    .browse-tag-v {
-      border-left: 1px solid $grey;
-      background-color: #fff;
-    }
-
     .colour-preview-box {
-      float: right;
       width: 14px;
       height: 14px;
-      margin: 4px 0px;
-      border: 1px solid rgba(0, 0, 0, .1);
       // add color via inline css on element: background-color: <tag value>;
     }
   }

diff --git a/app/helpers/browse_tags_helper.rb b/app/helpers/browse_tags_helper.rb
@@ -34,7 +34,7 @@ def format_value(key, value)
       end
       safe_join(phones, "; ")
     elsif colour_value = colour_preview(key, value)
-      tag.span("", :class => "colour-preview-box", :"data-colour" => colour_value, :title => t("browse.tag_details.colour_preview", :colour_value => colour_value)) + colour_value
+      tag.span("", :class => "colour-preview-box float-end m-1 border border-dark border-opacity-10", :"data-colour" => colour_value, :title => t("browse.tag_details.colour_preview", :colour_value => colour_value)) + colour_value
     else
       safe_join(value.split(";").map { |x| linkify(h(x)) }, ";")
     end

diff --git a/app/views/browse/_tag.html.erb b/app/views/browse/_tag.html.erb
@@ -1,4 +1,4 @@
 <tr>
-  <th class='browse-tag-k'><%= format_key(tag[0]) %></th>
-  <td class='browse-tag-v'><%= format_value(tag[0], tag[1]) %></td>
+  <th class='py-1 border-grey table-light fw-normal'><%= format_key(tag[0]) %></th>
+  <td class='py-1 border-grey border-start'><%= format_value(tag[0], tag[1]) %></td>
 </tr>
diff --git a/app/views/browse/_tag_details.html.erb b/app/views/browse/_tag_details.html.erb
@@ -1,6 +1,8 @@
 <% unless tag_details.empty? %>
   <h4><%= t ".tags" %></h4>
-  <table class='browse-tag-list border border-grey rounded'>
-    <%= render :partial => "tag", :collection => tag_details.sort %>
-  </table>
+  <div class='mb-3 border border-grey rounded overflow-hidden'>
+    <table class='mb-0 browse-tag-list table align-middle text-break'>
+      <%= render :partial => "tag", :collection => tag_details.sort %>
+    </table>
+  </div>
 <% end %>
diff --git a/test/helpers/browse_tags_helper_test.rb b/test/helpers/browse_tags_helper_test.rb
@@ -48,7 +48,7 @@ def test_format_value
     assert_dom_equal "<a title=\"The File:Test.jpg item on Wikimedia Commons\" href=\"//commons.wikimedia.org/wiki/File:Test.jpg?uselang=en\">File:Test.jpg</a>", html
 
     html = format_value("colour", "#f00")
-    assert_dom_equal %(<span class="colour-preview-box" data-colour="#f00" title="Colour #f00 preview"></span>#f00), html
+    assert_dom_equal %(<span class="colour-preview-box float-end m-1 border border-dark border-opacity-10" data-colour="#f00" title="Colour #f00 preview"></span>#f00), html
 
     html = format_value("email", "[email protected]")
     assert_dom_equal "<a title=\"Email [email protected]\" href=\"mailto:[email protected]\">[email protected]</a>", html