Directory

← Back

bootstrap-webcomponents

[WiP] Rewrite of bootstrap components as web components.

Author

Rating

Popularity

<100

Bootstrap Web Components

CircleCI npm version npm bundle size (minified + gzip)

� Status: In Development

Components get implemented as needed. PRs welcome!

Rewrite of bootstrap components as web components. See the demo 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

npm install @morbidick/bootstrap

Usage

Import into your module script:

import { BsButton, BsBadge } from "@morbidick/bootstrap/elements.js"

Alternatively, load a bundled version from CDN:

<script src="https://unpkg.com/@morbidick/bootstrap@latest/dist/elements.bundled.min.js"></script>

Use it in your web page:

<bs-button href="#link">Click Me</bs-button>
<bs-badge class="warning">warning</bs-badge>

Development

View the contributing notes for instructions and further resources.

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Dependencies

  • @morbidick/lit-element-notify#^1.0.0
  • lit-element#^2.0.1
  • lit-html#^1.0.0
  • rimraf#^2.6.3
Released
2019-02-05
Maturity
IMPORTED
License
MIT License

Compatibility

Framework
Browser
Browser Independent

bootstrap-webcomponents - Vaadin Add-on Directory

[WiP] Rewrite of bootstrap components as web components. bootstrap-webcomponents - Vaadin Add-on Directory
# 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.
Online