Change min-width to flex-basis

FireIsGood · FireIsGood · commit f4139831295e · 2024-04-24T15:43:04.000-07:00
Keeps the same design but fixes a bug where screens below 300px overflow
diff --git a/src/components/BlogPost.astro b/src/components/BlogPost.astro
@@ -26,7 +26,7 @@ const { url, title, description } = Astro.props;
 		padding: 1em;
 		gap: 1em;
 		flex: 1;
-		min-width: 300px;
+		flex-basis: 300px;
 	}
 
 	.blog-post-card .info span {
diff --git a/src/components/Member.astro b/src/components/Member.astro
@@ -29,7 +29,7 @@ const { github, name } = Astro.props;
 		padding: 1em;
 		gap: 1em;
 		flex: 1;
-		min-width: 300px;
+		flex-basis: 300px;
 	}
 
 	.member-card .avatar {

Original file line number	Diff line number	Diff line change
`@@ -26,7 +26,7 @@ const { url, title, description } = Astro.props;`
`26`	`26`	`padding: 1em;`
`27`	`27`	`gap: 1em;`
`28`	`28`	`flex: 1;`
`29`		`- min-width: 300px;`
	`29`	`+ flex-basis: 300px;`
`30`	`30`	`}`
`31`	`31`
`32`	`32`	`.blog-post-card .info span {`
Original file line number	Diff line number	Diff line change
`@@ -29,7 +29,7 @@ const { github, name } = Astro.props;`
`29`	`29`	`padding: 1em;`
`30`	`30`	`gap: 1em;`
`31`	`31`	`flex: 1;`
`32`		`- min-width: 300px;`
	`32`	`+ flex-basis: 300px;`
`33`	`33`	`}`
`34`	`34`
`35`	`35`	`.member-card .avatar {`