mdbootstrap/mdb-ui-kit
1
1
Fork 0
mirror of https://github.com/mdbootstrap/mdb-ui-kit.git synced 2024-11-28 20:44:18 +03:00
Code Issues Packages Projects Releases Wiki Activity

switch links

Browse Source
This commit is contained in:
filipkappa 2020-10-09 13:33:49 +02:00
parent 5625da94c3
commit 0303823dfa
77 changed files with 1522 additions and 1449 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
docs/4.0/about/license/index.html
View File

@ -83,19 +83,17 @@
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/"
onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
>Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/"
onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
>Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/"
onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
</li>
<li class="nav-item partner ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
>Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
</li>
@ -110,7 +108,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
</li>
@ -1285,7 +1283,7 @@
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>

17
docs/4.0/about/overview/index.html
View File

@ -87,21 +87,18 @@
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/"
onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
>Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/"
onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
>Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/"
onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
</li>
>Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit Pro</a>
</li>
</ul>
@ -114,7 +111,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1285,7 +1282,7 @@
<h2 id="more-tools">More free tools</h2>
<ul>
<li>
<a href="https://mdbootstrap.com/docs/standard/">Material Design for Bootstrap 5</a> - UI Kit implementing
<a href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Material Design for Bootstrap 5</a> - UI Kit implementing
the latest Material Design 2.0 guidelines into the new Bootstrap 5.
</li>
<li>

39
docs/4.0/bootstrap-components/alerts/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1267,16 +1265,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Alerts</h1>
<p class="bd-lead">Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="examples">Examples</h2>

39
docs/4.0/bootstrap-components/badge/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1256,16 +1254,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Badges</h1>
<p class="bd-lead">Documentation and examples for badges, our small count and labeling component.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="example">Example</h2>

39
docs/4.0/bootstrap-components/breadcrumb/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Breadcrumb</h1>
<p class="bd-lead">Indicate the current page's location within a navigational hierarchy that automatically adds separators via CSS.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="overview">Overview</h2>

39
docs/4.0/bootstrap-components/button-group/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1259,16 +1257,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Button group</h1>
<p class="bd-lead">Group a series of buttons together on a single line with the button group, and super-power them with JavaScript.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="basic-example">Basic example</h2>

39
docs/4.0/bootstrap-components/buttons/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1273,16 +1271,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Buttons</h1>
<p class="bd-lead">Use Bootstrap's custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="examples">Examples</h2>

39
docs/4.0/bootstrap-components/card/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1436,16 +1434,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Cards</h1>
<p class="bd-lead">Bootstrap's cards provide a flexible and extensible content container with multiple variants and options.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="about">About</h2>

39
docs/4.0/bootstrap-components/carousel/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1284,16 +1282,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Carousel</h1>
<p class="bd-lead">A slideshow component for cycling through elements—images or slides of text—like a carousel.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="how-it-works">How it works</h2>

39
docs/4.0/bootstrap-components/collapse/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1290,16 +1288,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Collapse</h1>
<p class="bd-lead">Toggle the visibility of content across your project with a few classes and our JavaScript plugins.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="example">Example</h2>

39
docs/4.0/bootstrap-components/dropdowns/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1301,16 +1299,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Dropdowns</h1>
<p class="bd-lead">Toggle contextual overlays for displaying lists of links and more with the Bootstrap dropdown plugin.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="overview">Overview</h2>

39
docs/4.0/bootstrap-components/forms/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1332,16 +1330,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Forms</h1>
<p class="bd-lead">Examples and usage guidelines for form control styles, layout options, and custom components for creating a wide variety of forms.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="overview">Overview</h2>

39
docs/4.0/bootstrap-components/input-group/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1261,16 +1259,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Input group</h1>
<p class="bd-lead">Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="basic-example">Basic example</h2>

39
docs/4.0/bootstrap-components/jumbotron/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Jumbotron</h1>
<p class="bd-lead">Lightweight, flexible component for showcasing hero unit style content.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>A lightweight, flexible component that can optionally extend the entire viewport to showcase key marketing messages on your site.</p>

39
docs/4.0/bootstrap-components/list-group/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1284,16 +1282,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">List group</h1>
<p class="bd-lead">List groups are a flexible and powerful component for displaying a series of content. Modify and extend them to support just about any content within.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="basic-example">Basic example</h2>

