Merge pull request #27 from templerobotics/fixing-image

Fixing removing image

Author: ryanhodge240

src/pages/home/Home.tsx

@@ -12,7 +12,7 @@ import Button from '../general/button/Button'
 // Images
 import nasaLogo from '../../assets/pics/logos/nasa.png'
 import HOME_CAROUSEL_INFO from '../../data/HomeCarouselInfo'
-import TOwl from '../../assets/pics/logos/TransRoboOwl.svg'
+// import TOwl from '../../assets/pics/logos/TransRoboOwl.svg'
 const Home = (): React.ReactElement => {
 	return (
 		<Styles.HomeContainer>
@@ -35,19 +35,8 @@ const Home = (): React.ReactElement => {
 			</Styles.VideoSource>
 
 			<Styles.SectionHeader>
-				<h2>
-					<img src={TOwl}
-						alt='Owl'
-						style={{
-							width: '150px',   // Set the width of the image
-							height: '150px', // Set the height of the image
-							margin: '0 0 0 -100px',// Set the margin around the image
-							float: 'left'
-							// us a .docx
-
-						}}
-					/>
-						We hope to see you at Temple Fest 2023!</h2>
+				{/* <img src={TOwl} alt='Owl'/> */}
+				<h2>We hope to see you at Temple Fest 2023!</h2>
 				<div className='button-container'>
 					<Button text={'Sign up here!'} size={'large'} source={'https://forms.gle/rp6BY6h4doLkZQ2E8'}/>
 					<Button text='Join Teams Here!' source={`https://teams.microsoft.com/l/team/19%3aeaf903f

src/pages/home/HomeStyles.tsx

@@ -10,7 +10,7 @@ export default class HomeStyles {
 		grid-template-rows: 
 			max(calc(var(--vh) * .40), 250px)   	/* Intro heading */
 			calc(var(--vh) * .1)   					/* Intro heading button */
-			calc(var(--vh) * .15)   				/* Program section heading */
+			calc(var(--vh) * .3)   					/* Program section heading */
 			calc(var(--vh) * .4)    				/* Carousel */
 			max(calc(var(--vh) * .3), 100px)   		/* Sponsors section heading */
 			max(calc(var(--vh) * .15), 70px);  		/* Contacts */
@@ -55,7 +55,6 @@ export default class HomeStyles {
 	`
 
 	static readonly SectionHeader = styled.div`
-		height: 100%;
 		display: flex;
 		flex-direction: column;
 		align-items: center;
@@ -76,6 +75,13 @@ export default class HomeStyles {
 			column-gap: 10%;
 			justify-content: center;
 		}
+
+		& > img {
+			width: 50%;   // Set the width of the image
+			height: 50%; // Set the height of the image
+			float: left;
+			/* margin: 0 0 0 -500px; */
+		}
 	`
 
 	static readonly VideoSource = styled.div`

src/tools/services/SetDimensions.tsx

@@ -9,6 +9,7 @@ import useWindowDimensions, { setVariableCssVars } from '../HelpfulFunctions'
 const SetDimensions = (): React.ReactElement => {
 	// This is a new component because when in <App>, it was reloading if scrolled in too soon and looking bad.
 	document.documentElement.style.setProperty('--vh', `${useWindowDimensions().width}px`)
+	console.log('Width: '+useWindowDimensions().width)
 	isMobile ? null : setVariableCssVars()
 	// console.log('Mobile user: ' + isMobile)
 	return (<></>)