Skip to content

Sham2206/essential-ui-kit-for-blazor

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 

Repository files navigation

Essential UI Kit for Blazor 🎨

GitHub Release License

Welcome to the Essential UI Kit for Blazor! This repository offers free, pre-built, and beautiful Blazor blocks for your web applications. Whether you are building a new project or enhancing an existing one, our kit provides the essential components to create stunning user interfaces with ease.

Table of Contents

Features

  • Pre-Built Components: Save time with ready-to-use Blazor blocks.
  • Responsive Design: All components are mobile-friendly and adapt to different screen sizes.
  • Easy Integration: Quickly add components to your Blazor projects.
  • Customizable: Modify styles and behavior to fit your needs.
  • Documentation: Comprehensive guides to help you get started.

Installation

To get started, clone this repository to your local machine:

git clone https://github.com/Sham2206/essential-ui-kit-for-blazor.git

Then, navigate to the project directory:

cd essential-ui-kit-for-blazor

You can download the latest release from our Releases section. Make sure to execute the necessary files to integrate the UI kit into your project.

Usage

To use the Essential UI Kit in your Blazor application, follow these steps:

  1. Add Reference: Include the necessary CSS and JavaScript files in your project.
  2. Import Components: Use the components in your Blazor pages or components.
  3. Customize: Adjust styles and properties to meet your design requirements.

Example

Here’s a simple example of how to use a button from the kit:

<Button CssClass="btn-primary" @onclick="HandleClick">Click Me!</Button>

@code {
    private void HandleClick()
    {
        // Your click handling logic
    }
}

Available Blocks

The Essential UI Kit offers a variety of blocks to enhance your web application:

  • Buttons: Stylish buttons with various styles.
  • Cards: Beautiful card layouts for displaying content.
  • Forms: User-friendly forms for data entry.
  • Modals: Interactive modals for alerts and confirmations.
  • Navigation: Responsive navigation bars and menus.

Each block is designed to be easy to implement and customize.

Customization

You can customize the components in the Essential UI Kit to fit your project's design. Modify CSS styles or pass parameters to adjust the behavior of components.

Example of Customization

<Button CssClass="btn-custom" Style="background-color: red; color: white;">Custom Button</Button>

In this example, the button's background color and text color are modified to fit the design.

Contributing

We welcome contributions to the Essential UI Kit! If you have ideas for new components or improvements, please follow these steps:

  1. Fork the repository.
  2. Create a new branch for your feature.
  3. Make your changes and commit them.
  4. Push your branch to your forked repository.
  5. Open a pull request.

Your contributions help us improve the kit for everyone!

License

This project is licensed under the MIT License. See the LICENSE file for details.

Links

For more information, check out the following resources:

  • Releases: Download the latest versions and updates.
  • Documentation: Explore detailed guides and examples.

Thank you for using the Essential UI Kit for Blazor! We hope it helps you create amazing web applications.