39
docs/4.0/bootstrap-components/modal/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1333,16 +1331,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Modal</h1>
<p class="bd-lead">Use Bootstrap's JavaScript modal plugin to add dialogs to your site for lightboxes, user notifications, or completely custom content.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="how-it-works">How it works</h2>

39
docs/4.0/bootstrap-components/navbar/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1268,16 +1266,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Navbar</h1>
<p class="bd-lead">Documentation and examples for Bootstrap's powerful, responsive navigation header, the navbar. Includes support for branding, navigation, and more, including support for our collapse plugin.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="how-it-works">How it works</h2>

39
docs/4.0/bootstrap-components/navs/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1280,16 +1278,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Navs</h1>
<p class="bd-lead">Documentation and examples for how to use Bootstrap's included navigation components.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="base-nav">Base nav</h2>

39
docs/4.0/bootstrap-components/pagination/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1251,16 +1249,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Pagination</h1>
<p class="bd-lead">Documentation and examples for showing pagination to indicate a series of related content exists across multiple pages.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="overview">Overview</h2>

39
docs/4.0/bootstrap-components/popovers/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1284,16 +1282,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Popovers</h1>
<p class="bd-lead">Documentation and examples for adding Bootstrap popovers, like those found in iOS, to any element on your site.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="overview">Overview</h2>

39
docs/4.0/bootstrap-components/progress/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1253,16 +1251,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Progress</h1>
<p class="bd-lead">Documentation and examples for using Bootstrap custom progress bars featuring support for stacked bars, animated backgrounds, and text labels.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="how-it-works">How it works</h2>

39
docs/4.0/bootstrap-components/scrollspy/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1306,16 +1304,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Scrollspy</h1>
<p class="bd-lead">Automatically update Bootstrap navigation or list group components based on scroll position to indicate which link is currently active in the viewport.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="how-it-works">How it works</h2>

39
docs/4.0/bootstrap-components/tooltips/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1281,16 +1279,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Tooltips</h1>
<p class="bd-lead">Documentation and examples for adding custom Bootstrap tooltips with CSS and JavaScript using CSS3 for animations and data-attributes for local title storage.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="overview">Overview</h2>

39
docs/4.0/browser-bugs/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Wall of browser bugs</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Bootstrap currently works around several outstanding browser bugs in major browsers to deliver the best cross-browser experience possible. Some bugs, like those listed below, cannot be solved by us.</p>

39
docs/4.0/content/code/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1251,16 +1249,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Code</h1>
<p class="bd-lead">Documentation and examples for displaying inline and multiline blocks of code with Bootstrap.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="inline-code">Inline code</h2>

39
docs/4.0/content/figures/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Figures</h1>
<p class="bd-lead">Documentation and examples for displaying related images and text with the figure component in Bootstrap.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Anytime you need to display a piece of content—like an image with an optional caption, consider using a <code class="highlighter-rouge">&lt;figure&gt;</code>.</p>

18
docs/4.0/content/images/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1263,7 +1261,7 @@
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>

39
docs/4.0/content/reboot/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1271,16 +1269,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Reboot</h1>
<p class="bd-lead">Reboot, a collection of element-specific CSS changes in a single file, kickstart Bootstrap to provide an elegant, consistent, and simple baseline to build upon.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="approach">Approach</h2>

39
docs/4.0/content/tables/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1272,16 +1270,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Tables</h1>
<p class="bd-lead">Documentation and examples for opt-in styling of tables (given their prevalent use in JavaScript plugins) with Bootstrap.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="examples">Examples</h2>

39
docs/4.0/content/typography/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1271,16 +1269,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Typography</h1>
<p class="bd-lead">Documentation and examples for Bootstrap typography, including global settings, headings, body text, lists, and more.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="global-settings">Global settings</h2>

41
docs/4.0/examples/index.html
View File

@ -71,19 +71,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -95,7 +93,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -126,18 +124,21 @@
<div class="pt-md-3 pb-md-4">
<h1 class="bd-title mt-0">Examples</h1>
<p class="bd-lead">Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts.</p>
<a href="https://github.com/mdbootstrap/bootstrap-material-design/releases" class="btn btn-lg btn-bd-primary" onclick="ga('send', 'event', 'Examples', 'Hero', 'Download');">Download source code</a>
<a href="https://github.com/mdbootstrap/bootstrap-material-design/releases" class="btn btn-lg btn-bd-primary" >Download source code</a>
</div>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
</header>

