1 files changed, 27 insertions, 31 deletions
diff --git a/src/views/Settings/DateTime/DateTime.vue b/src/views/Settings/DateTime/DateTime.vue
index 7ab3ec0e..63570c39 100644
--- a/src/views/Settings/DateTime/DateTime.vue
+++ b/src/views/Settings/DateTime/DateTime.vue
@@ -1,67 +1,61 @@
 <template>
-  <b-container fluid="xxl" class="pt-0 m-0">
+  <b-container id="date-time" fluid="xxl" class="pt-0 m-0">
     <page-title />
-    <b-row class="m-4">
-      <b-col md="8" xl="12">
-        <alert variant="info">
-          <span class="regular-12px">
+    <b-row class="bootstrap-table__section">
+      <b-col md="8" xl="6">
+        <alert variant="info" class="mb-4">
+          <span>
             {{ $t('pageDateTime.alert.message') }}
-            <b-link class="semi-bold-12px" to="/profile-settings">
+            <b-link to="/profile-settings">
               {{ $t('pageDateTime.alert.link') }}</b-link
             >
           </span>
         </alert>
       </b-col>
     </b-row>
-    <page-section class="m-4">
+    <page-section class="bootstrap-table__section">
       <b-row>
-        <b-col sm="6" lg="5" xl="4" xxl="3">
+        <b-col lg="3">
           <dl>
-            <dt class="semi-bold-12px">{{ $t('pageDateTime.form.date') }}</dt>
-            <dd v-if="bmcTime" class="regular-12px">
-              {{ bmcTime | formatDate }}
-            </dd>
+            <dt>{{ $t('pageDateTime.form.date') }}</dt>
+            <dd v-if="bmcTime">{{ bmcTime | formatDate }}</dd>
             <dd v-else>--</dd>
           </dl>
         </b-col>
-        <b-col sm="6" lg="5" xl="4" xxl="3">
+        <b-col lg="3">
           <dl>
-            <dt class="semi-bold-12px">
-              {{ $t('pageDateTime.form.time.label') }}
-            </dt>
-            <dd v-if="bmcTime" class="regular-12px">
-              {{ bmcTime | formatTime }}
-            </dd>
+            <dt>{{ $t('pageDateTime.form.time.label') }}</dt>
+            <dd v-if="bmcTime">{{ bmcTime | formatTime }}</dd>
             <dd v-else>--</dd>
           </dl>
         </b-col>
       </b-row>
     </page-section>
-    <page-section class="m-4">
-      <label class="semi-bold-16px">{{
-        $t('pageDateTime.configureSettings')
-      }}</label>
+    <page-section
+      class="bootstrap-table__section"
+      :section-title="$t('pageDateTime.configureSettings')"
+    >
       <b-form novalidate @submit.prevent="submitForm">
         <b-form-group
           label="Configure date and time"
           :disabled="loading"
           label-sr-only
-          class="system-control__radio regular-12px"
         >
           <b-form-radio
             v-model="form.configurationSelected"
             value="manual"
             data-test-id="dateTime-radio-configureManual"
           >
-            {{ $t('SystemDescription.UseServerDatettime') }}
+            {{ $t('pageDateTime.form.manual') }}
           </b-form-radio>
           <b-row class="mt-3 ml-3">
-            <b-col sm="7" lg="5" xl="5" xxl="3">
+            <b-col sm="6" lg="4" xl="3">
               <b-form-group
                 :label="$t('pageDateTime.form.date')"
                 label-for="input-manual-date"
+                label-class="regular-14px"
               >
-                <span class="regular-12px">YYYY-MM-DD</span>
+                <b-form-text id="date-format-help">YYYY-MM-DD</b-form-text>
                 <b-input-group>
                   <b-form-input
                     id="input-manual-date"
@@ -105,12 +99,13 @@
                 </b-input-group>
               </b-form-group>
             </b-col>
-            <b-col sm="7" lg="5" xl="5" xxl="3">
+            <b-col sm="6" lg="4" xl="3">
               <b-form-group
                 :label="$t('pageDateTime.form.time.timezone', { timezone })"
                 label-for="input-manual-time"
+                label-class="regular-14px"
               >
-                <span class="regular-12px">HH:MM</span>
+                <b-form-text id="time-format-help">HH:MM</b-form-text>
                 <b-input-group>
                   <b-form-input
                     id="input-manual-time"
@@ -134,7 +129,6 @@
           </b-row>
           <b-form-radio
             v-model="form.configurationSelected"
-            class="system-control__radio regular-12px"
             value="ntp"
             data-test-id="dateTime-radio-configureNTP"
           >
@@ -145,6 +139,7 @@
               <b-form-group
                 :label="$t('pageDateTime.form.ntpServers.server1')"
                 label-for="input-ntp-1"
+                label-class="regular-14px"
               >
                 <b-input-group>
                   <b-form-input
@@ -167,6 +162,7 @@
               <b-form-group
                 :label="$t('pageDateTime.form.ntpServers.server2')"
                 label-for="input-ntp-2"
+                label-class="regular-14px"
               >
                 <b-input-group>
                   <b-form-input
@@ -182,6 +178,7 @@
               <b-form-group
                 :label="$t('pageDateTime.form.ntpServers.server3')"
                 label-for="input-ntp-3"
+                label-class="regular-14px"
               >
                 <b-input-group>
                   <b-form-input
@@ -195,7 +192,6 @@
             </b-col>
           </b-row>
           <b-button
-            size="md"
             variant="primary"
             type="submit"
             data-test-id="dateTime-button-saveSettings"