ulthon/layui-ul
1
0
Fork 0
mirror of https://gitee.com/ulthon/layui-ul.git synced 2026-07-01 10:32:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

完善站点组件的手机端样式

Browse Source
This commit is contained in:
augushong
2022-11-01 10:34:19 +08:00
parent e4980cbe46
commit bef8467c76
5 changed files with 71 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
source/components/list/ul-order-list-simple-card/_index.html
View File

@@ -7,7 +7,7 @@
</div>
<div class="item-body">
<div class="item-body-item">
<div class="item-image" style="background-image: url('/static/images/view.jpg');">
<div class="item-image ul-demo-img-bg">
</div>
<div class="item-info">

22
source/components/list/ul-site-group/_index.html
View File

@@ -4,7 +4,7 @@
</div>
<div class="ul-site-list">
<div class="ul-site-item" v-for="i in 5">
<div class="ul-site-item-logo" style="background-image: url('/static/images/view.jpg')">
<div class="ul-site-item-logo ul-demo-img-bg">
</div>
<div class="ul-site-item-info">
<div class="ul-site-item-title">
@@ -16,7 +16,7 @@
</div>
</div>
<div class="ul-site-item">
<div class="ul-site-item-logo" style="background-image: url('/static/images/view.jpg')">
<div class="ul-site-item-logo ul-demo-img-bg">
</div>
<div class="ul-site-item-info">
<div class="ul-site-item-title">
@@ -35,19 +35,19 @@
</div>
<div class="ul-site-list">
<div class="ul-site-item card" v-for="i in 5">
<div class="ul-site-item-logo" style="background-image: url('/static/images/view.jpg')">
<div class="ul-site-item-logo ul-demo-img-bg">
</div>
<div class="ul-site-item-info">
<div class="ul-site-item-title">
layui奥宏样式库
layui奥宏样式
</div>
<div class="ul-site-item-desc">
纯CSS的组件案例样式大全
纯CSS的组件
</div>
</div>
</div>
<div class="ul-site-item card">
<div class="ul-site-item-logo" style="background-image: url('/static/images/view.jpg')">
<div class="ul-site-item-logo ul-demo-img-bg">
</div>
<div class="ul-site-item-info">
<div class="ul-site-item-title">
@@ -66,19 +66,19 @@
</div>
<div class="ul-site-list">
<div class="ul-site-item card same-height" v-for="i in 5">
<div class="ul-site-item-logo" style="background-image: url('/static/images/view.jpg')">
<div class="ul-site-item-logo ul-demo-img-bg">
</div>
<div class="ul-site-item-info">
<div class="ul-site-item-title">
layui奥宏样式库
layui奥宏样式
</div>
<div class="ul-site-item-desc">
纯CSS的组件案例样式大全
纯CSS的组件
</div>
</div>
</div>
<div class="ul-site-item card small-height">
<div class="ul-site-item-logo" style="background-image: url('/static/images/view.jpg')">
<div class="ul-site-item card same-height">
<div class="ul-site-item-logo ul-demo-img-bg">
</div>
<div class="ul-site-item-info">
<div class="ul-site-item-title">

24
source/components/list/ul-site-group/_index.scss
View File

@@ -66,12 +66,24 @@
}
@media screen and (max-width:450px) {
.ul-site-item {
width: 49%;
}
.ul-site-item-desc {
font-size : 11px;
margin-top: 3px;
.ul-site-list {
display : flex;
align-items : flex-start;
justify-content: space-between;
.ul-site-item {
width : calc(50% - 10px);
margin-right: 0;
&.card {
width: calc(50% - 30px);
}
}
.ul-site-item-desc {
font-size : 11px;
margin-top: 3px;
}
}
}

7
source/scss/_common.scss
View File

@@ -78,4 +78,11 @@
background-image : url("img/view.jpg");
background-size : cover;
background-position: center;
}
.ul-demo-mobile-page {
width : 360px;
height : 660px;
border : 0;
box-shadow: 0 0 3px #bbb;
}