diff --git a/app/src/App.vue b/app/src/App.vue
index 3608feb2..773da152 100644
--- a/app/src/App.vue
+++ b/app/src/App.vue
@@ -16,7 +16,7 @@
           </span>
         </BNavbarBrand>
 
-        <BNavbarNav class="ml-auto">
+        <BNavbarNav class="ms-auto">
           <li class="nav-item">
             <BButton :href="ssoLink" variant="primary" size="sm" block>
               {{ $t('user_interface_link') }} <YIcon iname="user" />
@@ -85,7 +85,7 @@
           <BNavText
             v-if="yunohost"
             id="yunohost-version"
-            class="ml-md-auto text-center"
+            class="ms-md-auto text-center"
           >
             <span v-html="$t('footer_version', yunohost)" />
           </BNavText>
diff --git a/app/src/components/CardCollapse.vue b/app/src/components/CardCollapse.vue
index 37726594..c36db2c1 100644
--- a/app/src/components/CardCollapse.vue
+++ b/app/src/components/CardCollapse.vue
@@ -9,7 +9,7 @@
             class="card-collapse-button"
           >
             {{ title }}
-            <YIcon class="ml-auto" iname="chevron-right" />
+            <YIcon class="ms-auto" iname="chevron-right" />
           </BButton>
         </h2>
       </slot>
diff --git a/app/src/components/QueryHeader.vue b/app/src/components/QueryHeader.vue
index 91a1c194..456a437d 100644
--- a/app/src/components/QueryHeader.vue
+++ b/app/src/components/QueryHeader.vue
@@ -15,12 +15,12 @@
     <div v-if="request.errors || request.warnings">
       <!-- WEBSOCKET ERRORS COUNT -->
       <span class="count" v-if="request.errors">
-        {{ request.errors }}<YIcon iname="bug" class="text-danger ml-1" />
+        {{ request.errors }}<YIcon iname="bug" class="text-danger ms-1" />
       </span>
       <!-- WEBSOCKET WARNINGS COUNT -->
       <span class="count" v-if="request.warnings">
         {{ request.warnings
-        }}<YIcon iname="warning" class="text-warning ml-1" />
+        }}<YIcon iname="warning" class="text-warning ms-1" />
       </span>
     </div>
 
@@ -29,7 +29,7 @@
       v-if="showError && request.error"
       size="sm"
       pill
-      class="error-btn ml-auto py-0"
+      class="error-btn ms-auto py-0"
       variant="danger"
       @click="reviewError"
     >
@@ -40,7 +40,7 @@
     <time
       v-if="showTime"
       :datetime="hour(request.date)"
-      :class="request.error ? 'ml-2' : 'ml-auto'"
+      :class="request.error ? 'ms-2' : 'ms-auto'"
     >
       {{ hour(request.date) }}
     </time>
diff --git a/app/src/components/RecursiveListGroup.vue b/app/src/components/RecursiveListGroup.vue
index 9a781ce9..9c564536 100644
--- a/app/src/components/RecursiveListGroup.vue
+++ b/app/src/components/RecursiveListGroup.vue
@@ -15,7 +15,7 @@
           :aria-expanded="node.data.opened ? 'true' : 'false'"
           :aria-controls="'collapse-' + node.id"
           :class="node.data.opened ? 'not-collapsed' : 'collapsed'"
-          class="ml-2"
+          class="ms-2"
           @click.stop="node.data.opened = !node.data.opened"
         >
           <span class="sr-only">{{ toggleText }}</span>
diff --git a/app/src/components/globals/FormField.vue b/app/src/components/globals/FormField.vue
index e08692e7..7a6d4d00 100644
--- a/app/src/components/globals/FormField.vue
+++ b/app/src/components/globals/FormField.vue
@@ -28,7 +28,7 @@
       <!-- Render description -->
       <template v-if="description || link">
         <div class="d-flex">
