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 { | header { | ||||||
|     display: flex; |     display: flex; | ||||||
|     flex-direction: row; |     flex-direction: row; | ||||||
| @ -26,6 +31,7 @@ header { | |||||||
|      |      | ||||||
|     background-color: var(--background); |     background-color: var(--background); | ||||||
|     color: var(--accent); |     color: var(--accent); | ||||||
|  |     height: 2rem; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| header > form { | header > form { | ||||||
| @ -33,7 +39,7 @@ header > form { | |||||||
|     flex-direction: row; |     flex-direction: row; | ||||||
|     align-items: center; |     align-items: center; | ||||||
|     gap: 8px; |     gap: 8px; | ||||||
|     padding: 4px 8px; |     padding: 2px 8px; | ||||||
|     border: solid 2px var(--accent); |     border: solid 2px var(--accent); | ||||||
|     border-radius: var(--radius); |     border-radius: var(--radius); | ||||||
|      |      | ||||||
| @ -54,3 +60,16 @@ header > form { | |||||||
|         display: none; |         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> |     </header> | ||||||
|     {% endblock %} |     {% endblock %} | ||||||
| 
 | 
 | ||||||
| 
 |     <main> | ||||||
|     {% block body %}{% endblock %} |     {% block body %}{% endblock %} | ||||||
|  |     </main> | ||||||
|      |      | ||||||
|      |      | ||||||
|     {% block footer %} |     {% block footer %} | ||||||
|  | |||||||
		Loading…
	
		Reference in New Issue
	
	Block a user