added photos, fonts, nav bar

This commit is contained in:
aj 2019-02-17 00:00:31 +00:00
parent 777abcd210
commit d37010a2e2
7 changed files with 113 additions and 85 deletions

BIN
static/art/horse.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 MiB

BIN
static/art/self.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 842 KiB

View File

@ -1,7 +0,0 @@
h3 {
color: white;
font-family: 'Ubuntu', sans-serif;
font-size: 12px;
}

View File

@ -1,71 +1,116 @@
* {
box-sizing: border-box;
}
html {
font-family: 'Open Sans', arial;
}
body { body {
background-color: #51688e; background-color: #111725;
}
h1 {
color: white;
font-family: 'Ubuntu', sans-serif;
font-size: 14vw;
text-shadow: 3px 3px 3px #aaa;
}
h3 {
color: white;
font-family: 'Ubuntu', sans-serif;
font-size: 4vw;
text-shadow: 3px 3px 3px #aaa;
} }
a { a {
color: white; color: white;
font-family: 'Ubuntu', sans-serif;
font-size: 20px; font-size: 20px;
text-shadow: 2px 2px 2px #aaa; /*text-shadow: 1px 1px 1px #aaa;*/
} }
p { p {
color: white; color: white;
font-family: 'Ubuntu', sans-serif; font-size: 20px;
font-size: 4vw; padding: 10px;
text-shadow: 2px 2px 2px #aaa;
} }
.gallerystrip img {
height: auto;
margin: 0px;
border: 6px solid #484c55;
}
.header { div.gallerystrip {
background-color: #58518e; width: 100%;
margin: auto;
}
h1.title {
color: white;
font-size: 14vw;
font-family: 'Megrim', arial;
text-shadow: 2px 2px 2px #aaa;
background-color: #070c1a;
padding: 0px; padding: 0px;
width: 60vw; width: 45vw;
height: 18vw; height: 18vw;
text-align: center; text-align: center;
margin: auto; margin: auto;
} }
.navbar { ul.navbar {
list-style-type: none; list-style-type: none;
margin: 0; border-radius: 5px 15px;
box-shadow: 5px 5px grey;
margin: 10px;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
background-color: #333; background-color: #1e2028;
} }
.navbar li { ul.navbar li {
float: left; float: left;
position: -webkit-sticky; position: -webkit-sticky;
position: sticky; position: sticky;
top: 0; top: 0;
} }
.navbar a { ul.navbar li a {
display: block; display: block;
color: white; color: white;
text-align: center; text-align: center;
padding: 14px 16px; padding: 14px 16px;
text-decoration: none; text-decoration: none;
-webkit-transition: background-color 0.4s;
url_for('static', filename='style.css') transition: background-color 0.4s;
} }
.navbar a:hover { ul.navbar a:hover {
background-color: #111; background-color: #00030a;
} }
ul.navbar li.right {float: right;}
@media only screen and (max-width: 500px) {
ul.navbar li.right,
ul.navbar li {float: none;}
}
[class*="col-"] {
float: left;
width: 100%;
}
@media only screen and (min-width: 768px) {
/* For desktop: */
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}
}
.row::after {
content: "";
clear: both;
display: table;
} }

View File

@ -1,28 +0,0 @@
<!doctype html>
<html>
<head>
<title>sarsoo</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='art.css') }}">
<link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet">
</head>
<body>
<div class="header">
<h1>sarsoo</h1>
</div>
<br><br>
<ul class="navbar">
<li><a href="/">home</a></li>
<li><a href="/art">art</a></li>
<li><a href="https://github.com/sarsoo">github</a></li>
<li><a href="https://www.last.fm/user/sarsoo">last.fm</a></li>
</ul>
<div class="gallery">
<a target="_blank" href="{{ url_for('static', filename='art/freddie.jpg') }} ">
<img src="{{ url_for('static', filename='art/freddie.jpg') }}" alt="Freddie Gibbs" width="600" height="400">
</a>
</div>
</body>
</html>

23
templates/base.html Normal file
View File

@ -0,0 +1,23 @@
<!doctype html>
<html>
<head>
<title>sarsoo/{% block title %}{% endblock %}</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
<link href="https://fonts.googleapis.com/css?family=Megrim|Open+Sans:600" rel="stylesheet">
</head>
<body>
<div>
<h1 class="title">andy</h1>
</div>
<br><br>
<ul class="navbar">
<li><a href="/">home</a></li>
<li class="right"><a href="https://www.instagram.com/pack_it_in_/">art ig</a></li>
<li class="right"><a href="https://www.last.fm/user/sarsoo">last.fm</a></li>
<li class="right"><a href="https://github.com/sarsoo">github</a></li>
</ul>
{% block content %}{% endblock %}
</body>
</html>

View File

@ -1,21 +1,16 @@
<!doctype html> {% extends 'base.html' %}
<html>
<head> {% block title %}home{% endblock %}
<title>sarsoo</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"> {% block content %}
<link type="text/css" rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
<link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet"> <div class="row">
</head> <p style="text-align:center">electronic engineering student</p>
<body>
<div class="header">
<h1>sarsoo</h1>
</div> </div>
<br><br>
<ul class="navbar"> <div class="gallerystrip row">
<li><a href="/">home</a></li> <img src="{{ url_for('static', filename='art/freddie.jpg') }}" alt="freddie gibbs" class="col-4">
<li><a href="/art">art</a></li> <img src="{{ url_for('static', filename='art/self.jpg') }}" alt="me" class="col-4">
<li><a href="https://github.com/sarsoo">github</a></li> <img src="{{ url_for('static', filename='art/horse.jpg') }}" alt="tempation of saint anthony" class="col-4">
<li><a href="https://www.last.fm/user/sarsoo">last.fm</a></li> </div>
</ul> {% endblock %}
</body>
</html>