hibbitts-design / grav-theme-quark-open-publishing

A customized version of the Quark theme with Git Sync and 'chromeless' mode support.

Home Page:http://demo.hibbittsdesign.org/grav-open-publishing-quark/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Feature request: in sections navigation on the left

awrog opened this issue · comments

commented

The template /quark-open-publishing/templates/sections.html.twig renders by default the navigation on the right side of the content.
Is it possible to have/add an entry in the Sections Config where I can choose to render the navigation on the left-side or the right-side?

image

Hi @awrog , this is a great suggestion - I've got this option now in Bootstrap4 Open Matter as well. I will look into this and see what I can come up with.

Hi @awrog , I've looked into this and now remember why I did not support this to begin with🙂 Right now the Spectre CSS framework does not support column ordering (picturepan2/spectre#274) while Bootstrap4 does - and that is how I was able to provide this option in Bootstrap4 Open Matter.

I am sorry but at this time I can't provide this option.

However, you could customize the existing sections.html.twig Twig file to permanently display the Sections nav on the left-hand side of the screen. I've made such a file for you, all you would need to do is replace yours - I would suggest using an inherited theme setup, if you are using the Quark Open Publishing Space skeleton this is already done for you.

Here is a link to the customized Twig file:
https://ln.sync.com/dl/7c1c292d0/7ketq3qm-qv7xs3se-kr6gsvad-erd3ahbr

Download this file and place it into user/themes/mytheme/templates/

Please let me know if this works for you.
Paul

commented

Hi Paul,

Thanks for helping me out!!
Exactly what I ended up withdid.

Isn't it possible to control it via a toggle/boolean?

Kind of:

{% if toggle = true %}
...
<div id="sections-nav" class="column col-3 col-md-12">
<div id="sections-content" class="column col-9 col-md-12">
...
{% else %}
...
<div id="sections-content" class="column col-9 col-md-12">
<div id="sections-nav" class="column col-3 col-md-12">
...
{% endif %}

Or am I thinking too simplistic?

Nice to see you got it going!

The logic is straightforward to add the toggle, it is the CSS required to re-order the Sections content and navbar based on that toggle. As I mentioned, with Bootstrap4 Open Matter I was able to do this cleanly (as seen here https://github.com/hibbitts-design/grav-theme-bootstrap4-open-matter/blob/master/templates/sections.html.twig#L49-L53) but Spectre does not support that reordering of columns at this time. There might be another way to do this though - always open to alternative options that minimally change the theme🙂

commented

I'm afraid you've lost me there. (no biggy)
For my purpose just switching the navigation and content makes me content with the result 🙂

Keep up the good work!!

Sorry if that was clear - as the Twig will display the Sections content before the navbar the CSS must actually swap that to display the navbar on the left (i.e. first)... hope that is a bit clearer.

I will close this issue now but will keep this in mind as a possible future enhancement.

Thanks for the positive feedback, glad you are finding the theme useful!