39
docs/4.0/extend/approach/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Approach</h1>
<p class="bd-lead">Learn about the guiding principles, strategies, and techniques used to build and maintain Bootstrap so you can more easily customize and extend it yourself.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>While the getting started pages provide an introductory tour of the project and what it offers, this document focuses on <em>why</em> we do the things we do in Bootstrap. It explains our philosophy to building on the web so that others can learn from us, contribute with us, and help us improve.</p>

39
docs/4.0/extend/icons/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Icons</h1>
<p class="bd-lead">Guidance and suggestions for using external icon libraries with Bootstrap.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Bootstrap doesn’t include an icon library by default, but we have a handful of recommendations for you to choose from. While most icon sets include multiple file formats, we prefer SVG implementations for their improved accessibility and vector support.</p>

39
docs/4.0/extend/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Extend</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>todo: this entire page</p>

39
docs/4.0/getting-started/accessibility/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1255,16 +1253,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Accessibility</h1>
<p class="bd-lead">A brief overview of Bootstrap's features and limitations for the creation of accessible content.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Bootstrap provides an easy-to-use framework of ready-made styles, layout tools, and interactive components, allowing developers to create websites and applications that are visually appealing, functionally rich, and accessible out of the box.</p>

39
docs/4.0/getting-started/best-practices/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Best practices</h1>
<p class="bd-lead">Learn about some of the best practices we've gathered from years of working on and using Bootstrap.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>We’ve designed and developed Bootstrap to work in a number of environments. Here are some of the best practices we’ve gathered from years of working on and using it ourselves.</p>

39
docs/4.0/getting-started/browsers-devices/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1271,16 +1269,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Browsers and devices</h1>
<p class="bd-lead">Learn about the browsers and devices, from modern to old, that are supported by Bootstrap, including known quirks and bugs for each.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="supported-browsers">Supported browsers</h2>

39
docs/4.0/getting-started/build-tools/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1251,16 +1249,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Build tools</h1>
<p class="bd-lead">Learn how to use Bootstrap's included npm scripts to build our documentation, compile source code, run tests, and more.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="tooling-setup">Tooling setup</h2>

39
docs/4.0/getting-started/contents/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1250,16 +1248,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Contents</h1>
<p class="bd-lead">Discover what's included in Bootstrap, including our precompiled and source code flavors. Remember, Bootstrap's JavaScript plugins require jQuery.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="precompiled-bootstrap">Precompiled Bootstrap</h2>

43
docs/4.0/getting-started/download/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1254,16 +1252,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Download</h1>
<p class="bd-lead">Download Bootstrap to get the compiled CSS and JavaScript, source code, or include it with your favorite package managers like npm, RubyGems, and more.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="compiled-css-and-js">Compiled CSS and JS</h2>
@ -1276,7 +1277,7 @@
<p>This doesn’t include documentation, source files, or any optional JavaScript dependencies (jQuery and Popper.js).</p>
<p><a href="https://github.com/mdbootstrap/archive/dist.zip" class="btn btn-bd-primary" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download Bootstrap');">Download</a></p>
<p><a href="https://github.com/mdbootstrap/archive/dist.zip" class="btn btn-bd-primary" >Download</a></p>
<h2 id="source-files">Source files</h2>
@ -1289,7 +1290,7 @@
<p>Should you require <a href="/bootstrap-material-design/docs/4.0/getting-started/build-tools/#tooling-setup">build tools</a>, they are included for developing Bootstrap and its docs, but they’re likely unsuitable for your own purposes.</p>
<p><a href="https://github.com/mdbootstrap/bootstrap-material-design/releases" class="btn btn-bd-primary" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download source');">Download source</a></p>
<p><a href="https://github.com/mdbootstrap/bootstrap-material-design/releases" class="btn btn-bd-primary" >Download source</a></p>
<h2 id="bootstrapcdn">BootstrapCDN</h2>

39
docs/4.0/getting-started/introduction/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1262,16 +1260,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Introduction</h1>
<p class="bd-lead">Get started with Bootstrap, the world's most popular framework for building responsive, mobile-first sites, with BootstrapCDN and a template starter page.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="quick-start">Quick start</h2>

