From 51ea5c1c573ebee31c68faf881c0ccf002a70846 Mon Sep 17 00:00:00 2001
From: arily <arily@arily.moe>
Date: Mon, 9 Oct 2023 14:45:18 +0800
Subject: [PATCH] remove default shadow

---
 src/assets/styles/daisyui.scss                | 11 +--
 ...locale-button.vue => nuxt-link-button.vue} |  0
 src/components/app/dynamic-settings.vue       |  2 +-
 src/components/app/score/heading.vue          |  2 +-
 src/components/app/search-modal.client.vue    |  4 +-
 .../content/editor/bubble-menu.client.vue     |  4 +-
 .../content/editor/insert-image.client.vue    | 10 +--
 .../content/editor/variables/fallback.vue     |  4 +-
 src/components/userpage/heading.vue           | 11 +--
 src/pages/admin/index.vue                     | 25 ++++--
 src/pages/admin/users.vue                     | 90 ++++++++++++++++++-
 src/pages/article/[...id].vue                 |  2 +-
 src/pages/article/edit.vue                    | 14 +--
 src/pages/auth/login.vue                      | 11 +--
 src/pages/auth/register.vue                   | 15 ++--
 src/pages/beatmapset/[id].vue                 | 14 +--
 src/pages/index.vue                           | 18 ++--
 src/pages/me/relations.vue                    |  6 +-
 src/pages/me/settings.vue                     | 30 +++----
 src/pages/user/[handle].vue                   |  4 +-
 20 files changed, 189 insertions(+), 88 deletions(-)
 rename src/components/T/{nuxt-link-locale-button.vue => nuxt-link-button.vue} (100%)

diff --git a/src/assets/styles/daisyui.scss b/src/assets/styles/daisyui.scss
index ee9bf5fb6..122dd77c4 100755
--- a/src/assets/styles/daisyui.scss
+++ b/src/assets/styles/daisyui.scss
@@ -4,24 +4,19 @@ html {
   @apply bg-transparent #{!important};
 }
 
-.btn {
+.btn.btn-shadow {
   @apply transition-shadow transition-[background];
   @apply shadow-lg;
   @apply dark:shadow-md;
   animation: none;
 
   @each $variant in $variants {
-    &.btn-#{$variant}:not(.no-shadow) {
+    &.btn-#{$variant} {
       @apply shadow-#{$variant}/40 hover:shadow-#{$variant}/60 dark:shadow-#{$variant}/20 hover:dark:shadow-#{$variant}/30;
     }
   }
-
-  &.btn-ghost,
-  &.no-shadow {
-    @apply shadow-none;
-  }
 }
