Style bugfixes and updates

src/pages/homepage/components/Header/Header.tsx

@@ -71,20 +71,10 @@ function Header({
 	return (
 		<Stack
 			style={{
-				borderBottom: '0px solid',
-				zIndex: 1,
-				clear: 'both',
-				display: 'flex',
 				flexDirection: isMobile ? 'column' : 'row',
-				gap: 0,
 			}}
 		>
-			<Stack
-				style={{
-					display: 'grid',
-					width: '100%',
-				}}
-			>
+			<Stack w={'100%'}>
 				<Text
 					className={textClasses.greeting}
 					classNames={textClasses}
@@ -99,10 +89,6 @@ function Header({
 			</Stack>
 			<Stack
 				style={{
-					display: 'flex',
-					float: 'right',
-					justifyContent: 'right',
-					width: 'auto',
 					gap: 0,
 					flexDirection: isMobile ? 'row' : 'column',
 				}}
@@ -119,27 +105,20 @@ function Header({
 						position: 'relative',
 						justifyContent: isMobile ? 'right' : 'space-between',
 						width: '100%',
-						gap: 0,
 					}}
 				>
 					<Group
 						align='end'
 						style={{
-							display: 'flex',
 							position: 'absolute',
 							bottom: isMobile ? -32 : 0,
-							right: 16,
+							right: 4,
 							cursor: 'pointer',
 							gap: 0,
 						}}
 						onClick={openWeatherModal}
 					>
-						<Text
-							component='h2'
-							className={textClasses.dateTime}
-							classNames={textClasses}
-							mr={'.25rem'}
-						>
+						<Text className={textClasses.dateTime} classNames={textClasses} mr={'.25rem'}>
 							{current.temperature}°F
 						</Text>
 						<Text
@@ -151,7 +130,7 @@ function Header({
 							{current.highTemp}°F/{current.lowTemp}°F
 						</Text>
 					</Group>
-					<Text component='h2' className={textClasses.dateTime} classNames={textClasses}>
+					<Text className={textClasses.dateTime} classNames={textClasses}>
 						{`${
 							time.getHours() === 0
 								? 12