Fix a text alignment bug

Author: junjizhi

README.md

@@ -52,11 +52,6 @@ export default Vue.extend({
         {
           timestamp: Date.parse('2021-05-28T20:20:46.444Z'),
           title: 'Voluptate pariatur dolore laborum eu'
-        },
-        {
-          timestamp: Date.parse('2021-01-28T20:20:46.444Z'),
-          title: 'Mollit aliqua velit nostrud ipsum',
-          content: 'Magna officia est fugiat sit esse consectetur labore elit nulla duis consectetur. Et sit velit ad ipsum officia.'
         }
       ]
     }

src/bootstrap-vue-timeline.vue

@@ -18,7 +18,7 @@ export default /*#__PURE__*/{
     variant: String,
   },
   methods: {
-    bsVariant() {
+    bootstrapVariant() {
       return this.variant || 'primary'
     },
     orderedItems() {
@@ -61,15 +61,15 @@ export default /*#__PURE__*/{
       :key="item.timestamp + item.title"
       class="flex-column align-items-start"
     >
-      <div :class="`item-head ${bsVariant()}`" />
+      <div :class="`item-head ${bootstrapVariant()}`" />
       <div
         v-if="index !== itemsCount() - 1"
         class="item-tail"
       />
 
       <b-spinner
         v-if="item.spinner"
-        :variant="bsVariant()"
+        :variant="bootstrapVariant()"
         class="ml-4"
       />
 
@@ -94,7 +94,7 @@ export default /*#__PURE__*/{
           </b-tooltip>
         </div>
 
-        <small class="mb-1">
+        <small class="mb-1 item-description">
           {{ item.content || '' }}
         </small>
       </div>
@@ -134,6 +134,11 @@ export default /*#__PURE__*/{
   word-break: break-word;
 }
 
+.item-description {
+  display: block;
+  text-align: left;
+}
+
 .primary {
   background-color: #007bff;
   color: #007bff;