UI Improvements. Incluing result limiting
@@ -1,56 +1,113 @@
|
||||
body{
|
||||
margin: 0px 10px 0px 10px;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
background-color: #DCDCDD;
|
||||
color: #46494C
|
||||
color: #fff;
|
||||
overflow: hidden;
|
||||
}
|
||||
#app{
|
||||
display: grid;
|
||||
grid-template-areas: "app_header"
|
||||
"app_body"
|
||||
"app_footer";
|
||||
grid-template-rows: 5vh 90vh 5vh;
|
||||
max-height: 100%
|
||||
grid-template-rows: auto 90vh 5vh;
|
||||
max-height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.clear{
|
||||
clear: both;
|
||||
}
|
||||
.app_header{
|
||||
grid-area: app_header;
|
||||
margin: 0px;
|
||||
display: grid;
|
||||
grid-template-areas: "title slogan";
|
||||
grid-template-areas: "title slogan subhdr";
|
||||
align-items: center;
|
||||
background-color: #2b2b2b;
|
||||
padding: 0px;
|
||||
}
|
||||
.app_hdr{
|
||||
grid-area: title;
|
||||
margin: 0;
|
||||
font-family: 'Audiowide', cursive;
|
||||
font-size: 25px;
|
||||
font-family: 'Gruppo', cursive;
|
||||
font-size: 36px;
|
||||
text-align: start;
|
||||
padding: 0px 0px 0px 5px;
|
||||
}
|
||||
.shadow{
|
||||
text-shadow: #4c5c68 -5px 3px 5px;
|
||||
}
|
||||
.app_subhdr{
|
||||
grid-area: slogan;
|
||||
grid-area: subhdr;
|
||||
margin: 0;
|
||||
font-family: 'Audiowide', cursive;
|
||||
font-family: 'Gruppo', cursive;
|
||||
font-size: 18px;
|
||||
text-shadow: #4c5c68 -5px 3px 5px;
|
||||
text-align: end;
|
||||
}
|
||||
.app_slogan{
|
||||
grid-area: slogan;
|
||||
margin: 0;
|
||||
fontsize: 18px;
|
||||
font-family: 'Gruppo', cursive;
|
||||
text-align: center;
|
||||
}
|
||||
.app_body{
|
||||
display: grid;
|
||||
grid-area: app_body;
|
||||
grid-template-rows: 5vh auto;
|
||||
grid-template-rows: auto;
|
||||
grid-template-areas: "nav_top"
|
||||
"shelf";
|
||||
justify-items: center;
|
||||
overflow: scroll;
|
||||
background-color: dimgray;
|
||||
}
|
||||
.app_footer{
|
||||
grid-area: app_footer;
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
min-width: 100%;
|
||||
background-color: #2b2b2b;
|
||||
}
|
||||
.nav_top{
|
||||
grid-area: nav_top
|
||||
grid-area: nav_top;
|
||||
display: grid;
|
||||
grid-template-areas: "left center right";
|
||||
grid-template-rows: 1vw auto 1vw;
|
||||
}
|
||||
.navbar{
|
||||
list-style-type: none;
|
||||
display: inline-flex;
|
||||
align-items: first baseline;
|
||||
margin: 5px 0px;
|
||||
}
|
||||
.top{
|
||||
|
||||
}
|
||||
.inline{
|
||||
|
||||
}
|
||||
.inline_txt{
|
||||
|
||||
}
|
||||
.button{
|
||||
|
||||
}
|
||||
.nav_button{
|
||||
background-color:darkgray;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #999;
|
||||
min-width: 110px;
|
||||
margin: 0px 5px 0px 0px;
|
||||
padding-top: 2px;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
.nav_search{
|
||||
margin: 0px 5px 0px 0px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #999;
|
||||
}
|
||||
.search{
|
||||
|
||||
}
|
||||
.shelf{
|
||||
grid-area: shelf;
|
||||
@@ -80,6 +137,7 @@ body{
|
||||
font-family: 'Audiowide', cursive;
|
||||
font-size: 25px;
|
||||
padding: 0;
|
||||
margin: 0px;
|
||||
}
|
||||
.shelf_item{
|
||||
background-color: burlywood;
|
||||
|
||||
BIN
src/interface/static/img/gpl-125x28.png
Normal file
|
After Width: | Height: | Size: 2.9 KiB |
BIN
src/interface/static/img/gpl-150x33.png
Normal file
|
After Width: | Height: | Size: 2.3 KiB |
BIN
src/interface/static/img/gpl-175x39.png
Normal file
|
After Width: | Height: | Size: 2.6 KiB |
BIN
src/interface/static/img/gpl.png
Normal file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
src/interface/static/img/open-source-150x25.png
Normal file
|
After Width: | Height: | Size: 2.1 KiB |
BIN
src/interface/static/img/open-source-175x29.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
BIN
src/interface/static/img/open-source-200x33.png
Normal file
|
After Width: | Height: | Size: 2.7 KiB |
BIN
src/interface/static/img/open-source.png
Normal file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
src/interface/static/img/pyShelf_frontend_0_1_0_thumb.png
Normal file
|
After Width: | Height: | Size: 548 KiB |
@@ -8,16 +8,38 @@
|
||||
<link type="text/css" rel="stylesheet" href="/static/css/main.css" />
|
||||
<title>pyShelf E-Book Server</title>
|
||||
<link href="https://fonts.googleapis.com/css?family=Audiowide&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css?family=Gruppo&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app">
|
||||
<div class="app_header" >
|
||||
<h1 class="app_hdr shadow">pyShelf</h1>
|
||||
<h2 class="app_subhdr shadow">Open Source E-book Server</h2>
|
||||
<div class="app_hdr">
|
||||
<h1 class="app_hdr shadow">pyShelf</h1>
|
||||
</div>
|
||||
<div class="app_slogan">
|
||||
<h2 class="app_slogan shadow">""An elegant tool... for a more civilized age."</h3>
|
||||
</div>
|
||||
<div class="app_subhdr">
|
||||
<img src="/static/img/open-source-175x29.png" class="hdr_badge" /><br />
|
||||
<img src="/static/img/gpl-125x28.png" class="hdr_badge" />
|
||||
</div>
|
||||
|
||||
</h2>
|
||||
</div>
|
||||
<div class="app_body" >
|
||||
<div class="nav_top">
|
||||
<!--Navigation and page controls will go here-->
|
||||
<div class="navbar top">
|
||||
<div style="grid-area:left">
|
||||
<input class="nav_button" type="submit" value="<< Prev Page">
|
||||
</div>
|
||||
<div style="grid-area:center">
|
||||
<input class="nav_search" type="text" size="15">
|
||||
<input class="nav_button" type="submit" value="Search">
|
||||
</div>
|
||||
<div style="grid-area:right">
|
||||
<input class="nav_button" type="submit" value="Next Page >>">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="shelf">
|
||||
<div class="shelf_contents" >
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import os
|
||||
|
||||
from django.db import models
|
||||
from django.shortcuts import HttpResponse, render
|
||||
from django.utils.text import slugify
|
||||
|
||||
@@ -7,7 +8,17 @@ from .models import Books
|
||||
|
||||
|
||||
def index(request):
|
||||
return render(request, "index.html", {"Books": Books.objects.all()})
|
||||
return render(request, "index.html", {"Books": book_set()})
|
||||
# return render(request, "index.html", {"Books": Books.objects.all()})
|
||||
|
||||
|
||||
def book_set(_limit=None, _set=1):
|
||||
if _limit is None:
|
||||
_limit = 20 # TODO default from user choice
|
||||
_set_max = _set * _limit
|
||||
_set_min = _set_max - _limit
|
||||
books = Books.objects.all()[_set_min:_set_max]
|
||||
return books
|
||||
|
||||
|
||||
def download(request, pk):
|
||||
@@ -22,11 +33,3 @@ def download(request, pk):
|
||||
|
||||
def hr_name(book):
|
||||
return "{0}.{1}".format(slugify(book.title), book.file_name.split(".")[1])
|
||||
|
||||
|
||||
def book_set(_set):
|
||||
r = 20
|
||||
x = _set * r
|
||||
y = x + r
|
||||
books = Books.objects.all()[x:y]
|
||||
return books
|
||||
|
||||