Socket
Socket
Sign inDemoInstall

@marco_ciaramella/wbootstrap

Package Overview
Dependencies
0
Maintainers
1
Versions
50
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    @marco_ciaramella/wbootstrap

wrapper for DOM


Version published
Weekly downloads
1
Maintainers
1
Created
Weekly downloads
 

Readme

Source

wbootstrap

wboostrap is a minimal wrapper for DOM based on Bootstrap 5 and Google Material.

Install

npm i @marco_ciaramella/wbootstrap

Usage

Create an html page like this

<!DOCTYPE html>
<html>

<head>

    <!-- import Material Icon -->
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons+Outlined" rel="stylesheet">

    <!-- CSS only -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <!-- JavaScript Bundle with Popper -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
        crossorigin="anonymous"></script>
</head>

<body></body>

<script src="index.js"></script>

</html>

Add your js code in index.js.

First of all you need a body element

const body = new Body();

then you can append child to this body. For example

body.appendChild(new FlexColumnFull(3));

Each HTML element defined in this module is a subclass of Element. If you want to add a custom element or a new one you should extend Element class or one of his subclasses.

See public documentation for all supported HTML elements styled with bootstrap 5. Further samples will follow as soon as possible.

Keywords

FAQs

Last updated on 27 Jan 2024

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc