attiya/ebike-plus-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 栅格系统

Browse Source
This commit is contained in:
wang_fan_w 2024-05-21 23:51:46 +08:00
parent 440b9007fb
commit a26f025ba7
2 changed files with 14 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/views/home/components/shortcut.vue
View File

@ -8,31 +8,20 @@
</div>
</div>
<a-divider :margin="16" />
<!-- <div class="flex-row-between-center">
<div v-for="(item, index) in shortcut" :key="item.id" class="card-middling row-center" :class="'animated-fade-up-' + index">
<div>
<SvgIcon :name="item.svg" :size="40" />
<span class="shortcut-card-label">{{ item.name }}</span>
</div>
</div>
</div> -->
<a-row class="grid-demo">
<a-row>
<a-col
:xs="24"
:sm="12"
:md="12"
:lg="8"
:xl="4"
:xxl="4"
:gutter="[24, 12]"
v-for="(item, index) in shortcut"
:key="item.id"
class="card-middling row-center"
class="card-middling row-center card-box"
:class="'animated-fade-up-' + index"
>
<div>
<SvgIcon :name="item.svg" :size="40" />
<span class="shortcut-card-label">{{ item.name }}</span>
</div>
<div class="shortcut-card-label">{{ item.name }}</div>
</a-col>
</a-row>
</div>
@ -75,11 +64,15 @@ const shortcut = ref([
<style lang="scss" scoped>
.shortcut-box {
.card-box {
margin-bottom: $padding;
.shortcut-card-label {
width: 100px;
font-size: $font-size-body-3;
margin-left: 20px;
color: $color-text-2;
}
}
}
.box-title {
display: flex;

2
src/views/home/components/target-box.vue
View File

@ -65,7 +65,7 @@ const targetData = reactive({
<style lang="scss" scoped>
.target-box {
margin-top: calc($padding * 2);
margin-top: $padding;
.target-grade {
width: 180px;
height: 60px;