-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
143 lines (142 loc) · 8.97 KB
/
index.html
File metadata and controls
143 lines (142 loc) · 8.97 KB
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
<html lang="ja">
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-K23C0FNYN2"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-K23C0FNYN2');
</script>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Escape Group</title>
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@escgroup_">
<meta property="og:url" content="https://www.escgrp.org/">
<meta property="og:title" content="Escape Group">
<meta property="og:description" content="人のチカラは、偉大だ">
<meta property="og:image" content="https://user-images.githubusercontent.com/67098414/129159724-419645ff-4f37-495a-8dfa-a21d8864658e.png">
<link rel="icon" href="/favicon.ico">
<link rel="shortcut icon" type="image/png" href="https://github.com/esc-org.png">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css">
<link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Courier+Prime:wght@700&family=M+PLUS+Rounded+1c:wght@500&display=swap" rel="stylesheet">
<style>
@font-face {
font-family: TwitterChirp;
src: url(https://abs.twimg.com/fonts/chirp-regular-web.woff2) format('woff2');
src: url(https://abs.twimg.com/fonts/chirp-regular-web.woff) format('woff');
font-weight: 400;
font-style: 'normal';
font-display: 'swap';
}
.twfont {
font-family: TwitterChirp;
}
img.emoji {
height: 1em;
width: 1em;
margin: 0 .05em 0 .1em;
vertical-align: -0.1em;
}
</style>
</head>
<body class="bg-dark">
<div class="bg-light d-flex flex-column" style="min-height: 100vh;">
<div class="flex-row bg-light">
<header>
<img src="https://user-images.githubusercontent.com/67098414/129015495-1875494e-dcdb-481b-b81f-1bfe86c9b9ee.jpg" class="w-100" style="max-height: 25vh; object-fit: cover;">
</header>
<div class="row mx-0">
<div class="col-md-8 col-12 mx-auto bg-white pt-3">
<div class="mb-4" style="background-color: #def; background-image: repeating-linear-gradient(-45deg, #fff, #fff 12px, transparent 0, transparent 18px); text-shadow: 1px 0 0 #fff, 0 1px 0 #fff, -1px 0 0 #fff, 0 -1px 0 #fff;">
<p class="fw-bold display-1 text-center" style="font-family: 'Courier Prime', monospace;">Escape Group</p>
<p class="text-center h5 pb-3" style="font-family: 'M PLUS Rounded 1c', serif;">〜人のチカラは、偉大だ〜</p>
</div>
<h2><i class="fas fa-hashtag text-secondary"></i> ABOUT US</h2>
<div class="m-3">
<p>Escape Groupは、プログラミングなどに興味がある人が集まって知識を共有したり、一緒になにかを作り上げたりするグループです。</p>
<p>現在メンバーは22人、元気に活動しています。</p>
</div>
<h2><i class="fas fa-hashtag text-secondary"></i> MEMBERS</h2>
<noscript class="m-3">
<a href="https://twitter.com/i/lists/1425274895445893123">Twitterのリストを見る</a>
</noscript>
<div class="m-3 swiper twfont" id="members" style="display: none; height: calc(180px + 9em);">
<div class="swiper-wrapper" id="swiper-wrapper">
</div>
<div id="swiper-loaded" style="display: none;">
<div class="swiper-button-prev" style="outline: none;"></div>
<div class="swiper-button-next" style="outline: none;"></div>
</div>
</div>
<h2><i class="fas fa-hashtag text-secondary"></i> SNS</h2>
<p class="m-3">Twitterをメインに活動しています。最新情報もTwitterをご覧ください。</p>
<div class="card m-3 bg-light">
<div class="card-title mx-3 my-2" style="color: #55acee;"><i class="fab fa-twitter"></i> Timeline</div>
<div class="mx-2 mb-2 twfont">
<a class="twitter-timeline" href="https://twitter.com/escgroup_?ref_src=twsrc%5Etfw" data-height="400" data-chrome="noheader nofooter">Tweets by escgroup_</a><script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
</div>
</div>
<h2><i class="fas fa-hashtag text-secondary"></i> CONTACT</h2>
<div class="m-3">
<a href="https://twitter.com/escgroup_">Twitter</a>のDM、またはメール(<a href="mailto:master.escgroup@gmail.com">master.escgroup@gmail.com</a>)までご連絡ください。
</div>
</div>
</div>
</div>
<div class="mt-auto bg-dark text-light text-center py-2">
<small>© 2021 Escape Group</small>
</div>
</div>
<script src="https://twemoji.maxcdn.com/v/latest/twemoji.min.js" crossorigin="anonymous"></script>
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-U1DAWAznBHeqEIlVSCgzq+c9gqGAJn5c/t99JyeKa9xxaYpSvHU5awsuZVVFIhvj" crossorigin="anonymous"></script>
<script type="text/javascript">
twttr.events.bind('loaded', function() {
tl = document.getElementsByClassName('twitter-timeline-rendered')[0].contentWindow.document;
tl.head.innerHTML += '<style>@font-face{font-family:TwitterChirp;src:url(https://abs.twimg.com/fonts/chirp-regular-web.woff2) format("woff2");src:url(https://abs.twimg.com/fonts/chirp-regular-web.woff) format("woff");font-weight:400;font-style:"normal";font-display:"swap";}body{font-family:TwitterChirp;}<\/style>';
});
document.getElementById('members').style.display = 'block';
let wrapper = document.getElementById('swiper-wrapper');
wrapper.innerHTML = 'Loading...';
fetch('https://api.escgrp.org/members')
.then(r => {
return r.json();
})
.then(j => {
wrapper.innerHTML = '';
for (let user of j.users) {
let desc = 'N/A';
if (user.description != '') {
desc = user.description;
}
wrapper.innerHTML += '<div class="swiper-slide"><div class="card h-100"><img src="' + user.image + '" class="card-img-top" width="100%" height="180" style="object-fit: cover;"><div class="card-body"><div class="card-tiitle"><div class="fw-bold" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">' + user.name + '<\/div><div class="text-secondary" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"> @' + user.screen_name + '<\/div><\/div><div class="card-text" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">' + desc + '<\/div><a href="https://twitter.com/' + user.screen_name + '" target="_blank"><div class="btn btn-sm btn-outline-light mt-2 w-100" style="color: #55acee; border-color: #55acee;"><i class="fab fa-twitter"><\/i> Visit Profile<\/div><\/a><\/div><\/div><\/div>';
}
twemoji.parse(wrapper);
var mySwiper = new Swiper ('.swiper', {
slidesPerView:1.5,
spaceBetween: 10,
centeredSlides : true,
autoplay: {
delay: 3000,
},
loop: true,
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
}
});
document.getElementById('swiper-loaded').style.display = 'block';
})
.cache(e => {
wrapper.innerHTML = '<a href="https://twitter.com/i/lists/1425274895445893123">Twitterのリストを見る<\/a>';
console.log(e);
});
</script>
</body>
</html>