chore(resp.): make mobile wrap coherent@@ -12,6 +12,7 @@ import { Grid } from "../components/Grid";
import { Layout } from "../components/Layout";
import { PageWrapper } from "../components/PageWrapper";
import { buildRouteLink } from "../utils/shared";
+import { breakpoints } from "../utils/style";
export interface HomeViewProps extends CommonProps {
foo?: boolean;
@@ -229,6 +230,9 @@ const HomeView: ReactView<HomeViewProps> = (props) => {
<style>{`
.feature-section {
display: flex;
+ width: 100%;
+ min-height: 80vh;
+ flex-direction: row;
align-items: center;
gap: 48;
flex-wrap: wrap;
@@ -236,6 +240,17 @@ const HomeView: ReactView<HomeViewProps> = (props) => {
.is-even {
flex-direction: row-reverse;
}
+ @media (max-width: ${breakpoints.sm}) {
+ .feature-section {
+ flex-direction: column;
+ }
+ .is-even {
+ flex-direction: column-reverse;
+ }
+ .is-odd {
+ flex-direction: column;
+ }
+ }
`}</style>
{isEven && (
<div className="feature-section is-even">