fix: small tweaks on style

src/common/ui/style/style.css

@@ -70,8 +70,14 @@ textarea {
 h1 {
   font-size: 1.5rem;
 }
-h1, h2 {
-  margin-top: .5em;
+h2 {
+  font-size: 1.3rem;
+}
+h3 {
+  font-size: 1.1rem;
+}
+h1, h2, h3 {
+  margin-top: 1em;
   margin-bottom: .5em;
 }
 a {
@@ -244,6 +250,9 @@ li {
 .mr-2 {
   margin-right: 1em;
 }
+.mt-0 {
+  margin-top: 0;
+}
 .mt-1 {
   margin-top: .5em;
 }

src/confirm/views/app.vue

@@ -2,7 +2,7 @@
   <div class="page-confirm frame flex flex-col h-100">
     <div class="frame-block">
       <div class="flex">
-        <h1 class="hidden-sm">
+        <h1 class="mt-0 hidden-sm">
           <span v-text="i18n('labelInstall')"></span> - <span v-text="i18n('extName')"></span>
         </h1>
         <div class="flex-auto"></div>

src/options/style.css

@@ -94,6 +94,7 @@ section {
   }
   > h3 {
     position: absolute;
+    margin: 0;
     padding: 0 .2rem;
     top: -.6em;
     left: .8rem;
@@ -111,6 +112,7 @@ section {
 .tab {
   position: relative;
   padding: 1.2rem;
+  overflow-y: auto;
   background: var(--bg);
 }
 

src/options/views/tab-about.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="tab-about">
-    <h1>
+    <h1 class="mt-0">
       <span class="mr-1" v-text="i18n('labelAbout')"></span>
       <small v-text="`v${version}`"></small>
     </h1>

src/options/views/tab-settings/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="tab-settings">
-    <h1 v-text="i18n('labelSettings')"></h1>
+    <h1 class="mt-0" v-text="i18n('labelSettings')"></h1>
     <section>
       <h3 v-text="i18n('labelGeneral')"></h3>
       <div class="mb-1">