39
docs/4.0/getting-started/javascript/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1277,16 +1275,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">JavaScript</h1>
<p class="bd-lead">Bring Bootstrap to life with our optional JavaScript plugins built on jQuery. Learn about each plugin, our data and programmatic API options, and more.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="individual-or-compiled">Individual or compiled</h2>

39
docs/4.0/getting-started/theming/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1284,16 +1282,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Theming Bootstrap</h1>
<p class="bd-lead">Customize Bootstrap 4 with our new built-in Sass variables for global style preferences for easy theming and component changes.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="introduction">Introduction</h2>

39
docs/4.0/getting-started/webpack/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1254,16 +1252,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Webpack</h1>
<p class="bd-lead">Learn how to include Bootstrap in your project using Webpack 3.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="installing-bootstrap">Installing Bootstrap</h2>

39
docs/4.0/layout/grid/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1297,16 +1295,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Grid system</h1>
<p class="bd-lead">Use our powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a twelve column system, five default responsive tiers, Sass variables and mixins, and dozens of predefined classes.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="how-it-works">How it works</h2>

39
docs/4.0/layout/media-object/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1297,16 +1295,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Media object</h1>
<p class="bd-lead">Documentation and examples for Bootstrap's media object to construct highly repetitive components like blog comments, tweets, and the like.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="example">Example</h2>

39
docs/4.0/layout/overview/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1249,16 +1247,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Overview</h1>
<p class="bd-lead">Components and options for laying out your Bootstrap project, including wrapping containers, a powerful grid system, a flexible media object, and responsive utility classes.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="containers">Containers</h2>

39
docs/4.0/layout/utilities-for-layout/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1250,16 +1248,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Utilities for layout</h1>
<p class="bd-lead">For faster mobile-friendly and responsive development, Bootstrap includes dozens of utility classes for showing, hiding, aligning, and spacing content.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="changing-display">Changing <code class="highlighter-rouge">display</code></h2>

39
docs/4.0/material-design/buttons/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Buttons</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="contents">Contents</h2>

39
docs/4.0/material-design/collapse-inline/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Collapse inline</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>The Material Design for Bootstrap <code class="highlighter-rouge">CollapseInline</code> plugin allows you to toggle inline content on your pages with a bit of JavaScript and some classes. This plugin utilizes a handful of classes from the <a href="/bootstrap-material-design/components/collapse/">Bootstrap collapse plugin</a> for easy toggle behavior. Since most functionality and documentation (including a rich set of Javascript events) is already provided by the <a href="/bootstrap-material-design/components/collapse/">Bootstrap collapse plugin</a>, the following will focus only on some samples utilizing the BMD <code class="highlighter-rouge">CollapseInline</code> component.</p>

39
docs/4.0/material-design/drawers/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Drawers</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>The Material Design for Bootstrap <code class="highlighter-rouge">Drawer</code> provides a markup structure and plugin that allows you to display content on the bounds of any containing element. Drawers are commonly referred to as a side nav or offcanvas nav. The BMD implementation allows for positioning top, left, bottom, right, as well as two styles including push (default) as well as overlay. Both the drawer position and style can be set statically or responsively with the provided classes.</p>

39
docs/4.0/material-design/extensions/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Extensions</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Material Design for Bootstrap provides seamlessly integration with some extensions.</p>

39
docs/4.0/material-design/forms/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Forms</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Bootstrap provides several form control styles, layout options, and custom components for creating a wide variety of forms.</p>

39
docs/4.0/material-design/labels/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Labels</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Below is a complete list of <code class="highlighter-rouge">&lt;label&gt;</code> class options supported by Material Design for Bootstrap:</p>

39
docs/4.0/material-design/list-groups/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">List groups</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Material design list groups are specialized versions of their bootstrap counterparts, opting for the flexbox layout to achieve
the varieties specified. (<a href="https://www.google.com/design/spec/components/lists.html#lists-specs">Specification</a>)</p>

39
docs/4.0/material-design/menus/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Menus</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Bootstrap users know these as <a href="/bootstrap-material-design/components/dropdowns/">dropdowns</a>, but these are also known as menus in the <a href="https://www.google.com/design/spec/components/menus.html#menus-specs">Material Design specification</a>.</p>

