Concept
use-bootstrap is the front-end framework based on Nuxt3 and Bootstrap5.
Pure Bootstrap5 CSS
Only Bootstrap5 CSS is being used without the original CSS. Bootstrap5 CSS is not included.
Using Bootstrap5 SASS source file, customized original Bootstrap5 CSS would be available. It corresponds to RFS.
Pure Vue.js Scripts
It is described by the script used Vue3 Composition API.
Bootstrap5 JavaScript and Popper.js are not used, and you don't need to include them.
Pure Components
use-bootstrap consists of properties set in the component, and is different from Bootstrap5 which consists of values set in the Class attribute or the Data attribute.
The Class attribute can accept any values, it is complicated and low on readability, and we cannot inspect the values.
The property of components is clear and the value is able to be inspected.
We are aiming for output to become identical with Bootstrap5.
SCSS of various Bootstrap5 templates can be used just as it is.
Clear property definition and parent-child relationship of components will make sense also crucial to an occasion using the dynamic rendering system and the CMS, WYSIWYG component mainly composed of data of JSON.
Flexible Property Specification
The Property attribute can be designated the value and expression by v-bind, and also the character string.
The numerical value, array(blank separator), and object(comma separator) can be used as the character string. Designation by the empty attribute is being supported.
Correspondence to nuxt-link , nuxt-image and nuxt-icon
It corresponds to nuxt-link by using the to-attribute.
It also corresponds to nuxt-image , nuxt-icon , nuxt-font , vue-use.
Animation support
The animation effect is being supported. Check the visual effect of the OS and browser and the setting of the animation effect to confirm the movement.
Moderate Abstraction and Automation
As the free layout is available like Bootstrap5, a component doesn't need a high level of abstraction; but a moderate level.
You can omit the ID for component. It is given automatically as necessary.If set manually, it will be able to accept events from non-descendant elements.
As far as it's possible, the role attribute and the area attribute are given automatically.