apps/homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

correct spacer for sigil to be always visible

Browse Source
This commit is contained in:
Vishesh 'ironeagle' Bangotra
2025-09-22 20:28:40 +05:30
parent 0964c0c9bb
commit 5e3419c3c3
1 changed files with 85 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

160
app/routes/home.tsx
View File

@@ -68,8 +68,8 @@ export default function Home() {
<Container maxWidth="lg"> <Container maxWidth="lg">
<Box <Box
sx={{ sx={{
minHeight: "100vh", minHeight: "150vh",
backgroundImage: "url('/aetos_sigil.jpg')", backgroundImage: "url('/extended_sigil.png')",
backgroundSize: "cover", backgroundSize: "cover",
backgroundRepeat: "no-repeat", backgroundRepeat: "no-repeat",
backgroundPosition: "center", backgroundPosition: "center",
@@ -77,87 +77,97 @@ export default function Home() {
flexDirection: "column", flexDirection: "column",
}} }}
> >
{/* Top section */}
<Box sx={{py: 6, textAlign: "center"}}>
<Typography variant="h3" sx={{color: "success.main"}}>
Aetos Hideout
</Typography>
</Box>
{/* Spacer pushes bottom part down */} {/* Spacer pushes bottom part down */}
<Box sx={{flex: 1}}/> <Box sx={{flex: 1}}/>
{/* Bottom dashboard */} {/* Bottom dashboard: only 50% height of viewport */}
<Container maxWidth="lg" sx={{mb: 4}}> <Box
<Typography sx={{
variant="h5" height: "80vh", // 50% of viewport height
align="center" overflowY: "auto", // scroll if content overflows
sx={{color: "warning.main", mt: 4, mb: 2}} p: 2,
}}
>
<Container
maxWidth="lg"
sx={{
bgcolor: "#1a1a1a", // dark background
borderRadius: 3,
p: 3,
boxShadow: 6,
}}
> >
Core Services <Typography
</Typography> variant="h5"
<Grid container spacing={3} justifyContent="center"> align="center"
{services.core.map((s) => ( sx={{color: "warning.main", mt: 4, mb: 2}}
<Paper >
elevation={3} Core Services
sx={{ </Typography>
p: 2, <Grid container spacing={3} justifyContent="center">
textAlign: "center", {services.core.map((s) => (
bgcolor: "#2d2d2d", <Paper
borderRadius: 2, elevation={3}
}} sx={{
> p: 2,
<Link textAlign: "center",
href={s.url} bgcolor: "#2d2d2d",
target={s.external ? "_blank" : undefined} borderRadius: 2,
rel="noopener" }}
underline="none"
sx={{fontSize: 18, fontWeight: "bold", color: "success.main"}}
> >
{s.name} <Link
</Link> href={s.url}
<Typography variant="body2" sx={{mt: 1, color: "#ccc"}}> target={s.external ? "_blank" : undefined}
{s.desc} rel="noopener"
</Typography> underline="none"
</Paper> sx={{fontSize: 18, fontWeight: "bold", color: "success.main"}}
))} >
</Grid> {s.name}
</Link>
<Typography variant="body2" sx={{mt: 1, color: "#ccc"}}>
{s.desc}
</Typography>
</Paper>
))}
</Grid>
<Typography <Typography
variant="h5" variant="h5"
align="center" align="center"
sx={{color: "warning.main", mt: 4, mb: 2}} sx={{color: "warning.main", mt: 4, mb: 2}}
> >
Media Services Media Services
</Typography> </Typography>
<Grid container spacing={3} justifyContent="center"> <Grid container spacing={3} justifyContent="center">
{services.media.map((s) => ( {services.media.map((s) => (
<Paper <Paper
elevation={3} elevation={3}
sx={{ sx={{
p: 2, p: 2,
textAlign: "center", textAlign: "center",
bgcolor: "#2d2d2d", bgcolor: "#2d2d2d",
borderRadius: 2, borderRadius: 2,
}} }}
>
<Link
href={s.url}
target={s.external ? "_blank" : undefined}
rel="noopener"
underline="none"
sx={{fontSize: 18, fontWeight: "bold", color: "success.main"}}
> >
{s.name} <Link
</Link> href={s.url}
<Typography variant="body2" sx={{mt: 1, color: "#ccc"}}> target={s.external ? "_blank" : undefined}
{s.desc} rel="noopener"
</Typography> underline="none"
</Paper> sx={{fontSize: 18, fontWeight: "bold", color: "success.main"}}
))} >
</Grid> {s.name}
</Container> </Link>
<Typography variant="body2" sx={{mt: 1, color: "#ccc"}}>
{s.desc}
</Typography>
</Paper>
))}
</Grid>
</Container>
</Box>
</Box> </Box>
</Container> </Container>
); );
} }