-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
151 lines (148 loc) · 8.17 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
139
140
141
142
143
144
145
146
147
148
149
150
151
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>もくもくOnline勉強会</title>
<link rel="shortcut icon" href="./images/favicon.ico">
<link rel="apple-touch-icon" href="./images/apple-touch-icon.png">
<link rel="stylesheet" href="reset.css">
<link href="https://fonts.googleapis.com/css?family=M+PLUS+Rounded+1c" rel="stylesheet">
<link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">
<link rel="stylesheet" href="simple-grid.min.css">
<link rel="stylesheet" href="stylesheet.css">
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-175204787-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-175204787-1');
</script>
</head>
<body>
<header class="blue-back" role="banner">
<nav role="navigation">
<h1 class="header__logo white">
<a href="index.html"><img src="images/icon_logoBlackborder.png" alt="もくもくOnline勉強会 Logo" class="header__logo--image">もくもくOnline勉強会</a>
</h1>
<ul class="header__menu">
<li><a href="index.html">TOP</a></li>
<li><a href="https://ofuse.me/ofuse/mo9mo9study" target="_blank">OFUSE<i class="fas fa-external-link-alt"></i></a></li>
<li><a href="https://twitter.com/mo9mo9study" target="_blank">Twitter<i class="fas fa-external-link-alt"></i></a></li>
<li><a href="https://github.com/mo9mo9study/discord.study" target=”_blank”>Github<i class="fas fa-external-link-alt"></i></a></li>
<!-- <li><a href="index.html">Github</a></li> -->
</ul>
</nav>
</header>
<main role="main">
<section class="main__top lightblue-back">
<div class="top__message">
<h1>ようこそ！<br />あなたは学び続けている人ですか？</h1>
<p>私たちも学びを続けている人が集まっているギルドです。<br>オーナー自身が「自分にとって学びやすい環境」が欲しいと思い作り始め、現在はメンバーと会話を交えながら「よりよい学びの環境」を日々作り上げています。<br>そんな環境で、あなたも一緒に勉強しませんか？</p>
</div>
<img src="images/screen.png" alt="もくもくOnline勉強会 Dicord画面" class="top__img">
</section>
<section class="main__body blue-back">
<div class="container pt-50">
<!-- <h2>実績</h2> -->
<ul class="row numbers__lists">
<li class="col-4 numbers__list">
<img src="./images/icon_members.png" alt="参加メンバーアイコン" class="numbers__img">
<div>
<h3>参加メンバー</h3>
<p><span>79</span> 人<br>(12/8時点)</p>
</div>
</li>
<li class="col-4 numbers__list">
<img src="./images/icon_month.png" alt="月間学習時間アイコン" class="numbers__img">
<div>
<h3>月間学習時間</h3>
<p><span>2,055</span> 時間<br>(11/1〜11/30)</p>
</div>
</li>
<li class="col-4 numbers__list">
<img src="./images/icon_week.png" alt="週間学習時間アイコン" class="numbers__img">
<div>
<h3>週間学習時間</h3>
<p><span>316</span> 時間<br>(11/30〜12/6)</p>
</div>
</li>
</ul>
</div>
<!-- <div class="steps">
<h2>使い方</h2>
<div class="steps__list">
<div class="steps__list--first">
<h3>1st</h3>
</div>
<div class="steps__list--second">
<h3>2nd</h3>
</div>
<div class="steps__list--third">
<h3>3rd</h3>
</div>
</div>
</div> -->
<div class="container pt-50">
<!-- <h2>実績</h2> -->
<div class="row">
<div class="col-6 amari">
<iframe src="https://discordapp.com/widget?id=603582455756095488&theme=light" width="100%" height="500" allowtransparency="true" frameborder="0" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe>
</div>
<div class="col-6 twitter">
<a class="twitter-timeline" href="https://twitter.com/mo9mo9study?ref_src=twsrc%5Etfw" data-theme="light" height="500px" width="100%">Tweets by mo9mo9study</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
<a href="https://twitter.com/mo9mo9study?ref_src=twsrc%5Etfw" class="twitter-follow-button" data-show-count="false">Follow @mo9mo9study</a>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
</div>
</div>
<div class="container pt-50 pb-50">
<!-- <h2>特徴</h2> -->
<ul class="row features__lists">
<li class="col-4 features__list">
<img src="./images/icon_stopwatch.png" alt="勉強時間記録アイコン" class="numbers__img">
<h3>勉強時間記録</h3>
<p>ボイスチャンネルへの参加と退室を勉強の開始と終了時間とし、勉強終了時に勉強時間を記録・出力します。</p>
</li>
<li class="col-4 features__list">
<img src="./images/icon_week.png" alt="週間勉強集計アイコン" class="numbers__img">
<h3>週間勉強集計</h3>
<p>毎週月曜日に先週の勉強時間を全メンバー分集計して結果を出力します。</p>
</li>
<li class="col-4 features__list">
<i class="fab fa-github github"></i>
<h3>Github OpenSource</h3>
<p>コードは全てGithubにて公開管理しています。興味あればご自由にご利用ください。</p>
<div class="widget">
<iframe src="https://ghbtns.com/github-btn.html?user=mo9mo9study&repo=discord.study&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="80" height="20"></iframe>
<iframe src="https://ghbtns.com/github-btn.html?user=mo9mo9study&repo=discord.study&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="95" height="20"></iframe>
</div>
</li>
</ul>
<ul class="row features__lists">
<li class="col-4 features__list">
<i class="fas fa-hashtag"></i>
<h3>ハッシュタグ</h3>
<p>ギルドの専用ハッシュタグです。<br>「#もくもく勉強机」と「#もくもくオンライン勉強会」のハッシュタグを使うメンバーはギルドのメンバーの可能性が9割9分です。</p>
</li>
<li class="col-4 features__list">
<img src="./images/icon_personStudy.png" alt="ギルド図書館アイコン" class="numbers__img">
<h3>ギルド図書館</h3>
<p>Coming Soon...<br>ギルド内のメンバーが不要になった技術(物理)本をギルドのシステム管理下で一元管理し、メンバー同士で自由に貸し借りできる図書館機能です。</p>
</li>
<li class="col-4 features__list">
<img src="./images/dojo.png" alt="勉強道場アイコン" class="numbers__img">
<h3>勉強道場</h3>
<p>勉強をする仲間が集まり、勉強する内容を宣言して開始し、終了とともに勉強内容の報告をします。<br>同じ「勉強」という目的のもと集まる同調意識があなたを刺激する会です。</p>
</li>
</ul>
</div>
</section>
</main>
<footer class="lightblue-back" role="contentinfo">
<p>© 2020 mo9mo9study</p>
</footer>
</body>
</html>