Skip to content

H
hunter-ht.cn
Commit d90f2e01 by liuyingying
Options

野旷天低树天清月近人

parent f097ff24
Showing with 217 additions and 11 deletions
Hunter_ht/hunter/static/hunter/style.css
...@@ -8,9 +8,85 @@ ...@@ -8,9 +8,85 @@
padding: 0; padding: 0;
} }
body{ body{
background-color: #ffffff; background-color: rgba(253, 253, 253, .3);
width:100%; width:100%;
} }
button{
line-height: 25px;
/* border: solid 1px black; */
border-radius: 5px;
cursor: pointer;
}
#error_log{
color:red;
width:60%;
margin:0 auto;
font-size:12px;
}
#login_div{
position:fixed;
width:100%;
height:100%;
top: -100%;
right:-100%;
z-index: 999;
}
.show_login{
top:0 !important;
right:0 !important;
}
#login_wrap{
width: 500px;
height: 250px;
border-radius: 10px;
margin: 90px 10px;
float: right;
background-color: white;
box-shadow: -1px -1px 3px #cec9c9 inset;
-moz-box-shadow: -1px -1px 3px #cec9c9 inset;
-webkit-box-shadow: -1px -1px 3px #cec9c9 inset;
}
#input_div{
width: 100%;
height: 140px;
margin: 10px auto 0;
padding-top: 10px;
}
#input_div>input{
width: 60%;
height: 45px;
font-size: 16px;
border: solid 1px #e4e4e4;
background: #fdfdfd;
border-radius: 7px;
margin: 15px auto;
display: block;
padding: 0 25px;
z-index: 9999;
}
#btn_div{
width: 67%;
height: 50px;
margin: 0px auto;
}
#btn_div>button{
width:40%;
height:40px;
display: block;
margin:10px 5%;
float: left;
outline: none;
}
#cancel_btn{
background: #d4d4d4;
color:white;
}
#login_btn{
background: #ffffff;
font-size: 16px;
}
ul li{ ul li{
list-style-type: none; list-style-type: none;
margin:0; margin:0;
...@@ -78,22 +154,42 @@ nav>div{ ...@@ -78,22 +154,42 @@ nav>div{
.bottom>a:hover, .active{ .bottom>a:hover, .active{
font-size:20px; font-size:20px;
color: #000; color: #000;
border-bottom:solid 5px #6e829e; border-bottom:solid 4px #6e829e;
/*border-bottom:solid 5px #97b7e6;*/ /*border-bottom:solid 5px #97b7e6;*/
} }
.top>a{ .top>button{
width:50px;
height:25px;
float: right;
font-size:12px;
outline:none;
}
.top>ul{
width:200px;
display: block;
float: right; float: right;
} }
.top>a:hover{ .top>ul>li{
display: block;
float: right;
margin-right: 10px;
}
.top>ul>li:hover{
font-size:16px; font-size:16px;
color: #0063a9; color: #000;
cursor: pointer;
/*border-bottom:solid 5px #97b7e6;*/
}
.top>button:hover{
font-size:14px;
color: dimgrey;
border-bottom:solid 3px #eeeeee; border-bottom:solid 3px #eeeeee;
} }
#bar>.top{ #bar>.top{
height:20px; height: 20px;
font-size:14px; font-size: 14px;
margin: 15px 25px 5px; margin: 5px 25px 10px;
} }
#bar>.top>a{ #bar>.top>a{
color:grey; color:grey;
...@@ -303,4 +399,23 @@ ul:after{ ...@@ -303,4 +399,23 @@ ul:after{
font-size:14px; font-size:14px;
color:dimgrey; color:dimgrey;
float: left; float: left;
}
footer{
background: #ffffff;
min-width: 100%;
}
footer .copyright{
font-size: 12px;
color: #999;
margin: 0 auto;
width: 100%;
text-align: center;
padding: 20px 0;
}
footer .copyright a{
color:#999;
}
footer .copyright a:hover{
color: #6e829e;
} }
\ No newline at end of file
Hunter_ht/hunter/templates/hunter/index.html
...@@ -2,21 +2,38 @@ ...@@ -2,21 +2,38 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>hunter.index</title> <title>hunter-ht</title>
{% load static %} {% load static %}
<link rel="icon" href="{% static 'hunter/images/logo.ico' %}" type="text/icon"> <link rel="icon" href="{% static 'hunter/images/logo.ico' %}" type="text/icon">
<link rel="stylesheet" type="text/css" href="{% static 'hunter/style.css' %}"> <link rel="stylesheet" type="text/css" href="{% static 'hunter/style.css' %}">
<script src="{% static 'hunter/jquery-1.9.1.min.js' %}"></script> <script src="{% static 'hunter/jquery-1.9.1.min.js' %}"></script>
</head> </head>
<body> <body>
<div id="login_div" class="">
<div id="login_wrap">
<div id="input_div">
<input type="text" placeholder="username" autofocus="autofocus">
<input type="password" placeholder="password">
</div>
<div id="error_log"></div>
<div id="btn_div">
<button id="cancel_btn" onclick="hide_log()">
取消
</button>
<button id="login_btn" onclick="login()">
登录
</button>
</div>
</div>
</div>
<nav> <nav>
<div> <div>
<div id="hunter"> <div id="hunter">
<span>HUNTER</span> <span>HUNTER</span>
</div> </div>
<div id="bar"> <div id="bar">
<div class="top"> <div class="top" id="top_bar">
<a>登录</a> <button onclick="show_log()">登录</button>
</div> </div>
<div class="bottom"> <div class="bottom">
<a href="#article" class="main_bar">文章随笔</a> <a href="#article" class="main_bar">文章随笔</a>
...@@ -209,6 +226,12 @@ ...@@ -209,6 +226,12 @@
</ul> </ul>
{% endif %} {% endif %}
</section> </section>
<footer>
<div class="w-1000 copyright">
Copyright © 2013-2020 <strong><a href="//www.runoob.com/" target="_blank">野旷天低树天清月近人</a></strong>&nbsp;
<strong><a href="//www.hunter-ht.cn/" target="_blank">hunter-ht.cn</a></strong> All Rights Reserved. 备案号：<a target="_blank" rel="nofollow" href="http://www.beian.miit.gov.cn">湘ICP备18008562号</a>
</div>
</footer>
<script> <script>
var pre_clicked=4; var pre_clicked=4;
...@@ -217,6 +240,13 @@ ...@@ -217,6 +240,13 @@
let i = $(".bottom>a").index(this); let i = $(".bottom>a").index(this);
click_bar(i); click_bar(i);
}); });
let storage = window.sessionStorage;
if (!storage["userID"]&&!storage["username"]){
}else{
login_success(storage['username'],storage['userID'])
}
}; };
function click_bar(index){ function click_bar(index){
let a_list = document.getElementsByClassName("main_bar"); let a_list = document.getElementsByClassName("main_bar");
...@@ -224,6 +254,65 @@ ...@@ -224,6 +254,65 @@
$(a_list[index]).addClass('active'); $(a_list[index]).addClass('active');
pre_clicked=index; pre_clicked=index;
} }
function hide_log() {
$('#login_div').removeClass("show_login");
$('input').val("");
$('#error_log').empty();
}
function show_log(){
$('#login_div').addClass("show_login");
$('input')[0].focus()
}
function login(){
let username = $("input")[0].value;
let password = $("input")[1].value;
if(username===""||password===""){
login_fail('用户名密码不能为空');
}else{
$.ajax({
url:'/login/',
type:'post',
dataType:'json',
data:{
"username":username,
"password":password,
},
success:function(response){
console.log(response);
if(response['message']==="success"){
let user_id=response['userid'];
let storage = window.sessionStorage;
storage['username'] = username;
storage['userID'] = user_id;
console.log(storage);
login_success(username,user_id);
}else{
login_fail(response['message']);
}
},
error:function (xhr) {
console.error('something went wrong...');
login_fail("something went wrong...");
}
})
}
}
function login_success(name,userid){
$('#top_bar').empty();
$('#top_bar').append("<ul><li onclick='logout()'>退出</li><li id="+userid+" title='点击进入个人中心'>"+name+"</li></ul>");
hide_log();
}
function login_fail(message){
$('#error_log').empty();
$('#error_log').append(message);
}
function logout(){
$('#top_bar').empty();
$('#top_bar').append('<button onclick="show_log()">登录</button>');
let storage = window.sessionStorage;
storage.clear();
console.log(storage);
}
</script> </script>
</body> </body>
</html> </html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment