Click for more
This commit is contained in:
12
components/ClickForMore.js
Normal file
12
components/ClickForMore.js
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
export default function ClickForMore() {
|
||||||
|
return (
|
||||||
|
<span
|
||||||
|
style={{
|
||||||
|
textDecorationLine: "underline",
|
||||||
|
color: "red",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{"点击阅读更多..."}
|
||||||
|
</span>
|
||||||
|
);
|
||||||
|
}
|
||||||
117
components/Map.js
Normal file
117
components/Map.js
Normal file
@@ -0,0 +1,117 @@
|
|||||||
|
import Link from 'next/link';
|
||||||
|
|
||||||
|
import Copyright from './Copyright';
|
||||||
|
import Image from
|
||||||
|
|
||||||
|
import typhoonMapPreview from "../public/typhoon.png";
|
||||||
|
import doughtMapPreview from "../public/dought.png";
|
||||||
|
import snowMapPreview from "../public/snow.jpg";
|
||||||
|
import workInjureMapPreview from "../public/workInjury.png";
|
||||||
|
import geologicalDisasterMapPreview from '../public/geological.png';
|
||||||
|
import earthquakeMapPreview from '../public/earthquake.png';
|
||||||
|
import forestFireMapPreview from '../public/forestFire.png';
|
||||||
|
import floodsAndDroughtsMapPreview from '../public/floodsAndDroughts.png';
|
||||||
|
import trafficAccidentsMapPreview from '../public/traffic.png';
|
||||||
|
|
||||||
|
export default function Map() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Link
|
||||||
|
href="https://umap.openstreetmap.fr/zh/map/map_761199#4/36.24/122.08"
|
||||||
|
passHref
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
<h3>各省受台风影响地图</h3>
|
||||||
|
<small>
|
||||||
|
<Copyright />
|
||||||
|
吴懿鹏 & 林思源
|
||||||
|
</small>
|
||||||
|
<Image src={typhoonMapPreview} />
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
<Link
|
||||||
|
href="https://umap.openstreetmap.fr/zh/map/drought-disasters-in-chinas-provinces-from-2014-to_758463#5/34.940/109.248"
|
||||||
|
passHref
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
<h3>各省干旱灾害地图</h3>
|
||||||
|
<small>
|
||||||
|
<Copyright />
|
||||||
|
Keer ZHENG & Mengjia ZHENG
|
||||||
|
</small>
|
||||||
|
<Image src={doughtMapPreview} />
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
<Link href="#" passHref>
|
||||||
|
<div>
|
||||||
|
<h3>各省雪灾影响地图</h3>
|
||||||
|
<small>
|
||||||
|
<Copyright />
|
||||||
|
Shuyi GUO
|
||||||
|
</small>
|
||||||
|
<Image src={snowMapPreview} />
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
<Link href="https://umap.openstreetmap.fr/en/map/gis_756551#5/37.020/103.623" passHref>
|
||||||
|
<div>
|
||||||
|
<h3>各省工伤统计地图</h3>
|
||||||
|
<small>
|
||||||
|
<Copyright />
|
||||||
|
Stanley, Lori, & Kristin.
|
||||||
|
</small>
|
||||||
|
<Image src={workInjureMapPreview} />
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
<Link href="https://umap.openstreetmap.fr/zh/map/geological-disasters-in-mainland-china_758447#4/39.44/104.15" passHref>
|
||||||
|
<div>
|
||||||
|
<h3>各省突发地质灾害地图</h3>
|
||||||
|
<small>
|
||||||
|
<Copyright />
|
||||||
|
Sherry, Ivy, & Rika
|
||||||
|
</small>
|
||||||
|
<Image src={geologicalDisasterMapPreview} />
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
<Link href="https://umap.osm.ch/en/map/map_4637#4/41.44/118.21" passHref>
|
||||||
|
<div>
|
||||||
|
<h3>新中国成立后各省地震数据</h3>
|
||||||
|
<small>
|
||||||
|
<Copyright />
|
||||||
|
陈九如, 刘梦蝶, & 周鲲鹏
|
||||||
|
</small>
|
||||||
|
<Image src={earthquakeMapPreview} />
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
<Link href="https://umap.openstreetmap.fr/en/map/forest-fires-data-map-of-china-2015-2020_753341#4/35.89/104.24" passHref>
|
||||||
|
<div>
|
||||||
|
<h3>各省森林火灾地图</h3>
|
||||||
|
<small>
|
||||||
|
<Copyright />
|
||||||
|
Jessie, Peggy, & Cindy
|
||||||
|
</small>
|
||||||
|
<Image src={forestFireMapPreview} />
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
<Link href="https://umap.openstreetmap.fr/en/map/untitled-map_758141#4/41.97/106.83" passHref>
|
||||||
|
<div>
|
||||||
|
<h3>各省洪涝旱灾地图</h3>
|
||||||
|
<small>
|
||||||
|
<Copyright />
|
||||||
|
Jade, Cherry, & Mia
|
||||||
|
</small>
|
||||||
|
<Image src={floodsAndDroughtsMapPreview} />
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
<Link href="http://umap.openstreetmap.fr/en/map/traffic-accidents_756060#4/40.38/107.58" passHref>
|
||||||
|
<div>
|
||||||
|
<h3>各省交通事故地图</h3>
|
||||||
|
<small>
|
||||||
|
<Copyright />
|
||||||
|
Carolyn, Julianne, & Selina
|
||||||
|
</small>
|
||||||
|
<Image src={trafficAccidentsMapPreview} />
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
import Head from "next/head";
|
import Head from "next/head";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import Header from "../components/Header";
|
import Header from "../components/Header";
|
||||||
import Footer from '../components/Footer';
|
import ClickForMore from "../components/ClickForMore";
|
||||||
|
|
||||||
// styles
|
// styles
|
||||||
import styles from "../styles/Home.module.css";
|
import styles from "../styles/Home.module.css";
|
||||||
@@ -21,7 +21,7 @@ export default function Home() {
|
|||||||
<Link href="/posts/map" passHref>
|
<Link href="/posts/map" passHref>
|
||||||
<section className={styles.postPreview}>
|
<section className={styles.postPreview}>
|
||||||
<h2>全国灾害统计地图</h2>
|
<h2>全国灾害统计地图</h2>
|
||||||
<small>发布于 2022-05-12</small>
|
<small>发布于 2022-05-12</small>{" | "}<ClickForMore />
|
||||||
</section>
|
</section>
|
||||||
</Link>
|
</Link>
|
||||||
<hr />
|
<hr />
|
||||||
@@ -29,7 +29,7 @@ export default function Home() {
|
|||||||
<section className={styles.postPreview}>
|
<section className={styles.postPreview}>
|
||||||
<h2>Social OjO 正式成立</h2>
|
<h2>Social OjO 正式成立</h2>
|
||||||
<p>平台介绍、期望及使命</p>
|
<p>平台介绍、期望及使命</p>
|
||||||
<small>发布于 2022-05-12</small>
|
<small>发布于 2022-05-12</small>{" | "}<ClickForMore />
|
||||||
</section>
|
</section>
|
||||||
</Link>
|
</Link>
|
||||||
</main>
|
</main>
|
||||||
|
|||||||
Reference in New Issue
Block a user