Skip to content

Added CSS design icons to the navigation bar and changed the color of… #54

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
WhyteAsamoah wants to merge 6 commits into
base: master
Choose a base branch
from
Open

Added CSS design icons to the navigation bar and changed the color of… #54

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
f54b66d
Added CSS design icons to the navigation bar and changed the color of…
WhyteAsamoah Jan 6, 2021
18f353e
Adding CSS icons to the login page
WhyteAsamoah Jan 6, 2021
8f119c9
Added a missing opening angle bracket on the body tag in line 3
WhyteAsamoah Jan 6, 2021
6a7d0bf
Update README.md
WhyteAsamoah Jan 6, 2021
3c4a1bb
Update README.md
WhyteAsamoah Jan 6, 2021
4e4ad32
Update README.md
WhyteAsamoah Jan 6, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -98,3 +98,5 @@ Project home page: http://118.25.96.118/gsrycloud/TreeLib/
- karro26-陈冬卉-201732120102
- Joffool-陈金龙-201732120112
- Weichao-Chen-陈伟超-201732120113
- Yeboah Martha Asamoah - 201732120135
- Tanaka Michelle Sandati -201732120134
17 changes: 8 additions & 9 deletions templates/donation.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,15 @@
{% extends "template.html" %}
{% extends "template.html" %} {% block content %}

{% block content %}
body style="background-color:#dadada;">
<div class="row">
<div class="col-md-3">
<p>In the development of the site, you can scan the QR code to support us.</p>
<img width="400px" height="400px" src="/static/img/mm_facetoface_collect_qrcode_1546415955505.png">
<body style="background-color:#dadada;">
<div class="row">
<div class="col-md-3">
<p>In the development of the site, you can scan the QR code to support us.</p>
<img width="400px" height="400px" src="/static/img/mm_facetoface_collect_qrcode_1546415955505.png">
</div>
</div>
</div>

<br>
<br>
<br>
</body>
{% endblock %}
{% endblock %}
46 changes: 22 additions & 24 deletions templates/login.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,30 +1,28 @@
{% extends "template.html" %}
{% extends "template.html" %} {% block content %}

{% block content %}
<div style="margin:auto">
<Table align="center">
<form action="/login" method="POST">
<tr>
<td> <i class="fa fa-envelope icon"></i> Email</td>
<td><input type="email" name="email"></td>
</tr>
<tr>
<td><i class="fa fa-key icon"></i> Password</td>
<td><input type="password" name="pass"></td>
</tr>
<tr>
<td><button class="btn btn-secondary" type="submit">Login</button></td>
<td>{% if error %}
<div style="color: red;">{{ error }}</div>
{% endif %}</td>
</tr>

<div style="padding-top: 250px;">
<Table align="center">
<form action="/login" method="POST">
<tr>
<td>Email</td>
<td><input type="email" name="email"></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" name="pass"></td>
</tr>
<tr>
<td><button class="btn btn-secondary" type="submit">Login</button></td>
<td>{% if error %}
<div style="color: red;">{{ error }}</div>
{% endif %}</td>
</tr>

</form>
</Table>
</form>
</Table>

<br>
<br>

</div>
{% endblock %}
{% endblock %}
260 changes: 181 additions & 79 deletions templates/template.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,108 +1,210 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">

<!-- 新 Bootstrap4 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
<!-- 新 Bootstrap4 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/css/bootstrap.min.css">

<!-- popper.min.js 用于弹窗、提示、下拉菜单 -->
<script src="https://cdn.staticfile.org/popper.js/1.12.5/umd/popper.min.js"></script>
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>

<!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
<!-- popper.min.js 用于弹窗、提示、下拉菜单 -->
<script src="https://cdn.staticfile.org/popper.js/1.12.5/umd/popper.min.js"></script>

<script src="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/js/bootstrap.min.js"></script>
<!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->

<!-- ajax -->
<script src="http://how2j.cn/study/axios.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/js/bootstrap.min.js"></script>

<script src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
<style>
<!-- ajax -->
<script src="http://how2j.cn/study/axios.min.js"></script>

footer{
background-color: #323a3a;
color: #dadada;
padding-top: 2rem;
}
hr.light{
border-top: 1px solid #d5d5d5;
width: 75%;
margin-top: .8rem;
margin-bottom: 1rem;
}
<script src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
<style>
.footer {
background-color: rgb(27, 54, 100);
color: #dadada;
padding-top: 2rem;
}

hr.light {
border-top: 1px solid #d5d5d5;
width: 75%;
margin-top: .8rem;
margin-bottom: 1rem;
}

.fixed-header {
box-sizing: border-box;
display: block;
position: fixed;
line-height: 20px;
min-height: 58px;
margin-bottom: 20px;
right: 0px;
top: 1px;
left: 0px;
background: rgb(27, 54, 100);
background-repeat: repeat-x;
z-index: 1030;
}