-          <BLink v-if="link" :to="link" :href="link.href" class="ml-auto">
+          <BLink v-if="link" :to="link" :href="link.href" class="ms-auto">
             {{ link.text }}
           </BLink>
         </div>
diff --git a/app/src/components/globals/YAlert.vue b/app/src/components/globals/YAlert.vue
index 5cc9a853..2032c42a 100644
--- a/app/src/components/globals/YAlert.vue
+++ b/app/src/components/globals/YAlert.vue
@@ -6,7 +6,7 @@
     :class="{ ['alert alert-' + variant]: !alert }"
     class="yuno-alert d-flex flex-column flex-md-row align-items-center"
   >
-    <YIcon :iname="_icon" class="mr-md-3 mb-md-0 mb-2 md" />
+    <YIcon :iname="_icon" class="me-md-3 mb-md-0 mb-2 md" />
 
     <div class="w-100">
       <slot name="default" />
diff --git a/app/src/components/globals/YCard.vue b/app/src/components/globals/YCard.vue
index edf6c5b5..a7556429 100644
--- a/app/src/components/globals/YCard.vue
+++ b/app/src/components/globals/YCard.vue
@@ -4,7 +4,7 @@
       <div class="w-100 d-flex align-items-center flex-wrap custom-header">
         <slot name="header">
           <Component :is="titleTag" class="custom-header-title">
-            <YIcon v-if="icon" :iname="icon" class="mr-2" />{{ title }}
+            <YIcon v-if="icon" :iname="icon" class="me-2" />{{ title }}
           </Component>
           <slot name="header-next" />
         </slot>
@@ -13,7 +13,7 @@
           v-if="hasButtons"
           class="mt-2 w-100 custom-header-buttons"
           :class="{
-            [`ml-${buttonUnbreak}-auto mt-${buttonUnbreak}-0 w-${buttonUnbreak}-auto`]:
+            [`ms-${buttonUnbreak}-auto mt-${buttonUnbreak}-0 w-${buttonUnbreak}-auto`]:
               buttonUnbreak,
           }"
         >
@@ -26,11 +26,11 @@
         @click="visible = !visible"
         size="sm"
         variant="outline-secondary"
-        class="align-self-center ml-auto"
+        class="align-self-center ms-auto"
         :class="{
           'not-collapsed': visible,
           collapsed: !visible,
-          [`ml-${buttonUnbreak}-2`]: buttonUnbreak,
+          [`ms-${buttonUnbreak}-2`]: buttonUnbreak,
         }"
       >
         <YIcon iname="chevron-right" />
diff --git a/app/src/components/globals/formItems/ButtonItem.vue b/app/src/components/globals/formItems/ButtonItem.vue
index 5bd09ad9..bac85799 100644
--- a/app/src/components/globals/formItems/ButtonItem.vue
+++ b/app/src/components/globals/formItems/ButtonItem.vue
@@ -6,7 +6,7 @@
     :disabled="!enabled"
     class="d-block mb-3"
   >
-    <YIcon :iname="icon_" class="mr-2" />
+    <YIcon :iname="icon_" class="me-2" />
     <span v-html="label" />
   </BButton>
 </template>
diff --git a/app/src/components/globals/formItems/ReadOnlyAlertItem.vue b/app/src/components/globals/formItems/ReadOnlyAlertItem.vue
index aa70ea26..851bfafb 100644
--- a/app/src/components/globals/formItems/ReadOnlyAlertItem.vue
+++ b/app/src/components/globals/formItems/ReadOnlyAlertItem.vue
@@ -4,7 +4,7 @@
     :variant="type"
     show
   >
-    <YIcon :iname="icon_" class="mr-md-3 mb-md-0 mb-2" :variant="type" />
+    <YIcon :iname="icon_" class="me-md-3 mb-md-0 mb-2" :variant="type" />
 
     <VueShowdown :markdown="label" tag="span" class="markdown" />
   </BAlert>
