Show 3 steps in help page instead of FAQ

6 files changed, 35 insertions, 97 deletions

diff --git a/www/cobrands/cuidomiciudad/css/style.css b/www/cobrands/cuidomiciudad/css/style.css
index 54b4276..b50f822 100644
--- a/www/cobrands/cuidomiciudad/css/style.css
+++ b/www/cobrands/cuidomiciudad/css/style.css
@@ -133,18 +133,32 @@ div[data-role='header'] .ui-icon-fms-account {
   background-position: center top;
   text-indent: -9999999px;
 }
-/* line 145, style.scss */
+/* line 144, style.scss */
+#helpContent h2 {
+  text-align: center;
+}
+/* line 148, style.scss */
+#helpContent img {
+  width: 200px;
+  display: block;
+  margin: 0.5em auto;
+}
+/* line 153, style.scss */
+#helpContent img.last-image {
+  margin-bottom: 3em;
+}
+/* line 158, style.scss */
 #helpContent a, #helpContent a:visited {
   color: #eed11c;
 }
 
-/* line 150, style.scss */
+/* line 163, style.scss */
 #dismiss {
   color: white;
   text-shadow: 0px 1px 0px silver;
 }
 
-/* line 156, style.scss */
+/* line 169, style.scss */
 #locating p {
   text-shadow: none;
 }
diff --git a/www/cobrands/cuidomiciudad/css/style.scss b/www/cobrands/cuidomiciudad/css/style.scss
index c7609fc..3976a23 100644
--- a/www/cobrands/cuidomiciudad/css/style.scss
+++ b/www/cobrands/cuidomiciudad/css/style.scss
@@ -141,6 +141,19 @@ div[data-role='header'] .ui-icon-fms-account {
         background-position: center top;
         text-indent: -9999999px;
     }
