fix(ui): alignment of head-bar icon buttons

src/main/frontend/components/header.cljs

@@ -131,10 +131,10 @@
   [:div.flex.flex-row
    [:a.it.navigation.nav-left.button
     {:title "Go Back" :on-click #(js/window.history.back)}
-    svg/arrow-narrow-left]
+    (ui/icon "arrow-left")]
    [:a.it.navigation.nav-right.button
     {:title "Go Forward" :on-click #(js/window.history.forward)}
-    svg/arrow-narrow-right]])
+    (ui/icon "arrow-right")]])
 
 (rum/defc updater-tips-new-version
   [t]

src/main/frontend/components/header.css

@@ -22,12 +22,27 @@
     transition: padding-left .2s;
   }
 
+  > .r {
+    align-items: center;
+  }
+
   .it svg {
     transform: scale(0.8);
   }
 
   a.button {
     margin: 0 4px;
+    height: 30px;
+    width: 30px;
+    padding: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    opacity: .5;
+
+    .ti {
+      font-size: 20px;
+    }
   }
 
   svg.warning {

src/main/frontend/components/plugins.css

@@ -307,10 +307,10 @@
 
 .ui-items-container {
   &[data-type=toolbar] {
-    @apply flex items-center mt-1;
+    @apply flex items-center;
 
     > .injected-ui-item-toolbar {
-      @apply opacity-70 hover:opacity-100 transition-opacity;
+      @apply hover:opacity-100 transition-opacity;
     }
   }