39
docs/4.0/material-design/navs/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Navs</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Navigation available in Bootstrap share general markup and styles, from the base <code class="highlighter-rouge">.nav</code> class to the active and disabled states. Swap modifier classes to switch between each style.</p>

39
docs/4.0/material-design/selections/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Selections</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="contents">Contents</h2>

39
docs/4.0/material-design/snackbars/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Snackbars</h1>
<p class="bd-lead"></p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Snackbars and toasts can be created using the <a href="https://github.com/FezVrasta/snackbarjs">SnackbarJS</a> plugin developed by us.</p>

39
docs/4.0/migration/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1304,16 +1302,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Migrating to v4</h1>
<p class="bd-lead">Bootstrap 4 is a major rewrite of the entire project. The most notable changes are summarized below, followed by more specific changes to relevant components.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="stable-changes">Stable changes</h2>

39
docs/4.0/utilities/borders/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1254,16 +1252,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Borders</h1>
<p class="bd-lead">Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons, or any other element.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="border">Border</h2>

39
docs/4.0/utilities/clearfix/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1246,16 +1244,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Clearfix</h1>
<p class="bd-lead">Quickly and easily clear floated content within a container by adding a clearfix utility.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Easily clear <code class="highlighter-rouge">float</code>s by adding <code class="highlighter-rouge">.clearfix</code> <strong>to the parent element</strong>. Can also be used as a mixin.</p>

39
docs/4.0/utilities/close-icon/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1246,16 +1244,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Close icon</h1>
<p class="bd-lead">Use a generic close icon for dismissing content like modals and alerts.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p><strong>Be sure to include text for screen readers</strong>, as we’ve done with <code class="highlighter-rouge">aria-label</code>.</p>

39
docs/4.0/utilities/colors/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1256,16 +1254,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Colors</h1>
<p class="bd-lead">Convey meaning through color with a handful of color utility classes. Includes support for styling links with hover states, too.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="color">Color</h2>

39
docs/4.0/utilities/display/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1251,16 +1249,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Display property</h1>
<p class="bd-lead">Quickly and responsively toggle the display value of components and more with our display utilities. Includes support for some of the more common values, as well as some extras for controlling display when printing.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="how-it-works">How it works</h2>

39
docs/4.0/utilities/embed/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1249,16 +1247,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Embeds</h1>
<p class="bd-lead">Create responsive video or slideshow embeds based on the width of the parent by creating an intrinsic ratio that scales on any device.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="about">About</h2>

39
docs/4.0/utilities/flex/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1260,16 +1258,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Flex</h1>
<p class="bd-lead">Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities. For more complex implementations, custom CSS may be necessary.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="enable-flex-behaviors">Enable flex behaviors</h2>

39
docs/4.0/utilities/float/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1250,16 +1248,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Float</h1>
<p class="bd-lead">Toggle floats on any element, across any breakpoint, using our responsive float utilities.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="overview">Overview</h2>

39
docs/4.0/utilities/image-replacement/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1247,16 +1245,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Image replacement</h1>
<p class="bd-lead">Swap text for background images with the image replacement class.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Utilize the <code class="highlighter-rouge">.text-hide</code> class or mixin to help replace an element’s text content with a background image.</p>

39
docs/4.0/utilities/position/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1244,16 +1242,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Position</h1>
<p class="bd-lead">Use these shorthand utilities for quickly configuring the position of an element.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="common-values">Common values</h2>

39
docs/4.0/utilities/screenreaders/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1246,16 +1244,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Screenreaders</h1>
<p class="bd-lead">Use screenreader utilities to hide elements on all devices except screen readers.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Hide an element to all devices <strong>except screen readers</strong> with <code class="highlighter-rouge">.sr-only</code>. Combine <code class="highlighter-rouge">.sr-only</code> with <code class="highlighter-rouge">.sr-only-focusable</code> to show the element again when it’s focused (e.g. by a keyboard-only user). Can also be used as mixins.</p>
<figure class="highlight"><pre><code class="language-html" data-lang="html"><span class="nt">&lt;a</span> <span class="na">class=</span><span class="s">"sr-only sr-only-focusable"</span> <span class="na">href=</span><span class="s">"#content"</span><span class="nt">&gt;</span>Skip to main content<span class="nt">&lt;/a&gt;</span></code></pre></figure>

