mirror of
				https://gitlab.com/parroquia-san-leandro/cancionero-web.git
				synced 2025-10-31 13:18:39 +01:00 
			
		
		
		
	Rediseño de la interfaz y arreglos menores
- ¡Ahora con tema oscuro! Se activa según el navegador del usuario. - URL de audios simplificada. - Nuevos iconos para canciones con acordes/audios. - Enlaces de la cabecera actualizados. - Siempre mostramos los ajustes. - Insertar espacio forzoso para separar algunas palabras que se juntaban. - Soporte para canciones con dos líneas de acordes (e.g. Engrandece).
This commit is contained in:
		
					parent
					
						
							
								e838b066de
							
						
					
				
			
			
				commit
				
					
						03522304fa
					
				
			
		
					 15 changed files with 203 additions and 83 deletions
				
			
		|  | @ -5,10 +5,6 @@ table.chordedline { | |||
|     display: inline-block; | ||||
| } | ||||
| 
 | ||||
| .song div { | ||||
|     padding: 0.5em 0; | ||||
| } | ||||
| 
 | ||||
| .chordedline td { | ||||
|     padding: 0px; | ||||
| } | ||||
|  | @ -16,11 +12,21 @@ table.chordedline { | |||
| .chord { | ||||
|     font-style: italic; | ||||
|     color: @chord-color; | ||||
|     @media (prefers-color-scheme: dark) { | ||||
|         color: @chord-color-dark; | ||||
|     } | ||||
| } | ||||
| 
 | ||||
| div.chorus { | ||||
| .song div { | ||||
|     margin: 0.5em 0; | ||||
| } | ||||
| 
 | ||||
| div.chorus, p.chorus { | ||||
|     font-weight: bold; | ||||
|     border-left: black 2px solid; | ||||
|     border-left: @text 2px solid; | ||||
|     @media (prefers-color-scheme: dark) { | ||||
|         border-left: @text-dark 2px solid; | ||||
|     } | ||||
|     padding-left: 0.5em; | ||||
|     div { | ||||
|         padding-left: 0.5em; | ||||
|  | @ -37,6 +43,10 @@ div.chorus { | |||
|     display: inline-block; | ||||
|     width: 1em; | ||||
|     height: 2em; | ||||
|     @media (prefers-color-scheme: dark) { | ||||
|         /* Black to white filter for svgs */ | ||||
|         filter: invert(100%); | ||||
|     } | ||||
| } | ||||
| 
 | ||||
| .lrep { | ||||
|  | @ -63,10 +73,18 @@ button, select#transposeSelect { | |||
|     padding: .4em; | ||||
|     border-style: none; | ||||
|     border-radius: @border-radius; | ||||
|     color: @text; | ||||
|     background-color: @secondary; | ||||
|     @media (prefers-color-scheme: dark) { | ||||
|         color: @text-dark; | ||||
|         background-color: @secondary-dark; | ||||
|     } | ||||
|     &:hover { | ||||
|         background-color: @secondary-hover; | ||||
|         transition-duration: @transition; | ||||
|         @media (prefers-color-scheme: dark) { | ||||
|             background-color: @secondary-hover-dark; | ||||
|         } | ||||
|     } | ||||
| } | ||||
| 
 | ||||
|  | @ -75,4 +93,7 @@ select#transposeSelect { | |||
|     -moz-appearance: none; | ||||
|     font-weight: bold; | ||||
|     color: black; | ||||
|     @media (prefers-color-scheme: dark) { | ||||
|         color: @text-dark; | ||||
|     } | ||||
| } | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue