Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Hide site nav under a button #1

Open
wants to merge 14 commits into
base: master
Choose a base branch
from
Open

Conversation

riyadh-h
Copy link
Owner

What is the purpose of this pull request?

  • Documentation update
  • Bug fix
  • Feature addition or enhancement
  • Code maintenance
  • Others, please explain:

Overview of changes:
Hides the site nav section under a button on the navbar, making it easy to show/hide the site nav section when necessary.

The site nav section might not be needed at all times, especially within long, full-of-text pages.

Therefore, hiding the site nav section would give more display space to the contents of the site's pages.

Before:
site-nav-before

After (hidden):
site-nav-after-hidden

After (shown):
site-nav-after-shown

Anything you'd like to highlight / discuss:

  • This change is implemented as a MarkBind plugin, allowing for easier enabling/disabling of the enhancement through the plugins property of site.json. The plugin is enabled by default.

  • The show/hide site nav button adopts the theme of the site's navbar. Examples of this are shown below:
    site-nav-theme-dark
    site-nav-theme-primary
    site-nav-theme-light

  • This change is open for further development (e.g., changing the position of the show/hide button).

Testing instructions:
For new MarkBind instances, initialize and serve such instances. The changes should appear automatically.

For existing MarkBind instances...

  • If the plugins property exists, add "hiddenSiteNav" to the plugins array.
  • If the pluginsContext property exists, add the following to the pluginsContext object:
"hiddenSiteNav": {
    "navbarTheme": "dark"
}

Note: the dark value for navbarTheme acts as a placeholder.

  • If neither plugins nor pluginsContext exist, add the following to the site.json object:
"plugins": [
    "hiddenSiteNav"
],
"pluginsContext": {
    "hiddenSiteNav": {
        "navbarTheme": "dark"
    }
}

Proposed commit message: (wrap lines at 72 characters)

Pages display the site nav section when exceeding a certain window width.

The site nav section usually takes unnecessary space within the site's pages.

Hiding the site nav section allows us to increase the display space of our pages' contents.

Let's hide the site nav section behind a button on the navbar.

Using a button makes it easy to show/hide the site nav section with a single click.


Checklist: ☑️

  • Updated the documentation for feature additions and enhancements
  • Added tests for bug fixes or features
  • Linked all related issues
  • No unrelated changes

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant