32 releases
0.11.0 | Sep 8, 2024 |
---|---|
0.10.1 | Jun 29, 2024 |
0.10.0 | Jan 5, 2024 |
0.9.0 | Dec 10, 2023 |
0.3.0 | Nov 29, 2021 |
#158 in Web programming
844 downloads per month
380KB
2.5K
SLoC
Contains (WOFF font, 180KB) bootstrap-icons.woff, (WOFF font, 130KB) bootstrap-icons.woff2
Usage
This project assumes that you have an existing web application that uses the Yew framework.
Add the dependency next to the regular yew dependency:
[dependencies]
yew = "0.21"
yew-bootstrap = "*"
To use form callback functions, the following dependencies should be added:
[dependencies]
wasm-bindgen = "0.2.*"
web-sys = { version = "0.3.*", features = ["HtmlTextAreaElement", "HtmlSelectElement"] }
Then in the beginning of your application, include the include_cdn()
or include_inline()
function to load the required CSS. Some components require the Bootstrap JavaScript
library to be loaded - for these you can use the include_cdn_js()
function. It is recommended that you put this at the bottom of your html!{}
macro, as done below:
fn view(&self, _ctx: &Context<Self>) -> Html {
html! {
<>
{include_cdn()}
<Button style={Color::Primary}>{"Primary"}</Button>
{include_cdn_js()}
</>
}
}
Check main.rs
for example usage for every implemented component.
Version Convention
This project uses semantic versioning.
Coverage
Core Content
- Container (component::Container)
- Grid (component::Row, component::Column)
- Display headings (component::Display)
- Lead (component::Lead)
- Blockquote
- Image/Figure
- Table
- Forms (component::form::FormControl)
Components
- Accordion (component::Accordion)
- Alert (component::Alert)
- Badge (component::Badge)
- Breadcrumb
- Button (component::Button)
- Button group (component::ButtonGroup)
- Card (component::Card, component::CardGroup)
- Carousel
- Close button
- Collapse
- Dropdown
- List group (component::ListGroup, component::ListGroupItem)
- Modal (component::Modal)
- Navbar (component::NavBar, component::NavItem, component::NavDropdown, component::NavDropdownItem)
- Navs & tabs
- Offcanvas
- Pagination
- Placeholders
- Popovers
- Progress (component::Progress, component::ProgressBar)
- Scrollspy
- Spinner (component::Spinner)
- Toast
- Tooltips
Helpers
- Clearfix
- Colored links (component::Link)
- Stacks
- Stretched (component::Link with
stretched={true}>
) - Text truncation
- Vertical/Horizontal rule/line (component::Line)
Examples
Several examples are provided:
examples/basics
: Componentsexamples/forms
: Form fields
To run an example:
cd examples/<directory>
trunk --serve
Dependencies
~11–20MB
~268K SLoC