feat: footer at bottom thanks to main
This commit is contained in:
		
							parent
							
								
									3a0fe3c342
								
							
						
					
					
						commit
						c29e6ef16f
					
				| @ -16,6 +16,11 @@ a { | ||||
|     } | ||||
| } | ||||
| 
 | ||||
| /*Main content (between header and footer)*/ | ||||
| body > main { | ||||
|     min-height: calc(100vh - ((3.2rem + 2*0.75rem) + 6rem) + 1px); | ||||
| } | ||||
| 
 | ||||
| header { | ||||
|     display: flex; | ||||
|     flex-direction: row; | ||||
| @ -26,6 +31,7 @@ header { | ||||
|      | ||||
|     background-color: var(--background); | ||||
|     color: var(--accent); | ||||
|     height: 2rem; | ||||
| } | ||||
| 
 | ||||
| header > form { | ||||
| @ -33,7 +39,7 @@ header > form { | ||||
|     flex-direction: row; | ||||
|     align-items: center; | ||||
|     gap: 8px; | ||||
|     padding: 4px 8px; | ||||
|     padding: 2px 8px; | ||||
|     border: solid 2px var(--accent); | ||||
|     border-radius: var(--radius); | ||||
|      | ||||
| @ -54,3 +60,16 @@ header > form { | ||||
|         display: none; | ||||
|     } | ||||
| } | ||||
| 
 | ||||
| footer { | ||||
|     display: flex; | ||||
|     flex-direction: row; | ||||
|     width: 100vw; | ||||
|     height: 6rem; | ||||
|     justify-content: center; | ||||
|     align-items: center; | ||||
|     background: hsl(200, 5%, 85%); | ||||
|     &>p{ | ||||
|         font-size: large; | ||||
|     } | ||||
| } | ||||
| @ -28,8 +28,9 @@ | ||||
|     </header> | ||||
|     {% endblock %} | ||||
| 
 | ||||
| 
 | ||||
|     <main> | ||||
|     {% block body %}{% endblock %} | ||||
|     </main> | ||||
|      | ||||
|      | ||||
|     {% block footer %} | ||||
|  | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user