From: Andy Allan <git@gravitystorm.co.uk>
Date: Wed, 30 Aug 2023 17:11:56 +0000 (+0100)
Subject: Use bootstrap badges to implement count-number badges
X-Git-Tag: live~1038^2
X-Git-Url: https://git.openstreetmap.org./rails.git/commitdiff_plain/1253bdcdc5dc43dc3880751a7255256c292e0ddc

Use bootstrap badges to implement count-number badges

This leaves bootstrap to take care of most aspects, while retaining
the current colours and font weights.
---

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index aa2c95a99..60a4bd59c 100644
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -204,18 +204,7 @@ nav.secondary {
   }
 
   #inboxanchor {
-    display: inline-block;
-    height: 25px;
-    margin: 3px 0 3px 3px;
     background-color: lighten($grey, 10%);
-    line-height: 20px;
-    border-radius: 3;
-  }
-
-  .dropdown-menu {
-    .count-number {
-      font-size: 14px;
-    }
   }
 }
 
@@ -329,12 +318,9 @@ body.small-nav {
 /* Utility for styling notification numbers */
 
 .count-number {
-  padding: 2px $lineheight/4;
-  border-radius: 2px;
   background: lighten($green, 30%);
-  margin: 0 2px;
-  font-size: 11px;
-  color: #333;
+  color: $gray-800;
+  font-weight: $font-weight-normal;
 }
 
 /* Rules for the message shown in place of the map when javascript is disabled */
diff --git a/app/helpers/issues_helper.rb b/app/helpers/issues_helper.rb
index dcec4990b..7bc64cb83 100644
--- a/app/helpers/issues_helper.rb
+++ b/app/helpers/issues_helper.rb
@@ -28,9 +28,9 @@ module IssuesHelper
   def open_issues_count
     count = Issue.visible_to(current_user).open.limit(100).size
     if count > 99
-      tag.span("99+", :class => "count-number")
+      tag.span("99+", :class => "badge count-number")
     elsif count.positive?
-      tag.span(count, :class => "count-number")
+      tag.span(count, :class => "badge count-number")
     end
   end
 end
diff --git a/app/views/layouts/_header.html.erb b/app/views/layouts/_header.html.erb
index a66715a75..fd2ae0a4a 100644
--- a/app/views/layouts/_header.html.erb
+++ b/app/views/layouts/_header.html.erb
@@ -97,7 +97,7 @@
           <%= link_to t("users.show.my_dashboard"), dashboard_path, :class => "dropdown-item" %>
           <%= link_to inbox_messages_path, :class => "dropdown-item" do %>
             <%= t("users.show.my messages") %>
-            <span class='count-number'><%= number_with_delimiter(current_user.new_messages.size) %></span>
+            <span class='badge count-number'><%= number_with_delimiter(current_user.new_messages.size) %></span>
           <% end %>
           <%= link_to t("users.show.my profile"), user_path(current_user), :class => "dropdown-item" %>
           <%= link_to t("users.show.my settings"), edit_account_path, :class => "dropdown-item" %>
diff --git a/app/views/layouts/_inbox.html.erb b/app/views/layouts/_inbox.html.erb
index 79a1db2da..2f5a63753 100644
--- a/app/views/layouts/_inbox.html.erb
+++ b/app/views/layouts/_inbox.html.erb
@@ -1,3 +1,3 @@
 <% if current_user.new_messages.size > 0 %>
-<span id="inboxanchor" class="count-number"><%= current_user.new_messages.size %></span>
+<span id="inboxanchor" class="badge count-number m-1"><%= current_user.new_messages.size %></span>
 <% end %>
diff --git a/app/views/users/show.html.erb b/app/views/users/show.html.erb
index 81e33dddb..6335b06d9 100644
--- a/app/views/users/show.html.erb
+++ b/app/views/users/show.html.erb
@@ -11,18 +11,18 @@
           <ul class='clearfix'>
             <li>
               <%= link_to t(".my edits"), :controller => "changesets", :action => "index", :display_name => current_user.display_name %>
-              <span class='count-number'><%= number_with_delimiter(current_user.changesets.size) %></span>
+              <span class='badge count-number'><%= number_with_delimiter(current_user.changesets.size) %></span>
             </li>
             <li>
               <%= link_to t(".my notes"), user_notes_path(@user) %>
             </li>
             <li>
               <%= link_to t(".my traces"), :controller => "traces", :action => "mine" %>
-              <span class='count-number'><%= number_with_delimiter(current_user.traces.size) %></span>
+              <span class='badge count-number'><%= number_with_delimiter(current_user.traces.size) %></span>
             </li>
             <li>
               <%= link_to t(".my diary"), :controller => "diary_entries", :action => "index", :display_name => current_user.display_name %>
-              <span class='count-number'><%= number_with_delimiter(current_user.diary_entries.size) %></span>
+              <span class='badge count-number'><%= number_with_delimiter(current_user.diary_entries.size) %></span>
             </li>
             <li>
               <%= link_to t(".my comments"), diary_comments_path(current_user) %>
@@ -34,14 +34,14 @@
             <% if current_user.blocks.exists? %>
               <li>
                 <%= link_to t(".blocks on me"), user_blocks_on_path(current_user) %>
-                <span class='count-number'><%= number_with_delimiter(current_user.blocks.active.size) %></span>
+                <span class='badge count-number'><%= number_with_delimiter(current_user.blocks.active.size) %></span>
               </li>
             <% end %>
 
             <% if can?(:create, UserBlock) and current_user.blocks_created.exists? %>
               <li>
                 <%= link_to t(".blocks by me"), user_blocks_by_path(current_user) %>
-                <span class='count-number'><%= number_with_delimiter(current_user.blocks_created.active.size) %></span>
+                <span class='badge count-number'><%= number_with_delimiter(current_user.blocks_created.active.size) %></span>
               </li>
             <% end %>
 
@@ -55,14 +55,14 @@
 
             <li>
               <%= link_to t(".edits"), :controller => "changesets", :action => "index", :display_name => @user.display_name %>
-              <span class='count-number'><%= number_with_delimiter(@user.changesets.size) %></span>
+              <span class='badge count-number'><%= number_with_delimiter(@user.changesets.size) %></span>
             </li>
             <li>
               <%= link_to t(".notes"), user_notes_path(@user) %>
             </li>
             <li>
               <%= link_to t(".traces"), :controller => "traces", :action => "index", :display_name => @user.display_name %>
-              <span class='count-number'><%= number_with_delimiter(@user.traces.size) %></span>
+              <span class='badge count-number'><%= number_with_delimiter(@user.traces.size) %></span>
             </li>
 
             <!-- Displaying another user's profile page -->
@@ -72,7 +72,7 @@
             </li>
             <li>
               <%= link_to t(".diary"), :controller => "diary_entries", :action => "index", :display_name => @user.display_name %>
-              <span class='count-number'><%= number_with_delimiter(@user.diary_entries.size) %></span>
+              <span class='badge count-number'><%= number_with_delimiter(@user.diary_entries.size) %></span>
             </li>
             <li>
               <%= link_to t(".comments"), diary_comments_path(@user) %>
@@ -90,14 +90,14 @@
             <% if @user.blocks.exists? %>
               <li>
                 <%= link_to t(".block_history"), user_blocks_on_path(@user) %>
-                <span class='count-number'><%= number_with_delimiter(@user.blocks.active.size) %></span>
+                <span class='badge count-number'><%= number_with_delimiter(@user.blocks.active.size) %></span>
               </li>
             <% end %>
 
             <% if @user.moderator? and @user.blocks_created.exists? %>
               <li>
                 <%= link_to t(".moderator_history"), user_blocks_by_path(@user) %>
-                <span class='count-number'><%= number_with_delimiter(@user.blocks_created.active.size) %></span>
+                <span class='badge count-number'><%= number_with_delimiter(@user.blocks_created.active.size) %></span>
               </li>
             <% end %>