@mapsindoors/css
v3.1.2
Published
CSS components and helpers using MapsIndoors Design Tokens (midt)
Downloads
924
Readme
MapsIndoors CSS
CSS button component and helpers using MapsIndoors Design Tokens (midt)
The component is using the BEM methodology.
See the demo page (index.html) for an overview.
Release a new version
To release a new version:
- Make your changes and commit them
- Update the version number in
package.jsonbased on Semantic Versioning - Tag the last commit with the version number in this format:
v1.2.3 - Push your commits with
git push origin --tags - GitHub Actions on the repo will create a Release with the tag's version number and push that versioned release to npm
mi-button
The .mi-button block class is used for styling buttons.
Basic example:
<button type="button" class="mi-button mi-button--primary">Click me</button>Variants:
mi-button--primarymi-button--basemi-button--outlinemi-button--link.
Helpers
The helpers.css-file is a range of CSS utility classes that each serve a particular purpose.
Example:
<body class="debug">Sets golden yellow lines around all elements on the page for easier debugging (when using .flex for instance).
Other examples:
.max-height-xx-largeto set amax-heightof40px.width-noneto set awidthofnone.inline-flexto setdisplay: inline-flex;.margin-autoto center items withmargin-leftandmargin-rightset toauto