1+ <!DOCTYPE html>
2+ <html lang="zh-tw">
3+
4+ <head>
5+ <meta charset="utf-8">
6+ <meta http-equiv="X-UA-Compatible" content="IE=edge" />
7+ <meta name="renderer" content="webkit" />
8+ <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no">
9+ <meta http-equiv="Cache-Control" content="no-siteapp, no-transform" />
10+ <meta name="theme-color" content="gray">
11+ <meta name="author" content="LGBTQIA-in-China">
12+ <meta name="description" content="{%Description%}">
13+ <meta name="keywords"
14+ content="LGBTQIA, LGBT, Homosexual, gay, lesbian, transgender, intersexual, asexual, bisexual, queer, questioning, 同性恋, 跨性别, 双性人, 酷儿, 双性恋, 疑性恋">
15+ <title>LGBTQIA in China</title>
16+ <link rel="icon" href="/static/favicon.ico" type="image/x-icon"/>
17+ <link rel="stylesheet"
18+ href="https://fonts.googleapis.com/css?family=Noto+Sans+SC:300|Noto+Serif+SC:300|ZCOOL+KuaiLe|ZCOOL+XiaoWei&display=swap">
19+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/twbs/bootstrap/dist/css/bootstrap-grid.min.css">
20+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/alvarotrigo/fullPage.js/dist/fullpage.min.css">
21+ <link rel="stylesheet" href="https://at.alicdn.com/t/font_1640253_7ac8t2q6btg.css">
22+ <link rel="stylesheet" href="https://at.alicdn.com/t/font_1912611_olza2ei6vv.css">
23+ <link rel="stylesheet" href="/static/css/style.css">
24+ </head>
25+
26+ <body>
27+ <nav>
28+ <div class="nav" id="nav">
29+ <h1 class="nav-title"><em class="iconfont icon-flag"></em> LGBTQIA in China</h1>
30+ <div class="nav-content">
31+ <a href="#about"><em class="iconfont icon-about"></em> {%About%}</a>
32+ <a href="#support"><em class="iconfont icon-thumbs-o-up"></em> {%Support%}</a>
33+ <a>|</a>
34+ <a href="{%Lang1Href%}">{%Lang1%}</a>
35+ <a href="{%Lang2Href%}">{%Lang2%}</a>
36+ </div>
37+ </nav>
38+ <main>
39+ <div id="fullpage">
40+ <!-- equal part -->
41+ <div class="section" id="equal">
42+ <div class="equal-content">
43+ <h1 class="main-title">{%MainTitle%}</h1>
44+ <div class="devider">
45+ <div id="red"> </div>
46+ <div id="orange"> </div>
47+ <div id="yellow"> </div>
48+ <div id="green"> </div>
49+ <div id="blue"> </div>
50+ <div id="purple"> </div>
51+ </div>
52+ <blockquote>{%Slogan%}</blockquote>
53+ <p>
54+ {%ProjectTarget%}
55+ </p>
56+ <div class="button-group">
57+ <a href="https://github.com/LGBT-CN/LGBTQIA-in-China" class="button button-github button-margin-right-8px"><em
58+ class="iconfont icon-GitHub"></em> GitHub</a>
59+ <a href="https://t.me/LGBTCN" class="button button-telegram">
60+ <em class="iconfont icon-telegram"></em> Telegram</a>
61+ </div>
62+ </div>
63+ <div class="equal-flag">
64+ <img src="https://cdn.jsdelivr.net/gh/LGBT-CN/logo@0bfed07/v0/flag.svg alt="LGBTQIA Flag">
65+ </div>
66+ </div>
67+ <!-- about part -->
68+ <div class="section" id="about">
69+ <div class="container-fluid">
70+ <div class="row">
71+ <div class="about-section col-md-12" id="about-title">
72+ <h1>{%AboutLGBTQIA%}</h1>
73+ <div class="devider">
74+ <div id="red"> </div>
75+ <div id="orange"> </div>
76+ <div id="yellow"> </div>
77+ <div id="green"> </div>
78+ <div id="blue"> </div>
79+ <div id="purple"> </div>
80+ </div>
81+ </div>
82+ <div class="about-section col-md-6" id="about-1">
83+ <h2>{%WhatsLGBTQIA%}</h2>
84+ <p>
85+ {%LGBTQIADefinition%}
86+ </p>
87+ </div>
88+ <div class="about-section col-md-6" id="about-2">
89+ <h2>{%WhyCreate%}</h2>
90+ <p>
91+ {%ReasonCreate%}
92+ </p>
93+ </div>
94+ <div class="about-section col-md-6" id="about-3">
95+ <h2>{%WhyNeedEquality%}</h2>
96+ <p>
97+ {%ReasonNeedEquality%}
98+ </p>
99+ </div>
100+ <div class="about-section col-md-6" id="about-4">
101+ <h2>{%HowToRespect%}</h2>
102+ <p>
103+ {%WaysToRespect%}
104+ </p>
105+ </div>
106+ </div>
107+ <br><br>
108+ </div>
109+ </div>
110+ <!-- support -->
111+ <div class="section" id="support">
112+ <h1>
113+ {%Support%}
114+ </h1>
115+ <hr>
116+ <p>
117+ {%WaysToSupport%}
118+ </p>
119+ <p style="color: cadetblue">
120+ <em class="iconfont icon-fork"></em>
121+ {%PRTip%}
122+ </p>
123+ <p id="sayings"><span style="color:red;font-size: 25px;">❤</span><br>
124+ Love is love. We're the same.<br>
125+ 在愛面前我們都一樣。
126+ </p>
127+ <br>
128+ </div>
129+ </div>
130+ </main>
131+ <footer>
132+ <div class="footer">
133+ <p>Copyright © 2021 <a href="https://github.com/LGBT-CN/LGBTQIA-in-China">
134+ <em class="iconfont icon-flag"></em> LGBTQIA in China</a>, All Rights Reserved.</p>
135+ </div>
136+ <script>
137+ var new_scroll_position = 0;
138+ var last_scroll_position;
139+ var header = document.getElementById("nav");
140+
141+ window.addEventListener('scroll', function (e) {
142+ last_scroll_position = window.scrollY;
143+
144+ // 向下滾動
145+ if (new_scroll_position < last_scroll_position && last_scroll_position > 80) {
146+ header.classList.remove("slideDown");
147+ header.classList.add("slideUp");
148+
149+ // 向上滾動
150+ } else if (new_scroll_position > last_scroll_position) {
151+ header.classList.remove("slideUp");
152+ header.classList.add("slideDown");
153+ }
154+
155+ new_scroll_position = last_scroll_position;
156+ });
157+ </script>
158+ </footer>
159+ </body>
160+
161+ </html>
0 commit comments