[Design] Responsive buttons. Minor fixes.
This commit is contained in:
		| @@ -2,6 +2,10 @@ $cloud_width: 200px; | ||||
|  | ||||
| @import 'fonts'; | ||||
|  | ||||
| * { | ||||
| 	box-sizing: border-box; | ||||
| } | ||||
|  | ||||
| body { | ||||
| 	margin: 0; | ||||
| 	padding: 0; | ||||
| @@ -34,7 +38,7 @@ body { | ||||
| 		display: flex; | ||||
| 		align-items: end; | ||||
| 		.wrapper { | ||||
| 			height: 100%; | ||||
| 			min-height: 70vh; | ||||
| 			align-items: flex-end; | ||||
| 			padding-bottom: 3em; | ||||
| 		} | ||||
| @@ -44,8 +48,9 @@ body { | ||||
| 		background-image: linear-gradient(#26a4c4, #afdde9); | ||||
| 		min-height: 30vh; | ||||
| 		.wrapper { | ||||
| 			min-height: 30vh; | ||||
| 			align-items: center; | ||||
| 			justify-content: space-between; | ||||
| 			justify-content: space-around; | ||||
| 			flex-direction: column; | ||||
| 			padding-top: 3em; | ||||
| 			height: 100%; | ||||
| @@ -69,7 +74,7 @@ body { | ||||
| 				} | ||||
| 			} | ||||
| 			footer { | ||||
| 				margin-top: 3em; | ||||
| 				margin-top: 1em; | ||||
| 				padding: 0 1em; | ||||
| 				text-align: center; | ||||
| 				color: #292929; | ||||
| @@ -107,6 +112,21 @@ h1 { | ||||
| 	text-align: center; | ||||
| } | ||||
|  | ||||
| @media (max-width: 600px) { | ||||
| 	body { | ||||
| 		.bottom { | ||||
| 			.wrapper { | ||||
| 				.content { | ||||
| 					.button { | ||||
| 						font-size: 1em; | ||||
| 						padding: 0.5em; | ||||
| 					} | ||||
| 				} | ||||
| 			} | ||||
| 		} | ||||
| 	} | ||||
| } | ||||
|  | ||||
|  | ||||
| @keyframes move_right { | ||||
| 	from {left: 0} | ||||
|   | ||||
		Reference in New Issue
	
	Block a user