Meteoclimatic
Software => WeeWX => Otros Skins de Weewx => Mensaje iniciado por: pablosedano en 19 de Octubre del 2018, 22:38:34 pm
-
Hola a todos, me estreno en la sección instalando esta plantilla que me gustó mucho por su adaptabilidad y ser muy visual.
La traduje al español aunque es muy fácil ya que en su skin.conf viene una sección con todas las palabras que hay que traducir, aunque luego en los html.tmpl hay que hacer alguna también. Cuando lo tenga terminado la subiré por si a alguien le viene bien. Me falta pulir ciertas cosas y acabar de traducir las webs de semana, mes, año....
Una cosa que no conseguí hacer es cambiar los colores del encabezado, modifiqué el archivo style.css y en local me lo cambia pero luego en la web por FTP no me lo sube, también modifiqué el archivo style.css que estaba alojado en el servidor. Si se os ocurre algo me decís, gracias.
Bueno la web en cuestión es:
http://www.colladojermoso.com/colladojermoso.com/meteo/meteo/index.html (http://www.colladojermoso.com/colladojermoso.com/meteo/meteo/index.html)
Espero os guste, un saludo.
-
Tiene una presentacion muy limpia y vistosa. Donde conseguiste la plantilla ?
-
Hola Oscar, de su web https://projects.neoground.com/neowx está muy guapa y es fácilmente traducible ya que en el archivo. conf tiene una sección con todos los términos que hay que traducir. Luego algo de los html.tmpl pero poca cosa.
-
Hola, si lo tienes traducido y lo posteas, nos ahorrarás un tiempo considerable a muchos.
Estoy probándolo y me parece muy visual si le quitamos algunas cosas como la temperatura/humedad interna...
Y me gustaría cambiarle colores y por ejemplo la organización de lo mas nuevo a viejo en los archivos mensuales / anuales.
En resumen personalizarlo, aunque no encuentro demasiada documentación.
Gracias.
-
Yo la tengo instalada en una de mis estaciones, y veo que no aparece la grafica de la humedad.
-
Buenos días, para quién lo necesite, adjunto skin.conf del neowx con su traducción a castellano y a catalán/valenciano.
Espero que las traducciones estén bien hechas.
Saludos.
-
Recordaros que para poder modificar el css de la página y/o algunos javascript, previamente hay que desminificarlos. Esto es devolverles los espacios y el formato que el programador les quita para publicarlos en Internet por dos motivos, uno hacerlos un poco mas ilegibles para entorpecer su modificación y el mas primordial que es bajar su tamaño de cara a ser mas eficiente la transmisión del fichero.
Por ejemplo podeis utilizar una herramienta de la web:
https://mrcoles.com/blog/css-unminify/ (https://mrcoles.com/blog/css-unminify/)
Modificar y luego si queréis volver a minificar el fichero. Por ejemplo usando https://www.willpeavy.com/minifier/ (https://www.willpeavy.com/minifier/)
Herramientas para esto hay muchas, para gustos ... colores.
Xavi.
-
Muchas gracias Xavi por el aporte de la traducción y los comentarios.
-
Hola
Estaba probando este skin y quería modificar el color de las líneas Max y Min,el dato registrado y la hora,ese color grisáceo que no se ve gran cosa.
Ya he probado modificando el archivo skin pero solo me cambia los colores de los gráficos, ya le he dado mil vueltas y no acierto ::)
Adjunto el skin y el archivo index...
Un saludo y gracias
-
Mira a ver si hay un fichero css
Ahora todo se hace con css......para mi un horror, con lo bueno que era el html a pelo, ja ja
-
Pues sí, como dice jantoni es de un fichero css concretamente de style.css
Ábrelo y localiza este selector:
.crd .crd-content table.meta td{padding:.15rem .4rem .15rem 0;color:#ccc}
donde pone al final color:#ccc es el color que quieres cambiar. Es un tono de gris, si lo quieres poner más oscuro ponle simplemente grey o ya juegas con los tonos:
https://www.w3schools.com/colors/colors_shades.asp
Saludos
-
Ole maestro apla3
-
jajajaja mira quien lo dice *-* *-*
:aplaude1:
-
Ok,gracias....algo he visto de css y roboto *-* *-*
Un rato pruebo :aplaude1:
Saludos
-
Hola
Lo único que he encontrado sobre css en el archivo index es esto...no veo donde cambiar el color :-\
<!-- CSS -->
<link rel="stylesheet" href="weather-icons/css/weather-icons.min.css" type="text/css">
<link rel="stylesheet" href="weather-icons/css/weather-icons-wind.min.css" type="text/css">
<link rel="stylesheet" href="style.css" type="text/css">
¿Quizás sea añadir en esta parte de crd-content?
<!-- Main data -->
<div class="row gutters row-gutters">
<div class="col col-9">
<div class="row gutters row-gutters">
<div class="col col-4 crd">
<h4><i class="wi wi-thermometer"></i> $Extras.Translation.out_temp</h4>
<div class="crd-content">
<span class="weatherdata">$current.outTemp</span>
<table class="meta">
<tr>
<td>$Extras.Translation.high:</td>
<td>$day.outTemp.max</td>
<td>($day.outTemp.maxtime.format("%H:%M"))</td>
</tr>
<tr>
<td>$Extras.Translation.low:</td>
<td>$day.outTemp.min</td>
<td>($day.outTemp.mintime.format("%H:%M"))</td>
</tr>
</table>
-
http://www.meteolamadrid.es/eltiempo/style.css
Busca esa cadena ahí en el fichero style.css de tu servidor.
Quizás la tuvieses que cambiar también en el archivo de la carpeta Neowx de weewx para que si lo sube no sobrescriba el de tu servidor si lo has editado.
-
Si quieres probar estilos directamente en el navegador sin tener que estar editándolos en tu servidor por FTP y recargando página etc etc para ver cómo quedan puedes echar un vistazo a cómo se utilizan las herramientas de desarrollador por ejemplo de Chrome (cada navegador tiene las suyas):
https://developers.google.com/web/tools/chrome-devtools/inspect-styles/edit-styles?hl=es
En las herramientas del desarrollador se pueden probar estilos, ver cómo son heredados, crear nuevos elementos, ver si falla algo de JavaScript etc etc, son unas herramientas muy valiosas para desarrollar y depurar código de nuestras páginas.
Solamente las cambiamos en nuestro navegador, al recargar la página perdemos los cambios y para que sean permanentes hay que editarlos en los archivos de nuestro servidor.
-
Perfecto :)
Me ha costado un rato entender el funcionamiento pero con las herramientas que me has indicado de google es mas sencillo ya que puedes ver como queda,después es solo modificar el archivo css en la raspberry.
Es un "tinglao"... una parte se modifica en el skin otra en el index y ahora en el css :;
Gracias :aplaude1: