Skip to content

Commit 57be8fb

Browse files
committed
Customize login page.
Signed-off-by: leozhang2018 <[email protected]>
1 parent 185bebc commit 57be8fb

File tree

5 files changed

+102
-41
lines changed

5 files changed

+102
-41
lines changed

custom-web/static/css/main.css

Lines changed: 31 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ a {
9191

9292
.login .login-inner-form {
9393
width: 100%;
94-
max-width: 350px;
94+
max-width: 380px;
9595
color: #717171;
9696
text-align: center;
9797
}
@@ -374,16 +374,22 @@ input[type="radio"] {
374374
margin-top: 35px;
375375
}
376376

377+
.details .auth-types{
378+
text-align: right;
379+
margin-top: 15px;
380+
}
381+
382+
.details .auth-types .methods-desc{
383+
font-weight: 400;
384+
font-size: 14px;
385+
}
386+
377387
.details .auth-types a {
378388
display: inline-block;
379389
margin: 0px 5px;
380-
height: 35px;
381390
color: #007bff;
382-
border: 1px solid #007bff;
383-
padding: 0 10px;
384-
border-radius: 4px;
385391
font-weight: 400;
386-
font-size: 13px;
392+
font-size: 14px;
387393
transition: all 0.3s;
388394
user-select: none;
389395
}
@@ -394,6 +400,24 @@ input[type="radio"] {
394400
color: #007bff;
395401
}
396402

403+
.details .auth-types a .iconfont {
404+
font-size: 25px;
405+
vertical-align: bottom;
406+
}
407+
408+
.details .auth-types .function-btn{
409+
color: #717171;
410+
}
411+
412+
.details .auth-types .function-btn:hover{
413+
color: #007bff;
414+
}
415+
416+
417+
.details .auth-types .divide {
418+
color: #ced4da;
419+
}
420+
397421
.details .auth-types p {
398422
margin: 10px auto 25px;
399423
color: #524f4f;
@@ -402,7 +426,7 @@ input[type="radio"] {
402426
}
403427

404428
.details .auth-types .login-button-show {
405-
display: block;
429+
display: inline-block;
406430
line-height: 35px;
407431
}
408432

custom-web/static/js/main.js

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -43,12 +43,6 @@ var dex = new Vue({
4343
}
4444

4545
},
46-
findPassword() {
47-
window.location.href = `${protocol}//${hostname}/signin?findPassword=true`;
48-
},
49-
signUp() {
50-
window.location.href = `${protocol}//${hostname}/signin?signUp=true`;
51-
},
5246
async registrationCheck(){
5347
const registrationRes = await axios.get(`/api/v1/features/RegisterTrigger`);
5448
if (registrationRes.data && registrationRes.data.enabled) {

custom-web/templates/header.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626
<link href="{{ url .ReqPath "static/css/bootstrap.css" }}" rel="stylesheet">
2727
<link href="{{ url .ReqPath "static/css/main.css" }}" rel="stylesheet">
2828
<link href="{{ url .ReqPath "theme/styles.css" }}" rel="stylesheet">
29-
<link rel="stylesheet" href="//at.alicdn.com/t/font_1282370_pa5gn2t532.css"
29+
<link rel="stylesheet" href="//at.alicdn.com/t/font_1282370_f2amwt7wbik.css"
3030
media="all" onload="this.media='all'" />
3131
<title>登录</title>
3232
</head>

custom-web/templates/index.html

Lines changed: 23 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@
4242
href="https://fonts.googleapis.com/css?family=Noto+Sans+SC:200,300,400,500,600,700" />
4343
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans+SC:200,300,400,500,600,700"
4444
media="all" onload="this.media='all'" /> -->
45-
<link rel="stylesheet" href="https://at.alicdn.com/t/font_1282370_pa5gn2t532.css"
45+
<link rel="stylesheet" href="https://at.alicdn.com/t/font_1282370_f2amwt7wbik.css"
4646
media="all" onload="this.media='all'" />
4747
<link href="../static/css/bootstrap.css" rel="stylesheet" />
4848
<link href="../static/css/main.css" rel="stylesheet" />
@@ -115,31 +115,44 @@
115115
</button>
116116
</form>
117117
</section>
118-
<div class="bottom">
119-
<a @click="findPassword">找回密码</a>
120-
<a v-if="showRegistration" @click="signUp">注册</a>
121-
</div>
122-
<span class="desc">第三方登录</span>
123-
<div class="divider"></div>
124118
<section class="auth-types">
119+
<span class="login-button-show methods-desc">
120+
<span>第三方登录:</span>
121+
</span>
125122
<a href="test">
126123
<span class="login-button-show">
127124
<i class="iconfont icongithub"></i>
128-
<span>GitHub</span>
129125
</span>
130126
</a>
131127
<a href="test">
132128
<span class="login-button-show">
133129
<i class="iconfont iconldap"></i>
134-
<span>LDAP</span>
135130
</span>
136131
</a>
137132
<a href="test">
138133
<span class="login-button-show">
139134
<i class="iconfont iconoauth"></i>
140-
<span>OAuth</span>
141135
</span>
142136
</a>
137+
<a href="test">
138+
<span class="login-button-show">
139+
<i class="iconfont iconotherauth"></i>
140+
</span>
141+
</a>
142+
<span class="divide">|</span>
143+
<a href="/signin?findPassword=true">
144+
<span class="login-button-show function-btn">
145+
<span>找回密码</span>
146+
</span>
147+
</a>
148+
<template v-if="showRegistration">
149+
<span class="divide">|</span>
150+
<a href="/signin?signUp=true">
151+
<span class="login-button-show function-btn">
152+
<span>注册</span>
153+
</span>
154+
</a>
155+
</template>
143156
</section>
144157
<!-- 尾结束 -->
145158
</div>

custom-web/templates/login.html

Lines changed: 47 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -61,24 +61,54 @@
6161
</button>
6262
</form>
6363
</section>
64-
<div class="bottom">
65-
<a @click="findPassword">找回密码</a>
66-
<a v-if="showRegistration" @click="signUp">注册</a>
67-
</div>
68-
<span class="desc">第三方登录</span>
69-
<div class="divider"></div>
7064
<section class="auth-types">
71-
{{ range $c := .Connectors }}
72-
{{ if ne $c.Name "Email" }}
73-
<a href="{{ $c.URL }}">
74-
<span class="login-button-show">
75-
<i class="iconfont icon{{ $c.Type }}"></i>
76-
<span>{{ $c.Name }}</span>
77-
</span>
78-
</a>
79-
{{ end }}
80-
{{ end }}
81-
</section>
65+
<span class="login-button-show methods-desc">
66+
<span>第三方登录:</span>
67+
</span>
68+
{{ range $c := .Connectors }}
69+
{{ if and (ne $c.Name "Email") (eq $c.Type "github") }}
70+
<a href="{{ $c.URL }}">
71+
<span class="login-button-show">
72+
<i class="iconfont icon{{ $c.Type }}"></i>
73+
</span>
74+
</a>
75+
{{ end }}
76+
{{ if and (ne $c.Name "Email") (eq $c.Type "oauth") }}
77+
<a href="{{ $c.URL }}">
78+
<span class="login-button-show">
79+
<i class="iconfont icon{{ $c.Type }}"></i>
80+
</span>
81+
</a>
82+
{{ end }}
83+
{{ if and (ne $c.Name "Email") (eq $c.Type "ldap") }}
84+
<a href="{{ $c.URL }}">
85+
<span class="login-button-show">
86+
<i class="iconfont icon{{ $c.Type }}"></i>
87+
</span>
88+
</a>
89+
{{ end }}
90+
{{ else }}
91+
<a href="{{ $c.URL }}">
92+
<span class="login-button-show">
93+
<i class="iconfont iconotherauth"></i>
94+
</span>
95+
</a>
96+
{{ end }}
97+
<span class="divide">|</span>
98+
<a href="/signin?findPassword=true">
99+
<span class="login-button-show function-btn">
100+
<span>找回密码</span>
101+
</span>
102+
</a>
103+
<template v-if="showRegistration">
104+
<span class="divide">|</span>
105+
<a href="/signin?signUp=true">
106+
<span class="login-button-show function-btn">
107+
<span>注册</span>
108+
</span>
109+
</a>
110+
</template>
111+
</section>
82112
<!-- 尾结束 -->
83113

84114
{{ template "footer.html" . }}

0 commit comments

Comments
 (0)