1.3 KiB
Vistas y Estilos
Vistas (HTML)
Si quieres modificar el HTML de alguna página puedes hacerlo copiando el HTML de app/views y poniendolo en app/views/custom respetando los subdirectorios que encuentres ahí. Por ejemplo si quieres modificar app/views/pages/conditions.html debes copiarlo y modificarla en app/views/custom/pages/conditions.html.erb
Estilos CSS con SASS
Si quieres cambiar algun selector CSS (de las hojas de estilo) puedes hacerlo en el fichero app/assets/stylesheets/custom.scss. Por ejemplo si quieres cambiar el color del header (.top-links) puedes hacerlo agregando:
.top-links {
background: red;
}
Si quieres cambiar alguna variable de foundation puedes hacerlo en el fichero app/assets/stylesheets/_custom_settings.scss. Por ejemplo para cambiar el color general de la aplicación puedes hacerlo agregando:
$brand: #446336;
Usamos un preprocesador de CSS, SASS, con la sintaxis SCSS.
Además puedes comprobar la sintaxis de tus ficheros scss con:
scss-lint
Accesibilidad
Para mantener el nivel de accesibilidad, si añades colores nuevos utiliza un Comprobador de contraste de color (WCAG AA es obligatorio, WCAG AAA es recomendable)