diff options
1 files changed, 0 insertions, 92 deletions
| -rw-r--r-- | docs/src/contents/tiles.pug | 92 |
diff --git a/docs/src/contents/tiles.pug b/docs/src/contents/tiles.pug deleted file mode 100644 index cd8b994..0000000 --- a/docs/src/contents/tiles.pug +++ /dev/null @@ -1,92 +0,0 @@ -p Tiles are repeatable or embeddable information blocks. - -.docs-demo.columns - .column.col-9.col-sm-12 - .tile - .tile-icon - figure.avatar.avatar-lg - img(src="img/avatar-3.png" alt="Avatar") - .tile-content - p.tile-title The Avengers - p.tile-subtitle.text-gray - | Earth's Mightiest Heroes joined forces to take on threats that were too big for any one hero to tackle... - .tile-action - button.btn.btn-primary Join - button.btn Contact - .column.col-9.col-sm-12 - .tile - .tile-icon - figure.avatar.avatar-lg - img(src="img/avatar-2.png" alt="Avatar") - .tile-content - p.tile-title The S.H.I.E.L.D. - p.tile-subtitle.text-gray The Strategic Homeland Intervention, Enforcement, and Logistics Division... - p - button.btn.btn-primary.btn-sm Join - button.btn.btn-sm Contact - -p - | Add a container with the #[code tile] class. - | And add child elements with the #[code tile-icon], #[code tile-content] or/and #[code tile-action] classes. - | The #[code tile-icon] and #[code tile-action] are optional. -p - | There are #[code tile-title] and #[code tile-subtitle] classes for title and subtitle text styles. - -pre.code(data-lang='HTML') - code - :highlight(lang="html") - <div class="tile"> - <div class="tile-icon"> - <div class="example-tile-icon"> - <i class="icon icon-file centered"></i> - </div> - </div> - <div class="tile-content"> - <p class="tile-title">The Avengers</p> - <p class="tile-subtitle text-gray">Earth's Mightiest Heroes joined forces to take on threats that were too big for any one hero to tackle...</p> - </div> - <div class="tile-action"> - <button class="btn btn-primary">Join</button> - </div> - </div> - -+docs-subheading('tiles-compact', 'Compact tiles') - -p - | There is compact version of Tiles component, which is often used as contact and file info blocks. -p - | Add the #[code tile-centered] class to the container #[code tile]. - | The #[code tile-icon], #[code tile-content] and #[code tile-action] will be vertically centered. - -.docs-demo.columns - .column.col-6.col-md-9.col-xs-12 - .tile.tile-centered - .tile-icon - .example-tile-icon - i.icon.icon-mail.centered - .tile-content - .tile-title spectre-docs.pdf - .tile-subtitle.text-gray 14MB · Public · 1 Jan, 2017 - .tile-action - button.btn.btn-link.btn-action - i.icon.icon-more-vert - -pre.code(data-lang='HTML') - code - :highlight(lang="html") - <div class="tile tile-centered"> - <div class="tile-icon"> - <div class="example-tile-icon"> - <i class="icon icon-file centered"></i> - </div> - </div> - <div class="tile-content"> - <div class="tile-title">spectre-docs.pdf</div> - <div class="tile-subtitle text-gray">14MB · Public · 1 Jan, 2017</div> - </div> - <div class="tile-action"> - <button class="btn btn-link"> - <i class="icon icon-more-vert"></i> - </button> - </div> - </div>
\ No newline at end of file |