39
docs/4.0/utilities/sizing/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1246,16 +1244,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Sizing</h1>
<p class="bd-lead">Easily make an element as wide or as tall (relative to its parent) with our width and height utilities.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Width and height utilities are generated from the <code class="highlighter-rouge">$sizes</code> Sass map in <code class="highlighter-rouge">_variables.scss</code>. Includes support for <code class="highlighter-rouge">25%</code>, <code class="highlighter-rouge">50%</code>, <code class="highlighter-rouge">75%</code>, <code class="highlighter-rouge">100%</code>, and <code class="highlighter-rouge">auto</code> by default. Modify those values as you need to generate different utilities here.</p>

39
docs/4.0/utilities/spacing/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1253,16 +1251,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Spacing</h1>
<p class="bd-lead">Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element's appearance.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="how-it-works">How it works</h2>

39
docs/4.0/utilities/text/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1250,16 +1248,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Text</h1>
<p class="bd-lead">Documentation and examples for common text utilities to control alignment, wrapping, weight, and more.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<h2 id="text-alignment">Text alignment</h2>

39
docs/4.0/utilities/vertical-align/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Vertical alignment</h1>
<p class="bd-lead">Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Change the alignment of elements with the <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/vertical-align"><code class="highlighter-rouge">vertical-alignment</code></a> utilities. Please note that vertical-align only affects inline, inline-block, inline-table, and table cell elements.</p>

39
docs/4.0/utilities/visibility/index.html
View File

@ -73,19 +73,17 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link " href="/bootstrap-material-design/" >Home</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link active" href="/bootstrap-material-design/docs/4.0/getting-started/introduction/" >Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/" >Examples</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">Material Kit PRO</a>
</li>
</ul>
@ -97,7 +95,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
@ -1241,16 +1239,19 @@
<main class="col-12 col-md-9 col-xl-8 py-md-3 pl-md-5 bd-content" role="main">
<h1 class="bd-title" id="content">Visibility</h1>
<p class="bd-lead">Control the visibility, without modifying the display, of elements with visibility utilities.</p>
<div class="row">
<div class="alert alert-danger col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
<div class="row">
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
<p>Set the <code class="highlighter-rouge">visibility</code> of elements with our visibility utilities. These do not modify the <code class="highlighter-rouge">display</code> value at all and are helpful for hiding content from most users, but still keeping them for screen readers.</p>

69
index.html
View File