diff --git a/app/src/components/globals/skeletons/CardFormSkeleton.vue b/app/src/components/globals/skeletons/CardFormSkeleton.vue
index 4cf810cf..9b9cae02 100644
--- a/app/src/components/globals/skeletons/CardFormSkeleton.vue
+++ b/app/src/components/globals/skeletons/CardFormSkeleton.vue
@@ -23,7 +23,7 @@
           >
             <BSkeleton width="100%" height="38px" />
 
-            <BSkeleton width="38px" height="38px" class="ml-2" />
+            <BSkeleton width="38px" height="38px" class="ms-2" />
           </div>
 
           <BSkeleton v-else width="100%" height="38px" />
diff --git a/app/src/components/globals/skeletons/CardListSkeleton.vue b/app/src/components/globals/skeletons/CardListSkeleton.vue
index 0726603b..277b3756 100644
--- a/app/src/components/globals/skeletons/CardListSkeleton.vue
+++ b/app/src/components/globals/skeletons/CardListSkeleton.vue
@@ -10,7 +10,7 @@
           <BSkeleton
             :width="randint(50, 100) + '%'"
             height="24px"
-            class="mr-3"
+            class="me-3"
           />
         </div>
         <BSkeleton :width="randint(30, 80) + '%'" height="24px" class="m-0" />
diff --git a/app/src/views/HomeView.vue b/app/src/views/HomeView.vue
index ae303438..514bfdd4 100644
--- a/app/src/views/HomeView.vue
+++ b/app/src/views/HomeView.vue
@@ -6,9 +6,9 @@
         :key="item.routeName"
         :to="{ name: item.routeName }"
       >
-        <YIcon :iname="item.icon" class="lg ml-1" />
+        <YIcon :iname="item.icon" class="lg ms-1" />
         <h4>{{ $t(item.translation) }}</h4>
-        <YIcon iname="chevron-right" class="lg fs-sm ml-auto" />
+        <YIcon iname="chevron-right" class="lg fs-sm ms-auto" />
       </BListGroupItem>
     </BListGroup>
   </div>
diff --git a/app/src/views/_partials/DomainForm.vue b/app/src/views/_partials/DomainForm.vue
index 28de1fba..8fe71730 100644
--- a/app/src/views/_partials/DomainForm.vue
+++ b/app/src/views/_partials/DomainForm.vue
@@ -26,7 +26,7 @@
     <BCollapse id="collapse-domain" v-model:visible="domainIsVisible">
       <p class="mt-2 alert alert-info">
         <YIcon iname="info-circle" />
-        <span class="pl-1" v-html="$t('domain.add.from_registrar_desc')" />
+        <span class="ps-1" v-html="$t('domain.add.from_registrar_desc')" />
       </p>
 
       <FormField
@@ -53,7 +53,7 @@
     <BCollapse id="collapse-dynDomain" v-model:visible="dynDomainIsVisible">
       <p class="mt-2 alert alert-info">
         <YIcon iname="info-circle" />
-        <span class="pl-1" v-html="$t('domain.add.from_yunohost_desc')" />
+        <span class="ps-1" v-html="$t('domain.add.from_yunohost_desc')" />
       </p>
 
       <FormField
@@ -98,7 +98,7 @@
     <BCollapse id="collapse-localDomain" v-model:visible="localDomainIsVisible">
       <p class="mt-2 alert alert-info">
         <YIcon iname="info-circle" />
-        <span class="pl-1" v-html="$t('domain.add.from_local_desc')" />
+        <span class="ps-1" v-html="$t('domain.add.from_local_desc')" />
       </p>
 
       <FormField
diff --git a/app/src/views/_partials/HistoryConsole.vue b/app/src/views/_partials/HistoryConsole.vue
index e3bd1b17..73ab25e0 100644
--- a/app/src/views/_partials/HistoryConsole.vue
+++ b/app/src/views/_partials/HistoryConsole.vue
@@ -25,7 +25,7 @@
         v-if="lastAction"
         size="sm"
         pill
