better cache all note button

src/components/FluxNote.vue

@@ -99,16 +99,18 @@ const focusREADME = () => scrollToTop()
         <a @click.prevent="focusREADME">{{ repo }}</a>
       </div>
       <div class="repo-title">
+        <div class="repo-header">
           <h1 class="title is-1">
             <router-link :to="{ name: 'FluxNoteView', params: { user, repo } }">
               {{ repo }}
             </router-link>
           </h1>
-        <h4 class="subtitle is-5">
-          <em>{{ user }}</em>
-        </h4>
           <cache-all-notes />
         </div>
+        <h2 class="subtitle is-5">
+          <em>{{ user }}</em>
+        </h2>
+      </div>
       <slot />
       <lite-loading v-if="isLoading" />
       <div v-else-if="!hasContent">No content here 📝</div>
@@ -179,6 +181,17 @@ $header-height: 40px;
     .repo-title {
       margin-top: 1rem;
 
+      .repo-header {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        gap: 1rem;
+      }
+
+      .title {
+        margin-bottom: 0;
+      }
+
       .title,
       .subtitle {
         text-align: center;

src/modules/note/components/CacheAllNote.vue

@@ -20,7 +20,7 @@ const confirmBeforeCachingAllNotes = () => {
     ></progress>
   </div>
   <button v-else class="button" @click="() => confirmBeforeCachingAllNotes()">
-    cache all notes
+    <img src="/assets/offline.svg" alt="offline cloud" />
   </button>
 </template>