From 807ea5f4f9c209f529a4100157c5d1af5c050ad9 Mon Sep 17 00:00:00 2001 From: augushong Date: Mon, 28 Mar 2022 09:57:48 +0800 Subject: [PATCH] =?UTF-8?q?=E5=BC=80=E5=A7=8B=E4=BD=BF=E7=94=A8scss?= =?UTF-8?q?=E9=87=8D=E6=9E=84=E9=A1=B9=E7=9B=AE;?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 4 +- source/scss/_common.scss | 51 +++++++++ source/scss/layui-ul.scss | 144 ++------------------------ source/scss/list/_index.scss | 1 + source/scss/list/_ul-avatar-list.scss | 49 +++++++++ source/scss/nav/_index.scss | 1 + source/scss/nav/_ul-nav-tree.scss | 30 ++++++ 7 files changed, 142 insertions(+), 138 deletions(-) create mode 100644 source/scss/_common.scss create mode 100644 source/scss/list/_index.scss create mode 100644 source/scss/list/_ul-avatar-list.scss create mode 100644 source/scss/nav/_index.scss create mode 100644 source/scss/nav/_ul-nav-tree.scss diff --git a/.gitignore b/.gitignore index b43f78f..3ba500c 100644 --- a/.gitignore +++ b/.gitignore @@ -7,4 +7,6 @@ ul.db composer.lock public/upload/* /public/cdn/layui-ul.css -/public/cdn/layui-ul.css.map \ No newline at end of file +/public/cdn/layui-ul.css.map +/public/cdn/layui-ul.min.css +/public/cdn/layui-ul.min.css.map \ No newline at end of file diff --git a/source/scss/_common.scss b/source/scss/_common.scss new file mode 100644 index 0000000..a919ea7 --- /dev/null +++ b/source/scss/_common.scss @@ -0,0 +1,51 @@ +/* 通用类开始 */ +.ul-padding-md { + padding: 15px; +} + +.ul-section { + margin-bottom: 15px; +} + +.ul-icon-exit { + display : inline-block; + width : 16px; + height : 16px; + background-image : url("img/exit.png"); + background-size : cover; + background-position: center; +} + +.ul-border-right { + border-right: 1px solid #bbb; +} + +.ul-bg-white { + background-color: #fff; +} + +.ul-bg-gray { + background-color: #eee; +} + +.ul-bg-black { + + background-color: #393D49; +} + +.ul-color-main { + color: #6cf !important; +} + +.ul-common-flex-list { + display : flex; + flex-wrap: wrap; +} + +.ul-common-flex-sb { + display : flex; + align-items : center; + justify-content: space-between; +} + +/* 通用类结束 */ \ No newline at end of file diff --git a/source/scss/layui-ul.scss b/source/scss/layui-ul.scss index 1a66af9..7a9437d 100644 --- a/source/scss/layui-ul.scss +++ b/source/scss/layui-ul.scss @@ -1,138 +1,7 @@ -/* 列表开始 */ -.ul-nav-tree {} +@import './common'; +@import './list/index'; +@import './nav/index'; -.ul-nav-tree-group-title { - font-size : 16px; - font-weight: 600; - line-height: 2; -} - -.ul-nav-tree-item { - display : flex; - align-items: baseline; - cursor : pointer; - padding : 5px; - white-space: nowrap; -} - -.ul-nav-tree-item.current .ul-nav-tree-item-title { - color: #6cf; -} - -.ul-nav-tree-item-title { - font-size: 15px; -} - -.ul-nav-tree-item-desc { - font-size : 14px; - color : #999; - margin-left: 15px; -} - -/* 列表结束 */ - -/* 通用类开始 */ -.ul-padding-md { - padding: 15px; -} - -.ul-section { - margin-bottom: 15px; -} - -.ul-icon-exit { - display : inline-block; - width : 16px; - height : 16px; - background-image : url("img/exit.png"); - background-size : cover; - background-position: center; -} - -.ul-border-right { - border-right: 1px solid #bbb; -} - -.ul-bg-white { - background-color: #fff; -} - -.ul-bg-gray { - background-color: #eee; -} - -.ul-bg-black { - - background-color: #393D49; -} - -.ul-color-main { - color: #6cf !important; -} - -.ul-common-flex-list { - display : flex; - flex-wrap: wrap; -} - -.ul-common-flex-sb { - display : flex; - align-items : center; - justify-content: space-between; -} - -/* 通用类结束 */ - -/* 用户头像开始 */ - -.ul-avatar-list {} - -.ul-avatar-list-item { - display : flex; - align-items : center; - justify-content : space-between; - padding : 8px; - background-color: #ddd; -} - -.ul-avatar-list-item.current { - background-color: #bbb; -} - -.ul-avatar-list-item-img { - height : 48px; - width : 48px; - background-image : url("/static/images/avatar.png"); - background-size : cover; - background-position: center; - border-radius : 3px; - background-color : #fff; -} - -.ul-avatar-list-item-info { - margin-left: 10px; - position : relative; - width : calc(100% - 48px - 10px); -} - -.ul-avatar-list-item-time { - position: absolute; - right : 0; - top : 0; - color : #999; -} - -.ul-avatar-list-item-tips { - color : #999; - font-size : 14px; - display : inline-block; - white-space : nowrap; - width : 100%; - overflow : hidden; - text-overflow: ellipsis; -} - -/* 头像结束 */ /* 头部开始 */ @@ -1481,11 +1350,12 @@ body .layui-quote-gray { } @media screen and (max-width:450px) { - .ul-site-item{ + .ul-site-item { width: 49%; } - .ul-site-item-desc{ - font-size: 11px; + + .ul-site-item-desc { + font-size : 11px; margin-top: 3px; } } diff --git a/source/scss/list/_index.scss b/source/scss/list/_index.scss new file mode 100644 index 0000000..3a8e851 --- /dev/null +++ b/source/scss/list/_index.scss @@ -0,0 +1 @@ +@import './ul-avatar-list' \ No newline at end of file diff --git a/source/scss/list/_ul-avatar-list.scss b/source/scss/list/_ul-avatar-list.scss new file mode 100644 index 0000000..f546c5c --- /dev/null +++ b/source/scss/list/_ul-avatar-list.scss @@ -0,0 +1,49 @@ + +/* 用户头像开始 */ + +.ul-avatar-list {} + +.ul-avatar-list-item { + display : flex; + align-items : center; + justify-content : space-between; + padding : 8px; + background-color: #ddd; +} + +.ul-avatar-list-item.current { + background-color: #bbb; +} + +.ul-avatar-list-item-img { + height : 48px; + width : 48px; + background-image : url("/static/images/avatar.png"); + background-size : cover; + background-position: center; + border-radius : 3px; + background-color : #fff; +} + +.ul-avatar-list-item-info { + margin-left: 10px; + position : relative; + width : calc(100% - 48px - 10px); +} + +.ul-avatar-list-item-time { + position: absolute; + right : 0; + top : 0; + color : #999; +} + +.ul-avatar-list-item-tips { + color : #999; + font-size : 14px; + display : inline-block; + white-space : nowrap; + width : 100%; + overflow : hidden; + text-overflow: ellipsis; +} diff --git a/source/scss/nav/_index.scss b/source/scss/nav/_index.scss new file mode 100644 index 0000000..391f275 --- /dev/null +++ b/source/scss/nav/_index.scss @@ -0,0 +1 @@ +@import './ul-nav-tree' \ No newline at end of file diff --git a/source/scss/nav/_ul-nav-tree.scss b/source/scss/nav/_ul-nav-tree.scss new file mode 100644 index 0000000..41f5e76 --- /dev/null +++ b/source/scss/nav/_ul-nav-tree.scss @@ -0,0 +1,30 @@ +/* 附带说明垂直导航 */ +.ul-nav-tree {} + +.ul-nav-tree-group-title { + font-size : 16px; + font-weight: 600; + line-height: 2; +} + +.ul-nav-tree-item { + display : flex; + align-items: baseline; + cursor : pointer; + padding : 5px; + white-space: nowrap; +} + +.ul-nav-tree-item.current .ul-nav-tree-item-title { + color: #6cf; +} + +.ul-nav-tree-item-title { + font-size: 15px; +} + +.ul-nav-tree-item-desc { + font-size : 14px; + color : #999; + margin-left: 15px; +}