-        class="ml-auto py-0"
+        class="ms-auto py-0"
         :variant="open ? 'light' : 'best'"
         @click.prevent="onLastActionClick"
         @keyup.enter.space.prevent="onLastActionClick"
@@ -35,7 +35,7 @@
       <QueryHeader
         v-if="lastAction"
         :request="lastAction"
-        class="w-auto ml-2 xs-hide"
+        class="w-auto ms-2 xs-hide"
       />
     </BCardHeader>
 
@@ -50,7 +50,7 @@
           v-for="(action, i) in history"
           :key="i"
           no-body
-          class="rounded-0 rounded-top border-left-0 border-right-0"
+          class="rounded-0 rounded-top border-start-0 border-right-0"
         >
           <!-- ACTION -->
           <BCardHeader
diff --git a/app/src/views/_partials/ReconnectingDisplay.vue b/app/src/views/_partials/ReconnectingDisplay.vue
index 65e94c4a..be8094c6 100644
--- a/app/src/views/_partials/ReconnectingDisplay.vue
+++ b/app/src/views/_partials/ReconnectingDisplay.vue
@@ -22,7 +22,7 @@
         <BButton
           variant="success"
           v-t="'retry'"
-          class="ml-auto"
+          class="ms-auto"
           @click="tryToReconnect()"
         />
       </div>
diff --git a/app/src/views/app/AppCatalog.vue b/app/src/views/app/AppCatalog.vue
index 40ded865..ba5b1c40 100644
--- a/app/src/views/app/AppCatalog.vue
+++ b/app/src/views/app/AppCatalog.vue
@@ -120,7 +120,7 @@
 
               <small
                 v-if="app.state !== 'working' || app.high_quality"
-                class="d-flex align-items-center ml-2 position-relative"
+                class="d-flex align-items-center ms-2 position-relative"
               >
                 <BBadge
                   v-if="app.state !== 'working'"
@@ -195,11 +195,11 @@
       <BCardGroup deck>
         <BCard v-for="i in 15" :key="i" no-body style="min-height: 10rem">
           <div class="d-flex w-100 mt-auto">
-            <BSkeleton width="30px" height="30px" class="mr-2 ml-auto" />
+            <BSkeleton width="30px" height="30px" class="me-2 ms-auto" />
             <BSkeleton
               :width="randint(30, 70) + '%'"
               height="30px"
-              class="mr-auto"
+              class="me-auto"
             />
           </div>
           <BSkeleton
diff --git a/app/src/views/app/AppInfo.vue b/app/src/views/app/AppInfo.vue
index 435074de..4226ffd8 100644
--- a/app/src/views/app/AppInfo.vue
+++ b/app/src/views/app/AppInfo.vue
@@ -20,7 +20,7 @@
         <BButton
           variant="primary"
           size="sm"
-          class="ml-auto mr-2"
+          class="ms-auto me-2"
           @click="dismissNotification('post_install')"
         >
           <YIcon iname="check" />
@@ -51,7 +51,7 @@
         <BButton
           variant="primary"
           size="sm"
-          class="ml-auto mr-2"
+          class="ms-auto me-2"
           @click="dismissNotification('post_upgrade')"
         >
           <YIcon iname="check" />
@@ -83,7 +83,7 @@
           :href="app.url"
           target="_blank"
           variant="success"
-          class="ml-auto mr-2"
+          class="ms-auto me-2"
         >
           <YIcon iname="external-link" />
           {{ $t('app.open_this_app') }}
@@ -93,7 +93,7 @@
           v-b-modal.uninstall-modal
           id="uninstall"
           variant="danger"
-          :class="{ 'ml-auto': !app.url }"
+          :class="{ 'ms-auto': !app.url }"
         >
           <YIcon iname="trash-o" />
           {{ $t('uninstall') }}
@@ -196,7 +196,7 @@
             size="sm"
             :to="{ name: 'group-list' }"
             variant="info"
-            class="ml-2"
+            class="ms-2"
           >
             <YIcon iname="key-modern" />
             {{ $t('groups_and_permissions_manage') }}
