мой третий commit

src/pages/Place.tsx

@@ -10,18 +10,13 @@ import {
   IonCardContent,
   IonImg,
   IonIcon,
-  IonCardSubtitle,
   IonButton
 } from "@ionic/react";
 
 import { navigateOutline } from "ionicons/icons";
 
-import ExploreContainer from "../components/ExploreContainer";
 import "./Tab1.css";
-import { Link } from "react-router-dom";
+//import { Link } from "react-router-dom";
-import { useState } from "react";
-import { map } from "ionicons/icons";
-
 const Tab1: React.FC = () => {
   const genKey = () => Math.random().toString();
   const cites = [

src/pages/Space.tsx

@@ -8,7 +8,7 @@ import {
   IonLabel,
   IonSegmentButton
 } from "@ionic/react";
-import { tabletPortraitSharp } from "ionicons/icons";
+//import { tabletPortraitSharp } from "ionicons/icons";
 
 const Tab2: React.FC = () => {
   const tabApp = [
@@ -20,7 +20,7 @@ const Tab2: React.FC = () => {
     <IonPage>
       <IonHeader>
         <IonToolbar>
-          <IonTitle>Образование</IonTitle>
+          <IonTitle>Пространства</IonTitle>
         </IonToolbar>
       </IonHeader>
       <IonContent fullscreen>

src/pages/Works.tsx

@@ -6,10 +6,18 @@ import {
   IonToolbar,
   IonSegment,
   IonLabel,
+  IonCard,
+  IonCardContent,
+  IonCardHeader,
+  IonCardTitle,
+  IonIcon,
+  IonButton,
   IonSegmentButton
 } from "@ionic/react";
 import "./Tab2.css";
 
+import { heart } from "ionicons/icons";
+
 const Tab2: React.FC = () => {
   const tablist = [
     {
@@ -24,7 +32,15 @@ const Tab2: React.FC = () => {
     }
   ];
 
-  const WorkList = [{ title: "", price: "", likes: "", experience: "" }, {}];
+  const WorkList = [
+    { title: "Монтажник", price: "44000", likes: "8", experience: "" },
+    { title: "Ситемный  Инженер", price: "68000", likes: "60", experience: "" },
+    { title: "Проограммист", price: "120000", likes: "50", experience: "" },
+    { title: "DevOps", price: "86000", likes: "100", experience: "" },
+    { title: "", price: "", likes: "", experience: "" },
+    { title: "", price: "", likes: "", experience: "" },
+    {}
+  ];
 
   return (
     <IonPage>
@@ -44,6 +60,38 @@ const Tab2: React.FC = () => {
             </IonSegmentButton>
           ))}
         </IonSegment>
+        {WorkList.map((w) => (
+          <IonCard>
+            <IonCardHeader>
+              <IonCardTitle>{w.title}</IonCardTitle>
+            </IonCardHeader>
+            <p>
+              <span style={{ fontSize: "20px", float: "right" }}>
+                <b>{w.price} &#8399;</b>
+              </span>
+              <IonIcon icon={heart} style={{ color: "#F00", fontSize: 16 }} />
+              {w.likes}
+            </p>
+            <IonCardContent>
+              {w.experience}
+
+              <p
+                style={{
+                  padding: "10px",
+                  border: "1px  dotted #AAA",
+                  fontSize: "16px"
+                }}
+              >
+                <IonButton
+                  color="lifght"
+                  style={{ backgroundColor: "#EE5203", color: "#EEE" }}
+                >
+                  Хочу подробностей
+                </IonButton>{" "}
+              </p>
+            </IonCardContent>
+          </IonCard>
+        ))}
       </IonContent>
     </IonPage>
   );