Skip to content

Commit b308d04

Browse files
authored
Merge pull request #24 from ailoooong/master
fix:样式修改、代码格式化
2 parents 68d4f96 + fa0be2b commit b308d04

File tree

3 files changed

+420
-390
lines changed

3 files changed

+420
-390
lines changed
Lines changed: 158 additions & 146 deletions
Original file line numberDiff line numberDiff line change
@@ -1,162 +1,174 @@
11
{{define "sign_in.html"}}
2-
<!DOCTYPE html>
3-
<html lang="zh-CN">
4-
<head>
5-
<meta charset="UTF-8">
6-
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8-
<title>openEuler</title>
9-
<style>
10-
* {
11-
padding: 0;
12-
margin: 0;
13-
}
2+
<!DOCTYPE html>
3+
<html lang="zh-CN">
4+
<head>
5+
<meta charset="UTF-8" />
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
8+
<title>openEuler</title>
9+
<style>
10+
* {
11+
padding: 0;
12+
margin: 0;
13+
}
1414

15-
body {
16-
background: #002FA7;
17-
}
15+
body {
16+
background: #002fa7;
17+
}
1818

19-
.wrap {
20-
height: 100vh;
21-
margin: 0 auto;
22-
display: flex;
23-
justify-content: center;
24-
align-items: center;
25-
background: url(https://openeuler-website.obs.ap-southeast-1.myhuaweicloud.com/img/euler_pc.jpg) no-repeat center/cover;
26-
padding: 0 80px;
27-
}
19+
.wrap {
20+
height: 100vh;
21+
margin: 0 auto;
22+
display: flex;
23+
justify-content: center;
24+
align-items: center;
25+
background: url(https://openeuler-website.obs.ap-southeast-1.myhuaweicloud.com/img/euler_pc.jpg)
26+
no-repeat center/cover;
27+
padding: 0 80px;
28+
}
2829

29-
.wrap .box {
30-
margin-top: 30vh;
31-
display: flex;
32-
align-items: center;
33-
flex-direction: column;
34-
}
30+
.wrap .box {
31+
margin-top: 30vh;
32+
display: flex;
33+
align-items: center;
34+
flex-direction: column;
35+
}
3536

36-
.wrap .button {
37-
width: 300px;
38-
line-height: 58px;
39-
border: 0 none;
40-
background: #002FA7;
41-
box-shadow: 0px 5px 0px 0px rgba(0, 0, 0, 0.11);
42-
border-radius: 8px;
43-
text-align: center;
44-
color: #fff;
45-
font-size: 20px;
46-
font-weight: bold;
47-
}
37+
.wrap .button {
38+
width: 300px;
39+
line-height: 58px;
40+
border: 0 none;
41+
background: #002fa7;
42+
box-shadow: 0px 5px 0px 0px rgba(0, 0, 0, 0.11);
43+
border-radius: 8px;
44+
text-align: center;
45+
color: #fff;
46+
font-size: 20px;
47+
font-weight: bold;
48+
}
4849

49-
.wrap .label {
50-
font-size: 14px;
51-
color: #fff;
52-
margin-top: 30px;
53-
display: flex;
54-
align-items: center;
55-
}
56-
57-
.wrap .label a {
58-
color: #fff;
59-
display: inline-block;
60-
text-decoration: none;
61-
}
62-
.wrap .label a:hover {
63-
color: #002FA7;
64-
}
65-
66-
.wrap .label .info {
67-
padding-left: 10px;
68-
}
69-
.wrap .label .info p{
70-
display: none;
71-
}
50+
.wrap .label {
51+
font-size: 14px;
52+
color: #fff;
53+
margin-top: 30px;
54+
display: flex;
55+
align-items: center;
56+
cursor: pointer;
57+
}
7258

73-
.wrap .not-allowed {
74-
cursor: not-allowed;
75-
color: white;
76-
background: grey;
77-
}
59+
.wrap .label a {
60+
color: #fff;
61+
display: inline-block;
62+
text-decoration: none;
63+
}
64+
.wrap .label a:hover {
65+
color: #002fa7;
66+
}
7867

79-
@media (max-width: 768px) {
80-
.wrap {
81-
padding: 0 12px;
82-
box-sizing: border-box;
83-
background: url(https://openeuler-website.obs.ap-southeast-1.myhuaweicloud.com/img/euler_h5.jpg) no-repeat left bottom /cover;
84-
}
85-
.wrap .box {
86-
margin-top: 6vh;
87-
}
88-
.wrap .box form,
89-
.wrap .button{
90-
width: 100%;
91-
}
68+
.wrap .label .info {
69+
padding-left: 10px;
70+
}
71+
.wrap .not-allowed {
72+
cursor: not-allowed;
73+
color: white;
74+
background: grey;
75+
}
9276

93-
.wrap .label {
94-
font-size: 14px;
95-
color: #fff;
96-
margin-top: 60px;
97-
}
98-
}
77+
@media (max-width: 768px) {
78+
.wrap {
79+
padding: 0 12px;
80+
box-sizing: border-box;
81+
background: url(https://openeuler-website.obs.ap-southeast-1.myhuaweicloud.com/img/euler_h5.jpg)
82+
no-repeat left bottom / cover;
83+
}
84+
.wrap .box {
85+
margin-top: 6vh;
86+
}
87+
.wrap .box form,
88+
.wrap .button {
89+
width: 100%;
90+
}
9991

100-
</style>
101-
</head>
102-
<body>
92+
.wrap .label {
93+
font-size: 14px;
94+
color: #fff;
95+
margin-top: 60px;
96+
}
97+
}
98+
</style>
99+
</head>
100+
<body>
103101
<div class="wrap">
104-
<div class="box">
105-
<form method="GET" action="{{.ProxyPrefix}}/start">
106-
<input type="hidden" name="rd" value="{{.Redirect}}">
107-
<button type="submit" class="button not-allowed block is-primary">Sign in with {{.ProviderName}}</button>
108-
</form>
109-
<div class="label">
110-
<input class="checkbox" type="checkbox">
111-
<div class="info">
112-
<p class="lang-zh">我已阅读并同意<a href="/agreement_ch.html" target="_blank">《用户授权协议》</a>和社区<a
113-
href='https://www.openeuler.org/zh/other/privacy/' target="_blank">《隐私政策》</a>
114-
</p>
115-
<p class="lang-en">I have read and agree to the <a href="/agreement_en.html" target="_blank">User
116-
Agreement</a> and the <a href='https://www.openeuler.org/en/other/privacy/' target="_blank">Privacy Policy</a>
117-
</p>
118-
</div>
119-
</div>
102+
<div class="box">
103+
<form method="GET" action="{{.ProxyPrefix}}/start">
104+
<input type="hidden" name="rd" value="{{.Redirect}}" />
105+
<button type="submit" class="button not-allowed block is-primary">
106+
Sign in with {{.ProviderName}}
107+
</button>
108+
</form>
109+
<div class="label">
110+
<input class="checkbox" type="checkbox" />
111+
<div class="info">
112+
<p class="lang-zh">
113+
我已阅读并同意<a href="/agreement_ch.html" target="_blank"
114+
>《用户授权协议》</a
115+
>和社区<a
116+
href="https://www.openeuler.org/zh/other/privacy/"
117+
target="_blank"
118+
>《隐私政策》</a
119+
>
120+
</p>
121+
<p class="lang-en">
122+
I have read and agree to the
123+
<a href="/agreement_en.html" target="_blank">User Agreement</a>
124+
and the
125+
<a
126+
href="https://www.openeuler.org/en/other/privacy/"
127+
target="_blank"
128+
>Privacy Policy</a
129+
>
130+
</p>
131+
</div>
120132
</div>
133+
</div>
121134
</div>
122135
<script>
123-
let checkbox = document.querySelector('.checkbox');
124-
let btn = document.querySelector('.button');
125-
checkbox.addEventListener('click',function() {
126-
checkbox.checked ? btn.classList.remove('not-allowed') : btn.classList.add('not-allowed')
127-
})
128-
btn.addEventListener('click',function() {
129-
checkbox.checked ? '' : event.preventDefault()
130-
})
131-
if (window.location.hash) {
132-
(function () {
133-
var inputs = document.getElementsByName('rd');
134-
for (var i = 0; i < inputs.length; i++) {
135-
// Add hash, but make sure it is only added once
136-
var idx = inputs[i].value.indexOf('#');
137-
if (idx >= 0) {
138-
// Remove existing hash from URL
139-
inputs[i].value = inputs[i].value.substr(0, idx);
140-
}
141-
inputs[i].value += window.location.hash;
142-
}
143-
})();
144-
}
145-
146-
// 根据中英文显示文案
147-
let lang = 'zh-CN';
148-
if(window.location.pathname.includes('en')){
149-
document.querySelector('.lang-en').style.display='block';
150-
document.querySelector('.lang-zh').remove();
151-
lang = 'en';
152-
}else{
153-
document.querySelector('.lang-zh').style.display='block';
154-
document.querySelector('.lang-en').remove();
155-
lang = 'zh-CN';
156-
}
157-
document.documentElement.setAttribute('lang',lang)
136+
let checkbox = document.querySelector(".checkbox");
137+
let btn = document.querySelector(".button");
138+
checkbox.addEventListener("click", function () {
139+
checkbox.checked
140+
? btn.classList.remove("not-allowed")
141+
: btn.classList.add("not-allowed");
142+
});
143+
btn.addEventListener("click", function () {
144+
checkbox.checked ? "" : event.preventDefault();
145+
});
146+
if (window.location.hash) {
147+
(function () {
148+
var inputs = document.getElementsByName("rd");
149+
for (var i = 0; i < inputs.length; i++) {
150+
// Add hash, but make sure it is only added once
151+
var idx = inputs[i].value.indexOf("#");
152+
if (idx >= 0) {
153+
// Remove existing hash from URL
154+
inputs[i].value = inputs[i].value.substr(0, idx);
155+
}
156+
inputs[i].value += window.location.hash;
157+
}
158+
})();
159+
}
158160

161+
// 根据中英文显示文案
162+
let lang = "zh-CN";
163+
if (window.location.pathname.includes("en")) {
164+
document.querySelector(".lang-zh").remove();
165+
lang = "en";
166+
} else {
167+
document.querySelector(".lang-en").remove();
168+
lang = "zh-CN";
169+
}
170+
document.documentElement.setAttribute("lang", lang);
159171
</script>
160-
</body>
161-
</html>
162-
{{end}}
172+
</body>
173+
</html>
174+
{{end}}

0 commit comments

Comments
 (0)