@@ -274,7 +274,7 @@
       <BTabs card fill pills>
         <BTab v-for="[name, content] in app.doc.admin" :key="name">
           <template #title>
-            <YIcon iname="book" class="mr-2" />
+            <YIcon iname="book" class="me-2" />
             {{ name === 'admin' ? $t('app.doc.admin.title') : name }}
           </template>
           <VueShowdown :markdown="content" />
@@ -331,7 +331,7 @@
       <BListGroup flush>
         <YListGroupItem v-for="[key, link] in app.links" :key="key" no-status>
           <BLink :href="link" target="_blank">
-            <YIcon :iname="appLinksIcons(key)" class="mr-1" />
+            <YIcon :iname="appLinksIcons(key)" class="me-1" />
             {{ $t('app.links.' + key) }}
           </BLink>
         </YListGroupItem>
diff --git a/app/src/views/app/AppInstall.vue b/app/src/views/app/AppInstall.vue
index 4922d953..e6a4b6d8 100644
--- a/app/src/views/app/AppInstall.vue
+++ b/app/src/views/app/AppInstall.vue
@@ -12,7 +12,7 @@
             :href="app.demo"
             target="_blank"
             variant="primary"
-            class="ml-auto"
+            class="ms-auto"
           >
             <YIcon iname="external-link" />
             {{ $t('app.install.try_demo') }}
@@ -90,7 +90,7 @@
         <BListGroup flush>
           <YListGroupItem v-for="[key, link] in app.links" :key="key" no-status>
             <BLink :href="link" target="_blank">
-              <YIcon :iname="appLinksIcons(key)" class="mr-1" />
+              <YIcon :iname="appLinksIcons(key)" class="me-1" />
               {{ $t('app.links.' + key) }}
             </BLink>
           </YListGroupItem>
@@ -105,7 +105,7 @@
           <dl class="antifeatures">
             <div v-for="antifeature in app.antifeatures" :key="antifeature.id">
               <dt class="d-inline">
-                <YIcon :iname="antifeature.icon" class="md mr-1" />
+                <YIcon :iname="antifeature.icon" class="md me-1" />
                 {{ antifeature.title }}:
               </dt>
               <dd class="d-inline">
diff --git a/app/src/views/app/AppList.vue b/app/src/views/app/AppList.vue
index 20a2bbbf..890a9792 100644
--- a/app/src/views/app/AppList.vue
+++ b/app/src/views/app/AppList.vue
@@ -19,7 +19,7 @@
         v-for="{ id, description, label } in filteredApps"
         :key="id"
         :to="{ name: 'app-info', params: { id } }"
-        class="d-flex justify-content-between align-items-center pr-0"
+        class="d-flex justify-content-between align-items-center pe-0"
       >
         <div>
           <h5 class="font-weight-bold">
@@ -31,7 +31,7 @@
           </p>
         </div>
 
-        <YIcon iname="chevron-right" class="lg fs-sm ml-auto" />
+        <YIcon iname="chevron-right" class="lg fs-sm ms-auto" />
       </BListGroupItem>
     </BListGroup>
   </ViewSearch>
diff --git a/app/src/views/backup/BackupCreate.vue b/app/src/views/backup/BackupCreate.vue
index 578faefe..699cd8b0 100644
--- a/app/src/views/backup/BackupCreate.vue
+++ b/app/src/views/backup/BackupCreate.vue
@@ -19,7 +19,7 @@
           >
             <h4 class="m-0"><YIcon iname="cube" /> {{ $t('system') }}</h4>
 
-            <div class="ml-sm-auto mt-2 mt-sm-0">
+            <div class="ms-sm-auto mt-2 mt-sm-0">
               <BButton
                 @click="toggleSelected(true, 'system')"
                 v-t="'select_all'"
@@ -32,7 +32,7 @@
                 v-t="'select_none'"
                 size="sm"
                 variant="outline-dark"
