diff --git a/src/interface/static/css/main.css b/src/interface/static/css/main.css index 5ea3b10..4dbeb28 100644 --- a/src/interface/static/css/main.css +++ b/src/interface/static/css/main.css @@ -2,7 +2,7 @@ body { margin: 0px; padding: 0px; background-color: #676767; - background-image: url(/static/img/bookshelf.jpg); + background-image: url(/static/img/blue-background.jpg); background-size: cover; background-repeat: no-repeat; color: #000; @@ -243,6 +243,8 @@ body { /* margin-left: 0px; */ /* background-color: #f0ffff00; */ /* color: $ui-color-1; */ + border-top: 0px !important; + border-bottom: 0px !important; } .search_details { @@ -261,16 +263,29 @@ body { #horiz_nav_hdr { display: grid; + justify-content: end; grid-area: horiz_nav_hdr; grid-template-areas: "left_col middle_col right_col"; grid-template-columns: max-content auto max-content; padding: 0px; } +#horiz_nav_right { + grid-area: horiz_nav_right; +} + +#horiz_nav_center { + grid-area: horiz_nav_center; +} + +#horiz_nav_left { + grid-area: horiz_nav_left; +} + #horiz_nav_main { display: grid; - grid-template-areas: "horiz_nav_left horiz_nav_right"; - grid-template-columns: 7fr auto; + grid-template-areas: "horiz_nav_left horiz_nav_center horiz_nav_right"; + grid-template-columns: 1fr 3fr 1fr; background-color: #282828; grid-area: horiz_nav_main; padding: 1px 0px 1px 5px; @@ -278,6 +293,8 @@ body { color: #fefefeb3; font-size: smaller; border-bottom: 1px solid #fefefeb3; + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; } #hdr_branding { @@ -300,11 +317,12 @@ body { } .horiz_nav_stats { - display: grid; + display: flex; + justify-content: flex-end; + align-items: center; } .nav_icon { - font-size: larger; color: #fefefeb3; } @@ -380,8 +398,7 @@ body { grid-template-areas: "horiz_nav_hdr" "horiz_nav_main"; grid-area: nav; list-style-type: none; - background-color: #000000; - margin: 0px auto 10px auto; + margin: 0px auto 20px auto; padding: 0px; padding-inline-start: 0px; } diff --git a/src/interface/static/css/main.scss b/src/interface/static/css/main.scss index 059585c..bab9f69 100755 --- a/src/interface/static/css/main.scss +++ b/src/interface/static/css/main.scss @@ -4,7 +4,8 @@ $ui-color-3: #676767; $ui-font-color-1: #000000; //Active button $ui-font-color-2: #ffffff; $ui-shelf-item-color: #0000006e; -$ui-background-img: url(/static/img/bookshelf.jpg); +//$ui-background-img: url(/static/img/bookshelf.jpg); +$ui-background-img: url(/static/img/blue-background.jpg); body { margin: 0px; padding: 0px; @@ -265,6 +266,8 @@ body { /* margin-left: 0px; */ /* background-color: #f0ffff00; */ /* color: $ui-color-1; */ + border-top: 0px !important; + border-bottom: 0px !important; } .search {} @@ -286,16 +289,26 @@ body { } #horiz_nav_hdr{ display: grid; + justify-content: end; grid-area: horiz_nav_hdr; grid-template-areas: "left_col middle_col right_col"; grid-template-columns: max-content auto max-content; padding: 0px; } +#horiz_nav_right { + grid-area: horiz_nav_right; +} +#horiz_nav_center { + grid-area: horiz_nav_center; +} +#horiz_nav_left { + grid-area:horiz_nav_left; +} #horiz_nav_main{ display: grid; - grid-template-areas: "horiz_nav_left horiz_nav_right"; - grid-template-columns: 7fr auto; + grid-template-areas: "horiz_nav_left horiz_nav_center horiz_nav_right"; + grid-template-columns: 1fr 3fr 1fr; background-color: $ui-color-2; grid-area: horiz_nav_main; padding: 1px 0px 1px 5px; @@ -303,6 +316,8 @@ body { color: $ui-color-1; font-size: smaller; border-bottom: 1px solid $ui-color-1; + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; } #hdr_branding{ grid-area: left_col; @@ -321,13 +336,15 @@ body { align-items: center; } .horiz_nav_stats{ - display: grid; + display: flex; + justify-content: flex-end; + align-items: center; } #username{} #password{} .nav_login{} .nav_icon{ - font-size: larger; + //font-size: larger; color: $ui-color-1; } .input_box{ @@ -393,8 +410,7 @@ body { "horiz_nav_main"; grid-area: nav; list-style-type: none; - background-color: #000000; - margin: 0px auto 10px auto; + margin: 0px auto 20px auto; padding: 0px; padding-inline-start: 0px; } diff --git a/src/interface/static/css/mobile.css b/src/interface/static/css/mobile.css index b99c628..797a367 100644 --- a/src/interface/static/css/mobile.css +++ b/src/interface/static/css/mobile.css @@ -31,6 +31,12 @@ .shelf_item{ max-width: min-content; } + .nav_search{ + display: none !important; + } + #horiz_nav_main{ + grid-template-columns: auto; + } } @media only screen and (max-width: 400px) { .vert-nav{ diff --git a/src/interface/static/img/blue-background.jpg b/src/interface/static/img/blue-background.jpg new file mode 100644 index 0000000..78e55c1 Binary files /dev/null and b/src/interface/static/img/blue-background.jpg differ diff --git a/src/interface/templates/index.html b/src/interface/templates/index.html index 83050f8..bdd6480 100755 --- a/src/interface/templates/index.html +++ b/src/interface/templates/index.html @@ -17,6 +17,7 @@ @@ -35,8 +36,6 @@

pyShelf {{Version}}

- -
search
- -
- {{ BookStats }} books | collections +
+ + + +
+
+ + + + search +
+
+  1-20 of {{ BookStats }}  +
-
diff --git a/src/interface/templates/search.html b/src/interface/templates/search.html index 14854f1..3eef2e3 100755 --- a/src/interface/templates/search.html +++ b/src/interface/templates/search.html @@ -1,5 +1,5 @@ -{% load filters %} - +{% LOAD FILTERS %} + diff --git a/src/interface/templates/vnav.html b/src/interface/templates/vnav.html new file mode 100644 index 0000000..318e10b --- /dev/null +++ b/src/interface/templates/vnav.html @@ -0,0 +1,20 @@ + diff --git a/src/interface/views.py b/src/interface/views.py index e743f66..df757f4 100755 --- a/src/interface/views.py +++ b/src/interface/views.py @@ -18,6 +18,8 @@ collections = Collections.objects.all() def index(request): """ Return template index + TODO: revise the way sets are handled so that they can be used uniformly in js + for ui page displays """ _set = 1 return render( @@ -49,7 +51,11 @@ def show_collection(request, _collection, _colset): "Version": config.VERSION, "LeftNavCollections": menu("collections"), "LeftNav": menu("collections"), - "Collections": collections_list() + "Collections": collections_list(), + "LeftNavMenu0": menu("nav_l_0"), + "BookStats": Books.objects.all().count, + "CollectionStats": Collections.objects.all().count, + "CollectionObject": collections_list() }, ) @@ -70,6 +76,13 @@ def next_page(request, bookset): "Version": config.VERSION, "LeftNavCollections": menu("collections"), "LeftNav": menu("collections"), + "Collections": collections_list(), + "LeftNavMenu0": menu("nav_l_0"), + "BookStats": Books.objects.all().count, + "CollectionStats": Collections.objects.all().count, + "CollectionObject": collections_list(), + "LeftNavCollections": menu("collections"), + "LeftNav": menu("collections"), }, ) @@ -94,6 +107,13 @@ def prev_page(request, bookset): "Version": config.VERSION, "LeftNavCollections": menu("collections"), "LeftNav": menu("collections"), + "Collections": collections_list(), + "LeftNavMenu0": menu("nav_l_0"), + "BookStats": Books.objects.all().count, + "CollectionStats": Collections.objects.all().count, + "CollectionObject": collections_list(), + "LeftNavCollections": menu("collections"), + "LeftNav": menu("collections"), }, )