-.input {
+.input.input-shadow {
   @each $variant in $variants {
     &.input-#{$variant} {
       @apply shadow-#{$variant}/40 hover:shadow-#{$variant}/50 dark:shadow-#{$variant}/20 hover:dark:shadow-#{$variant}/30;
diff --git a/src/components/T/nuxt-link-locale-button.vue b/src/components/T/nuxt-link-button.vue
similarity index 100%
rename from src/components/T/nuxt-link-locale-button.vue
rename to src/components/T/nuxt-link-button.vue
diff --git a/src/components/app/dynamic-settings.vue b/src/components/app/dynamic-settings.vue
index d59e2ceb9..6904dd51a 100644
--- a/src/components/app/dynamic-settings.vue
+++ b/src/components/app/dynamic-settings.vue
@@ -45,7 +45,7 @@ fr-FR:
           v-model="model[key]"
           :placeholder="setting.label"
           :disabled="setting.disabled"
-          class="input input-sm grow blur-sm hover:blur-none"
+          class="input input-shadow input-sm grow blur-sm hover:blur-none"
           :class="{
             'input-bordered input-primary':
               props.unchanged[key] !== model[key],
diff --git a/src/components/app/score/heading.vue b/src/components/app/score/heading.vue
index d034796e9..b4d7ce7fb 100644
--- a/src/components/app/score/heading.vue
+++ b/src/components/app/score/heading.vue
@@ -138,6 +138,6 @@ fr-FR:
     </div>
   </div>
   <div>
-    <a :href="`/replay/${score.id}/download`" class="btn btn-primary">{{ t('download-replay') }} <icon name="line-md:download-loop" class="w-5 h-5" /></a>
+    <a :href="`/replay/${score.id}/download`" class="btn btn-shadow btn-primary">{{ t('download-replay') }} <icon name="line-md:download-loop" class="w-5 h-5" /></a>
   </div>
 </template>
diff --git a/src/components/app/search-modal.client.vue b/src/components/app/search-modal.client.vue
index a66c25b33..1e4d4f20f 100644
--- a/src/components/app/search-modal.client.vue
+++ b/src/components/app/search-modal.client.vue
@@ -123,7 +123,7 @@ const {
             v-model="keyword"
             type="text"
             :placeholder="t('search')"
-            class="input grow border-label-0 focus:input-primary bg-transparent !outline-0"
+            class="input input-shadow grow border-label-0 focus:input-primary bg-transparent !outline-0"
             @input="onInput"
             @keyup.enter="raw(true)"
           >
@@ -133,7 +133,7 @@ const {
           v-model="keyword"
           type="text"
           :placeholder="t('search')"
-          class="input grow border-label-0 focus:input-primary bg-transparent !outline-0"
+          class="input input-shadow grow border-label-0 focus:input-primary bg-transparent !outline-0"
           @input="onInput"
           @keyup.enter="raw(true)"
         >
diff --git a/src/components/content/editor/bubble-menu.client.vue b/src/components/content/editor/bubble-menu.client.vue
index 4fe9fe2c4..799585629 100644
--- a/src/components/content/editor/bubble-menu.client.vue
+++ b/src/components/content/editor/bubble-menu.client.vue
@@ -61,9 +61,9 @@ function setLink() {
           <div class="card-body p-2">
             <div class="input-group input-group-sm">
               <span>URL</span>
-              <input id="url" v-model="link" type="url" class="input input-sm shadow-sm">
+              <input id="url" v-model="link" type="url" class="input input-shadow input-sm shadow-sm">
               <button
-                class="btn btn-sm btn-success" @click="() => {
+                class="btn btn-shadow btn-sm btn-success" @click="() => {
                   setLink()
                   hide()
                 }"
diff --git a/src/components/content/editor/insert-image.client.vue b/src/components/content/editor/insert-image.client.vue
index 8b55b29cf..92b5cf524 100644
--- a/src/components/content/editor/insert-image.client.vue
+++ b/src/components/content/editor/insert-image.client.vue
@@ -70,7 +70,7 @@ fr-FR:
               id="src"
               v-model="img.src"
               type="url"
-              class="input input-sm input-ghost"
+              class="input input-shadow input-sm input-ghost"
               required
             >
           </div>
@@ -82,7 +82,7 @@ fr-FR:
               id="title"
               v-model="img.title"
               type="text"
-              class="input input-sm input-ghost"
+              class="input input-shadow input-sm input-ghost"
             >
           </div>
           <div class="form-control">
@@ -92,18 +92,18 @@ fr-FR:
             <textarea
               id="description"
               v-model="img.alt"
-              class="input input-sm input-ghost"
+              class="input input-shadow input-sm input-ghost"
             />
           </div>
         </div>
         <div class="flex p-4 gap-2">
-          <t-button size="sm" variant="accent" class="grow">
+          <t-button class="btn-shadow grow" size="sm" variant="accent">
             {{ t('ok') }}
           </t-button>
           <t-button
+            class="btn-shadow grow"
             size="sm"
             variant="secondary"
-            class="grow"
             type="button"
             @click="closeModal"
           >
diff --git a/src/components/content/editor/variables/fallback.vue b/src/components/content/editor/variables/fallback.vue
index 6047754dd..31cfd41aa 100644
--- a/src/components/content/editor/variables/fallback.vue
+++ b/src/components/content/editor/variables/fallback.vue
@@ -21,8 +21,8 @@ defineExpose({
   <form action="#" @submit.prevent="send">
     <div class="card bg-gbase-100/80 backdrop-blur shadow-md p-3 gap-2">
       <label>Fallback content for <b>{{ $props.name }}</b>:</label>
-      <input ref="input" v-model="model" class="input input-sm input-primary" type="text">
-      <input type="submit" value="Save" class="btn btn-primary btn-sm">
+      <input ref="input" v-model="model" class="input input-shadow input-sm input-primary" type="text">
+      <input type="submit" value="Save" class="btn btn-shadow btn-primary btn-sm">
     </div>
   </form>
 </template>
diff --git a/src/components/userpage/heading.vue b/src/components/userpage/heading.vue
index b39aee059..aa66831bd 100755
--- a/src/components/userpage/heading.vue
+++ b/src/components/userpage/heading.vue
@@ -138,9 +138,9 @@ fr-FR:
         </p>
         <t-button
           ref="changeFriendStateButton"
+          class="btn-shadow gap-1"
           size="sm"
           :variant="isMutualFriend ? 'primary' : isFriend ? 'secondary' : 'gbase'"
-          class="gap-1"
           @click="toggleFriend"
         >
           <icon
@@ -157,7 +157,7 @@ fr-FR:
           />
           <span>{{ friendButtonContent }}</span>
         </t-button>
-        <!-- <t-button
+        <!-- <t-button class="btn-shadow"
           v-if="session.$state.loggedIn"
           size="sm"
           variant="secondary"
@@ -171,13 +171,14 @@ fr-FR:
         v-else
         class="container flex justify-around order-3 gap-3 pb-4 mx-auto md:order-1 md:justify-end md:pb-0"
       >
-        <!-- <t-button
+        <!-- <t-button class="btn-shadow"
           size="sm"
           variant="primary"
         >
           add as friend
         </t-button> -->
-        <t-nuxt-link-locale-button
+        <t-nuxt-link-button
+          class="btn-shadow"
           size="sm"
           variant="accent"
           :to="{
@@ -185,7 +186,7 @@ fr-FR:
           }"
         >
           {{ t('edit') }}
-        </t-nuxt-link-locale-button>
+        </t-nuxt-link-button>
       </div>
       <div
         class="container flex flex-col flex-wrap gap-4 mx-auto lg:flex-row lg:gap-0 sm:order-2 md:items-end md:justify-between md:pb-2"
diff --git a/src/pages/admin/index.vue b/src/pages/admin/index.vue
index a689c153e..3f99265a6 100644
--- a/src/pages/admin/index.vue
+++ b/src/pages/admin/index.vue
@@ -2,24 +2,37 @@
 const { t } = useI18n()
 </script>
 
+<i18n lang="yaml">
+en-GB:
+  user-management: User Management
+</i18n>
+
 <template>
   <div class="join">
-    <t-nuxt-link-locale-button
+    <t-nuxt-link-button
       :to="{
         name: 'article-edit',
       }"
-      class="join-item"
+      class="btn-shadow join-item"
     >
       {{ t('titles.articles') }}
-    </t-nuxt-link-locale-button>
-    <t-nuxt-link-locale-button
+    </t-nuxt-link-button>
+    <t-nuxt-link-button
       :to="{
         name: 'admin-logs',
       }"
-      class="join-item"
+      class="btn-shadow join-item"
     >
       {{ t('titles.logs') }}
-    </t-nuxt-link-locale-button>
+    </t-nuxt-link-button>
+    <t-nuxt-link-button
+      :to="{
+        name: 'admin-users',
+      }"
+      class="btn-shadow join-item"
+    >
+      {{ t('user-management') }}
+    </t-nuxt-link-button>
   </div>
 </template>
 
diff --git a/src/pages/admin/users.vue b/src/pages/admin/users.vue
index c41c1c14a..dcded1dc4 100644
--- a/src/pages/admin/users.vue
+++ b/src/pages/admin/users.vue
@@ -4,7 +4,95 @@
 
 <template>
   <div>
-    users
+    <div class="join">
+      <div>
+        <div>
+          <input class="input input-shadow input-bordered join-item" placeholder="Search">
+        </div>
+      </div>
+      <select class="select select-bordered join-item">
+        <option disabled selected>
+          Filter
+        </option>
+        <option>Sci-fi</option>
+        <option>Drama</option>
+        <option>Action</option>
+      </select>
+      <div class="indicator">
+        <span class="indicator-item badge badge-secondary">new</span>
+        <button class="btn btn-shadow join-item">
+          Search
+        </button>
+      </div>
+    </div>
+  </div>
+  <div>
+    <div class="overflow-x-auto">
+      <table class="table">
+        <!-- head -->
+        <thead>
+          <tr>
+            <th>
+              <label>
+                <input type="checkbox" class="checkbox">
+              </label>
+            </th>
+            <th>Name</th>
+            <th>Job</th>
+            <th>Favorite Color</th>
+            <th />
+          </tr>
+        </thead>
+        <tbody>
+          <!-- row 1 -->
+          <tr>
+            <th>
+              <label>
+                <input type="checkbox" class="checkbox">
+              </label>
+            </th>
+            <td>
+              <div class="flex items-center space-x-3">
+                <div class="avatar">
+                  <div class="mask mask-squircle w-12 h-12">
+                    <img src="/tailwind-css-component-profile-2@56w.png" alt="Avatar Tailwind CSS Component">
+                  </div>
+                </div>
+                <div>
+                  <div class="font-bold">
+                    Hart Hagerty
+                  </div>
+                  <div class="text-sm opacity-50">
+                    United States
+                  </div>
+                </div>
+              </div>
+            </td>
+            <td>
+              Zemlak, Daniel and Leannon
+              <br>
+              <span class="badge badge-ghost badge-sm">Desktop Support Technician</span>
+            </td>
+            <td>Purple</td>
+            <th>
+              <button class="btn btn-ghost btn-xs">
+                details
+              </button>
+            </th>
+          </tr>
+        </tbody>
+        <!-- foot -->
+        <!-- <tfoot>
+          <tr>
+            <th />
+            <th>Name</th>
+            <th>Job</th>
+            <th>Favorite Color</th>
+            <th />
+          </tr>
+        </tfoot> -->
+      </table>
+    </div>
   </div>
 </template>
 
diff --git a/src/pages/article/[...id].vue b/src/pages/article/[...id].vue
index a206b729d..61739ea1d 100644
--- a/src/pages/article/[...id].vue
+++ b/src/pages/article/[...id].vue
@@ -26,7 +26,7 @@ fr-FR:
 <template>
   <section class="container mx-auto with-editor relative">
     <content-render v-bind="content" />
-    <button v-if="content.access.write" class="btn btn-neutral d-flex gap-1 absolute top-0 right-0">
+    <button v-if="content.access.write" class="btn btn-shadow btn-neutral d-flex gap-1 absolute top-0 right-0">
       {{ t('edit') }} <icon name="ic:round-edit-note" class="w-5 h-5" />
     </button>
   </section>
diff --git a/src/pages/article/edit.vue b/src/pages/article/edit.vue
index c7e6085bb..6325804d8 100644
--- a/src/pages/article/edit.vue
+++ b/src/pages/article/edit.vue
@@ -199,18 +199,18 @@ fr-FR:
       <div>
         <div class="flex gap-2 items-baseline">
           {{ t('editing') }}: <input
-            v-model="article.slug" type="text" class="input input-sm shadow-lg" :class="{
+            v-model="article.slug" type="text" class="input input-shadow input-sm shadow-lg" :class="{
               'input-error': !article.slug,
             }"
           >
-          <button class="btn btn-sm btn-info" @click="() => { update(); postFetch() }">
+          <button class="btn btn-shadow btn-sm btn-info" @click="() => { update(); postFetch() }">
             {{ t('load') }}
           </button>
-          <button class="btn btn-sm btn-primary" @click="() => { create(); postFetch() }">
+          <button class="btn btn-shadow btn-sm btn-primary" @click="() => { create(); postFetch() }">
             {{ t('new') }}
           </button>
           <button
-            class="btn btn-sm btn-success" :class="{
+            class="btn btn-shadow btn-sm btn-success" :class="{
               'btn-disabled': !(article.slug && article.json),
             }" @click="() => { save(); postFetch() }"
           >
@@ -218,7 +218,7 @@ fr-FR:
           </button>
           <div class="divider divider-horizontal" />
           <button
-            class="btn btn-sm btn-error" :class="{
+            class="btn btn-shadow btn-sm btn-error" :class="{
               'btn-disabled': !(article.slug && access?.write),
             }" @click="() => { del().then(postFetch) }"
           >
