ThaniLandingPage/index.html at main · lab-tecnosocial/ThaniLandingPage · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE html>
<html lang="es">

<head>
  <!-- Primary Meta Tags -->
  <title>Thani: Conecta con tus emociones</title>
  <meta name="title" content="Thani: Conecta con tus emociones" />
  <meta name="description"
    content="Un espacio que permite conectar con tus emociones. Descarga la app en tu dispositivo Android" />
  <meta name="keywords" content="emociones, gestión emocional, registro de emociones" />

  <!-- Open Graph / Facebook -->
  <meta property="og:type" content="website" />
  <meta property="og:url" content="https://thaniconecta.app/" />
  <meta property="og:title" content="Thani: Conecta con tus emociones" />
  <meta property="og:description"
    content="Un espacio que permite conectar con tus emociones. Descarga la app en tu dispositivo Android" />
  <meta property="og:image" content=img src="https://thaniconecta.app/images/ThaniPreview.png" />

  <!-- Twitter -->
  <meta property="twitter:card" content="summary_large_image" />
  <meta property="twitter:url" content="https://thaniconecta.app/" />
  <meta property="twitter:title" content="Thani: Conecta con tus emociones" />
  <meta property="twitter:description"
    content="Un espacio que permite conectar con tus emociones. Descarga la app en tu dispositivo Android" />
  <meta property="twitter:image" content=img src="https://thaniconecta.app/images/ThaniPreview.png" />

  <link rel="stylesheet" href="style.css">

  <!-- elemento necesario para que funcione bien los media queries en celular -->
  <meta name="viewport" content="width=device-width, initial-scale=1">

</head>

<body>
  <header>
    <div class="contenedor">
      <div class="logo-izq">
        <img src="images/LogoThani_Color.png" alt="Logo Thani">
      </div>
      <div class="logo-der">
        <a href="https://labtecnosocial.org/" target="_blank"><img src="images/logo-claro.png" alt="Logo Lab"></a>
      </div>
    </div>
  </header>


  <div class="grid-celular">
    <div class="columna">
      <img src="images/celular.png" alt="Imagen" class="cel">
    </div>
    <div class="columna">
      <h4>¡Descubre Thani y conecta con tus emociones ahora mismo!</h4>
      <p>¿Estás listo para explorar y gestionar tus emociones como nunca antes? </br> Con Thani, podrás desbloquear el
        poder de tus emociones y experimentar una vida más equilibrada y significativa.</p>
      <a href="https://play.google.com/store/apps/details?id=org.labtecnosocial.thani" target="_blank" id="link">
        <img src="images/google_play.png" alt="google_play" class="gp"></a>

    </div>
  </div>


  <main>
    <div class="principal">
      <h2 class="ofrece">¿Qué te ofrece Thani?</h2>
      <div class="grid-container">
        <div class="grid-item">
          <img src="images/1.png" alt="Imagen 1">
          <div class="text-container">
            <h3>Registra tus emociones</h3>
            <p>Un espacio para reflexionar, expresar y aprender más sobre tus emociones</p>
          </div>
        </div>
        <div class="grid-item">
          <img src="images/2.png" alt="Imagen 2">
          <div class="text-container">
            <h3>Desarrolla tu inteligencia emocional</h3>
            <p>Practica la gratitud, una actitud positiva y accede a consejos de cómo gestionar tus emociones</p>
          </div>
        </div>
        <div class="grid-item">
          <img src="images/3.png" alt="Imagen 3">
          <div class="text-container">
            <h3>Monitorea tu recorrido</h3>
            <p>Observa tu estado emocional a través de nuestras estadísticas. Obtén información valiosa sobre tus
              altibajos emocionales y encuentra formas de mantener el equilibrio</p>
          </div>
        </div>
      </div>
    </div>


    <div class="detalles">
      <div class="columnadetalles">
        <img src="images/llama.png" alt="Imagen" class="llama">
      </div>
      <div class="columnadetalles">
      <p>¿Estás listo para transformar tu relación con tus emociones y vivir una vida más plena? </br></br>Únete a la
        comunidad de Thani hoy mismo y comienza tu viaje hacia el bienestar emocional</p>
      </div>
    </div>


    <div class="CTA">
      <div class="CTA-container">
        <div class="itemCTA">
          <div class="textoCTA">
            <h3>¡Descarga Thani ahora y dale a tus emociones el espacio que se merecen!</h3>
          </div>
        </div>
        <div class="itemCTA">
          <a href="https://play.google.com/store/apps/details?id=org.labtecnosocial.thani" target="_blank" id="link">
            <img src="images/google_play.png" alt="Play Store"></a>
        </div>
      </div>
    </div>
  </main>


  <footer>
    <a href="https://labtecnosocial.org/politica-de-privacidad-de-la-app-thani/" target="_blank" id="link">
      <p>Términos y condiciones</p>
    </a>
  </footer>

</body>

</html>