+    h2 {
+        text-align: center;
+    }
+
+    img {
+        width: 200px;
+        display: block;
+        margin: 0.5em auto;
+
+        &.last-image {
+            margin-bottom: 3em;
+        }
+    }
 
     a, a:visited {
         color: $color-cmc-yellow;
diff --git a/www/cobrands/cuidomiciudad/images/step1.png b/www/cobrands/cuidomiciudad/images/step1.png
new file mode 100644
index 0000000..abf2b7b
--- /dev/null
+++ b/www/cobrands/cuidomiciudad/images/step1.png
diff --git a/www/cobrands/cuidomiciudad/images/step2.png b/www/cobrands/cuidomiciudad/images/step2.png
new file mode 100644
index 0000000..f5cdd3b
--- /dev/null
+++ b/www/cobrands/cuidomiciudad/images/step2.png
diff --git a/www/cobrands/cuidomiciudad/images/step3.png b/www/cobrands/cuidomiciudad/images/step3.png
new file mode 100644
index 0000000..f5862e4
--- /dev/null
+++ b/www/cobrands/cuidomiciudad/images/step3.png
diff --git a/www/cobrands/cuidomiciudad/templates/es/help.html b/www/cobrands/cuidomiciudad/templates/es/help.html
index 02e3140..a288cbd 100644
--- a/www/cobrands/cuidomiciudad/templates/es/help.html
+++ b/www/cobrands/cuidomiciudad/templates/es/help.html
@@ -1,98 +1,9 @@
-<h1>Preguntas Frecuentes</h1>
-<dl>
-    <dt>¿En qué consiste la plataforma<% print( CONFIG.APP_NAME ) %>?</dt>
-    <dd><% print( CONFIG.APP_NAME ) %> es una plataforma y una applicación colaborativa que permite a la ciudadanía reportar, 
-        ver y discutir problemas locales, haciéndolos llegar al Municipio correspondiente simplemente 
-        al localizarlos en un mapa. De esta manera, el proyecto busca involucrar de manera activa a 
-        vecinos y vecinas en el cuidado de sus barrios, colaborando con la gestión municipal.</dd>
+<h1><% print( CONFIG.APP_NAME ) %></h1>
 
-    <dt>¿Cómo uso esta applicación?</dt>
-    <dd>La applicación intentará a localizarse automaticamente. Si no es posible o quiere reportar un problema en un otro lugar 
-    se puede buscar el lugar por zona o nombre de la calle. Para usar la applicación y reportar un problema, se desplaza el 
-        iconográfico en la plana hasta que encuentre el lugar del problema. Haz click en el buzon "nueva reporte aquí" y entregar
-        los datos del problema en el formulario.
-    </dd>
+<h2>¿Cómo reportar un problema?</h2>
 
-    <dt>¿Cómo se resuelven los problemas?</dt>
-    <dd>Los reportes se mandan a la Alcaldía del Distrito Nacional por correo electrónico para ser canalizados
-        al Departamento correspondiente. El Municipio puede entonces resolver el problema de la forma que lo hace 
-        normalmente y en los plazos correspondientes. En su defecto, puedes usar el sitio para discutir el problema
-        con otras personas y luego en conjunto dirigirse al Municipio para la búsqueda de una solución. </dd>
+<img src="cobrands/cuidomiciudad/images/step1.png" />
 
-    <dt>¿Cómo creo mi cuenta?</dt>
-    <dd>Para ser parte de la comunidad de <% print( CONFIG.APP_NAME ) %>, debo crear una cuenta suministrando
-        un nombre completo, el correo electrónico y completando datos adicionales que pueden ser
-        solicitados para poder dar seguimiento al reporte. Si deseas, publicamos tu reporte anónimo,
-        simplemente debes eliminar la opción de “Mostrar Públicamente”, pero tu reporte y correo si 
-        le llegarán a la Alcaldía.</dd>
+<img src="cobrands/cuidomiciudad/images/step2.png" />
 
-    <dt>¿Qué pasa con mis datos?</dt>
-    <dd><p><% print( CONFIG.APP_NAME ) %> jamás publicará tu email, teléfono ni datos al público, ni entregaremos estos datos
-        a otra entidad, salvo los casos legales previstos. Asimismo, tampoco te enviará spam ni correos no 
-        deseados. Ver Política de Privacidad.</p>
-    <p>Tenga en cuenta que los informes y actualizaciones de <% print( CONFIG.APP_NAME ) %> se muestran públicamente en 
-        el sitio web. Por esta razón, no incluya datos personales como su dirección o la dirección de otra 
-        persona o su número de teléfono en su informe inicial, que pueden proporcionarse cuando la Alcaldía 
-        se ponga en contacto con usted. Esto es para su propia seguridad y la de todos los que usan este 
-        servicio. Todos los informes y actualizaciones pueden hacerse de forma anónima bloqueando la casilla 
-        "Mostrar públicamente".</p></dd>
-
-    <dt>¿Cómo contacto a <% print( CONFIG.APP_NAME ) %>?</dt>
-    <dd>Escríbenos a <a href="mailto:info@cuidomiciudad.do">info@cuidomiciudad.do</a></dd>
-
-    <dt>¿Qué tipo de problemas puedo reportar  <% print( CONFIG.APP_NAME ) %>?</dt>
-    <dd><% print( CONFIG.APP_NAME ) %> es principalmente para reportar cosas que
-        <strong>estén en mal estado, sucias o funcionando ilegal o indebidamente, y que necesiten ser arregladas o fiscalizadas</strong>
-         como por ejemplo:
-    <ul>
-    <li>Construcciones Ilegales
-    <li>Ocupación de Área Verde
-    <li>Ocupación de Restos de Vía
-    <li>Vertederos Improvisados
-    <li>Falta de Recolección de Basura
-    <li>Comercios en Espacios Públicos
-    <li>Violaciones de Aceras por Construcciones
-    <li>Contaminación Visual Espacios Públicos (Vallas, bajantes, afiches, etc…)
-    </ul>
-        Nuestra plataforma también te permite:
-    <ul>
-    <li>Consultar tus reportes
-    <li>Consultar los reportes por sector
-    <li>Consultar problemas resueltos
-    <li>Actualizar tus reportes y los de otras personas. Puedes notificar que un problema ya fue resuelto o que se ha reactivado.
-        </ul>
-    </dd></dd>
-
-    <dt>¿Para qué NO es <% print( CONFIG.APP_NAME ) %>?</dt>
-    <dd><% print( CONFIG.APP_NAME ) %> es un mecanismo para ponerse en contacto con la Municipalidad, pero no para todo tipo de problemas. <strong>Debes contactar directamente con la autoridad competente para el reporte problemas como </strong></dd>
-        <dd><ul><li>Robos, hurtos, agresiones o cualquier tipo de delito
-    <li>Ruidos o contaminación ambiental
-    <li>Comportamiento antisocial
-    <li>Personas en actitud sospechosa    
-    <li>Situaciones de emergencia
-    <li>Reclamos contra los vecinos
-    <li>Reclamos contra el Municipio
-    <li>Maltrato animal
-    <li>Fugas de gas
-    <li>Incendios
-    <li>Propuestas para temas de tránsito y movilidad
-    <li>Permisos municipales
-            </ul></dd>
-    
-
-    <dt>¿Qué pasa con el contenido inapropiado?</dt>
-    <dd><% print( CONFIG.APP_NAME ) %> no es responsable por el contenido o la precisión de la información entregada o 
-        compartida por sus usuarios. Nos reservamos el derecho de editar o remover problemas o reportes 
-        que consideremos inapropiados luego de ser informados de esto por algún usuario.
-        
-        <p>Favor NO realizar comentarios que: </p>
-        <ul><li>Sean comentarios difamatorios, capaces de dañar la reputación de una persona u organización. 
-            Si fue demandado con éxito, usted podría ser considerado responsable por daños y costos considerables.
-            <li>Impliquen a otras personas en sus informes. Los informes sobre comportamiento antisocial, crueldad animal,
-                actividades criminales, entre otros, no deben ser reportados en <% print( CONFIG.APP_NAME ) %>. En estos casos, canalice 
-                su denuncia a la entidad que corresponda.
-            <li>Constituyan mensajes legales, acosadores, difamatorios, abusivos, amenazantes, dañinos, obscenos, sexualmente
-                orientados, homofóbicos o racialmente ofensivos.
-            <li>Sean spam o inundaciones, es decir, favor no volver a publicar el mismo mensaje, o mensajes muy similares, más de una vez
-        </ul>
-    </dd>
+<img class="last-image" src="cobrands/cuidomiciudad/images/step3.png" />
\ No newline at end of file