@@ -226,10 +226,10 @@ fr-FR:
           </button>
           <div class="divider divider-horizontal" />
           <input ref="importArticleFile" type="file" hidden @change="importArticle">
-          <button class="btn btn-sm btn-primary" @click="importArticleFile?.click">
+          <button class="btn btn-shadow btn-sm btn-primary" @click="importArticleFile?.click">
             {{ t('import') }}
           </button>
-          <button class="btn btn-sm btn-secondary" @click="exportArticle">
+          <button class="btn btn-shadow btn-sm btn-secondary" @click="exportArticle">
             {{ t('export') }}
           </button>
         </div>
diff --git a/src/pages/auth/login.vue b/src/pages/auth/login.vue
index 8bcf23ea8..07047e866 100755
--- a/src/pages/auth/login.vue
+++ b/src/pages/auth/login.vue
@@ -111,7 +111,7 @@ fr-FR:
               type="user"
               autocomplete="off"
               required
-              class="w-full input input-ghost shadow-sm"
+              class="w-full input input-shadow input-ghost shadow-sm"
               :class="{ 'input-error': error }"
               :placeholder="t('user-id-email')"
             >
@@ -125,7 +125,7 @@ fr-FR:
               type="password"
               autocomplete="off"
               required
-              class="w-full input input-ghost shadow-sm"
+              class="w-full input input-shadow input-ghost shadow-sm"
               :class="{ 'input-error': error }"
               :placeholder="t('password')"
             >
