Live App: Menu View Design Settings

[Jessie]

Now that the hard work is out of the way with the upcoming release of View Link Styles, we’re excited to share another update for the live app - Global Menu View Styles. These will be complementary styling options that will make it easier to achieve a more modern design with your menu views.

This feature is in development, but here is a preview of the Builder UI, that shows you what the options will look like:

How will it work?

Outlined here are some details about how this feature will function when it’s released, and what we expect to build into future iterations.

Breaking Changes

This will not be a breaking change for existing apps. The current theme renders menu views as buttons (tabbed or not), and this “legacy” styling will remain the default for all existing apps. If you choose a ‘fill’, ‘outline’, or ‘underline’ format then it is possible that the HTML will change.

For new apps, the “legacy” style will not be available, and we recommend using ‘fill’ to most closely match the old style if you don’t use custom code. If you do re-use custom code, you’ll need to update it for new apps to accommodate the new classes, like knMenuLink-fill .

Setting Options

You’ll see similar options to what is being made available in view links (fill, outline), with the addition of an ‘underline’ style format for tabbed menus. Depending on the selected format, you’ll have control over a sub-set of these options:

• Size
• Color (text, fill, outline, active state)
• Uppercase text
• Line weight (outline, underline)
• Round corners
• Raised buttons

As is the case currently with menu views - you can have your menu simulate tabs that appear on child pages, and choose to navigate to the first page linked automatically or not. These settings will continue to be available at the view level.

In the future, we plan to add options to override these settings at the view level as well. So if you want a particular menu view to be bigger or a different color, you can change that individual menu view’s style while everything else uses the defaults. We’ll open up a new topic about future overrides soon.

Feedback requests

Please let us know if you think these options will be valuable, along with anything else you’d like to see for customizing menu views like this. In particular, we’re interested in hearing feedback about:

• Any additional formats or style options we should consider
• Any concerns with class changes or breaking changes

Excited to share the plans for this feature! In addition to hearing feedback from you, we’ll continue using this topic to provide updates from our end about the feature’s development and upcoming release. Thank you!

[CarlHolmes]

This is great news.

Currently, like many others, I use CSS to change the colour of menu buttons so they stand out and are more obvious to a users. Specifically menus that “Add” a new record.

The additional options are great and will allow for more variation than I currently have. I like the underline option, this looks very modern, in my opinion.

I can’t offer any additional feedback about other options for formatting. I’d be very happy with the suggested options being planned.

With regards to menus, and I appreciate this is not related to formatting. I’d welcome the ability to be able to set, at the app level, forms to be true modal pop ups and redirect to parent by default.

Almost all my forms that add a record redirect to parent rather than showing a confirmation message.

Having modal pop ups set so they can’t be clicked away from which looses any data being added would also be welcomed. Like most I use a bit of JavaScript to stop this.

I appreciate the last few items are not related to the topic but there are a number of things I’d love to see addressed now we are past the bug fixing and into new features. For example, setting the date and currency format at the app level.

All that said, this is really exciting and welcome news. It will save me time not having to use custom code plus give me more options when building than I have now, making apps look fresh and new.

[Jessie]

Thanks for the feedback, Carl! I am glad that these design options will allow you to more easily make your apps look more modern and fresh.

You touched on two really great additional features - both of which are on our radar, and I’d love to point new discussions over to those:

Global app settings for default submit rules

Allow us to batch create a “Default” submit rule to Redirect to the parent page all forms of our app. Now we need to set it up form by form everytime that we create a form… and it’s really time consuming.

Global Settings Page

It would be great to have a global settings page where one could set default settings for various fields for the entire app. So for example, on that page I'd like to set the date format to dd/mm/yyyy and no default time. Then any new date field added would have the same settings. There are a number of fields for which doing this would be a huge time saver.

It all really comes together when your app has that modern design and ideal user flow!

[RayWindlow47079]

Sounds good but would be nice to find a listing of what all the changeable parameters are.
Been very hit and miss for my “inexperienced handiwork” thus far.

Also would love to be able to move around the search and filters boxes etc they take up a lot of unnecessary space with my multi-line data compilations in tables (ie street address city state yada yada yada.

If they could be managed to be on a single line particularly if filters is not active then we could regain significant display space.

Just some thoughts (ducking for cover)

[JulianKirkness]

Good news this is on the way - of course!

However, I feel it is very important to be able to colour the individual buttons on a menu rather than having them all the same colour. They could remain the same basic style of course.

I often use different coloured buttons in an app which may be menus, action links, links in tables (which I use several colours for where there are multiple buttons in the same table).

I fear without this option to vary the colours these new features will not that much benefit.

Slightly off subject, could we also have display rules for menus (i.e. be able to hide a menu button based on user or other data)?

[MichaelG]

@JulianKirkness “Sightly off subject, could we also have display rules for menus (i.e. be able to hide a menu button based on user or other data)?”

[Ranasha]

Hello everyone, we are excited to announce the release of Menu View Design Settings! We hope this makes your life a little bit easier with less custom code to deal with.

A global style editor has been added for customizing the style of menu links used throughout your live app’s menu views. These controls are available for both Button and Tab menus. They are similar to those recently released for view links, giving your app a unified, modern look.

You can find further documentation in our knowledge base and our dev docs.

Make sure to follow the parent topic, It’s time for an improved live app! for more design setting updates, such as upcoming discussions about page menu and header design settings, as well as global overrides.

We appreciate your following along! Please share your thoughts.

[Calvin_B]

Awesome work.