chore: prettier all demos
This commit is contained in:
+65
-13
@@ -2,27 +2,62 @@
|
||||
<demo-section>
|
||||
<demo-block :title="$t('basicUsage')">
|
||||
<van-cell :title="$t('buttonBasic')" is-link @click="showBasic = true" />
|
||||
<van-popup v-model="showBasic" :style="{ padding: '30px 50px' }">{{ $t('content') }}</van-popup>
|
||||
<van-popup v-model="showBasic" :style="{ padding: '30px 50px' }">
|
||||
{{ $t('content') }}
|
||||
</van-popup>
|
||||
</demo-block>
|
||||
|
||||
<demo-block :title="$t('position')">
|
||||
<van-cell :title="$t('buttonTop')" is-link @click="showTop = true" />
|
||||
<van-cell :title="$t('buttonBottom')" is-link @click="showBottom = true" />
|
||||
<van-cell
|
||||
:title="$t('buttonBottom')"
|
||||
is-link
|
||||
@click="showBottom = true"
|
||||
/>
|
||||
<van-cell :title="$t('buttonLeft')" is-link @click="showLeft = true" />
|
||||
<van-cell :title="$t('buttonRight')" is-link @click="showRight = true" />
|
||||
|
||||
<van-popup v-model="showTop" position="top" :style="{ height: '20%' }" />
|
||||
<van-popup v-model="showBottom" position="bottom" :style="{ height: '20%' }" />
|
||||
<van-popup v-model="showLeft" position="left" :style="{ width: '20%', height: '100%' }" />
|
||||
<van-popup v-model="showRight" position="right" :style="{ width: '20%', height: '100%' }" />
|
||||
<van-popup
|
||||
v-model="showBottom"
|
||||
position="bottom"
|
||||
:style="{ height: '20%' }"
|
||||
/>
|
||||
<van-popup
|
||||
v-model="showLeft"
|
||||
position="left"
|
||||
:style="{ width: '20%', height: '100%' }"
|
||||
/>
|
||||
<van-popup
|
||||
v-model="showRight"
|
||||
position="right"
|
||||
:style="{ width: '20%', height: '100%' }"
|
||||
/>
|
||||
</demo-block>
|
||||
|
||||
<demo-block :title="$t('closeIcon')">
|
||||
<van-cell :title="$t('closeIcon')" is-link @click="showCloseIcon = true" />
|
||||
<van-cell :title="$t('customCloseIcon')" is-link @click="showCustomCloseIcon = true" />
|
||||
<van-cell :title="$t('customIconPosition')" is-link @click="showCustomIconPosition = true" />
|
||||
<van-cell
|
||||
:title="$t('closeIcon')"
|
||||
is-link
|
||||
@click="showCloseIcon = true"
|
||||
/>
|
||||
<van-cell
|
||||
:title="$t('customCloseIcon')"
|
||||
is-link
|
||||
@click="showCustomCloseIcon = true"
|
||||
/>
|
||||
<van-cell
|
||||
:title="$t('customIconPosition')"
|
||||
is-link
|
||||
@click="showCustomIconPosition = true"
|
||||
/>
|
||||
|
||||
<van-popup v-model="showCloseIcon" closeable position="bottom" :style="{ height: '20%' }" />
|
||||
<van-popup
|
||||
v-model="showCloseIcon"
|
||||
closeable
|
||||
position="bottom"
|
||||
:style="{ height: '20%' }"
|
||||
/>
|
||||
<van-popup
|
||||
v-model="showCustomCloseIcon"
|
||||
closeable
|
||||
@@ -40,13 +75,30 @@
|
||||
</demo-block>
|
||||
|
||||
<demo-block :title="$t('roundCorner')">
|
||||
<van-cell :title="$t('roundCorner')" is-link @click="showRoundCorner = true" />
|
||||
<van-popup v-model="showRoundCorner" round position="bottom" :style="{ height: '20%' }" />
|
||||
<van-cell
|
||||
:title="$t('roundCorner')"
|
||||
is-link
|
||||
@click="showRoundCorner = true"
|
||||
/>
|
||||
<van-popup
|
||||
v-model="showRoundCorner"
|
||||
round
|
||||
position="bottom"
|
||||
:style="{ height: '20%' }"
|
||||
/>
|
||||
</demo-block>
|
||||
|
||||
<demo-block v-if="!isWeapp" :title="$t('getContainer')">
|
||||
<van-cell :title="$t('getContainer')" is-link @click="showGetContainer = true" />
|
||||
<van-popup v-model="showGetContainer" get-container="body" :style="{ padding: '30px 50px' }" />
|
||||
<van-cell
|
||||
:title="$t('getContainer')"
|
||||
is-link
|
||||
@click="showGetContainer = true"
|
||||
/>
|
||||
<van-popup
|
||||
v-model="showGetContainer"
|
||||
get-container="body"
|
||||
:style="{ padding: '30px 50px' }"
|
||||
/>
|
||||
</demo-block>
|
||||
</demo-section>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user