login ui

This commit is contained in:
Van 2019-12-14 17:10:40 +08:00
parent 215820f02b
commit 0568356fdc
No known key found for this signature in database
GPG Key ID: 7059B8783A78F16C
3 changed files with 45 additions and 21 deletions

2
package-lock.json generated
View File

@ -1879,7 +1879,7 @@
"integrity": "sha1-Yz0WyV2IUEYorQJmVmPO5aR5M1M=",
"dev": true,
"requires": {
"concat-with-sourcemaps": "^1.1.0",
"concat-with-sourcemaps": "^1.0.0",
"through2": "^2.0.0",
"vinyl": "^2.0.0"
}

View File

@ -92,18 +92,18 @@ body {
}
.login__github {
cursor: pointer;
background-image: url("/static/images/hacpai.png");
.login__icon {
height: 200px;
width: 200px;
background-size: cover;
margin: 20px auto;
background-position: center center;
transition: all .15s ease-in-out;
padding-right: 24px;
color: #3b3e43;
fill: currentColor;
}
.login__github:hover {
background-image: url("/static/images/hacpai.png");
.login__icon:hover {
transform: scale(1.1);
}
.btn {
@ -224,4 +224,20 @@ body {
font-size: 16px;
}
/* end sign up */
.start {
text-align: center;
}
.start .btn {
color: #fff;
}
.start svg {
fill: currentColor;
}
.start__aciton {
display: flex;
align-items: center;
}
/* end sign up */

View File

@ -18,10 +18,10 @@
<body>
<div class="header">
<div class="wrapper fn-clear">
<a href="/login" rel="login" style="flex:1">
<a href="{{$.conf.Server}}/login" rel="login" style="flex:1">
<img title="A Web-based Go IDE" src="/static/images/wide-logo.png" class="logo"/></a>
<ul>
<li><a href="/playground" target="_blank" style="color: #cd504a">Play</a></li>
<li><a href="{{$.conf.Server}}/playground" target="_blank" style="color: #cd504a">Play</a></li>
<li><a rel="bookmark" href="https://github.com/88250/wide" target="_blank">GitHub</a></li>
<li><a rel="help" href="https://hacpai.com/article/1538873544275" target="_blank">{{.i18n.help}}</a></li>
<li><a rel="bookmark" href="https://hacpai.com" target="_blank">{{.i18n.community}}</a></li>
@ -34,11 +34,25 @@
<h2>Hello, 世界</h2>
<h3>Coding with Go on the Wide way.</h3>
</div>
<div class="form fn-right">
<div class="form fn-right start">
<div style="text-align: center"><a href="https://hacpai.com/article/1558097702072" target="_blank">2019-05-17 关于账号迁移的公告</a></div>
<div class="login__github oauth"></div>
<img style="display: none" src="/static/images/hacpai.png"/>
<button class="btn oauth">登录黑客派社区账号后即可开始使用</button>
<a href="{{$.conf.Server}}/login/redirect">
<svg class="login__icon" viewBox="0 0 32 32">
<path fill="#d23f31" style="fill: var(--color1, #d23f31)"
d="M5.787 17.226h17.033l5.954 9.528c0.47 0.752 0.003 1.361-1.042 1.361h-15.141z"></path>
<path d="M10.74 3.927h17.033c1.045 0 1.512 0.609 1.042 1.361l-5.954 9.528h-19.872l6.379-10.209c0.235-0.376 0.849-0.681 1.372-0.681z"></path>
<path d="M2.953 17.226h2.839l6.804 10.889h-1.892c-0.523 0-1.137-0.305-1.372-0.681z"></path>
</svg>
</a>
<div class="start__aciton">
<a href="{{$.conf.Server}}/login/redirect" class="btn">登录黑客派社区账号后即可开始使用</a>
<span>&nbsp; &nbsp;</span>
<a href="https://hacpai.com/article/1576294445994" target="_blank">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 32 32">
<path d="M19.652 25v6c0 0.55-0.45 1-1 1h-6c-0.55 0-1-0.45-1-1v-6c0-0.55 0.45-1 1-1h6c0.55 0 1 0.45 1 1zM27.552 10c0 4.75-3.225 6.575-5.6 7.9-1.475 0.85-2.4 2.575-2.4 3.3v0c0 0.55-0.425 1.2-1 1.2h-6c-0.55 0-0.9-0.85-0.9-1.4v-1.125c0-3.025 3-5.625 5.2-6.625 1.925-0.875 2.725-1.7 2.725-3.3 0-1.4-1.825-2.65-3.85-2.65-1.125 0-2.15 0.35-2.7 0.725-0.6 0.425-1.2 1.025-2.675 2.875-0.2 0.25-0.5 0.4-0.775 0.4-0.225 0-0.425-0.075-0.625-0.2l-4.1-3.125c-0.425-0.325-0.525-0.875-0.25-1.325 2.7-4.475 6.5-6.65 11.6-6.65 5.35 0 11.35 4.275 11.35 10z"></path>
</svg>
</a>
</div>
</div>
</div>
</div>
@ -47,11 +61,5 @@
Ver {{.ver}}, &copy; {{.year}}&nbsp;<a rel="copyright" href="https://b3log.org" target="_blank">B3log 开源</a>
</span>
</div>
<script type="text/javascript" src="/static/js/lib/jquery-2.1.1.min.js"></script>
<script>
$('.oauth').click(function () {
window.location.href = '/login/redirect'
})
</script>
</body>
</html>