mirror of
https://github.com/Hopiu/vue-material.git
synced 2026-05-14 18:23:10 +00:00
63 lines
2.1 KiB
Vue
63 lines
2.1 KiB
Vue
<template>
|
|
<demo-page>
|
|
<div slot="examples" class="whiteframe-list">
|
|
<demo-example label="Default">
|
|
<md-whiteframe md-elevation="1">1dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="2">2dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="3">3dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="4">4dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="5">5dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="6">6dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="7">7dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="8">8dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="9">9dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="10">10dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="11">11dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="12">12dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="13">13dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="14">14dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="15">15dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="16">16dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="17">17dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="18">18dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="19">19dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="20">20dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="21">21dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="22">22dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="23">23dp</md-whiteframe>
|
|
<md-whiteframe md-elevation="24">24dp</md-whiteframe>
|
|
</demo-example>
|
|
</div>
|
|
|
|
<div slot="code">
|
|
<h2>Code</h2>
|
|
</div>
|
|
|
|
<div slot="api">
|
|
|
|
</div>
|
|
</demo-page>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
.whiteframe-list .demo-example .demo-example-body {
|
|
padding-bottom: 48px;
|
|
|
|
.md-whiteframe {
|
|
width: 100px;
|
|
height: 100px;
|
|
margin: 24px 12px 12px 24px;
|
|
display: inline-flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
export default {
|
|
mounted() {
|
|
this.$root.pageTitle = 'Whiteframe';
|
|
}
|
|
};
|
|
</script>
|