mirror of
				https://github.com/DerTyp7/explainegy-nextjs.git
				synced 2025-10-31 05:37:12 +01:00 
			
		
		
		
	jh
This commit is contained in:
		
							
								
								
									
										72
									
								
								styles/Footer.module.scss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										72
									
								
								styles/Footer.module.scss
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,72 @@ | ||||
| @import "variables.scss"; | ||||
| .footer { | ||||
| 	padding: 200px 15px 30px 15px; | ||||
| 	display: flex; | ||||
| 	flex-direction: column; | ||||
| 	justify-content: center; | ||||
| 	align-items: center; | ||||
| 	gap: 50px 50px; | ||||
|  | ||||
| 	.adContainer { | ||||
| 		background-color: #ff00003e; | ||||
| 		width: $footer-ad-container-width; | ||||
| 		height: $footer-ad-container-height; | ||||
|  | ||||
| 		@media (max-width: $footer-ad-container-width) { | ||||
| 			width: 100%; | ||||
| 		} | ||||
| 	} | ||||
| 	.content { | ||||
| 		display: grid; | ||||
| 		grid-template-columns: 1fr 1fr; | ||||
| 		gap: 100px 100px; | ||||
| 		align-items: center; | ||||
|  | ||||
| 		@media (max-width: $footer-breakpoint-1) { | ||||
| 			column-gap: 10px; | ||||
| 		} | ||||
|  | ||||
| 		@media (max-width: $footer-breakpoint-3) { | ||||
| 			grid-template-columns: 1fr; | ||||
| 			gap: 100px 20px; | ||||
| 		} | ||||
|  | ||||
| 		.company { | ||||
| 			float: right; | ||||
| 			display: flex; | ||||
| 			justify-content: center; | ||||
| 			align-items: center; | ||||
| 			width: 100; | ||||
| 			flex-shrink: 0; | ||||
| 			flex: 1; | ||||
| 			text-align: center; | ||||
| 			column-gap: 10px; | ||||
| 			font-size: 0.8em; | ||||
| 			@media (max-width: $footer-breakpoint-1) { | ||||
| 				flex-direction: column; | ||||
| 				font-size: 0.7em; | ||||
| 				column-gap: 0px; | ||||
| 			} | ||||
|  | ||||
| 			@media (max-width: $footer-breakpoint-3) { | ||||
| 				grid-row: 2; | ||||
| 			} | ||||
| 		} | ||||
|  | ||||
| 		.links { | ||||
| 			display: flex; | ||||
| 			justify-content: right; | ||||
| 			align-items: center; | ||||
|  | ||||
| 			.grid { | ||||
| 				display: grid; | ||||
| 				grid-template-columns: 1fr 1fr 1fr; | ||||
| 				gap: 20px 100px; | ||||
|  | ||||
| 				@media (max-width: $footer-breakpoint-4) { | ||||
| 					column-gap: 15px; | ||||
| 				} | ||||
| 			} | ||||
| 		} | ||||
| 	} | ||||
| } | ||||
		Reference in New Issue
	
	Block a user
	 Janis
					Janis