-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
138 lines (125 loc) · 6.41 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
---
---
<!DOCTYPE html>
<html lang="ja">
<head>
{% include head.html %}
<!-- Google Fonts / Font Awesome -->
<link rel="preconnect" href="https://fonts.googleapis.com/">
<link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin="">
<script src="https://kit.fontawesome.com/82f32b9df5.js" crossorigin="anonymous"></script>
<!-- CSS / Bootstrap -->
<link rel="stylesheet" href="./stylesheets/main.css">
<link rel="stylesheet" href="./stylesheets/bootstrap.css">
</head>
<body class="d-flex flex-column h-entry" id="body">
<div id='top' class="localmap-bg-landingpage">
<header class="d-flex align-items-center splash-localmap-image" style="background-image: linear-gradient(rgba(0, 0, 0, 0.000), rgba(0, 0, 0, 0.000)), url(/images/catch.png)">
<div class="container-lg">
<h1 class="p-name" style='margin-left: -20px;'>
<span class="localmap">📍LocalMap.jp</span>
</h1>
<hr class="my-3">
<p class="localmap-subtitle p-summary">地図で振り返る、地域の出来事</p>
</div>
</header>
</div>
<div class="localmap-bg-landingpage flex-fill">
<main class="container-lg pb-3 localmap-bg-landingpage">
<div class="row pt-2">
<aside class="col-lg-2 mt-lg-3 small"></aside>
<article id="maincontent" class="col-lg-8 mt-3">
<div class="text-center">
<div class="text-center my-4 py-5 px-3">
<p><a href='#about'><i class="fas fa-map-pin fa-3x"></i></a></p>
<h2 id='about' class="font-weight-bold py-3">LocalMap.jp とは</h2>
<p class="lead font-weight-light py-2">
<a href='https://minkei.net/'>みんなの経済新聞ネットワーク</a>の各地域で配信されたニュース記事をプロットした地図です。
</p>
<p class="lead font-weight-light py-2" style='margin-bottom: 50px;'>
地図上のアイコンをクリックすると、その場所で起こった出来事の記事が読めます。
</p>
<video alt="📍 LocalMap.jp Demo" width="100%" autoplay muted loop playsinline controls><source src="https://i.gyazo.com/c321a78eb4296f8fc2d9dd310f5000b9.mp4" type="video/mp4" /></video>
<p><small>※
情報は公開当時のものです。飲食店利用などの際は現在の営業日時をご確認ください。
</small></p>
</div>
<div class="text-center my-4 py-5 px-3">
<p><a href='#area'><i class="fas fa-map-location-dot fa-3x"></i></a></p>
<h2 id='area' class="font-weight-light py-3">対応地域</h2>
<p class="lead font-weight-light py-2">LocalMap.jp は以下の地域に現在対応しています。</p>
{% for map in site.data.maps %}
{% unless map['draft'] %}
<a class="btn btn-primary btn-lg my-3 text-white" role="button"
href="/{{ map['id'] }}">{{ map['area'] }}（{{ map['pref'] }}）</a>
{% endunless %}
{% endfor %}
</div>
<div class="text-center my-4 py-5 px-3">
<p><a href='#benefit'><i class="fas fa-message-smile fa-3x"></i></a></p>
<h2 id='benefit' class="font-weight-light py-3">利用者の声</h2>
<p class="lead font-weight-light py-2">
地図掲載メディアおよび利用者から、現在以下の用途で役立っているという声が届いております。
<ul class='text-left'>
<li>視覚で規模感が分かり、スポンサーに伝えやすい</li>
<li>地域の出来事について調べるときに役立った</li>
<li>近所の出来事について知るキッカケになった</li>
</ul>
</p>
</div>
<div class="text-center my-4 py-5 px-3">
<p><a href='#business'><i class="fas fa-chart-simple fa-3x"></i></a></p>
<h2 id='business' class="font-weight-light py-3">データ利用について</h2>
<p class="lead font-weight-light py-2">事業者向けのデータ提供も予定しています。ご興味あれば下記フォームからお問い合わせください。</p>
<a id='business-sample' class="btn btn-primary btn-lg my-3 text-white" href="/takadanobaba.json" role="button" style='padding-left: 14px; padding-right: 14px;'>サンプルデータ (JSON) を見る</a>
</div>
<div class="text-center my-4 py-5 px-3">
<p><a href='#howto'><i class="fas fa-file-pen fa-3x"></i></a></p>
<h2 id='howto' class="font-weight-light py-3">地図作成について</h2>
<p class="lead font-weight-light py-2">
<a href='https://minkei.net/list.html'>みんなの経済新聞ネットワーク</a>内のメディアであれば地図を作成できます。詳細は<a href='https://takadanobaba.keizai.biz/contact/contact.html'>高田馬場経済新聞までお問い合わせ</a>ください。
</p>
<a id='contact' class="btn btn-primary btn-lg my-3 text-white" href="https://takadanobaba.keizai.biz/contact/contact.html" role="button">お問い合わせフォームを見る</a>
</div>
<br><br><br>
</div>
</article>
</div>
</main>
</div>
<!-- Footer -->
<footer class="footer-localmap text-center mt-0 pt-4">
<div class="container">
<div class="row">
<div class="col-xl-10 offset-xl-1">
<div role="navigation" class="d-flex flex-wrap justify-content-center">
<a href="https://twitter.com/baba_keizai" title="Twitterアカウントを見る" class="localmap-footer-sociallink lead">
<span class="fa-stack fa-lg" aria-hidden="true">
<i class="fa-brands fa-twitter fa-stack-1x fa-inverse"></i>
</span>
<span class="sr-only">Twitter</span>
</a>
<a href="https://github.com/yasslab/localmap.jp" title="ソースコードを見る" class="localmap-footer-sociallink lead">
<span class="fa-stack fa-lg" aria-hidden="true">
<i class="fab fa-github fa-stack-1x fa-inverse"></i>
</span>
<span class="sr-only">GitHub</span>
</a>
<a href="https://takadanobaba.keizai.biz/headline/1021/" title="立ち上げの経緯を見る" class="localmap-footer-sociallink lead">
<span class="fa-stack fa-lg" aria-hidden="true">
<i class="fas fa-newspaper fa-stack-1x fa-inverse"></i>
</span>
<span class="sr-only"></span>
</a>
</div>
<ul style='list-style: none; margin-left: -39px; padding-top: 20px; padding-bottom: 30px;'>
<li>運営：<a href='https://takadanobaba.keizai.biz/'>高田馬場経済新聞</a></li>
<li style='margin-left: -1px;'>開発：<a href="https://yasslab.jp/ja/">YassLab株式会社</a></li>
</ul>
</div>
</div>
</div>
</footer>
{% include analytics.html %}
</body>
</html>