@@ -135,15 +135,16 @@ fr-FR:
           </h1>
         </div>
         <div class="grid grid-cols-2 gap-2">
-          <t-nuxt-link-locale-button
+          <t-nuxt-link-button
+            class="btn-shadow"
             to="/auth/register"
             variant="accent"
             @mouseenter="registerButton = $t('global.register')"
             @mouseleave="registerButton = t('have-no-account')"
           >
             {{ registerButton }}
-          </t-nuxt-link-locale-button>
-          <button type="submit" class="btn btn-primary">
+          </t-nuxt-link-button>
+          <button type="submit" class="btn btn-shadow btn-primary">
             {{ $t('global.login') }}
           </button>
         </div>
diff --git a/src/pages/auth/register.vue b/src/pages/auth/register.vue
index 90a7dfdb9..96eff33bd 100755
--- a/src/pages/auth/register.vue
+++ b/src/pages/auth/register.vue
@@ -174,7 +174,7 @@ fr-FR:
               type="name"
               autocomplete="off"
               required
-              class="w-full input input-ghost shadow-sm"
+              class="w-full input input-shadow input-ghost shadow-sm"
               :class="{ 'input-error': error.name }"
               :placeholder="t('name')"
               @input="error.name = ''"
@@ -195,7 +195,7 @@ fr-FR:
                 required
                 :pattern="safeNamePatternStr"
                 :title="t('name-pattern')"
