Bootstrap CSS Modules

Bootstrap made easy with CSS modules for modular, scoped styling in your web applications.

Table of Contents

• Table of Contents
• Introduction
• Features
• Installation
• Usage
• Contributing
• License
• Sponsors

Introduction

@appzic/bootstrap-css-modules integrates Bootstrap styles as CSS Modules, providing modular, scoped styling for your applications. It leverages the power of CSS Modules to encapsulate styles, preventing conflicts and promoting maintainability.

Features

• Scoped styling using CSS Modules
• Utilizes Bootstrap's powerful grid system
• Modular and maintainable styles
• TypeScript support for type checking and improved development experience
• Encapsulation of CSS rules and styles to prevent conflicts
• Reusable styles across components for consistent designs
• Reduced duplicate code in your application
• Improved performance through unique class names generated at build time

Installation

You can install Bootstrap CSS Modules using npm:

npm install @appzic/bootstrap-css-modules

Usage

import React from "react";
import bs from "@appzic/bootstrap-css-modules/dist/bootstrap.module.css";

const Component = () => {
	return (
		<div className={`${bs.containerFluid}`}>
			<div class={`${bs.row}`}>
				<div class={`${bs.col6}`}>...</div>
				<div class={`${bs.col6}`}>...</div>
			</div>
		</div>
	);
};

export default Component;

Contributing

We welcome contributions from the community! Please take a look at our CONTRIBUTING.md file for more information on how to get started. We appreciate all kinds of contributions, from bug reports and feature requests to code contributions and documentation improvements. Thank you for considering contributing to our project!

License

Bootstrap CSS Modules is licensed under the MIT License.

Sponsors