Cristina Cochior
5 years ago
7 changed files with 196 additions and 19 deletions
@ -0,0 +1,13 @@ |
|||
{% extends "layout2.html" %} |
|||
{% block title %}Index{% endblock %} |
|||
{% block head %} |
|||
{{ super() }} |
|||
<style type="text/css"> |
|||
.important { color: #336699; } |
|||
</style> |
|||
{% endblock %} |
|||
{% block content %} |
|||
<h1>Index</h1> |
|||
<p class="important"> |
|||
Welcome on my awesome homepage. |
|||
{% endblock %} |
@ -0,0 +1,4 @@ |
|||
{% extends "layout.html" %} |
|||
{% block content %} |
|||
|
|||
{% endblock content %} |
@ -0,0 +1,26 @@ |
|||
<!DOCTYPE html> |
|||
<html> |
|||
<head> |
|||
|
|||
<meta charset="utf-8"> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1"> |
|||
<title>Library</title> |
|||
<link rel="stylesheet" href="{{ url_for('static', filename='css/main.css') }}"> |
|||
</head> |
|||
<body> |
|||
<div class="nav-top"> |
|||
<ul> |
|||
<li><a class="nav-button" style="text-align: left;" href="bought">BOUGHT</a></li> |
|||
<li><a class="nav-button" style="text-align: center;" href="stolen">STOLEN</a> |
|||
<li><a class="nav-button" style="text-align: right;" href="repurposed">REPURPOSED</a> |
|||
</ul> |
|||
</div> |
|||
<div class="nav-bottom"> |
|||
<ul> |
|||
<li><a class="nav-button" style="text-align: left;" href="copied">COPIED</a></li> |
|||
<li><a class="nav-button" style="text-align: center;" href="found">FOUND</a></li> |
|||
<li><a class="nav-button" style="text-align: right;" href="gift">GIFT</a></li> |
|||
</ul> |
|||
</div> |
|||
</body> |
|||
</html> |
@ -0,0 +1,106 @@ |
|||
|
|||
* { |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
body{ |
|||
margin: 0; |
|||
height: 100vh; |
|||
} |
|||
|
|||
|
|||
.main-column-left { |
|||
padding: 1.7em 0em; |
|||
float: left; |
|||
width: 50%; |
|||
background: red; |
|||
overflow-y: scroll; |
|||
height: 100vh; |
|||
} |
|||
|
|||
.main-column-right { |
|||
padding: 2em 1em; |
|||
float: right; |
|||
width: 50%; |
|||
background: purple; |
|||
overflow-y: scroll; |
|||
height: 100vh; |
|||
} |
|||
|
|||
.main:after { |
|||
content: ""; |
|||
display: table; |
|||
clear: both; |
|||
} |
|||
|
|||
div.nav-bottom ul, div.nav-top ul { |
|||
list-style-type: none; |
|||
margin: 0; |
|||
padding: 0; |
|||
} |
|||
|
|||
li a.nav-button { |
|||
display: block; |
|||
text-decoration: none; |
|||
padding: 0.25em; |
|||
font-family: sans-serif; |
|||
float: left; |
|||
width: 33.33%; |
|||
} |
|||
|
|||
.nav-top { |
|||
height: 1.5em; |
|||
background: white; |
|||
width: 100%; |
|||
position: fixed; |
|||
} |
|||
|
|||
.nav-bottom{ |
|||
height: 1.5em; |
|||
background: white; |
|||
width: 100%; |
|||
bottom: 0; |
|||
position: fixed; |
|||
z-index: 10000; |
|||
} |
|||
|
|||
span.librarian-names, span.file-names { |
|||
text-decoration: none; |
|||
padding: 0.3em; |
|||
color: black; |
|||
} |
|||
|
|||
span.librarian-names:hover, span.file-names:hover { |
|||
color: white; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
#listofpeople{ |
|||
border: lime 1px solid; |
|||
position: fixed; |
|||
width: 50%; |
|||
padding: 0em; |
|||
} |
|||
|
|||
.file-names-container { |
|||
/* IE 9 */ |
|||
-ms-transform: rotate(-90deg) translate(-78%, 0%); |
|||
/* Safari */ |
|||
-webkit-transform: rotate(-90deg) translate(-78%, 0%); |
|||
/* Standard syntax */ |
|||
transform: rotate(-90deg) translate(-0%, 0%); |
|||
transform-origin: top left; |
|||
border:blue 1px solid; |
|||
height: 47em; |
|||
width: 30em; |
|||
overflow-y: scroll; |
|||
overflow-x: hidden; |
|||
position: absolute; |
|||
left: 0%; |
|||
top:100%; |
|||
|
|||
} |
|||
|
|||
img.listed-images { |
|||
width: 2rem; |
|||
} |
Loading…
Reference in new issue