fix: update settings page styles

packages/nc-gui/components/account/AppStore.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="h-full overflow-y-scroll scrollbar-thin-dull pt-2">
-    <div class="text-xl mt-4 mb-8 text-center font-weight-bold">{{ $t('title.appStore') }}</div>
+    <div class="text-xl mt-4 mb-8 text-left font-weight-bold">{{ $t('title.appStore') }}</div>
     <div>
       <LazyDashboardSettingsAppStore />
     </div>

packages/nc-gui/components/account/License.vue

@@ -40,7 +40,9 @@ loadLicense()
       <div>
         <a-textarea v-model:value="key" placeholder="License key" class="!mt-2 !max-w-[600px]"></a-textarea>
       </div>
-      <div class="text-center"><a-button class="mt-4" @click="setLicense" type="primary">Save license key</a-button></div>
+      <div class="text-center">
+        <a-button class="mt-4 !h-[2.2rem] !rounded-md" @click="setLicense" type="primary">Save license key</a-button>
+      </div>
     </div>
   </div>
 </template>

packages/nc-gui/components/account/ResetPassword.vue

@@ -65,13 +65,13 @@ const resetError = () => {
 </script>
 
 <template>
-  <div class="mx-auto relative flex flex-col justify-center gap-2 w-full px-8 md:(bg-white) max-w-[900px]">
-    <div class="text-xl mt-4 mb-8 text-center font-weight-bold">{{ $t('activity.changePwd') }}</div>
+  <div class="mx-auto relative flex flex-col justify-start gap-2 w-full px-8 md:(bg-white) max-w-[900px]">
+    <div class="text-xl my-4 text-left font-weight-bold">{{ $t('activity.changePwd') }}</div>
     <a-form
       ref="formValidator"
       data-testid="nc-user-settings-form"
       layout="vertical"
-      class="change-password lg:max-w-3/4 w-full !mx-auto"
+      class="change-password lg:max-w-3/4 w-full"
       no-style
       :model="form"
       @finish="passwordChange"
@@ -118,13 +118,13 @@ const resetError = () => {
         />
       </a-form-item>
 
-      <div class="text-center">
-        <button data-testid="nc-user-settings-form__submit" class="scaling-btn bg-opacity-100" type="submit">
-          <span class="flex items-center gap-2">
+      <div class="text-right">
+        <a-button size="middle" data-testid="nc-user-settings-form__submit" class="!rounded-md !h-[2.5rem]" type="primary">
+          <div class="flex justify-center items-center gap-2">
             <component :is="iconMap.passwordChange" />
             {{ $t('activity.changePwd') }}
-          </span>
-        </button>
+          </div>
+        </a-button>
       </div>
     </a-form>
   </div>

packages/nc-gui/components/account/Token.vue

@@ -100,8 +100,8 @@ const descriptionInput: VNodeRef = (el) => (el as HTMLInputElement)?.focus()
 
 <template>
   <div class="h-full overflow-y-scroll scrollbar-thin-dull pt-2">
-    <div class="text-xl mt-4 mb-8 text-center font-weight-bold">Token Management</div>
     <div class="max-w-[900px] mx-auto p-4" data-testid="nc-token-list">
+      <div class="text-xl my-4 text-left font-weight-bold">Token Management</div>
       <div class="py-2 flex gap-4 items-center">
         <div class="flex-grow"></div>
         <component :is="iconMap.reload" class="cursor-pointer" @click="loadTokens" />

packages/nc-gui/components/account/UserList.vue

@@ -131,8 +131,8 @@ const copyPasswordResetUrl = async (user: User) => {
 
 <template>
   <div data-testid="nc-super-user-list">
-    <div class="text-xl mt-4 mb-8 text-center font-weight-bold">User Management</div>
-    <div class="max-w-[900px] mx-auto p-4">
+    <div class="max-w-[900px] mx-auto">
+      <div class="text-xl my-4 text-left font-weight-bold">User Management</div>
       <div class="py-2 flex gap-4 items-center">
         <a-input-search
           v-model:value="searchText"