Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/morbidick/bootstrap-webcomponents
[WiP] Rewrite of bootstrap components as web components.
https://github.com/morbidick/bootstrap-webcomponents
bootstrap frontend lit-element lit-html ui webcomponents
Last synced: about 1 month ago
JSON representation
[WiP] Rewrite of bootstrap components as web components.
- Host: GitHub
- URL: https://github.com/morbidick/bootstrap-webcomponents
- Owner: morbidick
- License: mit
- Created: 2018-06-22T15:39:31.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2019-02-05T19:51:48.000Z (almost 6 years ago)
- Last Synced: 2024-11-07T16:48:46.497Z (about 2 months ago)
- Topics: bootstrap, frontend, lit-element, lit-html, ui, webcomponents
- Language: JavaScript
- Homepage: https://bootstrap.morbi-happens.de/demo/
- Size: 501 KB
- Stars: 39
- Watchers: 6
- Forks: 4
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
# Bootstrap Web Components
[![CircleCI](https://circleci.com/gh/morbidick/bootstrap-webcomponents.svg?style=shield)](https://circleci.com/gh/morbidick/bootstrap-webcomponents)
[![npm version](https://img.shields.io/npm/v/@morbidick/bootstrap.svg)](https://www.npmjs.com/package/@morbidick/bootstrap)
[![npm bundle size (minified + gzip)](https://img.shields.io/bundlephobia/minzip/@morbidick/bootstrap.svg)](https://bundlephobia.com/result?p=@morbidick/bootstrap)> ## 🛠Status: In Development
> Components get implemented as needed. PRs welcome!Rewrite of bootstrap components as web components. See [the demo](demo/index.html) for all implemented features.
## Motivation
This isn't just a webcomponents wrapper around the bootstrap css, this aims to be a clean and simple rewrite easily understandable to everyone new to the webcomponents standards.
* No build chain / preprocessors
* allow easy theming via css custom properties
* provide a clear api to end users in the form of attributes
* Use web standards over big libraries where possible (even if that means loosing compatibility eg. dialog element)
* Provide support to projects to include polyfills and buildsteps for the above points## Install
```bash
npm install @morbidick/bootstrap
```## Usage
Import into your module script:
```javascript
import { BsButton, BsBadge } from "@morbidick/bootstrap/elements.js"
```Alternatively, load a bundled version from CDN:
```html
```
Use it in your web page:
```html
Click Me
warning
```## Development
View the [contributing notes](CONTRIBUTING.md) for instructions and further resources.