feat(search): style perf metrics

userstyles-world · Aug 27, 2021 · 9a089cf · 9a089cf
1 parent b7d7184
commit 9a089cf
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 3 deletions.
diff --git a/scss/ui/_base.scss b/scss/ui/_base.scss
@@ -263,3 +263,15 @@ label[for="remember"] {
     border: 1px solid var(--bg-4);
     > pre { border: none } // TODO: Remove when refactoring.
 }
+
+.search-perf-metrics {
+    line-height: 1.5;
+    color: var(--fg-2);
+    > :nth-child(2) {
+        padding-left: 0.25rem;
+        &::after {
+            content: '|';
+            padding: 0 0.5rem;
+        }
+    }
+}
diff --git a/views/core/search.html b/views/core/search.html
@@ -33,10 +33,10 @@ <h1>Search</h1>
 
     <section class="mt:l">
         {{ if gt (len .Styles) 0 }}
-            <h3>Metrics of search engine:</h3>
-            <div>
+            <div class="flex search-perf-metrics">
+                <span class="f:b">Metrics of search engine:</span>
                 <p>Hits: {{ .Metrics.Hits }}</p>
-                <p>TIme Spent: {{ Elapsed .Metrics.TimeSpent }}</p>
+                <p>Time Spent: {{ Elapsed .Metrics.TimeSpent }}</p>
             </div>
 
             {{/* template "partials/debug-styles" . */}}