Function PostIndex

src/Components/Post/PostIndex.jsx:65–115

()

}

export default function PostIndex() {
    return (
        <Box sx={{flex: 1, minHeight: 0, overflowY: "auto", width: "100%", py: {xs: 1, sm: 2}}}>
            <Typography variant="h5" sx={{fontWeight: 700}}>经验分享帖</Typography>
            <Typography sx={{color: "text.secondary", mt: 1, mb: 4, maxWidth: 720}}>
                学长学姐的申请与发展经验长文，覆盖从选校、套磁、文书到海外就业与长期规划的方方面面。
                从左侧列表选择一篇开始阅读，也欢迎你贡献自己的故事。
            </Typography>

            <SectionLabel>快速上手</SectionLabel>
            <Box sx={{display: "grid", gridTemplateColumns: "repeat(auto-fill, minmax(300px, 1fr))", gap: 2}}>
                {tips.map((tip) => (
                    <Paper key={tip.title} elevation={0}
                           sx={{bgcolor: (theme) => theme.palette.surfaceVariant, borderRadius: 3, p: 2.5, display: "flex", gap: 2, alignItems: "flex-start"}}>
                        <IconTile>{tip.icon}</IconTile>
                        <Box>
                            <Typography sx={{fontWeight: 600, mb: 0.5}}>{tip.title}</Typography>
                            <Typography variant="body2" sx={{color: "text.secondary", lineHeight: 1.7}}>{tip.desc}</Typography>
                        </Box>
                    </Paper>
                ))}
            </Box>

            <Box sx={{mt: 4}}>
                <SectionLabel>常见主题</SectionLabel>
                <Paper elevation={0}
                       sx={{bgcolor: (theme) => theme.palette.surfaceVariant, borderRadius: 3, p: 2.5, display: "flex", flexWrap: "wrap", gap: 1}}>
                    {topics.map((topic) => (
                        <Chip key={topic} label={topic}
                              sx={{bgcolor: (theme) => theme.palette.surface, color: "text.primary", fontWeight: 500}}/>
                    ))}
                </Paper>
            </Box>

            <Box sx={{mt: 4}}>
                <SectionLabel>注意事项</SectionLabel>
                <Paper elevation={0} sx={{bgcolor: (theme) => theme.palette.surfaceVariant, borderRadius: 3, p: 2.5}}>
                    <Box sx={{display: "flex", alignItems: "center", gap: 1, mb: 1, color: "text.primary"}}>
                        <BlockOutlined fontSize="small" sx={{color: "primary.main"}}/>
                        <Typography sx={{fontWeight: 600}}>发帖与评论前请留意</Typography>
                    </Box>
                    <Box component="ul" sx={{m: 0, pl: 2.5, color: "text.secondary"}}>
                        {notes.map((note) => (
                            <Typography component="li" variant="body2" key={note} sx={{lineHeight: 1.9}}>{note}</Typography>
                        ))}
                    </Box>
                </Paper>
            </Box>
        </Box>
    );
}