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

Merge pull request #514 from enyosolutions/patch-1

Browse Source 
added card information do the doc
This commit is contained in:
Fez Vrasta 2015-03-20 19:20:52 +01:00
commit d703f7f4c0
1 changed files with 44 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
README.md
View File

@ -125,6 +125,50 @@ The syntax to add a Material icon is:
<i class="icon icon-material-favorite"></i> <i class="icon icon-material-favorite"></i>
### Cards
A card will expand to fill all of the available width (e.g. column's width). Card's height will be automatically resized to match width.
Here is an example on how to use it:
<div class="card">
<div class="card-height-indicator"></div>
<div class="card-content">
<div class="card-image">
<img src="./image.jpg" alt="Loading image...">
<h3 class="card-image-headline">Lorem Ipsum Dolor</h3>
</div>
<div class="card-body">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry.</p>
</div>
<footer class="card-footer">
<button class="btn btn-flat">Share</button>
<button class="btn btn-flat btn-warning">Learn More</button>
</footer>
</div>
</div>
Cards will adapt to column's width. The card below will have width equal to col-lg-6:
<div class="row">
<div class="col-lg-3"></div>
<div class="col-lg-6">
<div class="card">
...
</div>
</div>
<div class="col-lg-3"></div>
</div>
## Material.js ## Material.js
`Material.js` is a jQuery plugin that adds some magic to your markup and allows Material Design for Bootstrap to style some elements like inputs, checkboxes, radios etc. `Material.js` is a jQuery plugin that adds some magic to your markup and allows Material Design for Bootstrap to style some elements like inputs, checkboxes, radios etc.