Reset
Reset helpers you can use to reset browser default styles on HTML elements.
Button
The button reset can be used as an utility class: flix-reset-btn
<button type="button" class="flix-reset-btn my-custom-button">Plain old button</button>
Or you can also import honeycomb tools and include the sass
mixin on your custom class:
@import '@flixbus/honeycomb/assets/scss/honeycomb-tools';
.my-custom-button {
@include btn-reset;
}
List
The list reset can reset lists in block (default) or inline display setting.
You can use the utility classes:
flix-reset-list
flix-reset-list--inline
- Plain
- old
- list
- Plain
- old
- inline
- list
<ul class="flix-reset-list my-custom-list">
<li>Plain</li>
<li>old</li>
<li>list</li>
</ul>
<ul class="flix-reset-list--inline my-custom-inline-list">
<li>Plain</li>
<li>old</li>
<li>inline</li>
<li>list</li>
</ul>
Or as a sass
mixin on your custom class:
@import '@flixbus/honeycomb/assets/scss/honeycomb-tools';
.my-custom-list {
@include list-reset;
}
.my-custom-inline-list {
@include list-reset($inline: true);
}