added setting to switch between center and left-aligned user bio

src/components/settings_modal/tabs/general_tab.vue

@@ -159,6 +159,11 @@
             {{ $t('settings.show_page_backgrounds') }}
           </BooleanSetting>
         </li>
+        <li>
+          <BooleanSetting path="centerAlignBio">
+            {{ $t('settings.center_align_bio') }}
+          </BooleanSetting>
+        </li>
         <li>
           <BooleanSetting path="stopGifs">
             {{ $t('settings.stop_gifs') }}

src/components/user_card/user_card.scss

@@ -58,7 +58,6 @@
   }
 
   &-bio {
-    text-align: start;
     display: block;
     line-height: 1.3;
     padding: 1em;

src/components/user_card/user_card.vue

@@ -299,6 +299,7 @@
         :html="user.description_html"
         :emoji="user.emoji"
         :handle-links="true"
+        :style='{"text-align": this.$store.getters.mergedConfig.centerAlignBio ? "center" : "start"}'
       />
     </div>
     <teleport to="#modal">

src/i18n/de.json

@@ -482,6 +482,7 @@
         "blocks_tab": "Blocks",
         "bot": "Dies ist ein Bot Account",
         "btnRadius": "Knöpfe",
+        "center_align_bio": "Zentrale Textausrichtung in der Bio",
         "cBlue": "Blau (Antworten, folgt dir)",
         "cGreen": "Grün (Retweet)",
         "cOrange": "Orange (Favorisieren)",

src/i18n/en.json

@@ -488,6 +488,7 @@
         "blocks_tab": "Blocks",
         "bot": "This is a bot account",
         "btnRadius": "Buttons",
+        "center_align_bio": "Center text in user bio",
         "cBlue": "Blue (Reply, follow)",
         "cGreen": "Green (Retweet)",
         "cOrange": "Orange (Favorite)",

src/modules/config.js

@@ -56,6 +56,7 @@ export const defaultState = {
   autohideFloatingPostButton: false,
   pauseOnUnfocused: true,
   displayPageBackgrounds: true,
+  centerAlignBio: false,
   stopGifs: undefined,
   replyVisibility: 'all',
   thirdColumnMode: 'notifications',