-                class="ml-2"
+                class="ms-2"
               />
             </div>
           </BListGroupItem>
@@ -41,9 +41,9 @@
           <BListGroupItem
             v-for="(item, partName) in system"
             :key="partName"
-            class="d-flex justify-content-between align-items-center pr-0"
+            class="d-flex justify-content-between align-items-center pe-0"
           >
-            <div class="mr-2">
+            <div class="me-2">
               <h5 class="font-weight-bold">
                 {{ item.name }}
               </h5>
@@ -67,7 +67,7 @@
               <YIcon iname="cubes" /> {{ $t('applications') }}
             </h4>
 
-            <div class="ml-sm-auto mt-2 mt-sm-0">
+            <div class="ms-sm-auto mt-2 mt-sm-0">
               <BButton
                 @click="toggleSelected(true, 'apps')"
                 v-t="'select_all'"
@@ -80,7 +80,7 @@
                 v-t="'select_none'"
                 size="sm"
                 variant="outline-dark"
-                class="ml-2"
+                class="ms-2"
               />
             </div>
           </BListGroupItem>
@@ -89,9 +89,9 @@
           <BListGroupItem
             v-for="(item, appName) in apps"
             :key="appName"
-            class="d-flex justify-content-between align-items-center pr-0"
+            class="d-flex justify-content-between align-items-center pe-0"
           >
-            <div class="mr-2">
+            <div class="me-2">
               <h5 class="font-weight-bold">
                 {{ item.name }}
                 <small class="text-secondary">{{ item.id }}</small>
diff --git a/app/src/views/backup/BackupInfo.vue b/app/src/views/backup/BackupInfo.vue
index f4af06bd..7d119126 100644
--- a/app/src/views/backup/BackupInfo.vue
+++ b/app/src/views/backup/BackupInfo.vue
@@ -68,9 +68,9 @@
           <BListGroupItem
             v-for="(item, partName) in system"
             :key="partName"
-            class="d-flex justify-content-between align-items-center pr-0"
+            class="d-flex justify-content-between align-items-center pe-0"
           >
-            <div class="mr-2">
+            <div class="me-2">
               <h5 class="font-weight-bold">
                 {{ item.name }}
                 <small class="text-secondary" v-if="item.size">
@@ -89,9 +89,9 @@
           <BListGroupItem
             v-for="(item, appName) in apps"
             :key="appName"
-            class="d-flex justify-content-between align-items-center pr-0"
+            class="d-flex justify-content-between align-items-center pe-0"
           >
-            <div class="mr-2">
+            <div class="me-2">
               <h5 class="font-weight-bold">
                 {{ item.name }}
                 <small class="text-secondary">
diff --git a/app/src/views/backup/BackupList.vue b/app/src/views/backup/BackupList.vue
index 875f3390..96cbce56 100644
--- a/app/src/views/backup/BackupList.vue
+++ b/app/src/views/backup/BackupList.vue
@@ -25,7 +25,7 @@
         :key="name"
         :to="{ name: 'backup-info', params: { name, id } }"
         :title="readableDate(created_at)"
-        class="d-flex justify-content-between align-items-center pr-0"
+        class="d-flex justify-content-between align-items-center pe-0"
       >
         <div>
           <h5 class="font-weight-bold">
@@ -38,7 +38,7 @@
             {{ path }}
           </p>
         </div>
-        <YIcon iname="chevron-right" class="lg fs-sm ml-auto" />
+        <YIcon iname="chevron-right" class="lg fs-sm ms-auto" />
       </BListGroupItem>
     </BListGroup>
   </ViewBase>
diff --git a/app/src/views/backup/BackupView.vue b/app/src/views/backup/BackupView.vue
index b81f6ff6..164447d3 100644
--- a/app/src/views/backup/BackupView.vue
+++ b/app/src/views/backup/BackupView.vue
@@ -5,7 +5,7 @@
         v-for="{ id, name, uri } in storages"
         :key="id"
         :to="{ name: 'backup-list', params: { id } }"