-                class="w-full input input-ghost shadow-sm"
+                class="w-full input input-shadow input-ghost shadow-sm"
                 :class="{ 'input-error': error.safeName }"
                 :placeholder="t('link')"
                 @input="error.safeName = ''"
@@ -214,7 +214,7 @@ fr-FR:
               type="email"
               autocomplete="off"
               required
-              class="w-full input input-ghost shadow-sm"
+              class="w-full input input-shadow input-ghost shadow-sm"
               :class="{ 'input-error': error.email }"
               :placeholder="t('email')"
               @input="error.email = ''"
@@ -234,7 +234,7 @@ fr-FR:
               required
               :pattern="pwPatternStr"
               :title="t('password-pattern')"
-              class="w-full input input-ghost shadow-sm"
+              class="w-full input input-shadow input-ghost shadow-sm"
               :class="{ 'input-error': error.password }"
               :placeholder="t('password')"
               @input="error.password = ''"
@@ -246,15 +246,16 @@ fr-FR:
         </div>
 
         <div class="grid grid-cols-2 gap-2">
-          <t-nuxt-link-locale-button
+          <t-nuxt-link-button
+            class="btn-shadow"
             :to="{ name: 'auth-login' }"
             variant="secondary"
             @mouseenter="loginButton = $t('global.login')"
             @mouseleave="loginButton = t('have-account')"
           >
             {{ loginButton }}
