refactor: card header title spacing

Author: xidedix

src/views/notifications/Alerts.vue

@@ -69,8 +69,7 @@
             header-tag="header"
             footer-tag="footer">
             <div slot="header">
-              <i class="fa fa-align-justify"></i>Alerts
-              <small>with additional content</small>
+              <i class="fa fa-align-justify"></i> Alerts <small>with additional content</small>
             </div>
             <b-alert show variant="success">
               <h4 class="alert-heading">Well done!</h4>
@@ -91,8 +90,7 @@
             header-tag="header"
             footer-tag="footer">
             <div slot="header">
-              <i class="fa fa-align-justify"></i>Alerts
-              <small>dismissible</small>
+              <i class="fa fa-align-justify"></i> Alerts <small>dismissible</small>
             </div>
             <div>
               <b-alert show dismissible>
@@ -113,8 +111,7 @@
             header-tag="header"
             footer-tag="footer">
             <div slot="header">
-              <i class="fa fa-align-justify"></i>Alerts
-              <small>auto dismissible</small>
+              <i class="fa fa-align-justify"></i> Alerts <small>auto dismissible</small>
             </div>
             <div>
               <b-alert :show="dismissCountDown"

src/views/notifications/Badges.vue

@@ -29,7 +29,7 @@
           </b-card>
         </b-col>
         <b-col cols="12" md="6">
-          <b-card header="Badge <small>contextual variations</small>"
+          <b-card header="<i class='fa fa-align-justify'></i> Badge <small>contextual variations</small>"
             header-tag="header"
             footer-tag="footer">
             <div>
@@ -43,7 +43,7 @@
               <b-badge variant="dark">Dark</b-badge>
             </div>
           </b-card>
-          <b-card header="Badge <small>pills</small>"
+          <b-card header="<i class='fa fa-align-justify'></i> Badge <small>pills</small>"
             header-tag="header"
             footer-tag="footer">
             <div>
@@ -57,7 +57,7 @@
               <b-badge pill variant="dark">Dark</b-badge>
             </div>
           </b-card>
-          <b-card header="Badge <small>actionable</small>"
+          <b-card header="<i class='fa fa-align-justify'></i> Badge <small>actionable</small>"
             header-tag="header"
             footer-tag="footer">
             <div>

src/views/notifications/Modals.vue

@@ -3,7 +3,7 @@
     <div class="animated fadeIn">
       <b-row>
         <b-col cols="12">
-          <b-card header="Bootstrap Modals">
+          <b-card header="<i class='fa fa-align-justify'></i> Bootstrap Modals">
             <b-button type="button" variant="secondary" @click="myModal = true">Launch demo modal</b-button>
             <b-button type="button" variant="secondary" @click="largeModal = true">Launch large modal</b-button>
             <b-button type="button" variant="secondary" @click="smallModal = true">Launch small modal</b-button>