tab4

angular.json

@@ -136,7 +136,8 @@
   "cli": {
     "schematicCollections": [
       "@ionic/angular-toolkit"
-    ]
+    ],
+    "analytics": "67ccf4db-a6bd-4bdf-b172-4d9297ba599c"
   },
   "schematics": {
     "@ionic/angular-toolkit:component": {

src/app/tab1/tab1.page.html

@@ -39,7 +39,7 @@
                   <img src="assets/user-avatar.jpg">
                 </ion-avatar>
               </ion-col>
-              <ion-col size="9"></ion-col>
+              <ion-col size="6"></ion-col>
               <ion-col size="2">
                 <ion-button fill="clear" (click)="like()">
                   <ion-icon name="heart"></ion-icon> 100
@@ -62,7 +62,7 @@
                   <img src="assets/user-avatar.jpg">
                 </ion-avatar>
               </ion-col>
-              <ion-col size="9"></ion-col>
+              <ion-col size="6"></ion-col>
               <ion-col size="2">
                 <ion-button fill="clear" (click)="like()">
                   <ion-icon name="heart"></ion-icon> 200

src/app/tab2/tab2.page.scss

@@ -14,6 +14,7 @@ ion-card {
 .image-container img{
   width: 100%;
   height: 80%;
+  background-color: #000000;
   object-fit: contain;
   object-position: center;
 }
@@ -80,9 +81,9 @@ ion-card {
       background-color: rgba(255, 255, 255, 0.3);
       color: #000000;
       border: 1px solid rgba(255, 255, 255, 0.3);
-      margin: 0 30px;
-      width: 140px;
-      height: 80px;
+      margin: 1 10px;
+      width: 190px;
+      height: 50px;
     }
   }
   .user-actions ion-button:hover {

src/app/tab3/tab3.page.scss

@@ -31,7 +31,7 @@ ion-label {
   margin-top: 5px;
   margin-bottom: 5px;
   ion-button{
-    margin: 0px 20px;
+    margin: 1 10px;
     margin-top: 5px;
     margin-bottom: 5px;
     color: #000000;