pr request fixes (css)

ScottLogic · Feb 27, 2024 · a469f31 · a469f31
1 parent 3c7e723
commit a469f31
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 5 deletions.
diff --git a/frontend/src/components/LevelMissionInfoBanner/LevelMissionInfoBanner.css b/frontend/src/components/LevelMissionInfoBanner/LevelMissionInfoBanner.css
@@ -16,6 +16,7 @@
 
 .level-title-area {
 	min-width: 10%;
+	margin: 1rem 0;
 	font-weight: 800;
 	font-size: 1.875rem;
 }
@@ -26,19 +27,24 @@
 }
 
 .level-mission-info-banner .themed-button {
+	gap: 0.25rem;
 	height: auto;
+	padding: 0.75rem 1rem;
 	white-space: nowrap;
 }
 
 .info-icon {
-	margin-right: 0.25rem;
-	padding: 0 0.4rem;
-	border: 0.2rem;
+	display: flex;
+	align-items: center;
+	box-sizing: border-box;
+	height: auto;
+	padding: 0 0.625rem;
 	border-style: solid;
 	border-color: var(--action-button-text-colour);
 	border-radius: 50%;
 	background-color: var(--action-button-text-colour);
 	color: var(--action-button-background-colour);
 	font: 1rem serif;
 	font-weight: bold;
+	aspect-ratio: 1;
 }
diff --git a/frontend/src/components/LevelMissionInfoBanner/LevelMissionInfoBanner.tsx b/frontend/src/components/LevelMissionInfoBanner/LevelMissionInfoBanner.tsx
@@ -21,9 +21,9 @@ function LevelMissionInfoBanner({
 				}}
 			></p>
 			<ThemedButton onClick={openOverlay}>
-				<p className="info-icon" aria-hidden="true">
+				<span className="info-icon" aria-hidden="true">
 					i
-				</p>
+				</span>
 				Mission Info
 			</ThemedButton>
 		</span>