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 2 months 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 7 years ago)
• Default Branch: master
• Last Pushed: 2019-02-05T19:51:48.000Z (almost 7 years ago)
• Last Synced: 2025-07-03T17:59:53.959Z (6 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: 5
• 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.