cleaner look

src/App.vue

@@ -90,23 +90,6 @@ const filteredEntries = computed(() => {
   })
 })
 
-const completionByLanguage = computed(() => {
-  const totals: Record<string, number> = {}
-  const counts: Record<string, number> = {}
-  languages.forEach((lang) => {
-    totals[lang.code] = entries.value.length
-    counts[lang.code] = entries.value.filter((entry) => !!entry[lang.code]).length
-  })
-  return (code: Language['code']) => {
-    const total = totals[code] || 0
-    const count = counts[code] || 0
-    if (!total) {
-      return 0
-    }
-    return Math.round((count / total) * 100)
-  }
-})
-
 const hasMissingTranslations = (entry: Entry) => {
   return languages.some((lang) => !entry[lang.code])
 }
@@ -196,9 +179,13 @@ onBeforeUnmount(() => {
       <div class="header-inner">
         <div class="brand">
           <span class="brand-strong">Sanasto</span>
-          <span class="brand-light">Wiki</span>
+          <span class="brand-light">Kristillisyyden sanasto</span>
+        </div>
+        <div class="header-actions">
+          <a class="link-button" href="https://sanasto.rin.no" target="_blank" rel="noopener noreferrer">
+            Visit Sanasto Wiki
+          </a>
         </div>
-        <div class="header-actions" />
       </div>
       <div class="header-sub">
         <div class="meta-row">
@@ -327,14 +314,12 @@ onBeforeUnmount(() => {
                     {{ languages.find((lang) => lang.code === preferredLanguage)?.name || 'Primary' }}
                     <span class="th-code">{{ preferredLanguage.toUpperCase() }}</span>
                   </div>
-                  <div class="th-sub">Category / Status</div>
                 </th>
                 <th v-for="language in displayLanguages" :key="language.code">
                   <div class="th-title">
                     {{ language.name }}
                     <span class="th-code">{{ language.code.toUpperCase() }}</span>
                   </div>
-                  <div class="th-sub completion">{{ completionByLanguage(language.code) }}% complete</div>
                 </th>
               </tr>
             </thead>

src/style.css

@@ -307,6 +307,22 @@ body {
   color: var(--slate-600);
 }
 
+.link-button {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  padding: 8px 14px;
+  border-radius: 12px;
+  border: 1px solid var(--slate-200);
+  background: #ffffff;
+  color: var(--indigo-600);
+  font-size: 12px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.08em;
+  text-decoration: none;
+}
+
 .stats-row {
   display: flex;
   align-items: center;
@@ -478,11 +494,6 @@ body {
   color: #94a3b8;
 }
 
-.th-sub.completion {
-  color: var(--emerald-600);
-  font-weight: 700;
-}
-
 .entry-title {
   font-weight: 700;
   color: var(--slate-900);