-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
134 lines (131 loc) · 6.06 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Home</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- 引入 Bootstrap -->
<link href="script/bootstrap.min.css" rel="stylesheet">
<!-- 引入动画CSS -->
<link href="style/animate.css" rel="stylesheet">
<!-- 引入main.css -->
<link href="style/main.css" rel="stylesheet">
<!-- 引入normalize.css -->
<link href="style/normalize.css" rel="stylesheet">
</head>
<body id="homepage">
<div class="main">
<div class="logo">
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
<path d="M36 8l4 8h-6l-4-8h-4l4 8h-6l-4-8h-4l4 8h-6l-4-8H8c-2.21 0-3.98 1.79-3.98 4L4 36c0 2.21 1.79 4 4 4h32c2.21 0 4-1.79 4-4V8h-8z"></path>
</svg>
<span>Movie-Finder</span>
</div>
<div class="user-entrance">
<a data-toggle="modal" data-target="#loginModal">
<span class="glyphicon glyphicon-user"></span>登陆
</a>
<span>|</span>
<a data-toggle="modal" data-target="#registerModal">
<span class="glyphicon glyphicon-log-in"></span>注册
</a>
</div>
<div class="user-entrance after-login" hidden>
<span class="user-profile">
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48"><path d="M24 24c4.42 0 8-3.59 8-8 0-4.42-3.58-8-8-8s-8 3.58-8 8c0 4.41 3.58 8 8 8zm0 4c-5.33 0-16 2.67-16 8v4h32v-4c0-5.33-10.67-8-16-8z"></path></svg>
</span>
<span class="user-name">
</span>
<span class="glyphicon glyphicon-log-out log-out"></span>
</div>
<div class="index-content">
<h1 class="index-title">
来,寻找更好的电影.......
</h1>
<h2 class="index-subtitle">
我们一直等着被你发现
</h2>
</div>
<div class="search-bar">
<div class="cntr">
<div class="cntr-innr">
<label class="search" for="inpt_search">
<input id="inpt_search" type="text" placeholder="电影/影人/导演"/>
</label>
<p>在这里发现更多</p>
</div>
</div>
</div>
</div> <!-- END: main -->
<!-- BEGIN: modal -->
<div class="modal fade" id="loginModal" tabindex="-1" role="dialog" aria-labelledby="loginLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<div class="modal-logo">
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
<path d="M36 8l4 8h-6l-4-8h-4l4 8h-6l-4-8h-4l4 8h-6l-4-8H8c-2.21 0-3.98 1.79-3.98 4L4 36c0 2.21 1.79 4 4 4h32c2.21 0 4-1.79 4-4V8h-8z"></path>
</svg>
<span>Movie-Finder</span>
</div>
</div>
<div class="modal-body">
<div class="input-group">
<span class="glyphicon glyphicon-user input-group-addon"></span>
<input type="text" class="form-control" name="login-name" id="login-name" placeholder="用户名"/>
</div>
<div class="input-group">
<span class="glyphicon glyphicon-pencil input-group-addon"></span>
<input type="password" class="form-control" name="login-pwd" id="login-pwd" placeholder="您的密码" />
</div>
<div class="error-message login" hidden></div>
</div>
<div class="modal-footer">
<div class="modal-btn-footer" id="login_btn">登陆</div>
</div>
</div><!-- END: /.modal-content -->
</div><!-- END: login-modal -->
</div>
<div class="modal fade" id="registerModal" tabindex="-2" role="dialog" aria-labelledby="registerLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<div class="modal-logo">
<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
<path d="M36 8l4 8h-6l-4-8h-4l4 8h-6l-4-8h-4l4 8h-6l-4-8H8c-2.21 0-3.98 1.79-3.98 4L4 36c0 2.21 1.79 4 4 4h32c2.21 0 4-1.79 4-4V8h-8z"></path>
</svg>
<span>Movie-Finder</span>
</div>
</div>
<div class="modal-body">
<div class="input-group">
<span class="glyphicon glyphicon-user input-group-addon"></span>
<input type="text" class="form-control" name="register-name" id="register-name" placeholder="用户名"/>
</div>
<div class="input-group">
<span class="glyphicon glyphicon-pencil input-group-addon"></span>
<input type="password" class="form-control" name="register-pwd" id="register-pwd" placeholder="您的密码"/>
</div>
<div class="input-group">
<span class="glyphicon glyphicon-ok input-group-addon"></span>
<input type="password" class="form-control" name="registser-re-pwd" id="register-re-pwd" placeholder="请确认您的密码" />
</div>
<div class="error-message register" hidden></div>
</div>
<div class="modal-footer">
<div class="modal-btn-footer" id="register_btn">注册</div>
</div>
</div><!-- END: modal-content -->
</div>
</div><!-- END: register modal -->
<!-- END: modal -->
<!-- 引入jQuery -->
<script src="script/jquery.min.js"></script>
<!-- 引入bootstrap.min.js -->
<script src="script/bootstrap.min.js"></script>
<!-- 引入自定义JS -->
<script src="script/main.js"></script>
</body>
</html>