Web Components UI library based on WebCell v3, BootStrap v5, BootStrap Icon v1 & FontAwesome v6
npm install dom-renderer web-cell boot-cell npm install parcel @parcel/config-default @parcel/transformer-typescript-tsc -D{ "scripts": { "start": "parcel source/index.html --open", "build": "parcel build source/index.html --public-url ." } }{ "compilerOptions": { "target": "ES6", "module": "ES2020", "moduleResolution": "Node", "useDefineForClassFields": true, "jsx": "react-jsx", "jsxImportSource": "dom-renderer" } }{ "extends": "@parcel/config-default", "transformers": { "*.{ts,tsx}": ["@parcel/transformer-typescript-tsc"] } }<link rel="stylesheet" href="https://unpkg.com/bootstrap@5.3.3/dist/css/bootstrap.min.css" /> <link rel="stylesheet" href="https://unpkg.com/bootstrap-icons@1.11.3/font/bootstrap-icons.css" /> <link rel="stylesheet" href="https://unpkg.com/@fortawesome/fontawesome-free@6.5.1/css/all.min.css" /> <script src="https://polyfill.web-cell.dev/feature/ECMAScript.js"></script> <script src="https://polyfill.web-cell.dev/feature/WebComponents.js"></script> <script src="https://polyfill.web-cell.dev/feature/ElementInternals.js"></script> <script src="https://polyfill.web-cell.dev/feature/Dialog.js"></script> <script src="https://polyfill.web-cell.dev/feature/Share.js"></script>- ListItem
- ListGroup
- Table
- TableRow
- InputCell
- Jumbotron
- Card
- CardHeader
- CardFooter
- MediaObject
- EdgeDetector
- SplitView
- AccordionPanel
- Accordion
- CollapseBox
- TabPanel
- TabView
- BreadCrumb
- Pagination
- NavLink
- Nav
- NavBar
- BannerNavBar
- NavBarToggler
- Step
- Stepper
- DropMenuItem
- DropMenu
- ShareBar
- Form
- Button
- ButtonGroup
- Toolbar
- IconButton
- CloseButton
- ToggleField
- ScoreRange
- Field
- FormField
- InputGroup
- FileInput
Replace BootStrap official CSS file with these 3th-party libraries's directly: