You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

74 lines
2.0 KiB

// core
import React from "react";
// antd
import { Typography, Divider, Button, Card } from "antd";
const { Title, Text } = Typography;
// components
import AppLayout from "../components/AppLayout";
import { T } from "antd/lib/upload/utils";
import './index.less'
const App = () => (
<AppLayout>
<div>Home Page</div>
<Title>Nextjs with Ant Design & Less</Title>
<Text>
Go ahead and edit <code>/pages/index.js</code>, and see your changes here
</Text>
<Divider />
<Title level={2}>Useful Links</Title>
<Button
href="https://nextjs.org/learn/basics/getting-started"
target="__blank"
>
Next.js Learn
</Button>
<Button href="https://nextjs.org/docs/getting-started" target="__blank">
Next.js Docs
</Button>
<Button href="https://ant.design/components/button/" target="__blank">
antd Docs
</Button>
<Divider />
<div style={{ textAlign: "start" }}>
<Card className="main-card">
<Title level={2}>Quick Recap:</Title>
<Title level={4}>Shared App Layout</Title>
<Text>
Shared/Common App Layout is located at{" "}
<code>/components/AppLayout</code>
</Text>
<br />
<Text>Sider/sidebar, header and footer are all in this file.</Text>
<br />
<br />
<Title level={4}>antd Less</Title>
<Text>
antd's Less file is present at <code>/assets/antd-custom.less</code>
</Text>
<br />
<Text>
Head over to{" "}
<a
href="https://github.com/ant-design/ant-design/blob/master/components/style/themes/default.less"
target="__blank"
>
antd's theming docs
</a>{" "}
for a list of less variables.
</Text>
<br />
<Text>
If you dont wish to mess around with Less, just delete everything in
the less file.
</Text>
</Card>
</div>
</AppLayout>
);
export default App;