Browse Source

Info Page Update

cynthiarivera15 2 years ago
parent
commit
c90dfc1d69
3 changed files with 26 additions and 10 deletions
  1. 7
    7
      src/App.tsx
  2. 17
    3
      src/pages/Info.tsx
  3. 2
    0
      src/theme/variables.css

+ 7
- 7
src/App.tsx View File

57
             <Redirect to="/home" />
57
             <Redirect to="/home" />
58
           </Route>
58
           </Route>
59
         </IonRouterOutlet>
59
         </IonRouterOutlet>
60
-        <IonTabBar slot="bottom">
60
+        <IonTabBar color="light" slot="bottom">
61
           <IonTabButton tab="home" href="/home">
61
           <IonTabButton tab="home" href="/home">
62
-            <IonIcon icon={home} />
63
-            <IonLabel>Home</IonLabel>
62
+            <IonIcon color="primary" icon={home} />
63
+            <IonLabel color="primary">Home</IonLabel>
64
           </IonTabButton>
64
           </IonTabButton>
65
           <IonTabButton tab="flag" href="/flag">
65
           <IonTabButton tab="flag" href="/flag">
66
-            <IonIcon icon={flag} />
67
-            <IonLabel>Flag</IonLabel>
66
+            <IonIcon color="primary" icon={flag} />
67
+            <IonLabel color="primary">Flag</IonLabel>
68
           </IonTabButton>
68
           </IonTabButton>
69
           <IonTabButton tab="info" href="/info">
69
           <IonTabButton tab="info" href="/info">
70
-            <IonIcon icon={peopleCircle} />
71
-            <IonLabel>Info</IonLabel>
70
+            <IonIcon color="primary" icon={peopleCircle} />
71
+            <IonLabel color="primary">Info</IonLabel>
72
           </IonTabButton>
72
           </IonTabButton>
73
         </IonTabBar>
73
         </IonTabBar>
74
       </IonTabs>
74
       </IonTabs>

+ 17
- 3
src/pages/Info.tsx View File

1
-import { IonContent, IonHeader, IonPage, IonText, IonTitle, IonToolbar } from '@ionic/react';
1
+import { IonCard, IonContent, IonHeader, IonPage, IonText, IonTitle, IonToolbar } from '@ionic/react';
2
 import ExploreContainer from '../components/ExploreContainer';
2
 import ExploreContainer from '../components/ExploreContainer';
3
 import './Info.css';
3
 import './Info.css';
4
 
4
 
16
             <IonTitle size="large">Info</IonTitle>
16
             <IonTitle size="large">Info</IonTitle>
17
           </IonToolbar>
17
           </IonToolbar>
18
         </IonHeader>
18
         </IonHeader>
19
+        <IonCard color="light">
19
         <IonText color="primary">
20
         <IonText color="primary">
20
           <h2>Contáctanos</h2>
21
           <h2>Contáctanos</h2>
21
         </IonText>
22
         </IonText>
22
-        <p>Teléfonos: (787)876-3440 / (787)256-7568</p>
23
-        <p>Email: info@tallersaludpr.org</p>
23
+        <p>Teléfonos: <a href="tel:(787)876-3440">(787)876-3440</a> / <a href="tel:(787)256-7568">(787)256-7568</a></p>
24
+        <p>Email: <a href="mailto:info@tallersaludpr.org">info@tallersaludpr.org</a></p>
25
+        <IonText color="primary">
26
+          <h2>Visión</h2>
27
+        </IonText>
28
+        <p>Una sociedad inclusiva con comunidades organizadas y libres de opresión que ejercen su derecho a la salud integral y a una vida digna, e impulsan su desarrollo colectivo y sostenible</p>
29
+        <IonText color="primary">
30
+          <h2>Misión</h2>
31
+        </IonText>
32
+        <p>Elevar el liderato de las mujeres para así co-crear bienestar, salud integral y oportunidades de desarrllo individual y colectivo.</p>
33
+        <IonText color="primary">
34
+          <h2>Valores</h2>
35
+        </IonText>
36
+        <p>En Taller Salud vivimos estos valores en el diseño de nuestro trabajo y en nuestro quehacer cotidiano, bajo la convicción firme de que son esenciales para el desarrllo social de Puerto Rico y para rearfirmar una nueva noción de lo que es bienestar</p>
37
+        </IonCard>
24
       </IonContent>
38
       </IonContent>
25
     </IonPage>
39
     </IonPage>
26
   );
40
   );

+ 2
- 0
src/theme/variables.css View File

3
 
3
 
4
 /** Ionic CSS Variables **/
4
 /** Ionic CSS Variables **/
5
 :root {
5
 :root {
6
+  --ion-background-color: #8f00ff;
7
+  
6
   /** primary **/
8
   /** primary **/
7
   --ion-color-primary: #8f00ff;
9
   --ion-color-primary: #8f00ff;
8
   --ion-color-primary-rgb: 56, 128, 255;
10
   --ion-color-primary-rgb: 56, 128, 255;