Fires maps simplified. Better mobile style

imports/ui/pages/FiresMap/FiresMap.js

@@ -31,7 +31,7 @@ import FireAlertsCollection from '/imports/api/FireAlerts/FireAlerts';
 import IndustriesCollection, { industriesRemap } from '/imports/api/Industries/Industries';
 import FalsePositivesCollection, { falsePositivesRemap } from '/imports/api/FalsePositives/FalsePositives';
 import SiteSettings from '/imports/api/SiteSettings/SiteSettings';
-import { isNotHomeAndMobile, isChrome } from '/imports/ui/components/Utils/isMobile';
+import { isNotHomeAndMobile, isChrome, isAnyMobile } from '/imports/ui/components/Utils/isMobile';
 import { isHome } from '/imports/ui/components/Utils/location';
 import ShareIt from '/imports/ui/components/ShareIt/ShareIt';
 import FullScreenMap from '/imports/ui/components/Maps/FullScreenMap';
@@ -223,13 +223,13 @@ class FiresMap extends React.Component {
              <Col xs={12} sm={6} md={6} lg={6} >
                <p className="firesmap-legend">
                  { (this.props.activefires.length + this.props.firealerts.length) === 0 ?
-                   <Fragment><Trans parent="span" i18nKey="noActiveFireInMapCount">No hay fuegos activos en esta zona del mapa. Hay un total de <strong>{{ countTotal: this.props.activefirestotal }}</strong> fuegos activos detectados en todo el mundo.</Trans> <Trans>Datos actualizados <FromNow when={this.props.lastCheck} />.</Trans></Fragment> :
+                   <Fragment><Trans parent="span" i18nKey="noActiveFireInMapCount">No hay fuegos activos en esta zona del mapa. <strong>{{ countTotal: this.props.activefirestotal }}</strong> fuegos activos en el mundo.</Trans> <Trans>Actualizado <FromNow when={this.props.lastCheck} />.</Trans></Fragment> :
-                   <Fragment><Trans parent="span" i18nKey="activeFireInMapCount">En rojo, <strong>{{ count: this.props.activefires.length + this.props.firealerts.length }}</strong> fuegos activos en el mapa. Hay un total de <strong>{{ countTotal: this.props.activefirestotal }}</strong> fuegos activos detectados en todo el mundo por la NASA.</Trans> <Trans>Datos actualizados <FromNow when={this.props.lastCheck} />.</Trans></Fragment>
+                 <Fragment><Trans parent="span" i18nKey="activeFireInMapCount">En rojo, <strong>{{ count: this.props.activefires.length + this.props.firealerts.length }}</strong> fuegos activos. <strong>{{ countTotal: this.props.activefirestotal }}</strong> fuegos activos en el mundo.</Trans> <Trans>Actualizado <FromNow when={this.props.lastCheck} />.</Trans></Fragment>
                  }
                </p>
                {isNotHomeAndMobile() && this.props.firealerts.length > 0 &&
                 <p className="firesmap-legend"><Trans parent="span" i18nKey="activeNeigFireInMapCount">En naranja, los fuegos notificados por nuestros usuarios/as recientemente.</Trans></p> }
-                {isNotHomeAndMobile() && this.props.firealerts.length === 0 &&
+                {isNotHomeAndMobile() && this.props.firealerts.length === 0 && !isAnyMobile &&
                  <p className="firesmap-legend"><Trans parent="span" i18nKey="noActiveNeigFireInMap">No hay fuegos notificados recientemente por nuestros usuarios/as en esta zona.</Trans></p> }
              </Col>
              <Col xs={12} sm={6} md={6} lg={6}>
@@ -252,7 +252,7 @@ class FiresMap extends React.Component {
                 </Fragment>}
                 <p className="firesmap-note">
                   <em>{ this.state.viewport.zoom >= MAXZOOMREACTIVE ?
-                       <Trans>Los fuegos activos se actualizan en tiempo real.</Trans> :
+                       <Trans>Los fuegos activos se actualizan en tiempo cuasi real.</Trans> :
                        <Trans>Haga zoom en una zona de su interés si quiere que los fuegos se actualicen en tiempo real.</Trans>
                       }
                   </em>
@@ -344,6 +344,7 @@ class FiresMap extends React.Component {
            <Row>
              <Col xs={12} sm={12} md={12} lg={12}>
                <p className="firesmap-footnote"><span style={{ paddingRight: '5px' }}>(*)</span><Trans i18nKey="mapPrivacy" parent="span"><em>Para preservar la privacidad de nuestros usuarios/as, los datos reflejados están aleatoriamente alterados y son solo orientativos.</em></Trans></p>
+               <p className="firesmap-footnote"><em><Trans>Nota: Las nubes pueden entorpecer la detección de fuegos activos.</Trans></em></p>
              </Col>
            </Row>
            { !isHome() &&

imports/ui/stylesheets/custom.scss

@@ -11,11 +11,13 @@ a, a:hover  {
 
 h4.page-header {
   line-height: 2em;
+  font-size: 2em;
 }
 
 @include breakpoint(mobile) {
   h4.page-header {
     line-height: 1.3em;
+    font-size: 1.5em;
   }
 }
 
@@ -23,18 +25,8 @@ h4.page-header {
   /* margin-top: 30px; */
 }
 
-h4.page-header {
-  font-size: 2em;
-}
-
 .page-header {
-  margin-top: 0;
+  margin-top: 10px;
-}
-
-@include breakpoint(tablet) {
-  .page-header {
-    margin-top: 10px;
-  }
 }
 
 #react-root > div > div.container > div > div.alert {

public/locales/en/common.json

@@ -70,8 +70,10 @@
   "Participa": "Get Involved",
   "activeFires": "Active Fires",
   "Fuegos activos": "Active Fires",
-  "noActiveFireInMapCount": "There are no active fires in this area of the map. There is a total of <1><0>{{countTotal}}</0></1> active fires detected worldwide.",
+  "noActiveFireInMapCount":
-  "activeFireInMapCount": "On the map marked in red <1><0>{{count,number}}</0></1> active fires. There is a total of <3><0>{{countTotal,number}} </0></3> active fires detected worldwide by NASA.",
+  "There are no active fires in this area of the map. <1><0>{{countTotal}}</0></1> active fires worldwide.",
+  "activeFireInMapCount":
+  "Marked in red <1><0>{{count,number}}</0></1> active fires. <3><0>{{countTotal,number}} </0></3> active fires worldwide.",
   "activeNeigFireInMapCount": "In Orange, the fires recently reported by our users.",
   "Centrar en tu ubicación": "Center on your location",
   "Resaltar en verde el área vigilada por nuestros usuarios/as": "The area monitored by our users is highlighted in green",
@@ -102,7 +104,7 @@
   "Terminar": "Finish",
   "Pulsa para borrar": "Click to delete",
   "Pulsa aquí para borrar la zona": "Click here to remove the area",
-  "Los fuegos activos se actualizan en tiempo real.": "Fires are updated in real-time.",
+  "Los fuegos activos se actualizan en tiempo cuasi real.": "Fires are updated in near real-time.",
   "Somos muchos ojos": "We are many eyes",
   "Usa nuestro bot de Telegram para estar al tanto de los fuegos en tus área": "Use our Telegram bot to be aware of the fires in your area",
   "Otros dispositivos": "Other Devices",
@@ -165,7 +167,7 @@
   "Verifica tu dirección de correo": "Verify Your Email Address",
   "Zonas vigiladas": "Monitored areas",
   "En verde, las zonas vigiladas por nuestros usuari@s actualmente": "In green, the areas monitored by our users currently",
-  "Datos actualizados <1></1>.": "Data updated <1></1>.",
+  "Actualizado <1></1>.": "Updated <1></1>.",
   "Información adicional sobre fuego": "Additional information about fire",
   "CO2emisions": "Did you know that wildfires <1>produce as much CO² as cars</1> and <3>about ⅕ of all our carbon emissions</3>?",
   "Ayúdanos a combatir el cambio climático y a proteger el medioambiente": "Help us fight climate change and protect the environment",
@@ -239,5 +241,7 @@
   "on-already-subscribed":
   "Upppps: You have already subscribed to that zone before",
   "Cancelar":
-  "Cancel"
+  "Cancel",
+  "Nota: Las nubes pueden entorpecer la detección de fuegos activos.":
+  "Note: Cloud cover might obscure active fire detections."
 }

public/locales/es/common.json

@@ -113,9 +113,9 @@
   "Fuegos activos":
   "Fuegos activos",
   "noActiveFireInMapCount":
-  "No hay fuegos activos en esta zona del mapa. Hay un total de <1><0>{{countTotal}}</0></1> fuegos activos detectados en todo el mundo.",
+  "No hay fuegos activos en esta zona del mapa. <1><0>{{countTotal}}</0></1> fuegos activos en el mundo.",
   "activeFireInMapCount":
-  "En rojo, <1><0>{{count,number}}</0></1> fuegos activos en el mapa. Hay un total de <3><0>{{countTotal,number}}</0></3> fuegos activos detectados en todo el mundo por la NASA.",
+  "En rojo, <1><0>{{count,number}}</0></1> fuegos activos. <3><0>{{countTotal,number}}</0></3> fuegos activos en el mundo.",
   "activeNeigFireInMapCount":
   "En naranja, los fuegos notificados por nuestros usuarios/as recientemente.",
   "Centrar en tu ubicación":
@@ -162,7 +162,7 @@
   "Terminar": "Terminar",
   "Pulsa para borrar": "Pulsa para borrar",
   "Pulsa aquí para borrar la zona": "Pulsa aquí para borrar la zona",
-  "Los fuegos activos se actualizan en tiempo real.": "Los fuegos activos se actualizan en tiempo real.",
+  "Los fuegos activos se actualizan en tiempo cuasi real.": "Los fuegos activos se actualizan en tiempo cuasi real.",
   "Somos muchos ojos": "Somos muchos ojos",
   "Usa nuestro bot de Telegram para estar al tanto de los fuegos en tus área": "Usa nuestro bot de Telegram para estar al tanto de los fuegos en tus área",
   "Otros dispositivos": "Otros dispositivos",
@@ -237,7 +237,7 @@
   "Verifica tu dirección de correo",
   "Zonas vigiladas": "Zonas vigiladas",
   "En verde, las zonas vigiladas por nuestros usuari@s actualmente": "En verde, las zonas vigiladas por nuestros usuari@s actualmente",
-  "Datos actualizados <1></1>.": "Datos actualizados <1></1>.",
+  "Actualizado <1></1>.": "Actualizado <1></1>.",
   "Tomamos nota, ¡gracias por colaborar!":
   "Tomamos nota, ¡gracias por colaborar!",
   "Indícanos de que tipo de fuego se trata y ayúdanos así a mejorar nuestras notificaciones:": "Indícanos de que tipo de fuego se trata y ayúdanos así a mejorar nuestras notificaciones:",
@@ -326,5 +326,7 @@
   "on-already-subscribed":
   "Upppps: Ya te habías suscrito a esa zona antes",
   "Cancelar":
-  "Cancelar"
+  "Cancelar",
+  "Nota: Las nubes pueden entorpecer la detección de fuegos activos.":
+  "Nota: Las nubes pueden entorpecer la detección de fuegos activos."
 }