From 707a0a5ab6725457d04c2cd07f633f727b85f71e Mon Sep 17 00:00:00 2001 From: Richard Thier Date: Sat, 15 Feb 2020 00:04:40 +0100 Subject: [PATCH] The navmenu section - first version working. TODO: email, phone and language picker --- prosopopee/prosopopee.py | 13 +- .../themes/exposure/static/css/style.css | 117 ++++++++++++++++-- .../exposure/templates/gallery-index.html | 3 + .../themes/exposure/templates/menu.html | 2 +- .../exposure/templates/sections/header.html | 2 +- .../exposure/templates/sections/navmenu.html | 41 ++++++ 6 files changed, 166 insertions(+), 12 deletions(-) create mode 100644 prosopopee/themes/exposure/templates/sections/navmenu.html diff --git a/prosopopee/prosopopee.py b/prosopopee/prosopopee.py index 08d6f03..1a26377 100644 --- a/prosopopee/prosopopee.py +++ b/prosopopee/prosopopee.py @@ -493,18 +493,29 @@ def build_gallery(settings, gallery_settings, gallery_path, template, galleries_ Audio.base_dir = Path(".").joinpath(gallery_path) Audio.target_dir = Path(".").joinpath("build", gallery_path) + + + has_gotto = False; + gottolist = [] if gallery_settings.get("sections"): for x in gallery_settings['sections']: if x['type'] not in gallery_settings: gallery_settings[x['type'] + '_enabled'] = True + if x['type'] == 'header': + if x['menuid']: + has_gotto = True + gottolist.append(x) template_to_render = page_template if gallery_settings.get("static") else gallery_index_template + html = template_to_render.render( settings=settings, gallery=gallery_settings, galleries=galleries_cover, # Can be False if there were no subgal sections (subgal_section branch) sub_index=sub_index, # TODO: Back button not generated (subgal_section) + has_goto=has_gotto, # Needed for the navmenu + gotolist=gottolist, # Needed for the navmenu Image=Image, Video=Video, Audio=Audio, @@ -521,7 +532,7 @@ def build_gallery(settings, gallery_settings, gallery_path, template, galleries_ open(Path("build").joinpath(gallery_path, "index.html"), "wb").write(html) # XXX shouldn't this be a call to build_gallery? - # Build light mode gallery + # Build light mode gallery - TODO: I think does not work in most cases anymore... if gallery_settings.get("light_mode", False) or ( settings["settings"].get("light_mode", False) and gallery_settings.get("light_mode") is None diff --git a/prosopopee/themes/exposure/static/css/style.css b/prosopopee/themes/exposure/static/css/style.css index 9ac0142..b32fefa 100644 --- a/prosopopee/themes/exposure/static/css/style.css +++ b/prosopopee/themes/exposure/static/css/style.css @@ -182,43 +182,43 @@ footer a { color: #111; } -nav { +nav.old { background-color: #FBFBFB; width: 100%; height: 56px; line-height: 56px; } -body.night nav { +body.night nav.old { background-color: #061F2F;; } -nav .nav-wrapper { +nav.old .nav-wrapper { position: relative; height: 100%; margin: 0px auto; max-width: 1280px; } -nav ul { +nav.old ul { margin: 0; } -nav ul li { +nav.old ul li { padding: 0; list-style-type: none; display:inline-block; } -nav a.first-item-menu { +nav.old a.first-item-menu { margin-left: -42px; } -nav ul li.active { +nav.old ul li.active { background-color: rgba(0, 0, 0, 0.1); } -nav ul a { +nav.old ul a { transition: background-color .3s; font-size: 1rem; display: block; @@ -236,7 +236,7 @@ nav ul a { text-align: center; } -nav ul li > a.item-menu::before { +nav.old ul li > a.item-menu::before { content: "/"; margin-right: 22px; font-size: 18px; @@ -437,3 +437,102 @@ input:checked + .slider:before { } } +/* These are added for the top nav menu for gallery pages (navmenu section) */ +/* As you can see these use html id so should not clash with the default menu navigation CSS */ +/* BEGIN: navmenu */ +/* z-index: 2147483647; is the maximum, but I lowered it a bit */ +.navmenu { + margin-bottom: 0; + margin-top: 0; + position: fixed; + top: 0px; + left: 0px; + z-index: 900; +} + +#nav { /*nav rész szélességes, színe*/ + width:100vw; + display:block; + background-color:#11bf22; + border-bottom:8px solid #006f18; +} + +#nav ul { /*lista stílus igazítás*/ + padding:0; + margin:0; + list-style: none; + position: relative; + } + +#nav ul:After { + content: ""; + display:block; + clear:both; + } + +#nav ul li { + display:list-item; + list-style: none; + float:left; + background-color:#11bf22; + } + +#nav ul li i { /*betűméret - szélesség (ikonsor)*/ + font-size:30px; + width:40px; + } + +#nav ul li a { /*betűméret - menü szöveg*/ + display:block; + padding:15px 30px; + color:#FFF; + font-size:18px; + text-decoration:none; + font-family: Georgia, serif; + text-align:center; +} + +#nav li a:hover { background-color: #5bbcb9; } /*hover szín*/ + +/* Dropdown */ +/* almenük elrejtése */ +#nav ul ul { + display: none; + position: absolute; top: 80px; +} + +/* hover-re megjelenítés */ +#nav ul li:hover > ul { + display:list-item; +} + +/* almenük lista nézetben */ +#nav ul ul li { + width:210px; + float:none; + position: relative; + border-bottom:none; +} + +#nav ul ul li i { /*almenü ikon igazítása*/ + margin-right:12px; + } + +#nav ul ul li a { + padding:16px 20px; + text-align:left; + } + +/* 3. almenü követően */ +nav ul ul ul li { + position: absolute relative; + top:-80px; + left:200px; +} + +#nav li > a:after { content: ' >'; } + +#nav > li > a:after {content: ' >'; } + +#nav li > a:only-child:after {content: ''; } +/* END: navmenu */ diff --git a/prosopopee/themes/exposure/templates/gallery-index.html b/prosopopee/themes/exposure/templates/gallery-index.html index d0a6272..f22edfd 100644 --- a/prosopopee/themes/exposure/templates/gallery-index.html +++ b/prosopopee/themes/exposure/templates/gallery-index.html @@ -7,6 +7,9 @@ + {% if gallery.navmenu_enabled %} + + {% endif %} {% if gallery.panorama_enabled %} {% endif %} diff --git a/prosopopee/themes/exposure/templates/menu.html b/prosopopee/themes/exposure/templates/menu.html index 9b37839..4247554 100644 --- a/prosopopee/themes/exposure/templates/menu.html +++ b/prosopopee/themes/exposure/templates/menu.html @@ -1,4 +1,4 @@ -