-        class="d-flex justify-content-between align-items-center pr-0"
+        class="d-flex justify-content-between align-items-center pe-0"
       >
         <div>
           <h5 class="font-weight-bold">
@@ -16,7 +16,7 @@
             {{ uri }}
           </p>
         </div>
-        <YIcon iname="chevron-right" class="lg fs-sm ml-auto" />
+        <YIcon iname="chevron-right" class="lg fs-sm ms-auto" />
       </BListGroupItem>
     </BListGroup>
   </div>
diff --git a/app/src/views/diagnosis/DiagnosisView.vue b/app/src/views/diagnosis/DiagnosisView.vue
index 1e99f9d3..29dceb19 100644
--- a/app/src/views/diagnosis/DiagnosisView.vue
+++ b/app/src/views/diagnosis/DiagnosisView.vue
@@ -86,9 +86,9 @@
           :faded="item.ignored"
         >
           <div class="item-button d-flex align-items-center">
-            <p class="mb-0 mr-2" v-html="item.summary" />
+            <p class="mb-0 me-2" v-html="item.summary" />
 
-            <div class="d-flex flex-column flex-lg-row ml-auto">
+            <div class="d-flex flex-column flex-lg-row ms-auto">
               <BButton
                 v-if="item.ignored"
                 size="sm"
@@ -109,7 +109,7 @@
                 v-if="item.details"
                 size="sm"
                 variant="outline-dark"
-                class="ml-lg-2 mt-2 mt-lg-0"
+                class="ms-lg-2 mt-2 mt-lg-0"
                 v-b-toggle="`collapse-${report.id}-item-${i}`"
               >
                 <YIcon iname="level-down" /> {{ $t('details') }}
@@ -121,7 +121,7 @@
             v-if="item.details"
             :id="`collapse-${report.id}-item-${i}`"
           >
-            <ul class="mt-2 pl-4">
+            <ul class="mt-2 ps-4">
               <li
                 v-for="(detail, index) in item.details"
                 :key="index"
diff --git a/app/src/views/domain/DomainInfo.vue b/app/src/views/domain/DomainInfo.vue
index 824e0da5..74821d6c 100644
--- a/app/src/views/domain/DomainInfo.vue
+++ b/app/src/views/domain/DomainInfo.vue
@@ -48,7 +48,7 @@
 
       <!-- DOMAIN CERT AUTHORITY -->
       <DescriptionRow :term="$t('domain.info.certificate_authority')">
