Add Projects page
This commit is contained in:
parent
861b36ec32
commit
d6fd7fc108
3
index.py
3
index.py
|
@ -44,11 +44,12 @@ def index():
|
||||||
@app.route('/<page>')
|
@app.route('/<page>')
|
||||||
def page(page):
|
def page(page):
|
||||||
md = CONTENT_DIR + '%s_%s.md' % (page, lang)
|
md = CONTENT_DIR + '%s_%s.md' % (page, lang)
|
||||||
|
html = 'page_%s.html' % lang
|
||||||
|
|
||||||
if os.path.isfile(md):
|
if os.path.isfile(md):
|
||||||
body = read_md(md)
|
body = read_md(md)
|
||||||
|
|
||||||
return body
|
return render_template(html, body=body)
|
||||||
else:
|
else:
|
||||||
return not_found()
|
return not_found()
|
||||||
|
|
||||||
|
|
|
@ -4,12 +4,12 @@
|
||||||
* #17466E - Blue
|
* #17466E - Blue
|
||||||
*/
|
*/
|
||||||
|
|
||||||
html {
|
#html {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
#body {
|
||||||
background-color: #F2F2FF;
|
background-color: #F2F2FF;
|
||||||
background-image: url("duck.png");
|
background-image: url("duck.png");
|
||||||
background-size: 50%;
|
background-size: 50%;
|
||||||
|
@ -22,13 +22,13 @@ body {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
header {
|
#header {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
padding: 2rem;
|
padding: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
header h1 {
|
#title {
|
||||||
font-family: "Noto Serif Display", "American Typewriter", serif;
|
font-family: "Noto Serif Display", "American Typewriter", serif;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -36,12 +36,17 @@ header h1 {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
header nav {
|
#title a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
#links {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav a {
|
#links a {
|
||||||
margin: 1rem;
|
margin: 1rem;
|
||||||
font-size: 1.2rem;
|
font-size: 1.2rem;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
@ -49,7 +54,7 @@ nav a {
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.button {
|
#links .button {
|
||||||
background-color: #17466E;
|
background-color: #17466E;
|
||||||
color: #F2F2FF;
|
color: #F2F2FF;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
|
@ -73,11 +78,11 @@ nav a {
|
||||||
margin: .5em 0;
|
margin: .5em 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#social a img {
|
#social .icon {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
main {
|
#main {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -85,48 +90,47 @@ main {
|
||||||
flex-wrap: wrap-reverse;
|
flex-wrap: wrap-reverse;
|
||||||
}
|
}
|
||||||
|
|
||||||
main figure {
|
#quote {
|
||||||
max-width: 30%;
|
max-width: 30%;
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 1.5rem;
|
font-size: 1.5rem;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
main figure figcaption {
|
#quote figcaption {
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
main span {
|
#slogan {
|
||||||
text-align: right;
|
text-align: right;
|
||||||
font-size: 3rem;
|
font-size: 3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
mark {
|
#slogan mark {
|
||||||
background-color: #17466E;
|
background-color: #17466E;
|
||||||
color: #F2F2FF;
|
color: #F2F2FF;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (max-width: 600px) {
|
@media only screen and (max-width: 600px) {
|
||||||
|
#body {
|
||||||
body {
|
|
||||||
background-image: none;
|
background-image: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
main {
|
#main {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
header {
|
#header {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
main figure {
|
#quote {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
mark {
|
#slogan mark {
|
||||||
background-color: #EDAF1F;
|
background-color: #EDAF1F;
|
||||||
color: black;
|
color: black;
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,42 @@
|
||||||
|
#wrapper {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 3rem 1rem 5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#content {
|
||||||
|
background-color: white;
|
||||||
|
padding: 2rem;
|
||||||
|
box-shadow: 1px 0px 10px black;
|
||||||
|
text-align: justify;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: 600px) {
|
||||||
|
#content {
|
||||||
|
max-width: 90%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: 600px) {
|
||||||
|
#content {
|
||||||
|
max-width: 80%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: 768px) {
|
||||||
|
#content {
|
||||||
|
max-width: 70%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: 992px) {
|
||||||
|
#content {
|
||||||
|
max-width: 60%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (min-width: 1200px) {
|
||||||
|
#content {
|
||||||
|
max-width: 50%;
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,16 +1,16 @@
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html id="html">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8"/>
|
<meta charset="utf-8"/>
|
||||||
<title>Augusto Gunsch</title>
|
<title>Augusto Gunsch</title>
|
||||||
<link rel="stylesheet" href="{{ url_for('static', filename='stylesheet.css') }}"/>
|
<link rel="stylesheet" href="{{ url_for('static', filename='stylesheet.css') }}"/>
|
||||||
<link rel="icon" href="{{ url_for('static', filename='icon.png') }}"/>
|
<link rel="icon" href="{{ url_for('static', filename='icon.png') }}"/>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body id="body">
|
||||||
<header>
|
<header id="header">
|
||||||
<h1>Augusto<br>Gunsch</h1>
|
<h1 id="title"><a href='/'>Augusto<br>Gunsch</a></h1>
|
||||||
|
|
||||||
<nav>
|
<nav id="links">
|
||||||
<a href='contact'>Contact</a>
|
<a href='contact'>Contact</a>
|
||||||
<a href='about'>About</a>
|
<a href='about'>About</a>
|
||||||
<a href='projects' class='button'>Projects</a>
|
<a href='projects' class='button'>Projects</a>
|
||||||
|
@ -20,20 +20,20 @@
|
||||||
<div id="page">
|
<div id="page">
|
||||||
<div id="social">
|
<div id="social">
|
||||||
<a href="https://github.com/augustogunsch" target="_blank">
|
<a href="https://github.com/augustogunsch" target="_blank">
|
||||||
<img src="{{ url_for('static', filename='github.png') }}">
|
<img class="icon" src="{{ url_for('static', filename='github.png') }}">
|
||||||
</a>
|
</a>
|
||||||
<a href="https://www.linkedin.com/in/augusto-gunsch-210b17218" target="_blank">
|
<a href="https://www.linkedin.com/in/augusto-gunsch-210b17218" target="_blank">
|
||||||
<img src="{{ url_for('static', filename='linkedin.png') }}">
|
<img class="icon" src="{{ url_for('static', filename='linkedin.png') }}">
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<main>
|
<main id="main">
|
||||||
<figure>
|
<figure id="quote">
|
||||||
<blockquote>
|
<blockquote>
|
||||||
{{ quote }}
|
{{ quote }}
|
||||||
</blockquote>
|
</blockquote>
|
||||||
<figcaption>{{ author }}</figcaption>
|
<figcaption>{{ author }}</figcaption>
|
||||||
</figure>
|
</figure>
|
||||||
<span>
|
<span id="slogan">
|
||||||
I turn <mark>ideas</mark><br>into<br><mark>software</mark>.
|
I turn <mark>ideas</mark><br>into<br><mark>software</mark>.
|
||||||
</span>
|
</span>
|
||||||
</main>
|
</main>
|
||||||
|
|
|
@ -0,0 +1,29 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html id="html">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8"/>
|
||||||
|
<title>Augusto Gunsch</title>
|
||||||
|
<link rel="stylesheet" href="{{ url_for('static', filename='stylesheet.css') }}"/>
|
||||||
|
<link rel="stylesheet" href="{{ url_for('static', filename='stylesheet_page.css') }}"/>
|
||||||
|
<link rel="icon" href="{{ url_for('static', filename='icon.png') }}"/>
|
||||||
|
</head>
|
||||||
|
<body id="body">
|
||||||
|
<header id="header">
|
||||||
|
<h1 id="title"><a href='/'>Augusto<br>Gunsch</a></h1>
|
||||||
|
|
||||||
|
<nav id="links">
|
||||||
|
<a href='contact'>Contact</a>
|
||||||
|
<a href='about'>About</a>
|
||||||
|
<a href='projects' class='button'>Projects</a>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<article id="wrapper">
|
||||||
|
<div id="content">
|
||||||
|
{% autoescape false %}
|
||||||
|
{{ body }}
|
||||||
|
{% endautoescape %}
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</body>
|
||||||
|
</html>
|
Loading…
Reference in New Issue