43 lines
1.1 KiB
Vue
43 lines
1.1 KiB
Vue
<template>
|
|
<div class="md-example drop-menu">
|
|
<section class="md-example-section" v-for="(demo, index) in demos" :key="index">
|
|
<div class="md-example-title" v-html="demo.title"></div>
|
|
<div class="md-example-content">
|
|
<component :is="demo"></component>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import createDemoModule from '../../../examples/create-demo-module'
|
|
import Demo0 from './cases/demo0'
|
|
import Demo1 from './cases/demo1'
|
|
import Demo2 from './cases/demo2'
|
|
import Demo3 from './cases/demo3'
|
|
|
|
export default {...createDemoModule('drop-menu', [Demo0, Demo1, Demo2, Demo3])}
|
|
|
|
</script>
|
|
|
|
<style lang="stylus">
|
|
.md-example.drop-menu
|
|
.md-example-section
|
|
position relative
|
|
.md-example-child
|
|
position relative
|
|
height 400px
|
|
background color-bg-base
|
|
overflow hidden
|
|
.md-drop-menu
|
|
position absolute
|
|
float left
|
|
width 100%
|
|
height 100%
|
|
.md-drop-menu-bar
|
|
height drop-menu-height
|
|
.md-popup
|
|
position absolute
|
|
.content
|
|
font-size font-body-normal
|
|
text-align center
|
|
line-height 400px
|
|
</style> |