cant find setting button on examples page

[madtitan02]

Increasing Access

Currently , Switching themes feature is available inside the setting button which is available only on the homepage.But when we switch to the examples section there is no setting button available o we cannot switch theme or change font size from other pages except the home page.We can provide the setting button on everypage as it will be very compatible for the user experience.As screenshot is attached below there is no setting button available we can simple add it to the right top where it is present on the homepage

Feature request details

By simply adding the setting button on the right top corner will do the work we can simply embedd the feature there which is prexisting we just need to add it on the examples page

[madtitan02]

if the community agrees please do assign me i will work on it

[lindapaiste]

I’m on board with the principal. I’m adding the “needs design” tag to this issue because we need to determine what exactly it should look like. I don’t think that the huge gear button that we have on the home page would work here. I’m thinking either the word “Settings” on the right side of the Nav bar or a smaller gear icon in the Nav bar.

Most of the settlings only apply to the IDE. I think theme is the only one that is “global”? There might be a bit of a usability question regarding what to show in the popup and if it’s confusing to show IDE settings when on other pages. It’s definitely easier to implement if we show the entire existing Preferences modal. And that seems fine to me.

[gauravsingh94]

@lindapaiste
In my opinion, incorporating the entire settings menu into the navigation bar may not be the optimal choice, as it includes numerous settings that are irrelevant to other pages.

Proposed Approach 1: We could relocate the theme enabler from the settings menu to the navigation bar.

Proposed Approach 2: Separate the IDE settings from the settings and then integrate the settings into the navigation bar.

[nick2432]

Can I contribute to this issue? I'm new here, but I have experience contributing to many other organizations. Is there a Discord channel or any other channel where I can discuss and get assistance?

[lindapaiste]

Can I contribute to this issue? I'm new here, but I have experience contributing to many other organizations. Is there a Discord channel or any other channel where I can discuss and get assistance?

There is "contribute-to-p5" section on the p5.js discord.

For this issue I think we need to finalize the design first before coding.

[adityagarg06]

Hi @lindapaiste, Here is a proposed design:
We can add more items along with the theme as per the requirement.

[Akshun-01]

Hello, for this issue I have some suggestions:

• First if we are planning to add this feature as a general feature and not only restricted to homepage, then i think adding it to the navbar will do the trick.(as illustrated below)
  It will make sure we don't have to add it manually to any other page we decide to add in the future as and would save code repetition and rendering time as well.
  

• For the same we also have the option to add it to the left side of the navbar but we are infact changing that part from all the options available to "back to editor", so it might look weird. We have the following design ideas, if we consider aligning it to the left in navbar.(below illustrations)
  

• Now if we want to add it only to the examples page, then i think what aditya has mentioned is perfectly fine to go with. We would just scale the icon according to the page and leave rest of the implementation as it is.