Added missing pages, built home page layout, added some images and external css/js files
This commit is contained in:
parent
ca17d47a75
commit
b4ecefe5c6
14 changed files with 807 additions and 40 deletions
|
|
@ -7,6 +7,7 @@ app.config.from_pyfile('config.py')
|
|||
|
||||
def connect_db():
|
||||
return sqlite3.connect(app.config['DATABASE'])
|
||||
|
||||
@app.before_request
|
||||
def before_request():
|
||||
g.db = connect_db()
|
||||
|
|
@ -18,10 +19,28 @@ def teardown_request(exception):
|
|||
db.close()
|
||||
|
||||
@app.route('/')
|
||||
def show_entries():
|
||||
def home():
|
||||
cur = g.db.execute('select title, text from entries order by id desc')
|
||||
entries = [dict(title=row[0], text=row[1]) for row in cur.fetchall()]
|
||||
return render_template('show_entries.html', entries=entries)
|
||||
return render_template('home.html', entries=entries)
|
||||
|
||||
@app.route('/bio')
|
||||
def bio():
|
||||
return render_template('bio.html')
|
||||
|
||||
@app.route('/blog')
|
||||
def blog():
|
||||
cur = g.db.execute('select title, text from entries order by id desc')
|
||||
entries = [dict(title=row[0], text=row[1]) for row in cur.fetchall()]
|
||||
return render_template('blog.html', entries=entries)
|
||||
|
||||
@app.route('/projects')
|
||||
def projects():
|
||||
return render_template('projects.html')
|
||||
|
||||
@app.route('/contact')
|
||||
def contact():
|
||||
return render_template('contact.html')
|
||||
|
||||
@app.route('/add', methods=['POST'])
|
||||
def add_entry():
|
||||
|
|
|
|||
|
|
@ -1,18 +1,473 @@
|
|||
body { font-family: sans-serif; background: #eee; }
|
||||
a, h1, h2 { color: #377ba8; }
|
||||
h1, h2 { font-family: Georgia, serif; margin: 0; }
|
||||
h1 { border-bottom: 2px solid #eee; }
|
||||
h2 { font-size: 1.2em; }
|
||||
body {
|
||||
font-family:'Open Sans', Tahoma, Geneva, sans-serif;
|
||||
margin:0;
|
||||
padding:0;
|
||||
background-color:#fff;
|
||||
}
|
||||
|
||||
.page { margin: 2em auto; width: 35em; border: 5px solid #ccc;
|
||||
padding: 0.8em; background: white; }
|
||||
.entries { list-style: none; margin: 0; padding: 0; }
|
||||
.entries li { margin: 0.8em 1.2em; }
|
||||
.entries li h2 { margin-left: -1em; }
|
||||
.add-entry { font-size: 0.9em; border-bottom: 1px solid #ccc; }
|
||||
.add-entry dl { font-weight: bold; }
|
||||
.metanav { text-align: right; font-size: 0.8em; padding: 0.3em;
|
||||
margin-bottom: 1em; background: #fafafa; }
|
||||
.flash { background: #cee5F5; padding: 0.5em;
|
||||
border: 1px solid #aacbe2; }
|
||||
.error { background: #f0d6d6; padding: 0.5em; }
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-family: 'Ubuntu', sans-serif;
|
||||
}
|
||||
|
||||
a {
|
||||
-webkit-transition: color 0.5s, background-color 0.5s; /* Safari */
|
||||
transition: color 0.5s, background-color 0.5s;
|
||||
}
|
||||
|
||||
pre {
|
||||
max-width: 565px;
|
||||
white-space: pre-wrap;
|
||||
width: 95%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
td {
|
||||
padding: 5px 20px;
|
||||
}
|
||||
|
||||
td ul {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#nav {
|
||||
position:fixed;
|
||||
top:0;
|
||||
margin:0;
|
||||
background-color:#002900;
|
||||
height:60px;
|
||||
width:100vw;
|
||||
z-index:99;
|
||||
}
|
||||
|
||||
.main-nav {
|
||||
position:fixed;
|
||||
top:0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height:50px;
|
||||
width:100vw;
|
||||
max-width: 1100px;
|
||||
margin:auto;
|
||||
padding:12px 0;
|
||||
z-index:99;
|
||||
}
|
||||
|
||||
.main-nav h1 {
|
||||
top:20px;
|
||||
color:white;
|
||||
text-align:left;
|
||||
display:inline;
|
||||
padding:10px;
|
||||
width:200px;
|
||||
font-size:30px;
|
||||
}
|
||||
|
||||
.main-nav h1 a:link, .main-nav h1 a:visited, .main-nav h1 a:hover, .main-nav h1 a:active {
|
||||
color:white;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
.main-nav ul {
|
||||
float:right;
|
||||
margin-top:-5px;
|
||||
margin:0;
|
||||
padding:0;
|
||||
list-style-type:none;
|
||||
}
|
||||
|
||||
.main-nav li {
|
||||
display:inline-block;
|
||||
margin:0 auto;
|
||||
padding:0;
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.main-nav li a {
|
||||
display:block;
|
||||
}
|
||||
|
||||
.main-nav li a:link, .main-nav li a:visited {
|
||||
text-decoration:none;
|
||||
text-align:center;
|
||||
color:white;
|
||||
padding:5px;
|
||||
margin:0 auto;
|
||||
font-size:16px;
|
||||
font-weight:bold;
|
||||
border-radius: 40px;
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.main-nav li a:hover, .main-nav li a:active {
|
||||
background-color:#5C995C;
|
||||
}
|
||||
|
||||
.main-nav p {
|
||||
margin:0 0 0 15px;
|
||||
padding:0;
|
||||
color:white;
|
||||
font-size:12px;
|
||||
}
|
||||
|
||||
.main-nav p a {
|
||||
text-decoration:none;
|
||||
color:white;
|
||||
}
|
||||
|
||||
#menu {
|
||||
display:inline-block;
|
||||
}
|
||||
|
||||
#menu-icon {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.nav-spacer {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.container {
|
||||
min-height: 100vh - 60px;
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.content {
|
||||
width:90%;
|
||||
max-width:1100px;
|
||||
margin:auto;
|
||||
}
|
||||
|
||||
.content h1, .content h2 {
|
||||
color:#002900;
|
||||
text-align:left;
|
||||
padding: 5px;
|
||||
border-bottom: 1px solid #002900;
|
||||
}
|
||||
|
||||
.section {
|
||||
border-radius: 40px;
|
||||
padding:1px 15px 15px 15px;
|
||||
}
|
||||
|
||||
.one-third {
|
||||
width: 30%;
|
||||
margin: 5px 1.5%;
|
||||
float: left;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h1.entry-title {
|
||||
padding: 5px;
|
||||
border-bottom: 1px solid black;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
a.view-more {
|
||||
display: block;
|
||||
float: right;
|
||||
}
|
||||
|
||||
#home {
|
||||
color:white;
|
||||
}
|
||||
a.insta-link {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
a.insta-link span {
|
||||
border-radius: 50%;
|
||||
color: #fff;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
-webkit-transition:opacity 0.25s linear;
|
||||
transition:opacity 0.25s linear;
|
||||
}
|
||||
|
||||
a.insta-link:hover span {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
span.insta-caption-bg {
|
||||
background-color: rgba(0, 0, 0, 0.75);
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
right: 0;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
span.insta-caption {
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 130px;
|
||||
margin: 0 20px;
|
||||
height: auto;
|
||||
max-height: 130px;
|
||||
font-size: 14px;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
div#instafeed {
|
||||
overflow: hidden;
|
||||
width: 95%;
|
||||
max-width: 1100px;
|
||||
margin: 60px auto;
|
||||
}
|
||||
|
||||
#home img {
|
||||
border-radius:50%;
|
||||
height:auto;
|
||||
width:150px;
|
||||
display:inline-block;
|
||||
float:none;
|
||||
margin:10px;
|
||||
}
|
||||
|
||||
#about {
|
||||
background-color:white;
|
||||
padding:1px 15px 15px 15px;
|
||||
}
|
||||
|
||||
.desktop {
|
||||
display:inline-block;
|
||||
width:70%;
|
||||
}
|
||||
|
||||
.glance {
|
||||
display:inline-block;
|
||||
width:20%;
|
||||
}
|
||||
|
||||
.glance p {
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
.glance ul {
|
||||
margin:auto;
|
||||
display:inline-block;
|
||||
}
|
||||
|
||||
#projects {
|
||||
background-color:#002900;
|
||||
color:white;
|
||||
margin:50px auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#projects h2 {
|
||||
color: #ffffff;
|
||||
border-bottom: 1px solid white;
|
||||
}
|
||||
|
||||
#projects h3 {
|
||||
margin: 10px auto;
|
||||
}
|
||||
|
||||
#projects p {
|
||||
margin: 5px auto;
|
||||
}
|
||||
|
||||
.project {
|
||||
width:75%%;
|
||||
margin: 0 auto 10px;
|
||||
text-align: left;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.project li {
|
||||
float:left;
|
||||
width:50%;
|
||||
|
||||
}
|
||||
|
||||
.project-logo {
|
||||
height: auto;
|
||||
width: 95%;
|
||||
max-width: 200px;
|
||||
max-height: 100px;
|
||||
margin: auto;
|
||||
border: 1px solid white;
|
||||
}
|
||||
|
||||
.ff-store-link {
|
||||
height: auto;
|
||||
width: 40%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.chrome-webstore-link {
|
||||
height: auto;
|
||||
width: 51%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.project h4 {
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
footer {
|
||||
display: block;
|
||||
width: 100%;
|
||||
background-color: #002900;
|
||||
border-top: 3px solid #fff;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
a#menu-icon {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
a.social-link {
|
||||
font-size: 20px;
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
a.social-link:link, a.social-link:visited {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
a.social-link:hover, a.social-link:active {
|
||||
color: #476C47;
|
||||
}
|
||||
|
||||
.section a:link, .section a:visited {
|
||||
color: #476C47;
|
||||
}
|
||||
|
||||
.section a:hover, .section a:active {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.entry-footer {
|
||||
border-radius: 50px;
|
||||
}
|
||||
|
||||
.entry-footer span {
|
||||
margin: auto 5px;
|
||||
}
|
||||
|
||||
.entry-footer a:link, .entry-footer a:visited {
|
||||
color: #5C995C;
|
||||
}
|
||||
|
||||
.entry-footer a:hover, .entry-footer a:active {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
@media all and (max-width: 1192px) {
|
||||
div#instafeed {
|
||||
max-width: 510px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width:1024px) {
|
||||
.main-nav, #nav {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
#menu {
|
||||
display:none;
|
||||
width:100vw;
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
left: 0;
|
||||
padding:0;
|
||||
background-color:#002900;
|
||||
float:none;
|
||||
}
|
||||
|
||||
#menu-icon {
|
||||
position:absolute;
|
||||
right:30px;
|
||||
display:inline;
|
||||
height:20px;
|
||||
width:auto;
|
||||
margin:10px;
|
||||
}
|
||||
|
||||
.main-nav li {
|
||||
display:block;
|
||||
margin:0 auto;
|
||||
padding:0;
|
||||
background-color:#002900;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.main-nav li a {
|
||||
width:90%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.desktop {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.glance {
|
||||
width:95%;
|
||||
margin:auto;
|
||||
}
|
||||
|
||||
.project {
|
||||
display:block;
|
||||
width:95%;
|
||||
margin:auto;
|
||||
}
|
||||
|
||||
.project-logo {
|
||||
display: block;
|
||||
float:none;
|
||||
margin:auto;
|
||||
}
|
||||
.social-link {
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 768px) {
|
||||
div#instafeed {
|
||||
max-width: 340px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 870px) {
|
||||
.one-third {
|
||||
width: 45%;
|
||||
margin: 5px 2.5% 40px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 782px) {
|
||||
.customize-support #nav, .customize-support .main-nav {
|
||||
top: 46px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 700px) {
|
||||
.one-third {
|
||||
width: 90%;
|
||||
margin: 5px 5% 40px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 596px) {
|
||||
div#instafeed {
|
||||
max-width: 340px;
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width: 414px) {
|
||||
div#instafeed {
|
||||
max-width: 170px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
BIN
static/img/chrome-webstore.png
Normal file
BIN
static/img/chrome-webstore.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.6 KiB |
BIN
static/img/ff-marketplace.png
Normal file
BIN
static/img/ff-marketplace.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
BIN
static/img/interval-timer.png
Normal file
BIN
static/img/interval-timer.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 102 KiB |
BIN
static/img/sinconsa.png
Normal file
BIN
static/img/sinconsa.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 209 KiB |
BIN
static/img/workout-generator.png
Normal file
BIN
static/img/workout-generator.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4 KiB |
2
static/js/instafeed.min.js
vendored
Normal file
2
static/js/instafeed.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
7
templates/bio.html
Normal file
7
templates/bio.html
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
{% extends 'master.html' %}
|
||||
{% block body %}
|
||||
<div class="section" id="bio">
|
||||
<h2>about me</h2>
|
||||
<p>extended bio coming soon...</p>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
@ -11,11 +11,12 @@
|
|||
</dl>
|
||||
</form>
|
||||
{% endif %}
|
||||
<ul class=entries>
|
||||
<div class=entries>
|
||||
{% for entry in entries %}
|
||||
<li><h2>{{ entry.title }}</h2>{{ entry.text|safe }}
|
||||
<h2>{{ entry.title }}</h2>
|
||||
{{ entry.text|safe }}
|
||||
{% else %}
|
||||
<li><em>Unbelievable. No entries here so far</em>
|
||||
<em>Sorry, I still haven't gotten around to moving my blog posts over!</em>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endblock %}
|
||||
57
templates/contact.html
Normal file
57
templates/contact.html
Normal file
|
|
@ -0,0 +1,57 @@
|
|||
{% extends 'master.html' %}
|
||||
{% block body %}
|
||||
<h1 style="border-width: 0; text-align: center;">
|
||||
<span id="changing-text">web developer.</span>
|
||||
</h1>
|
||||
|
||||
<div class="section" id="blog">
|
||||
<h2>from my blog</h2>
|
||||
</div>
|
||||
<div class="section" id="projects">
|
||||
<h2 style="color: #ffffff; border-bottom: 1px solid white;">projects</h2>
|
||||
<div class="one-third">
|
||||
<a href="http://wbrawner.com/interval-timer" target="_blank"><img class="project-logo" style="max-width: 102px; border-radius: 50%;" src="{{ url_for('static', filename='img/interval-timer.png') }}"></a>
|
||||
<h3>interval timer app</h3>
|
||||
<p>languages/technologies used:</p>
|
||||
<ul class="project">
|
||||
<li>English</li>
|
||||
<li>HTML/CSS</li>
|
||||
<li>JavaScript</li>
|
||||
<li>AngularJS</li>
|
||||
<li>GIMP</li>
|
||||
</ul>
|
||||
<a href="https://marketplace.firefox.com/app/interval-timer-1/" target="_blank"><img class="ff-store-link" src="{{ url_for('static', filename='img/ff-marketplace.png') }}"></a>
|
||||
<a href="https://chrome.google.com/webstore/detail/interval-timer/glhbffeiigldedfpeiccmfdigplkeanm" target="_blank"><img class="chrome-webstore-link" src="{{ url_for('static', filename='img/chrome-webstore.png') }}"></a>
|
||||
</div>
|
||||
<div class="one-third">
|
||||
<a href="http://workout-generator.wbrawner.com/" target="_blank"><img class="project-logo" src="{{ url_for('static', filename='img/workout-generator.png') }}"></a>
|
||||
<h3>workout generator app</h3>
|
||||
<p>languages/technologies used:</p>
|
||||
<ul class="project">
|
||||
<li>English</li>
|
||||
<li>HTML/CSS</li>
|
||||
<li>JavaScript</li>
|
||||
<li>JQuery</li>
|
||||
<li>PHP</li>
|
||||
<li>Laravel</li>
|
||||
<li>GIMP</li>
|
||||
<li>VIM</li>
|
||||
<li>MySQL</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="one-third">
|
||||
<a href="http://www.sinconsa.com/" target="_blank"><img class="project-logo" src="{{ url_for('static', filename='img/sinconsa.png') }}"></a>
|
||||
<h3>sinconsa consultores</h3>
|
||||
<p>languages/technologies used:</p>
|
||||
<ul class="project">
|
||||
<li>Spanish</li>
|
||||
<li>HTML/CSS</li>
|
||||
<li>JavaScript</li>
|
||||
<li>JQuery</li>
|
||||
<li>CPanel</li>
|
||||
<li>GIMP</li>
|
||||
<li>VIM</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
128
templates/home.html
Normal file
128
templates/home.html
Normal file
|
|
@ -0,0 +1,128 @@
|
|||
{% extends 'master.html' %}
|
||||
{% block body %}
|
||||
<h1 style="border-width: 0; text-align: center;">
|
||||
<span id="changing-text">web developer.</span>
|
||||
</h1>
|
||||
|
||||
<div class="section" id="blog">
|
||||
<h2>from my blog</h2>
|
||||
{% for entry in entries %}
|
||||
<h3>{{ entry.title }}</h3>
|
||||
{{ entry.text|safe }}
|
||||
{% else %}
|
||||
<em>Sorry, I still haven't gotten around to moving my blog posts over!</em>
|
||||
{% endfor %}
|
||||
<a class="view-more" href="{{ url_for('blog') }}">Read more »</a>
|
||||
</div>
|
||||
<div class="section" id="projects">
|
||||
<h2>projects</h2>
|
||||
<div class="one-third">
|
||||
<a href="http://wbrawner.com/interval-timer" target="_blank"><img class="project-logo" style="max-width: 102px; border-radius: 50%;" src="{{ url_for('static', filename='img/interval-timer.png') }}"></a>
|
||||
<h3>interval timer app</h3>
|
||||
<p>languages/technologies used:</p>
|
||||
<ul class="project">
|
||||
<li>English</li>
|
||||
<li>HTML/CSS</li>
|
||||
<li>JavaScript</li>
|
||||
<li>AngularJS</li>
|
||||
<li>GIMP</li>
|
||||
</ul>
|
||||
<a href="https://marketplace.firefox.com/app/interval-timer-1/" target="_blank"><img class="ff-store-link" src="{{ url_for('static', filename='img/ff-marketplace.png') }}"></a>
|
||||
<a href="https://chrome.google.com/webstore/detail/interval-timer/glhbffeiigldedfpeiccmfdigplkeanm" target="_blank"><img class="chrome-webstore-link" src="{{ url_for('static', filename='img/chrome-webstore.png') }}"></a>
|
||||
</div>
|
||||
<div class="one-third">
|
||||
<a href="http://workout-generator.wbrawner.com/" target="_blank"><img class="project-logo" style="margin: 23px auto;" src="{{ url_for('static', filename='img/workout-generator.png') }}"></a>
|
||||
<h3>workout generator app</h3>
|
||||
<p>languages/technologies used:</p>
|
||||
<ul class="project">
|
||||
<li>English</li>
|
||||
<li>HTML/CSS</li>
|
||||
<li>JavaScript</li>
|
||||
<li>JQuery</li>
|
||||
<li>PHP</li>
|
||||
<li>Laravel</li>
|
||||
<li>GIMP</li>
|
||||
<li>VIM</li>
|
||||
<li>MySQL</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="one-third">
|
||||
<a href="http://www.sinconsa.com/" target="_blank"><img class="project-logo" style="margin: 17px auto;" src="{{ url_for('static', filename='img/sinconsa.png') }}"></a>
|
||||
<h3>sinconsa consultores</h3>
|
||||
<p>languages/technologies used:</p>
|
||||
<ul class="project">
|
||||
<li>Spanish</li>
|
||||
<li>HTML/CSS</li>
|
||||
<li>JavaScript</li>
|
||||
<li>JQuery</li>
|
||||
<li>CPanel</li>
|
||||
<li>GIMP</li>
|
||||
<li>VIM</li>
|
||||
</ul>
|
||||
</div>
|
||||
<a class="view-more" href="{{ url_for('projects') }}">See more »</a>
|
||||
</div>
|
||||
<div class="section" id="bio">
|
||||
<h2>quick facts</h2>
|
||||
<table>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
current employer:
|
||||
</td>
|
||||
<td>
|
||||
<a href="http://whiterabbit.is">White Rabbit</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
current occupation:
|
||||
</td>
|
||||
<td>
|
||||
web developer
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
previous occupations:
|
||||
</td>
|
||||
<td>
|
||||
cashier, front desk receptionist, gym membership salesman, personal trainer, efl teacher
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
background:
|
||||
</td>
|
||||
<td>
|
||||
<ul>
|
||||
<li>13 years old: first time out of the USA - trip to Japan</li>
|
||||
<li>16 years old: first experience living in another country - foreign exchange student program in Finland</li>
|
||||
<li>18 years old: graduated high school and moved to Mexico</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
languages:
|
||||
</td>
|
||||
<td>
|
||||
<ul>
|
||||
<li>English</li>
|
||||
<li>Spanish</li>
|
||||
<li>Finnish</li>
|
||||
<li>German</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>HTML/CSS</li>
|
||||
<li>JavaScript</li>
|
||||
<li>PHP</li>
|
||||
<li>Python</li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<a class="view-more" href="{{ url_for('bio') }}">Learn more »</a>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
@ -1,17 +1,108 @@
|
|||
<!doctype html>
|
||||
<title>Flask Site</title>
|
||||
<link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/style.css') }}">
|
||||
<div class=page>
|
||||
<h1>Flask Site</h1>
|
||||
<div class=metanav>
|
||||
{% if not session.logged_in %}
|
||||
<a href="{{ url_for('login') }}">log in</a>
|
||||
{% else %}
|
||||
<a href="{{ url_for('logout') }}">log out</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% for message in get_flashed_messages() %}
|
||||
<div class=flash>{{ message }}</div>
|
||||
{% endfor %}
|
||||
{% block body %}{% endblock %}
|
||||
</div>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>William Brawner</title>
|
||||
<link rel=stylesheet type=text/css href="{{ url_for('static', filename='css/style.css') }}">
|
||||
<meta name="viewport" content="width=device-width, initial scale=1">
|
||||
<meta name="og:image" content="http://wbrawner.com/wp-content/uploads/2015/10/favicon.png">
|
||||
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
|
||||
<link href='https://fonts.googleapis.com/css?family=Ubuntu|Open+Sans' rel='stylesheet' type='text/css'>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="{{ url_for('static', filename='js/instafeed.min.js') }}"></script>
|
||||
<?php wp_head(); ?>
|
||||
<script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)
|
||||
},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
||||
|
||||
ga('create', 'UA-69342914-1', 'auto');
|
||||
ga('send', 'pageview');
|
||||
|
||||
</script>
|
||||
</script></script></title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="nav"></div>
|
||||
<nav class="main-nav">
|
||||
<h1><a href="/">william brawner</a></h1>
|
||||
<a href="javascript:void(0)" id="menu-icon">menu</a>
|
||||
<ul id="menu">
|
||||
<li>
|
||||
<a href="{{ url_for('home') }}">home</a>
|
||||
<div class="glow-border"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{{ url_for('bio') }}">bio</a>
|
||||
<div class="glow-border"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{{ url_for('projects') }}">projects</a>
|
||||
<div class="glow-border"></div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{{ url_for('contact') }}">contact</a>
|
||||
<div class="glow-border"></div>
|
||||
</li>
|
||||
<li>
|
||||
{% if not session.logged_in %}
|
||||
<a href="{{ url_for('login') }}">log in</a>
|
||||
{% else %}
|
||||
<a href="{{ url_for('logout') }}">log out</a>
|
||||
{% endif %}
|
||||
<div class="glow-border"></div>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="container">
|
||||
<div class="content">
|
||||
{% for message in get_flashed_messages() %}
|
||||
<div class=flash>{{ message }}</div>
|
||||
{% endfor %}
|
||||
{% block body %}{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
<footer>
|
||||
<div class="one-third" id="contact">
|
||||
<p>contact</p>
|
||||
<p class="contact-btns"><a class="social-link" href="mailto:contact@wbrawner.com?subject=Let's Work Together"><i class="fa fa-envelope-o"></i></a>
|
||||
<a target="_blank" class="social-link" href="https://www.facebook.com/wpbrawner"><i class="fa fa-facebook"></i></a>
|
||||
<a target="_blank" class="social-link" href="https://twitter.com/BillyBrawner1"><i class="fa fa-twitter"></i></a>
|
||||
<a target="_blank" class="social-link" href="https://www.linkedin.com/profile/view?id=AAIAABAr3PgB2QY4LrVuT2tCxni4S7Rdi2FC3MY&trk=nav_responsive_tab_profile"><i class="fa fa-linkedin"></i></a>
|
||||
<a target="_blank" class="social-link" href='http://stackexchange.com/users/6090478/billy-brawner'><i class="fa fa-stack-overflow"></i></a>
|
||||
<a target="_blank" class="social-link" href='https://github.com/wbrawner'><i class="fa fa-github"></i></a></p>
|
||||
</div>
|
||||
</footer>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$('#menu li').hover(function() {
|
||||
$(this).children('.glow-border').css('opacity', 1)
|
||||
}, function() {
|
||||
$(this).children('.glow-border').css('opacity', 0)
|
||||
})
|
||||
changeText()
|
||||
var minHeight = window.innerHeight - 60 - $('body > footer').height();
|
||||
$('.container').css('min-height', minHeight);
|
||||
})
|
||||
$(function() {
|
||||
var menuVisible = false;
|
||||
$('#menu-icon').click(function() {
|
||||
if (menuVisible) {
|
||||
$('#menu').css({'display':'none'});
|
||||
menuVisible = false;
|
||||
return;
|
||||
}
|
||||
$('#menu').css({'display':'block'});
|
||||
menuVisible = true;
|
||||
});
|
||||
});
|
||||
var titles = ["certified linux system administrator.","web developer.", "linguist.", "traveller."]; //array of titles to rotate
|
||||
function changeText() {
|
||||
var current = $("#changing-text").data("title") || 0;
|
||||
$("#changing-text").data("title", current == titles.length -1 ? 0 : current + 1).text(titles[current])
|
||||
.fadeIn().delay(2000).fadeOut(500, changeText);
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
7
templates/projects.html
Normal file
7
templates/projects.html
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
{% extends 'master.html' %}
|
||||
{% block body %}
|
||||
<div class="section" id="projects">
|
||||
<h2>projects</h2>
|
||||
<p>extended projects info coming soon...</p>
|
||||
</div>
|
||||
{% endblock %}
|
||||
Loading…
Reference in a new issue