import { IonCard, IonContent, IonHeader, IonPage, IonText, IonTitle, IonToolbar } from '@ionic/react';
import ExploreContainer from '../components/ExploreContainer';
import './Info.css';

const Info: React.FC = () => {
  return (
    <IonPage>
      <IonHeader>
        <IonToolbar>
        <IonTitle class="ion-text-center">TPC</IonTitle>
        </IonToolbar>
      </IonHeader>
      <IonContent fullscreen>
        <IonHeader collapse="condense">
          <IonToolbar>
            <IonTitle size="large">Info</IonTitle>
          </IonToolbar>
        </IonHeader>
        <IonCard color="light">
          <IonText color="primary">
            <h2>Contáctanos</h2>
          </IonText>
          <p>Teléfonos: <a href="tel:(787)876-3440">(787)876-3440</a> / <a href="tel:(787)256-7568">(787)256-7568</a></p>
          <p>Email: <a href="mailto:info@tallersaludpr.org">info@tallersaludpr.org</a></p>
         <IonText color="primary">
            <h2>Visión</h2>
         </IonText>
          <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>
          <IonText color="primary">
           <h2>Misión</h2>
          </IonText>
          <p>Elevar el liderato de las mujeres para así co-crear bienestar, salud integral y oportunidades de desarrllo individual y colectivo.</p>
          <IonText color="primary">
            <h2>Valores</h2>
          </IonText>
          <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>
          <IonText class="ion-text-right">
            <p>Más información en: <a href="https://www.tallersalud.com">Taller Salud</a></p>
          </IonText>
        </IonCard>
      </IonContent>
    </IonPage>
  );
};

export default Info;