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

feat: customize sidebar navi #1336

Merged
merged 12 commits into from
May 6, 2023

Conversation

meteyou
Copy link
Member

@meteyou meteyou commented Apr 10, 2023

With this PR, you can add custom links or sort/hide nav points (in the interface settings).

To add new nav points, you have to add a JSON file in config/.theme/navi.json with the following example config:

[
  {
    "title":"Custom1",
    "href":"https://www.google.com"
  },
  {
    "title":"Moonraker",
    "href":"/server/info",
    "target": "_blank",
    "position": 90,
    "icon": "M5 5H7V11H5V5M10 5H8V11H10V5M5 19H7V13H5V19M10 13H8V19H10V17H15V15H10V13M2 21H4V3H2V21M20 3V7H13V5H11V11H13V9H20V15H18V13H16V19H18V17H20V21H22V3H20Z"
  }
]

per default, all nav points have 10 steps between each other positions. That means:

  • dashboard => 10
  • console => 20
  • heightmap => 30

Thus it should be possible to integrate each custom nav point on each position by choosing one position value between them. You can also use custom icons. You only have to use the JS icon content of MDI (https://materialdesignicons.com/).

Signed-off-by: Stefan Dej meteyou@gmail.com

Signed-off-by: Stefan Dej <meteyou@gmail.com>
Signed-off-by: Stefan Dej <meteyou@gmail.com>
Signed-off-by: Stefan Dej <meteyou@gmail.com>
Signed-off-by: Stefan Dej <meteyou@gmail.com>
Signed-off-by: Stefan Dej <meteyou@gmail.com>
Signed-off-by: Stefan Dej <meteyou@gmail.com>
Signed-off-by: Stefan Dej <meteyou@gmail.com>
Signed-off-by: Stefan Dej <meteyou@gmail.com>
Signed-off-by: Stefan Dej <meteyou@gmail.com>
Signed-off-by: Stefan Dej <meteyou@gmail.com>
@meteyou meteyou requested a review from dw-0 April 10, 2023 10:28
@github-actions
Copy link
Contributor

Language file analysis report:

File Missing Keys Unused Keys
en.json 0 0

@meteyou meteyou linked an issue Apr 10, 2023 that may be closed by this pull request
Signed-off-by: Stefan Dej <meteyou@gmail.com>
@github-actions
Copy link
Contributor

github-actions bot commented May 1, 2023

Language file analysis report:

File Missing Keys Unused Keys
en.json 0 0

@meteyou meteyou added this to the v2.6.0 milestone May 1, 2023
@meteyou meteyou merged commit a3316eb into mainsail-crew:develop May 6, 2023
@meteyou meteyou deleted the feat/customize-sidebar-navi branch May 6, 2023 21:01
@jeno007
Copy link

jeno007 commented Sep 14, 2024

I'd like to use this feature to add Obico's web UI to mainsail and the mainsail UI to OrcaSlicer's device tab.
The problem I'm facing is that loading Obico's web as _self overwrites the whole page making the sidebar unavailable. As Orca does not support tabs on their device tab, after opening Obico, there is no way back to the rest of mainsail. Specifying Obico as _blank does not help either because tabs are not supported so does not open. I'think it would help to open Obico inside a properly setup div to keep the sidebar working. Unfortunately I'm not familiar with typescript to make it working.

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.

[FR] customizable sidebar menu
3 participants