@ -19,7 +19,8 @@
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Bootstrap Material Design">
<meta name="twitter:description" content="The most popular HTML, CSS, and JS Material Design library in the world.">
<meta name="twitter:image" content="https://mdbootstrap.com/wp-content/themes/mdbootstrap4/content/en/_mdb5/standard/pro/_main/assets/mdb5-about-v2.jpg">
<meta name="twitter:image"
content="https://mdbootstrap.com/wp-content/themes/mdbootstrap4/content/en/_mdb5/standard/pro/_main/assets/mdb5-about-v2.jpg">
<!-- Facebook -->
@ -28,8 +29,10 @@
<meta property="og:title" content="Bootstrap Material Design">
<meta property="og:description" content="The most popular HTML, CSS, and JS Material Design library in the world.">
<meta property="og:image" content="https://mdbootstrap.com/wp-content/themes/mdbootstrap4/content/en/_mdb5/standard/pro/_main/assets/mdb5-about-v2.jpg">
<meta property="og:image:secure_url" content="https://mdbootstrap.com/wp-content/themes/mdbootstrap4/content/en/_mdb5/standard/pro/_main/assets/mdb5-about-v2.jpg">
<meta property="og:image"
content="https://mdbootstrap.com/wp-content/themes/mdbootstrap4/content/en/_mdb5/standard/pro/_main/assets/mdb5-about-v2.jpg">
<meta property="og:image:secure_url"
content="https://mdbootstrap.com/wp-content/themes/mdbootstrap4/content/en/_mdb5/standard/pro/_main/assets/mdb5-about-v2.jpg">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
@ -54,6 +57,9 @@
<link rel="apple-touch-icon" href="/bootstrap-material-design/apple-touch-icon.png">
<link rel="icon" href="/bootstrap-material-design/favicon.ico">
<!--Search console-->
<meta name="google-site-verification" content="CDRxMQ1vslfeJg3-UW8Kk095p9hnV1Ym6-U7akwCyNY" />
</head>
<body class="bd-home">
@ -79,22 +85,18 @@
<div class="navbar-nav-scroll">
<ul class="navbar-nav bd-navbar-nav flex-row">
<li class="nav-item">
<a class="nav-link active" href="/bootstrap-material-design/"
onclick="ga('send', 'event', 'Navbar', 'Community links', 'Bootstrap');">Home</a>
<a class="nav-link active" href="/bootstrap-material-design/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/getting-started/introduction/"
onclick="ga('send', 'event', 'Navbar', 'Community links', 'Docs');">Documentation</a>
<a class="nav-link "
href="/bootstrap-material-design/docs/4.0/getting-started/introduction/">Documentation</a>
</li>
<li class="nav-item">
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/"
onclick="ga('send', 'event', 'Navbar', 'Community links', 'Examples');">Examples</a>
<a class="nav-link " href="/bootstrap-material-design/docs/4.0/examples/">Examples</a>
</li>
<li class="nav-item partner ">
<a class="nav-link" href="https://mdbootstrap.com/pricing/jquery/pro/">Material Bootstrap 4 PRO Kit</a>
</li>
<li class="nav-item ">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Bootstrap 5 PRO Kit</a>
<li class="nav-item">
<a class="nav-link" href="https://mdbootstrap.com/docs/standard/pro/">Material Kit Pro</a>
</li>
</ul>
@ -108,7 +110,7 @@
v4.x
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="bd-versions">
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/">Latest (5.x)</a>
<a class="dropdown-item" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683">Latest (5.x)</a>
<a class="dropdown-item active" href="/bootstrap-material-design/docs/4.0/">Default (4.x)</a>
</div>
</li>
@ -167,25 +169,29 @@
and mixins, responsive grid system, extensive prebuilt components, and powerful plugins built on jQuery.
</p>
<div class="d-flex flex-column flex-md-row lead mb-3">
<a href="/bootstrap-material-design/docs/4.0/getting-started/" class="btn btn-lg btn-primary"
onclick="ga('send', 'event', 'Jumbotron actions', 'Get started', 'Get started');">Get started</a>
<a href="/bootstrap-material-design/docs/4.0/getting-started/download/" class="btn btn-lg btn-secondary"
onclick="ga('send', 'event', 'Jumbotron actions', 'Download', 'Download 4.1.1');">Download</a>
<a href="/bootstrap-material-design/docs/4.0/getting-started/" class="btn btn-lg btn-primary">Get
started</a>
<a href="/bootstrap-material-design/docs/4.0/getting-started/download/"
class="btn btn-lg btn-secondary">Download</a>
</div>
<p class="text-muted mb-0">
Currently v4.1.1
</p>
</div>
</div>
<div class="row">
<div class="alert alert-primary col-md-6 text-center" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/" class="btn btn-outline-primary mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
<div class="col-md-6 text-center">
<div class="alert alert-danger" role="alert">
This UI Kit is dedicated to Bootstrap 4 &amp; Material Design.
<hr>
<strong>Discover the latest Kit for Bootstrap 5 &amp; Material Design 2.0!
<a type="button" href="https://mdbootstrap.com/docs/standard/?utm_ref_id=28683"
class="btn btn-outline-danger mt-3">GET
BOOTSTRAP
5 KIT FOR FREE</a>
</strong></div>
</div>
</div>
</div>
@ -256,15 +262,16 @@
<h3 class="">Material Design for Bootstrap PRO</h3>
<p class="">
2000+ material UI elements, 600+ material icons, 74 CSS animations, SASS files, templates, premium tutorials and
many more
Latest Bootstrap 5 with Material Design 2.0. 5000+ material UI elements, 1500+ icons, 70+ CSS animations, SASS
files, templates, premium tutorials and
many more.
</p>
<a class="" href="https://mdbootstrap.com/products/">
<a class="" href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683">
<img class="img-fluid mt-3 mx-auto" src="/bootstrap-material-design/assets/img/mdbootstrap-alt.jpg"
alt="Bootstrap Themes" width="1024" height="388">
</a>
<br /><br />
<a href="https://mdbootstrap.com/products/" class="btn btn-outline-primary">Get Material
<a href="https://mdbootstrap.com/docs/standard/pro/?utm_ref_id=28683" class="btn btn-outline-primary">Get Material
Design for Bootstrap PRO</a>
</div>
</div>