bmy/Vue_dbui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 00:57:27 +08:00
commit 18df0f5e4b
2548 changed files with 253280 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
vue-ydui/example/routers/flexbox.vue Normal file
View File

@@ -0,0 +1,62 @@
<template>
<yd-layout title="FlexBox">
<div style="padding: 0 .12rem;">
<h2 class="demo-flexbox-title">Horizontal</h2>
<yd-flexbox class="demo-flexbox">
<yd-flexbox-item>
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
<yd-flexbox-item>
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
</yd-flexbox>
<yd-flexbox class="demo-flexbox">
<yd-flexbox-item>
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
<yd-flexbox-item>
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
<yd-flexbox-item>
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
</yd-flexbox>
<yd-flexbox class="demo-flexbox">
<div class="demo-flexbox-text" style="background-color:#BBB;">&lt;div&gt;</div>
<yd-flexbox-item>
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
</yd-flexbox>
<yd-flexbox class="demo-flexbox">
<div class="demo-flexbox-text" style="background-color:#BBB;">&lt;div&gt;</div>
<yd-flexbox-item>
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
<div class="demo-flexbox-text" style="background-color:#BBB;">&lt;div&gt;</div>
</yd-flexbox>
<h2 class="demo-flexbox-title">Vertical</h2>
<yd-flexbox direction="vertical" class="demo-flexbox">
<yd-flexbox-item style="margin-bottom: 8px;">
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
<yd-flexbox-item style="margin-bottom: 8px;">
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
<yd-flexbox-item>
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
</yd-flexbox>
<div style="height: 300px;">
<yd-flexbox direction="vertical" class="demo-flexbox">
<div class="demo-flexbox-text" style="width: 100%;background-color:#BBB;margin-bottom: 8px;">&lt;div&gt;</div>
<yd-flexbox-item style="margin-bottom: 8px;background-color:#DCDCDC;">
<div class="demo-flexbox-text">&lt;yd-flexbox-item&gt;</div>
</yd-flexbox-item>
<div class="demo-flexbox-text" style="width: 100%;background-color:#BBB;">&lt;div&gt;</div>
</yd-flexbox>
</div>
</div>
</yd-layout>
</template>