nav a {
color: #fff;
text-decoration: none;
padding: 15px 25px;
display: inline-block;
}

.navbar {
position: relative;
display: inline-block;
}

.navbar .navlink {
cursor: pointer;
font-size: 16px;
border: none;
outline: none;
color: white;
padding: 15px 16px;
background-color: inherit;
font-family: inherit;
margin: 0;
}

.nav a:hover,
.navbar:hover .navlink,
.navlink:focus {
background-color: #2b65bd;
text-decoration: none;
}

.search {
padding-top: 12px;
margin-left: 40px;
font-size: 14px;
}

.search button {
float: right;
padding: 3.0px 9px;
margin-top: 0px;
margin-right: 16px;
background: #ddd;
font-size: 12px;
border: none;
cursor: pointer;
}

#textfield {
font-size: 14px;
border-style: inset;
width: 200px;
padding-right: 0px;
}

.move_right {
float: right;
margin: 0px, 0px, 0px, 0px;
}

.container {
box-sizing: border-box;
color: rgb(27, 54, 100);
margin-left: 15px;
margin-right: 15px;
}
</style>


{% block head %}

{% endblock %}
{% block head %} {% endblock %}
</head>

<body>
<nav class="navbar navbar-expand-sm bg-dark navbar-dark">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="/">ZJNUservice</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/donation">Donation</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/admin">admin</a>
</li>
<!-- search -->&emsp;
<li class="nav-item" style="float:right">
<form method="get" action="/search">
<input type="text" name="content" style="border-radius:2px;" placeholder="input keyword to search"/>&nbsp;
<button class="btn btn-secondary" type="submit">search</button>
</form>
</li>
</ul>
</nav>
<div class="fixed-header">
<div class="container">
<nav>
<div class="navbar">
<a href="/" class="navlink">
<i class="fa fa-fw fa-home"></i> Home
</a>
</div>
<div class="navbar">
<a href="/donation" class="navlink">
<i class="fas fa-globe"></i> Donation
</a>
</div>
<div class="navbar">
<a href="/admin" class="navlink">
<i class="fa fa-fw fa-user"></i> Admin
</a>
</div>
<div class="navbar">
<a href="/" class="navlink">
<i class="far fa-address-card"></i> About US
</a>

</div>

<div class="navbar move_right">
<form method="get" action="/search" class="search">
<input type="text" placeholder=" Search..." id="textfield">
<button type="submit">
<i class="fa fa-search"></i>
</button>
</form>
</div>
</nav>
</div>
</div>
<br>
<br>
<br>


<div style="font-size: 20px; line-height: 1.8; text-shadow: 0.3px 0.3px black; font-family: Times, serif;" class="col-sm-10 container">
{% block content %}

{% endblock %}
{% block content %} {% endblock %}
</div>

<div class="footer bg-primary navbar-fixed-bottom">

</div>
</body>
<br>
<br>
<br>
<br>
<br>
<br>

<footer>
<div class="container-fluid padding">
<div class="row text-center">
<div class="col-md-6">
<hr class="light">
<h5>Contact Us</h5>
<hr class="light">
<p>Phone: 131-7551-6271</p>
<p>Email: i.leaderx@hotmail.com</p>
<p>Add: jinhua, zhejiang, 321000</p>
</div>
<div class="col-md-6">
<hr class="light">
<h5>About Us</h5>
<hr class="light">
<p>Zhejiang Normal University</p>
<p>Mathematics and computer science college</p>
<p><a style="text-decoration: none;" href="http://lanlab.org/course/2020s/spm/decide-areas-for-improvement-review.html">The SPM Spring 2020 Team</a></p>

</div>

<div class="col-12">
<hr class="light">
<h5><a style="text-decoration: none; color:#dadada;" href="http://zjnu.edu.cn/">&copy; ZJNU.com</a></h5>
</div>
</div>
</div>
<div class="container-fluid padding">
<div class="row text-center">
<div class="col-md-6">
<hr class="light">
<h5>Contact Us</h5>
<hr class="light">
<p>Phone: 131-7551-6271</p>
<p>Email: i.leaderx@hotmail.com</p>
<p>Add: jinhua, zhejiang, 321000</p>
</div>
<div class="col-md-6">
<hr class="light">
<h5>About Us</h5>
<hr class="light">
<p>Zhejiang Normal University</p>
<p>College of Mathematics and Computer Science </p>
<p><a style="text-decoration: none;" href="http://lanlab.org/course/2020s/spm/decide-areas-for-improvement-review.html">The SPM Spring 2020 Team</a></p>

</div>

<div class="col-12">
<hr class="light">
<h5><a style="text-decoration: none; color:#dadada;" href="http://zjnu.edu.cn/">&copy; ZJNU.com</a></h5>
</div>
</div>
</div>
</footer>
</html>

</html>