This commit is contained in:
Manav Rathi 2024-05-25 06:01:06 +05:30
parent 69beecb7bb
commit e23bc2602f
No known key found for this signature in database
2 changed files with 77 additions and 75 deletions

View file

@ -25,80 +25,6 @@ import { useContext, useEffect, useState } from "react";
import { Trans } from "react-i18next";
import { AppContext } from "./_app";
const Container = styled("div")`
display: flex;
flex: 1;
align-items: center;
justify-content: center;
background-color: #000;
@media (max-width: 1024px) {
flex-direction: column;
}
`;
const SlideContainer = styled("div")`
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
@media (max-width: 1024px) {
flex-grow: 0;
}
`;
const DesktopBox = styled("div")`
flex: 1;
height: 100%;
padding: 10px;
display: flex;
align-items: center;
justify-content: center;
background-color: #242424;
@media (max-width: 1024px) {
display: none;
}
`;
const MobileBox = styled("div")`
display: none;
@media (max-width: 1024px) {
max-width: 375px;
width: 100%;
padding: 12px;
display: flex;
flex-direction: column;
gap: 8px;
}
`;
const SideBox = styled("div")`
display: flex;
flex-direction: column;
min-width: 320px;
`;
const TextContainer = (props: TypographyProps) => (
<Typography color={"text.muted"} mt={2} mb={3} {...props} />
);
const FeatureText = (props: TypographyProps) => (
<Typography variant="h3" mt={4} {...props} />
);
const Img = styled("img")`
height: 250px;
object-fit: contain;
@media (max-width: 400px) {
height: 180px;
}
`;
export default function LandingPage() {
const router = useRouter();
@ -223,6 +149,64 @@ export default function LandingPage() {
);
}
const Container = styled("div")`
display: flex;
flex: 1;
align-items: center;
justify-content: center;
background-color: #000;
@media (max-width: 1024px) {
flex-direction: column;
}
`;
const SlideContainer = styled("div")`
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
@media (max-width: 1024px) {
flex-grow: 0;
}
`;
const DesktopBox = styled("div")`
flex: 1;
height: 100%;
padding: 10px;
display: flex;
align-items: center;
justify-content: center;
background-color: #242424;
@media (max-width: 1024px) {
display: none;
}
`;
const MobileBox = styled("div")`
display: none;
@media (max-width: 1024px) {
max-width: 375px;
width: 100%;
padding: 12px;
display: flex;
flex-direction: column;
gap: 8px;
}
`;
const SideBox = styled("div")`
display: flex;
flex-direction: column;
min-width: 320px;
`;
const Slideshow: React.FC = () => {
return (
<CarouselProvider
@ -276,6 +260,24 @@ const Slideshow: React.FC = () => {
);
};
const TextContainer = (props: TypographyProps) => (
<Typography color={"text.muted"} mt={2} mb={3} {...props} />
);
const FeatureText = (props: TypographyProps) => (
<Typography variant="h3" mt={4} {...props} />
);
const Img = styled("img")`
height: 250px;
object-fit: contain;
@media (max-width: 400px) {
height: 180px;
}
`;
const CustomDotGroup = styled(DotGroup)`
margin-block-start: 2px;
margin-block-end: 24px;

View file

@ -5,7 +5,7 @@ import { OverflowMenuContext } from "./context";
interface Iprops {
onClick: () => void;
color?: "primary" | "secondary" | "critical",
color?: "primary" | "secondary" | "critical";
startIcon?: React.ReactNode;
endIcon?: React.ReactNode;
keepOpenAfterClick?: boolean;