-          </t-nuxt-link-locale-button>
-          <button type="submit" class="btn btn-primary">
+          </t-nuxt-link-button>
+          <button type="submit" class="btn btn-shadow btn-primary">
             {{ $t('global.register') }}
           </button>
         </div>
diff --git a/src/pages/beatmapset/[id].vue b/src/pages/beatmapset/[id].vue
index 3c010058f..954bc947b 100644
--- a/src/pages/beatmapset/[id].vue
+++ b/src/pages/beatmapset/[id].vue
@@ -140,7 +140,7 @@ async function update() {
 en-GB:
   beatmapset:
     placement: '{title} by {artist}'
-    externam-links: External Links 
+    external-links: External Links
     direct-downloads: Direct downloads
     creator: Creator
     status: Status
@@ -161,7 +161,7 @@ en-GB:
 zh-CN:
   beatmapset:
     placement: "曲名:{title} \n 艺术家:{artist}"
-    externam-links: 其它链接 
+    external-links: 其它链接
     direct-downloads: 直接下载
     creator: 铺师
     status: 状态
@@ -170,9 +170,9 @@ zh-CN:
     last-update: 上次更新时间
     star-rating: 难度星级
     circle-size: 圆圈大小
-    approach-rate: 缩圈速度	
+    approach-rate: 缩圈速度
     od: 准度要求
-    hp-drain: 掉血速度	
+    hp-drain: 掉血速度
     duration: 长度
     hit-objects: 物件统计
     hit-object:
@@ -182,7 +182,7 @@ zh-CN:
 fr-FR:
   beatmapset:
     placement: '{title} par {artist}'
-    externam-links: External Links 
+    external-links: External Links
     direct-downloads: Direct downloads
     creator: Creator
     status: Status
@@ -265,14 +265,14 @@ fr-FR:
               <div v-if="links" class="pt-2">
                 <div class="w-min">
                   <t-menu>
-                    <button class="btn btn-primary btn-circle rounded-full">
+                    <button class="btn btn-shadow btn-primary btn-circle rounded-full">
                       <icon name="material-symbols:file-present-rounded" size="2em" />
                     </button>
                     <template #popper>
                       <ul class="menu menu-compact border-[1px] border-base-300/20 bg-base-200/80 w-max rounded-box">
                         <template v-if="links.external.length">
                           <li class="menu-title">
-                            <span>{{ _t('beatmapset.externam-links') }}</span>
+                            <span>{{ _t('beatmapset.external-links') }}</span>
                           </li>
                           <li v-for="{ link, label } in links.external" :key="`external-${label}`">
                             <a :href="link">{{ label }}</a>
diff --git a/src/pages/index.vue b/src/pages/index.vue
index a9a16fa93..27c0eadda 100755
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -36,7 +36,8 @@ fr-FR:
       </div>
       <div class="grid grid-cols-2 gap-2 justify-center">
         <template v-if="session.$state.loggedIn">
-          <t-nuxt-link-locale-button
+          <t-nuxt-link-button
+            class="btn-shadow"
             :to="{
               name: 'user-handle',
               params: { handle: session.$state.userId },
@@ -44,21 +45,22 @@ fr-FR:
             variant="primary"
           >
             {{ t('to-userpage') }}
-          </t-nuxt-link-locale-button>
-          <t-nuxt-link-locale-button :to="{ name: 'me-settings' }" variant="secondary">
+          </t-nuxt-link-button>
+          <t-nuxt-link-button class="btn-shadow" :to="{ name: 'me-settings' }" variant="secondary">
             {{ $t('titles.settings').toLocaleLowerCase() }}
-          </t-nuxt-link-locale-button>
+          </t-nuxt-link-button>
         </template>
         <template v-else>
-          <t-nuxt-link-locale-button :to="{ name: 'auth-login' }" variant="primary">
+          <t-nuxt-link-button class="btn-shadow" :to="{ name: 'auth-login' }" variant="primary">
             {{ $t('global.login') }}
-          </t-nuxt-link-locale-button>
-          <t-nuxt-link-locale-button
+          </t-nuxt-link-button>
+          <t-nuxt-link-button
+            class="btn-shadow"
             :to="{ name: 'auth-register' }"
             variant="secondary"
           >
             {{ $t('global.register') }}
-          </t-nuxt-link-locale-button>
+          </t-nuxt-link-button>
         </template>
       </div>
     </div>
diff --git a/src/pages/me/relations.vue b/src/pages/me/relations.vue
index 3e653c572..37a38fbe9 100644
--- a/src/pages/me/relations.vue
+++ b/src/pages/me/relations.vue
@@ -121,13 +121,13 @@ fr-FR:
                   @{{ user.safeName }}
                 </nuxt-link-locale>
                 <div class="flex gap-2 actions">
-                  <!-- <t-button variant="info" size="xs" class="md:btn-sm">
+                  <!-- <t-button class="btn-shadow" variant="info" size="xs" class="md:btn-sm">
                     chat
                   </t-button> -->
-                  <t-button :loading="pendingUser.has(user.id)" variant="warning" size="xs" class="md:btn-sm" @click="toggleFriend(user)">
+                  <t-button class="btn-shadow md:btn-sm" :loading="pendingUser.has(user.id)" variant="warning" size="xs" @click="toggleFriend(user)">
                     {{ pendingUser.has(user.id) ? '' : isFriend(user) ? t('remove-friend') : t('regret') }}
                   </t-button>
-                  <!-- <t-button :loading="pendingUser.has(user.id)" variant="warning" size="xs" class="md:btn-sm" @click="toggleBlock(user)">
+                  <!-- <t-button class="btn-shadow" :loading="pendingUser.has(user.id)" variant="warning" size="xs" class="md:btn-sm" @click="toggleBlock(user)">
                     {{ pendingUser.has(user.id) ? '' : isBlocked(user) ? 'remove block' : 'regret' }}
                   </t-button> -->
                 </div>
diff --git a/src/pages/me/settings.vue b/src/pages/me/settings.vue
index ec5a1b880..d4b95dc19 100755
--- a/src/pages/me/settings.vue
+++ b/src/pages/me/settings.vue
@@ -433,7 +433,7 @@ fr-FR:
         </div>
         <t-button
           v-if="uploadingAvatarStat !== UploadingAvatarStatus.Succeed && newAvatar"
-          class="grow"
+          class="btn-shadow grow"
           :loading="uploadingAvatarStat === UploadingAvatarStatus.Uploading"
           @click="saveAvatar"
         >
@@ -444,8 +444,8 @@ fr-FR:
           }}
         </t-button>
         <t-button
