Accessing the mobius style guide

The Mobius Style Guide is a developer reference site that documents Mobius components. The Mobius Style Guide can be useful in providing documentation as you implement custom widgets A pre-configured content holder ISC_Content user roles may use to add content to website pages without having to develop page elements. using Mobius components, or as you modify the Spire Theme to customize your site's look and feel.

Use cases

Customize a site's buttons

When building out the basic look and feel of a site, you may want to modify more about the Primary Button variant than can be modified in the Spire CMS Style Guide. To do so, you will use the pre- or post-styleguide Theme object. In this case, you can use the Mobius Style Guide to take a look at what about the button's appearance can be changed using the Props of the Button component, and what you might need to modify using the css prop. You can click the View Code button below every style guide component example and modify the components' props there. You will see your changes in the stage. This sandbox lets you experiment with changes that you may want to put in your theme and validate what they will look like in one place. Just remember to rely on theme colors and props wherever possible!

Build a custom Spire widget

If you have received a design for a custom widget -for instance, a custom quote request form - your UI development should start with Mobius. You may choose to take a look at the Mobius GridContainer and GridItem components to lay your widget out, then use the TextField, Select, DatePicker and Dynamicdrop-down components for the form fields, and a Button component for the submit button. You can also use the Mobius Icon and Tooltip components to provide additional context to your form elements. Without you having to do any additional work, the components will use your site's theme to and will be consistent with the site's overall look and feel, even if the theme changes in the future.