diff --git a/README.md b/README.md index f38a41a..ca45406 100644 --- a/README.md +++ b/README.md @@ -31,13 +31,14 @@ ulthon扩展的layui样式库. ### 部分组件展示 -[](https://imgtu.com/i/gmyXDS) -[](https://imgtu.com/i/gmyINd) -[](https://imgtu.com/i/gmyH3t) + + + + ### 收藏组件 -[](https://imgtu.com/i/gm6rqS) + ### 开发说明 diff --git a/demo/pc/card.html b/demo/pc/card.html index 61ce22f..6cae640 100644 --- a/demo/pc/card.html +++ b/demo/pc/card.html @@ -398,4 +398,86 @@ + + +
\ No newline at end of file diff --git a/public/static/images/demo/ul-card-file.png b/public/static/images/demo/ul-card-file.png new file mode 100644 index 0000000..00df5c0 Binary files /dev/null and b/public/static/images/demo/ul-card-file.png differ diff --git a/source/scss/_common.scss b/source/scss/_common.scss index 368846a..868b207 100644 --- a/source/scss/_common.scss +++ b/source/scss/_common.scss @@ -7,6 +7,12 @@ margin-bottom: 15px; } +.ul-inline-block { + display : inline-block !important; + margin-right : 15px; + margin-bottom: 15px; +} + .ul-icon-exit { display : inline-block; width : 16px; diff --git a/source/scss/card/_index.scss b/source/scss/card/_index.scss index 42dbc5a..a7d9a5e 100644 --- a/source/scss/card/_index.scss +++ b/source/scss/card/_index.scss @@ -3,4 +3,5 @@ @import './ul-info-card'; @import './ul-card-data-simple'; @import './ul-card-data-simple-bg-black'; -@import './ul-data-card'; \ No newline at end of file +@import './ul-data-card'; +@import './ul-card-file'; \ No newline at end of file diff --git a/source/scss/card/_ul-card-file.scss b/source/scss/card/_ul-card-file.scss new file mode 100644 index 0000000..8d389c3 --- /dev/null +++ b/source/scss/card/_ul-card-file.scss @@ -0,0 +1,95 @@ +.ul-card-file { + background-color: #fff; + display : block; + width : 240px; + color : #000 !important; + cursor : pointer; + + box-shadow: 0 0 2px #bbb; + + .main { + display : flex; + align-items : flex-start; + justify-content: space-between; + padding : 15px 15px 5px 15px; + height : 60px; + + .info { + + .name { + overflow : hidden; + text-overflow : ellipsis; + display : -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + width : 160px; + } + + .desc { + color : #bbb; + font-weight: normal; + font-size : 12px; + margin-top : 5px; + } + } + + + .icon { + font-size: 40px; + color : #999; + + &.file { + color: #bbb; + } + + &.excel { + color: rgb(32, 115, 70); + } + + &.zip { + color: rgb(139, 87, 42); + } + + &.word { + color: rgb(44, 86, 154); + } + + &.powerpoint { + color: rgb(242, 97, 63); + } + + &.pdf { + color: rgb(250, 81, 81); + } + + &.video { + color: #7c8eee; + } + + &.audio { + color: #f16c00; + } + + &.image { + color: #f6ad00; + } + + &.text { + color: #8289ad; + } + + &.link { + color: #4876f9; + } + } + } + + .footer { + display : flex; + justify-content: space-between; + font-size : 12px; + color : #999; + border-top : 1px solid #eee; + padding : 5px 15px 5px 15px; + } +} \ No newline at end of file diff --git a/view/index/index/index.html b/view/index/index/index.html index e901431..ff1deee 100644 --- a/view/index/index/index.html +++ b/view/index/index/index.html @@ -124,9 +124,6 @@