From f0d6eef509825ab43206946039ae97f1929e2a6b Mon Sep 17 00:00:00 2001 From: Cristina Cochior Date: Sun, 22 Dec 2019 20:36:29 +0100 Subject: [PATCH] last edits before 25-dec --- library.py | 6 ++- static/css/main.css | 18 ++++--- templates/exchange.html | 13 +++++ templates/home.html | 4 ++ templates/layout.html | 42 +++++++++++----- templates/layout2.html | 26 ++++++++++ templates/main.css | 106 ++++++++++++++++++++++++++++++++++++++++ 7 files changed, 196 insertions(+), 19 deletions(-) create mode 100644 templates/exchange.html create mode 100644 templates/home.html create mode 100644 templates/layout2.html create mode 100644 templates/main.css diff --git a/library.py b/library.py index b445217..3198fdf 100644 --- a/library.py +++ b/library.py @@ -17,7 +17,7 @@ path = "/static/files/" librarians = [] files_without_folders = [] -with open('mergedjson.json', 'r', encoding='utf8') as filesandnames: +with open('static/js/mergedjson.json', 'r', encoding='utf8') as filesandnames: filetoname_dict = json.load(filesandnames) #get full list librarians from json (printed later through global variable) @@ -59,3 +59,7 @@ def home(): @app.route('/about/') def about(): return render_template('about.html') + +@app.route('/exchange') +def exchange(): + return render_template('exchange.html') diff --git a/static/css/main.css b/static/css/main.css index 783c148..132b558 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -91,12 +91,16 @@ span.librarian-names:hover, span.file-names:hover { 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%; + height: 50vw; + width: 50vw; + overflow-y: scroll; + overflow-x: hidden; + position: absolute; + left: 0%; + top: calc(100% - 1.5em); + +} +img.listed-images { + width: 2rem; } diff --git a/templates/exchange.html b/templates/exchange.html new file mode 100644 index 0000000..49781f3 --- /dev/null +++ b/templates/exchange.html @@ -0,0 +1,13 @@ +{% extends "layout2.html" %} +{% block title %}Index{% endblock %} +{% block head %} + {{ super() }} + +{% endblock %} +{% block content %} +

Index

+

+ Welcome on my awesome homepage. +{% endblock %} diff --git a/templates/home.html b/templates/home.html new file mode 100644 index 0000000..eb6f96b --- /dev/null +++ b/templates/home.html @@ -0,0 +1,4 @@ +{% extends "layout.html" %} +{% block content %} + +{% endblock content %} diff --git a/templates/layout.html b/templates/layout.html index b8ba43a..1ffe668 100644 --- a/templates/layout.html +++ b/templates/layout.html @@ -29,16 +29,16 @@ $(".name-elements").append("

  • "); } else if (extension=="pdf") { - $(".name-elements").append("
  • "); + $(".name-elements").append("
  • "); } else if (extension=="epub") { $(".name-elements").append("
  • "+ledocument+"
  • "); } else if ((extension=="mp3") || (extension=="wav") || (extension=="m4a")) { - $(".name-elements").append("
  • "); + $(".name-elements").append("
  • "); } else if ((extension=="mov") || (extension=="mp4")) { - $(".name-elements").append("
  • "); + $(".name-elements").append("
  • "); } else if ((extension=="odt") || (extension=="docx")) { // something for odt and docx @@ -61,8 +61,28 @@ var item = test[i]; if(item.debrisname.includes(thefile)){ ledocument = item.debrispath; - $(".name-elements").append("
  • "+ledocument+"
  • "); - allpeeps.push(ledocument); + // allpeeps.push(ledocument); + var extension = ledocument.replace(/^.*\./, ''); + console.log(ledocument); + if ((extension=="jpg") || (extension=="jpeg") || (extension=="png") || (extension=="gif") || (extension=="tiff")) { + $(".name-elements").append("
  • "); + } + else if (extension=="pdf") { + $(".name-elements").append("
  • "); + } + else if (extension=="epub") { + $(".name-elements").append("
  • "+ledocument+"
  • "); + } + else if ((extension=="mp3") || (extension=="wav") || (extension=="m4a")) { + $(".name-elements").append("
  • "); + } + else if ((extension=="mov") || (extension=="mp4")) { + $(".name-elements").append("
  • "); + } + else if ((extension=="odt") || (extension=="docx")) { + // something for odt and docx + $(".name-elements").append("
  • "+ledocument+"
  • "); + }; }; category = item.method; }; @@ -77,9 +97,9 @@
    @@ -112,9 +132,9 @@
    diff --git a/templates/layout2.html b/templates/layout2.html new file mode 100644 index 0000000..faa9d19 --- /dev/null +++ b/templates/layout2.html @@ -0,0 +1,26 @@ + + + + + + + Library + + + + + + + diff --git a/templates/main.css b/templates/main.css new file mode 100644 index 0000000..d8ce606 --- /dev/null +++ b/templates/main.css @@ -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; +}