Useful Bootstrap 5 Components (For Moodle 5)
セクションアウトライン
-
This theme supports Bootstrap 5 components. You can use the useful components to enhance your Moodle course design.
Need help getting started? Check out our guide: How to Use Bootstrap 5 Components in Moodle 5 Courses. -
Tab 1 content goes here. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.Tab 2 content goes here. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.Tab 3 content goes here. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.Tab 4 content goes here. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
-
-
Single Card
Card title
Some quick example text to build on the card title and make up the bulk of the card's content.
Go somewhere -
Grid Cards
Card title
This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
Card title
This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
Card title
This is a longer card with supporting text below as a natural lead-in to additional content.
Card title
This is a longer card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.
-
Card Styles
HeaderPrimary card title
Some quick example text to build on the card title and make up the bulk of the card's content.
HeaderSecondary card title
Some quick example text to build on the card title and make up the bulk of the card's content.
HeaderSuccess card title
Some quick example text to build on the card title and make up the bulk of the card's content.
HeaderDanger card title
Some quick example text to build on the card title and make up the bulk of the card's content.
HeaderWarning card title
Some quick example text to build on the card title and make up the bulk of the card's content.
HeaderInfo card title
Some quick example text to build on the card title and make up the bulk of the card's content.
HeaderLight card title
Some quick example text to build on the card title and make up the bulk of the card's content.
HeaderDark card title
Some quick example text to build on the card title and make up the bulk of the card's content.
-
-
-
Standard Table
# First Last Handle 1 Mark Otto @mdo 2 Jacob Thornton @fat 3 John Doe @social -
Table with Striped Rows
# First Last Handle 1 Mark Otto @mdo 2 Jacob Thornton @fat 3 John Doe @social -
Dark Table with Hoverable Rows
# First Last Handle 1 Mark Otto @mdo 2 Jacob Thornton @fat 3 John Doe @social
-
-
A simple primary alert with an example link. Give it a click if you like.A simple secondary alert with an example link. Give it a click if you like.A simple success alert with an example link. Give it a click if you like.A simple danger alert with an example link. Give it a click if you like.A simple warning alert with an example link. Give it a click if you like.A simple info alert with an example link. Give it a click if you like.A simple light alert with an example link. Give it a click if you like.A simple dark alert with an example link. Give it a click if you like.
-
Primary Secondary Success Danger Warning Info Light Dark
-
Modal title
Modal body text goes here. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse non risus semper, dictum leo at, molestie nunc. Praesent molestie, sem eu tristique venenatis, massa justo auctor diam, vitae faucibus augue lorem luctus felis. Aenean tempor eros a maximus posuere. Ut at tortor non lectus imperdiet ullamcorper.


