Replace .term sprite class with .d-flex container

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index c99fb9e4e29d5f1d5fa64314ccf692444ff12b84..71de054ce2903e8c40fd3df11336929688e3f169 100644 (file)
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -905,12 +905,6 @@ div.secondary-actions {
     /*rtl:ignore*/ background-position: -50px 0;
   }
 
-  .sprite.term {
-    margin-right: 10px;
-    vertical-align: middle;
-    display: inline-block;
-  }
-
   .sprite.node {
     /*rtl:ignore*/ background-position: -100px 0;
   }

diff --git a/app/views/site/_any_questions.html.erb b/app/views/site/_any_questions.html.erb
index 6036623f97a5bf15add0efec683f28138758173d..3458999a6dc83902d6e75095251b780c263a4622 100644 (file)
--- a/app/views/site/_any_questions.html.erb
+++ b/app/views/site/_any_questions.html.erb
@@ -1,6 +1,6 @@
-  <h2><%= t ".title" %></h2>
-  <div class='clearfix'>
-  <span class='sprite term question float-start'></span>
+<h2><%= t ".title" %></h2>
+<div class='d-flex align-items-center gap-2'>
+  <span class='flex-shrink-0 align-self-start sprite question'></span>
   <p><%= t ".paragraph_1_html", :help_link => link_to(t(".get_help_here"), help_path),
                                 :welcome_mat_link => link_to(t(".welcome_mat"), t(".welcome_mat_url")) %></p>
-  </div>
+</div>

diff --git a/app/views/site/welcome.html.erb b/app/views/site/welcome.html.erb
index ed3d6ceb3779913c47a53361635530467872dd22..a108495852a27c8fbd97e1a4a20707167b598787 100644 (file)
--- a/app/views/site/welcome.html.erb
+++ b/app/views/site/welcome.html.erb
@@ -30,27 +30,27 @@
 <p><%= t ".basic_terms.paragraph_1" %></p>
 
 <ul class='list-unstyled'>
-  <li class='mb-2'>
-    <span class='sprite term editor'></span>
+  <li class='d-flex align-items-center gap-2 mb-2'>
+    <span class='flex-shrink-0 align-self-start sprite editor'></span>
     <span><%= t ".basic_terms.an_editor_html", :editor => tag.strong(t(".basic_terms.editor")) %></span>
   </li>
-  <li class='mb-2'>
-    <span class='sprite term node'></span>
+  <li class='d-flex align-items-center gap-2 mb-2'>
+    <span class='flex-shrink-0 align-self-start sprite node'></span>
     <span><%= t ".basic_terms.a_node_html", :node => tag.strong(t(".basic_terms.node")) %></span>
   </li>
-  <li class='mb-2'>
-    <span class='sprite term way'></span>
+  <li class='d-flex align-items-center gap-2 mb-2'>
+    <span class='flex-shrink-0 align-self-start sprite way'></span>
     <span><%= t ".basic_terms.a_way_html", :way => tag.strong(t(".basic_terms.way")) %></span>
   </li>
-  <li class='mb-2'>
-    <span class='sprite term tag'></span>
+  <li class='d-flex align-items-center gap-2 mb-2'>
+    <span class='flex-shrink-0 align-self-start sprite tag'></span>
     <span><%= t ".basic_terms.a_tag_html", :tag => tag.strong(t(".basic_terms.tag")) %></span>
   </li>
 </ul>
 
-<div class='clearfix'>
-  <h2><%= t ".rules.title" %></h2>
-  <span class='sprite term rules float-start'></span>
+<h2><%= t ".rules.title" %></h2>
+<div class='d-flex align-items-center gap-2'>
+  <span class='flex-shrink-0 align-self-start sprite rules'></span>
   <p><%= t ".rules.para_1_html", :imports_link => link_to(t(".rules.imports"), t(".rules.imports_url")),
                                  :automated_edits_link => link_to(t(".rules.automated_edits"), t(".rules.automated_edits_url")) %></p>
 </div>