Skip to content

Commit 4833fd9

Browse files
author
Jensen
committed
vid 2 ok
1 parent 7e2a1bf commit 4833fd9

File tree

7 files changed

+236
-1
lines changed

7 files changed

+236
-1
lines changed

‎README.md

+5-1
Original file line numberDiff line numberDiff line change
@@ -1 +1,5 @@
1-
# flask-tutorial
1+
# flask-tutorial
2+
3+
http://localhost:5000/
4+
5+
stopped at https://www.youtube.com/watch?v=UIJKdCIEXUQ

‎__pycache__/flaskblog.cpython-37.pyc

378 Bytes
Binary file not shown.

‎flaskblog.py

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
from flask import Flask, render_template, url_for
2+
import datetime
3+
app = Flask(__name__)
4+
5+
posts = [{
6+
'_id': 0,
7+
'name': 'Bob',
8+
'dob': datetime.datetime(1996, 11, 12, 11, 14),
9+
'email': 'bob@gmail.com',
10+
'status': 0
11+
}, {
12+
'_id': 1,
13+
'name': 'Mason',
14+
'dob': datetime.datetime(1996, 11, 12, 11, 14),
15+
'email': 'mason@gmail.com',
16+
'status': 1
17+
}]
18+
19+
20+
@app.route('/') #'/' is root page
21+
@app.route('/home')
22+
def home():
23+
return render_template('home.html', posts=posts, title='home')
24+
25+
26+
@app.route('/about')
27+
def about():
28+
return render_template('about.html', title='about')
29+
30+
31+
if __name__ == '__main__':
32+
app.run(debug=True)

‎static/main.css

+85
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
body {
2+
background: #fafafa;
3+
color: #333333;
4+
margin-top: 5rem;
5+
}
6+
7+
h1,
8+
h2,
9+
h3,
10+
h4,
11+
h5,
12+
h6 {
13+
color: #444444;
14+
}
15+
16+
.bg-steel {
17+
background-color: #5f788a;
18+
}
19+
20+
.site-header .navbar-nav .nav-link {
21+
color: #cbd5db;
22+
}
23+
24+
.site-header .navbar-nav .nav-link:hover {
25+
color: #ffffff;
26+
}
27+
28+
.site-header .navbar-nav .nav-link.active {
29+
font-weight: 500;
30+
}
31+
32+
.content-section {
33+
background: #ffffff;
34+
padding: 10px 20px;
35+
border: 1px solid #dddddd;
36+
border-radius: 3px;
37+
margin-bottom: 20px;
38+
}
39+
40+
.article-title {
41+
color: #444444;
42+
}
43+
44+
a.article-title:hover {
45+
color: #428bca;
46+
text-decoration: none;
47+
}
48+
49+
.article-content {
50+
white-space: pre-line;
51+
}
52+
53+
.article-img {
54+
height: 65px;
55+
width: 65px;
56+
margin-right: 16px;
57+
}
58+
59+
.article-metadata {
60+
padding-bottom: 1px;
61+
margin-bottom: 4px;
62+
border-bottom: 1px solid #e3e3e3;
63+
}
64+
65+
.article-metadata a:hover {
66+
color: #333;
67+
text-decoration: none;
68+
}
69+
70+
.article-svg {
71+
width: 25px;
72+
height: 25px;
73+
vertical-align: middle;
74+
}
75+
76+
.account-img {
77+
height: 125px;
78+
width: 125px;
79+
margin-right: 20px;
80+
margin-bottom: 16px;
81+
}
82+
83+
.account-heading {
84+
font-size: 2.5rem;
85+
}

‎templates/about.html

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{% extends 'layout.html' %} {% block content %}
2+
<h1>About</h1>
3+
{% endblock content %}

‎templates/home.html

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{% extends 'layout.html' %} {% block content %} {% for post in posts %}
2+
3+
<div class="row">
4+
<div class="col-sm-12">
5+
<div class="card">
6+
<div class="card-body">
7+
<h5 class="card-title">Name: {{ post.name }}</h5>
8+
<p class="card-text">DOB: {{ post.dob }}</p>
9+
<p class="card-text">Email: {{ post.email }}</p>
10+
<p class="card-text">Status: {{ post.status }}</p>
11+
{% if post.status == 0 %}
12+
<a href="#" class="btn btn-primary">Register</a>
13+
{% else %}
14+
<a href="#" class="btn btn-primary">Loan</a>
15+
{% endif %}
16+
</div>
17+
</div>
18+
</div>
19+
</div>
20+
{% endfor %} {% endblock content %}

‎templates/layout.html

+91
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<!-- Required meta tags -->
5+
<meta charset="utf-8" />
6+
<meta
7+
name="viewport"
8+
content="width=device-width, initial-scale=1, shrink-to-fit=no"
9+
/>
10+
11+
<!-- Bootstrap CSS -->
12+
<link
13+
rel="stylesheet"
14+
href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
15+
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
16+
crossorigin="anonymous"
17+
/>
18+
19+
<link rel="stylesheet" type="text/css" href="{{url_for('static', filename='main.css')}}">
20+
21+
<title>{{ title }}</title>
22+
<title></title>
23+
</head>
24+
25+
<body>
26+
<header class="site-header">
27+
<nav class="navbar navbar-expand-md navbar-dark bg-steel fixed-top">
28+
<div class="container">
29+
<a class="navbar-brand mr-4" href="/">Flask Blog</a>
30+
<button
31+
class="navbar-toggler"
32+
type="button"
33+
data-toggle="collapse"
34+
data-target="#navbarToggle"
35+
aria-controls="navbarToggle"
36+
aria-expanded="false"
37+
aria-label="Toggle navigation"
38+
>
39+
<span class="navbar-toggler-icon"></span>
40+
</button>
41+
<div class="collapse navbar-collapse" id="navbarToggle">
42+
<div class="navbar-nav mr-auto">
43+
<a class="nav-item nav-link" href="/">Home</a>
44+
<a class="nav-item nav-link" href="/about">About</a>
45+
</div>
46+
<!-- Navbar Right Side -->
47+
<div class="navbar-nav">
48+
<a class="nav-item nav-link" href="/login">Login</a>
49+
<a class="nav-item nav-link" href="/register">Register</a>
50+
</div>
51+
</div>
52+
</div>
53+
</nav>
54+
</header>
55+
<main role="main" class="container">
56+
<div class="row">
57+
<div class="col-md-8">
58+
{% block content %}{% endblock %}
59+
</div>
60+
<div class="col-md-4">
61+
<div class="content-section">
62+
<h3>Our Sidebar</h3>
63+
<p class='text-muted'>You can put any information here you'd like.
64+
<ul class="list-group">
65+
<li class="list-group-item list-group-item-light">Latest Posts</li>
66+
<li class="list-group-item list-group-item-light">Announcements</li>
67+
<li class="list-group-item list-group-item-light">Calendars</li>
68+
<li class="list-group-item list-group-item-light">etc</li>
69+
</ul>
70+
</p>
71+
</div>
72+
</div>
73+
</div>
74+
</main>
75+
<script
76+
src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
77+
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
78+
crossorigin="anonymous"
79+
></script>
80+
<script
81+
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
82+
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
83+
crossorigin="anonymous"
84+
></script>
85+
<script
86+
src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
87+
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
88+
crossorigin="anonymous"
89+
></script>
90+
</body>
91+
</html>

0 commit comments

Comments
 (0)