wellness logo header

config.xml

@@ -101,5 +101,4 @@
     <plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" />
     <allow-navigation href="http://172.16.112.36:8102" sessionid="56964c11" />
     <allow-navigation href="http://localhost:8101" sessionid="9c146598" />
-    <allow-navigation href="http://localhost:8102" sessionid="e658a7f1" />
 </widget>

src/app/home/home.page.html

@@ -1,6 +1,9 @@
 <ion-header>
   <ion-toolbar class="new-background-color">
-    <ion-title>Wellness Route</ion-title>
+    <div class="hcs">
+      <img src="/assets/images/wellnessbar.svg" height="50" />
+      <!-- <ion-title>Wellness Route</ion-title> -->
+    </div>
   </ion-toolbar>
 </ion-header>
 <ion-content [fullscreen]="true">
@@ -42,17 +45,19 @@
       </ion-col> -->
       <ion-col size="3">
         <div class="center catshow">
-          <a [routerLink]="['/tabs/place/']"><fa-icon [icon]="['fas', 'utensils']" size="2x" class="red"></fa-icon></a>          
+          <a [routerLink]="['/tabs/place/']">
+            <fa-icon [icon]="['fas', 'utensils']" size="2x" class="red"></fa-icon>
+          </a>
         </div>
       </ion-col>
       <ion-col size="3">
         <div class=" catshow center">
-          <fa-icon [icon]="['fas', 'spa']" size="2x"></fa-icon>        
+          <fa-icon [icon]="['fas', 'spa']" size="2x"></fa-icon>
         </div>
       </ion-col>
       <ion-col size="3">
         <div class=" catshow center">
-          <fa-icon [icon]="['fas', 'praying-hands']" size="2x"></fa-icon>          
+          <fa-icon [icon]="['fas', 'praying-hands']" size="2x"></fa-icon>
         </div>
       </ion-col>
       <ion-col size="3">
@@ -70,8 +75,9 @@
           <div *ngIf="pldata.better_featured_image == null">
             <img src="/assets/images/temp.png" />
           </div>
-          <ion-card-header>            
-            <a [routerLink]="['/tabs/place/', pldata.id]"><ion-card-title [innerHTML]="pldata.title.rendered"></ion-card-title>
+          <ion-card-header>
+            <a [routerLink]="['/tabs/place/', pldata.id]">
+              <ion-card-title [innerHTML]="pldata.title.rendered"></ion-card-title>
             </a>
             <a [routerLink]="['/tabs/province/']">
               <span [innerHTML]="pldata._embedded['wp:term'][1][0].name"></span>

src/app/tabs/tabs.page copy.html

@@ -1,31 +0,0 @@
-<ion-tabs>
-  <ion-fab vertical="bottom" horizontal="center" slot="fixed">
-    
-      <ion-fab-button [routerLink]="['/tabs/nearme/']">
-        <ion-icon name="add-outline"></ion-icon>
-      </ion-fab-button>
-    
-  </ion-fab>
-
-  <ion-tab-bar slot="bottom">
-    <ion-tab-button tab="tab1">
-      <ion-icon name="home"></ion-icon>
-      <ion-label>Tab 1</ion-label>
-    </ion-tab-button>
-
-    <ion-tab-button tab="tab2">
-      <ion-icon name="ellipse"></ion-icon>
-      <ion-label>Tab 2</ion-label>
-    </ion-tab-button>
-
-    <ion-tab-button tab="tab3">
-      <ion-icon name="location"></ion-icon>
-      <ion-label>Tab 3</ion-label>
-    </ion-tab-button>
-
-    <ion-tab-button tab="tab4">
-      <ion-icon name="location"></ion-icon>
-      <ion-label>Tab 4</ion-label>
-    </ion-tab-button>
-  </ion-tab-bar>
-</ion-tabs>

src/app/tabs/tabs.page copy.scss

@@ -1 +0,0 @@
-

src/app/tabs/tabs.page.html

@@ -5,23 +5,20 @@
     </ion-fab-button>
   </ion-fab> -->
   <ion-tab-bar slot="bottom">
-    <ion-tab-button tab="home">
+    <ion-tab-button tab="home" layout="icon-top">
       <ion-icon name="home"></ion-icon>
       <ion-label>หน้าแรก</ion-label>
     </ion-tab-button>
 
-    <ion-tab-button tab="nearme">
-      <ion-icon name="location"></ion-icon>
-      <ion-label>ใกล้ฉัน</ion-label>
+    <ion-tab-button tab="nearme" layout="icon-top">
+      <ion-icon name="location" color="danger"></ion-icon>
+      <ion-label color="danger">ใกล้ฉัน</ion-label>
     </ion-tab-button>
 
-    <ion-tab-button tab="login">
+    <ion-tab-button tab="login" layout="icon-top">
       <ion-icon name="person"></ion-icon>
       <ion-label>ฉัน</ion-label>
     </ion-tab-button>
-    <ion-tab-button tab="register-form">
-      <ion-icon name="person"></ion-icon>
-      <ion-label>ลงทะเบียน</ion-label>
-    </ion-tab-button>
+    
   </ion-tab-bar>
 </ion-tabs>

src/app/tabs/tabs.page.scss

@@ -1,4 +1,34 @@
 ion-label {
     font-family: "IBM Plex Sans Thai", sans-serif !important;
     font-weight: 400;
-}
+}
+
+ion-tab-bar {
+    height: 70px;
+  }
+  
+// ion-tab-bar {
+//     bottom: 20px;
+//     position: relative;
+//     border-radius: 16px;
+//     width: 92%;
+//     margin: 0 auto;
+//   }
+  
+//   ion-tab-button {
+//     --color: var(--ion-color-medium);
+//     --color-selected: var(--ion-color-primary);
+  
+//     &::before {
+//       background-color: transparent;
+//       display: block;
+//       content: "";
+//       margin: 0 auto;
+//       width: 20px;
+//       height: 2px;
+//     }
+  
+//     &.tab-selected::before {
+//       background-color: var(--ion-color-primary);
+//     }
+//   }

src/global.scss

@@ -78,6 +78,14 @@
   font-family: "IBM Plex Sans Thai", sans-serif !important;
 }
 
+.hcs {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding-bottom: 5px;
+  padding-top: 5px;
+}
+
 .new-background-color {
   --background: rgb(103, 143, 221);
   --background: -moz-linear-gradient(