Git Product home page Git Product logo

blazorstrap's Introduction

BlazorStrap

NuGet Pre Release Nuget (with prereleases) Nuget GitHub stars Gitter chat Gitter chat

Bootstrap 4/5 components for Blazor

Bootstrap 5 NuGet Pre Release

We do not include bootstrap.min.css in the package. This already exists in the blazor wasm and blazor server side templates.

Packages

  • Core Package handles all the logic / JSInterop

    • NuGet Pre Release
  • Display packages. These packages so the rendered components. V5 is for Bootstrap 5. V4 is for Bootstrap 4

    • NuGet Pre Release NuGet Pre Release
  • Pre Release

    • Nuget (with prereleases) Nuget (with prereleases) Nuget (with prereleases)
    • Beta. Not recommended for production use.
      • Minor fixes a-z. Example 5.2.100-Beta1a
    • Preview. Test to make sure it meets your requirements before production use.
      • Minor fixes a-z. Example 5.2.100-Preview1a
    • Release. Safe for production.
      • Minor fixes .MMDDYY. Example 5.2.100.60323

Install

Blazor WebAssembly
    • Download BlazorStrap package from nuget: nuget
    • Download BlazorStrap.V5 package from nuget: nuget
      • Both packages should be the same version.
  1. Modify your index.html with the following.
    1. Inside the <head> add
      1. <link href="YourAssemblyName.styles.css" rel="stylesheet"> )
      2. <link href="path_to_bootstrap.min.css" rel="stylesheet" integrity="if_needed" />"
    2. At the end of the <body> add
      1. <script src="_content/BlazorStrap/popper.min.js"></script>
      2. <script src="_content/BlazorStrap/blazorstrap.js"></script>
  2. In Program.cs add
    1. builder.Services.AddBlazorStrap();
  3. In _Imports.razor add
    1. @using BlazorStrap.V5

Blazor Server Side
    • Download BlazorStrap package from nuget: nuget
    • Download BlazorStrap.V5 package from nuget: nuget
      • Both packages should be the same version.
  1. Modify your _host.cshtml with the following.
    1. Inside the <head> add
      1. <link href="YourAssemblyName.styles.css" rel="stylesheet">
      2. <link href="path_to_bootstrap.min.css" rel="stylesheet" integrity="if_needed" />"
    2. At the end of the <body> add
      1. <script src="_content/BlazorStrap/popper.min.js"></script>
      2. <script src="_content/BlazorStrap/blazorstrap.js"></script>
  2. In Program.cs or Startup.cs add
    1. Services.AddBlazorStrap(); to your build pipeline
  3. In _Imports.razor add
    1. @using BlazorStrap.V5

Bootstrap 4 NuGet Pre Release

We do not include bootstrap.min.css in the package. This already exists in the blazor wasm and blazor server side templates.

Install

Blazor WebAssembly
    • Download BlazorStrap package from nuget: nuget
    • Download BlazorStrap.V4 package from nuget: nuget
      • Both packages should be the same version.
  1. Modify your index.html with the following.
    1. Inside the <head> add
      1. <link href="YourAssemblyName.styles.css" rel="stylesheet"> )
      2. <link href="path_to_bootstrap.min.css" rel="stylesheet" integrity="if_needed" />"
    2. At the end of the <body> add
      1. <script src="_content/BlazorStrap/popper.min.js"></script>
      2. <script src="_content/BlazorStrap/blazorstrap.js"></script>
  2. In Program.cs add
    1. builder.Services.AddBlazorStrap();
  3. In _Imports.razor add
    1. @using BlazorStrap.V4

Blazor Server Side
    • Download BlazorStrap package from nuget: nuget
  • Download BlazorStrap.V4 package from nuget: nuget
    • Both packages should be the same version.-
  1. Modify your _host.cshtml with the following.
    1. Inside the <head> add
      1. <link href="YourAssemblyName.styles.css" rel="stylesheet">
      2. <link href="path_to_bootstrap.min.css" rel="stylesheet" integrity="if_needed" />"
    2. At the end of the <body> add
      1. <script src="_content/BlazorStrap/popper.min.js"></script>
      2. <script src="_content/BlazorStrap/blazorstrap.js"></script>
  2. In Program.cs or Startup.cs add
    1. Services.AddBlazorStrap(); to your build pipeline
  3. In _Imports.razor add
    1. @using BlazorStrap.V4

Extensions:

  • NuGet Pre Release BlazorStrap.Extensions.FluentValidation
  • NuGet Pre Release BlazorStrap.Extensions.TreeView

blazorstrap's People

Contributors

andras-csanyi avatar arivera12 avatar blackfenix2 avatar blinard avatar chanan avatar chucker avatar danielabbatt avatar emaderbacher avatar gomjabar6 avatar hawxy avatar herbertmilhomme avatar hez2010 avatar ivanjosipovic avatar jbomhold3 avatar jespersh avatar kiasyn avatar m-chandler avatar markzither avatar masterskriptor avatar natbyre avatar paul-schroeder avatar pelshen avatar peterblazejewicz avatar stiankroknes avatar tabnoc avatar timbze avatar uecasm avatar vulpessarl avatar woodste36 avatar zandermar18 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.