+          class="btn-shadow grow"
           :variant="uploadingAvatarStat === UploadingAvatarStatus.Succeed ? 'success' : 'gbase'"
-          class="grow"
           @click="closeModal(resetAvatar)"
         >
           {{
@@ -468,7 +468,7 @@ fr-FR:
               <input
                 v-model="changePasswordForm.oldPassword"
                 type="password"
-                class="input input-sm input-ghost"
+                class="input input-shadow input-sm input-ghost"
                 required
               >
             </div>
@@ -479,7 +479,7 @@ fr-FR:
               <input
                 v-model="changePasswordForm.newPassword"
                 type="password"
-                class="input input-sm input-ghost"
+                class="input input-shadow input-sm input-ghost"
                 required
               >
             </div>
@@ -490,20 +490,20 @@ fr-FR:
               <input
                 v-model="changePasswordForm.repeatNewPassword"
                 type="password"
-                class="input input-sm input-ghost"
+                class="input input-shadow input-sm input-ghost"
                 required
               >
             </div>
             <span class="text-error px-2">{{ changePasswordError }}</span>
           </div>
           <div class="flex p-4 gap-2">
-            <t-button size="sm" variant="accent" class="grow">
+            <t-button class="btn-shadow grow" size="sm" variant="accent">
               <icon name="ic:round-check" class="w-5 h-5" size="100%" /> {{ t('password.ok') }}
             </t-button>
             <t-button
+              class="btn-shadow grow"
               size="sm"
               variant="secondary"
-              class="grow"
               type="button"
               @click="
                 closeModal(() => {
@@ -524,7 +524,7 @@ fr-FR:
         {{ t('preferences') }}
       </div>
       <button
-        class="btn btn-sm"
+        class="btn btn-shadow btn-sm"
         :class="[
           updateResult ? 'btn-success' : 'btn-accent',
           posting ? 'loading' : '',
@@ -659,7 +659,7 @@ fr-FR:
               v-model="user.name"
               type="text"
               :placeholder="t('username')"
-              class="w-full input input-sm"
+              class="w-full input input-shadow input-sm"
               :disabled="!user.roles.includes(UserPrivilege.Supporter)"
               :class="{
                 'input-bordered input-primary': unchanged.name !== user.name,
@@ -668,7 +668,7 @@ fr-FR:
             >
             <button
               v-if="unchanged.name !== user.name"
-              class="btn btn-sm"
+              class="btn btn-shadow btn-sm"
               type="button"
               :disabled="unchanged.name === user.name"
               @click="
@@ -691,7 +691,7 @@ fr-FR:
               id="userlink"
               v-model="user.safeName"
               type="text"
-              class="input input-sm grow"
+              class="input input-shadow input-sm grow"
               disabled
               :class="{
                 'input-bordered input-primary':
@@ -700,7 +700,7 @@ fr-FR:
                   unchanged.safeName === user.safeName,
               }"
             >
-            <!-- <button class="btn btn-sm btn-secondary" type="button" disabled>
+            <!-- <button class="btn btn-shadow btn-sm btn-secondary" type="button" disabled>
               request change
             </button> -->
           </div>
@@ -719,7 +719,7 @@ fr-FR:
               v-model="user.email"
               type="email"
               placeholder="abc@123.com"
-              class="w-full input input-sm"
+              class="w-full input input-shadow input-sm"
               :class="{
                 'input-bordered input-primary': unchanged.email !== user.email,
                 'input-ghost': unchanged.email === user.email,
@@ -727,7 +727,7 @@ fr-FR:
             >
             <button
               v-show="unchanged.email !== user.email"
-              class="btn btn-sm"
+              class="btn btn-shadow btn-sm"
               type="button"
               :disabled="unchanged.email === user.email"
               @click="
@@ -760,7 +760,7 @@ fr-FR:
             <span class="pl-3 label-text">{{ t('password.literal') }}</span>
             <button
               id="#password"
-              class="btn btn-sm btn-secondary"
+              class="btn btn-shadow btn-sm btn-secondary"
               type="button"
               @click.prevent="() => changePassword?.showModal()"
             >
diff --git a/src/pages/user/[handle].vue b/src/pages/user/[handle].vue
index 4c06c03b0..e7739a7de 100755
--- a/src/pages/user/[handle].vue
+++ b/src/pages/user/[handle].vue
@@ -97,10 +97,10 @@ fr-FR:
         {{ t('unknown-error') }}
       </h2>
       <div class="grid grid-cols-2 gap-2">
-        <t-button variant="primary" @click="$router.back()">
+        <t-button class="btn-shadow" variant="primary" @click="$router.back()">
           {{ t('back') }}
         </t-button>
-        <t-button variant="secondary" @click="page.refresh">
+        <t-button class="btn-shadow" variant="secondary" @click="page.refresh">
           {{ t('retry') }}
         </t-button>
       </div>