-        <YIcon :iname="cert.icon" :variant="cert.variant" class="mr-1" />
+        <YIcon :iname="cert.icon" :variant="cert.variant" class="me-1" />
         {{ $t('domain.cert.types.' + cert.authority) }}
         <span class="text-secondary px-2">
           ({{
@@ -83,7 +83,7 @@
             v-for="app in domain.apps"
             :key="app.id"
             size="sm"
-            class="mr-2 mb-2"
+            class="me-2 mb-2"
           >
             <BButton
               class="py-0 font-weight-bold"
diff --git a/app/src/views/domain/DomainList.vue b/app/src/views/domain/DomainList.vue
index c95a96bf..b42367a1 100644
--- a/app/src/views/domain/DomainList.vue
+++ b/app/src/views/domain/DomainList.vue
@@ -22,7 +22,7 @@
     >
       <template #default="{ data, parent }">
         <div class="w-100 d-flex justify-content-between align-items-center">
-          <h5 class="mr-3">
+          <h5 class="me-3">
             <BLink :to="data.to" class="text-body text-decoration-none">
               <span class="font-weight-bold">
                 {{ data.name.replace(parent ? parent.data.name : null, '') }}
@@ -35,7 +35,7 @@
             <small
               v-if="data.name === mainDomain"
               :title="$t('domain.types.main_domain')"
-              class="ml-1"
+              class="ms-1"
               v-b-tooltip.hover
             >
               <YIcon iname="star" />
diff --git a/app/src/views/service/ServiceList.vue b/app/src/views/service/ServiceList.vue
index 8d0731e2..8ee867d5 100644
--- a/app/src/views/service/ServiceList.vue
+++ b/app/src/views/service/ServiceList.vue
@@ -18,7 +18,7 @@
         } in filteredServices"
         :key="name"
         :to="{ name: 'service-info', params: { name } }"
-        class="d-flex justify-content-between align-items-center pr-0"
+        class="d-flex justify-content-between align-items-center pe-0"
       >
         <div>
           <h5 class="font-weight-bold">
@@ -36,7 +36,7 @@
           </p>
         </div>
 
-        <YIcon iname="chevron-right" class="lg fs-sm ml-auto" />
+        <YIcon iname="chevron-right" class="lg fs-sm ms-auto" />
       </BListGroupItem>
     </BListGroup>
   </ViewSearch>
diff --git a/app/src/views/tool/ToolList.vue b/app/src/views/tool/ToolList.vue
index 8c4cead2..2424d6d8 100644
--- a/app/src/views/tool/ToolList.vue
+++ b/app/src/views/tool/ToolList.vue
@@ -6,9 +6,9 @@
       :key="item.routeName"
       :to="{ name: item.routeName }"
     >
-      <YIcon :iname="item.icon" class="lg ml-1" />
+      <YIcon :iname="item.icon" class="lg ms-1" />
       <h4>{{ $t(item.translation) }}</h4>
-      <YIcon iname="chevron-right" class="lg fs-sm ml-auto" />
+      <YIcon iname="chevron-right" class="lg fs-sm ms-auto" />
     </BListGroupItem>
   </BListGroup>
 </template>
diff --git a/app/src/views/tool/ToolLogs.vue b/app/src/views/tool/ToolLogs.vue
index 62724a6b..c263c133 100644
--- a/app/src/views/tool/ToolLogs.vue
+++ b/app/src/views/tool/ToolLogs.vue
@@ -16,7 +16,7 @@
           :to="{ name: 'tool-log', params: { name: log.name || log.log_path } }"
           :title="readableDate(log.started_at)"
         >
-          <small class="mr-3">{{ distanceToNow(log.started_at) }} </small>
+          <small class="me-3">{{ distanceToNow(log.started_at) }} </small>
           <YIcon :iname="log.icon" :class="'text-' + log.class" />
           {{ log.description }}
         </BListGroupItem>
diff --git a/app/src/views/tool/ToolMigrations.vue b/app/src/views/tool/ToolMigrations.vue
index bba1f253..1b42b7c1 100644
--- a/app/src/views/tool/ToolMigrations.vue
+++ b/app/src/views/tool/ToolMigrations.vue
@@ -22,7 +22,7 @@
           <div class="d-flex align-items-center">
             {{ number }}. {{ description }}
 
-            <div class="ml-auto">
+            <div class="ms-auto">
               <BButton @click="skipMigration(id)" size="sm" variant="warning">
                 <YIcon iname="close" /> {{ $t('skip') }}
               </BButton>
diff --git a/app/src/views/user/UserList.vue b/app/src/views/user/UserList.vue
index 2622c4ea..ffdcdd00 100644
--- a/app/src/views/user/UserList.vue
+++ b/app/src/views/user/UserList.vue
@@ -35,7 +35,7 @@
         v-for="user in filteredUsers"
         :key="user.username"
         :to="{ name: 'user-info', params: { name: user.username } }"
-        class="d-flex justify-content-between align-items-center pr-0"
+        class="d-flex justify-content-between align-items-center pe-0"
       >
         <div>
           <h5 class="font-weight-bold">
@@ -46,7 +46,7 @@
             {{ user.mail }}
           </p>
         </div>
-        <YIcon iname="chevron-right" class="lg fs-sm ml-auto" />
+        <YIcon iname="chevron-right" class="lg fs-sm ms-auto" />
       </BListGroupItem>
     </BListGroup>
   </ViewSearch>