Refactor Lighthouse fix

config.toml

@@ -280,7 +280,7 @@ favicon16 = "favicon-16x16.png" # favicon-16x16.png
 ###############################################################################
 
 ### To disable any of these icons set them to "false" (will default to unicode icons instead)
-#icon_search = "svgs search" # Search button in search box.
+#icon_search = "svgs svgm search" # Search button in search box.
 #icon_adjust = "svgs adjust" # Theme Switcher button in top menu. (add class svgh to change colors on hover)
 #icon_first = "svgs svgh angll" # Pagination First Page.
 #icon_prev = "svgs svgh angl" # Pagination Previous Page.

sass/abridge.scss

@@ -1366,13 +1366,16 @@ $syntax: true !default;//syntax highlighting for code blocks
   .svgs {
     width: var(--fs);
     height: var(--fs);
-    min-width: 24px;
-    min-height: 24px;
     display: inline-block;
     //overflow: hidden;
     text-align: center;
     vertical-align: middle;
   }
+  .svgm {
+    //set minimum width and height for items with insufficient spacings
+    min-width: 24px;
+    min-height: 24px;
+  }
   .fa-a:hover {
     color: var(--a3);
     opacity: 1;

templates/base.html

@@ -94,7 +94,7 @@ <h1><a href="{{ get_url(path="/", lang=lang) }}{%- if uglyurls %}/index.html{%-
 
         <div>
           {%- if config.build_search_index %}
-          {%- set icon_search=config.extra.icon_search | default(value="svgs search") %}
+          {%- set icon_search=config.extra.icon_search | default(value="svgs svgm search") %}
           <div>
             <form autocomplete=off class="js" name="goSearch" id="searchbox">
               <div class="searchd">