mirror of
https://gitee.com/ulthon/layui-ul.git
synced 2026-07-08 21:22:48 +08:00
基本完成生成命令
This commit is contained in:
@@ -82,7 +82,7 @@ class Component extends Command
|
|||||||
$index_scss = '';
|
$index_scss = '';
|
||||||
|
|
||||||
foreach ($dir_tpl as $dir_name) {
|
foreach ($dir_tpl as $dir_name) {
|
||||||
if ($dir_name == '.' || $dir_name == '..') {
|
if ($dir_name == '.' || $dir_name == '..' || $dir_name == '_index.scss') {
|
||||||
continue;
|
continue;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -94,10 +94,10 @@ class Component extends Command
|
|||||||
continue;
|
continue;
|
||||||
}
|
}
|
||||||
|
|
||||||
$index_scss .= "@import './{$dir_name}/{$component_name}/index';";
|
$index_scss .= "@import './{$dir_name}/{$component_name}/index';\n";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
file_put_contents(App::getRootPath() . '/source/components/_index.scss');
|
file_put_contents(App::getRootPath() . '/source/components/_index.scss', $index_scss);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -421,77 +421,3 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</fieldset>
|
</fieldset>
|
||||||
<fieldset class="layui-elem-field layui-field-title">
|
|
||||||
<legend>站点导航（卡片）</legend>
|
|
||||||
<div class="layui-field-box">
|
|
||||||
<div class="ul-site-group ul-bg-gray ul-padding-md" data-repeat="2">
|
|
||||||
<div class="ul-site-group-header">
|
|
||||||
新上线
|
|
||||||
</div>
|
|
||||||
<div class="ul-site-list">
|
|
||||||
|
|
||||||
<div class="ul-site-item card" data-repeat="5">
|
|
||||||
<div class="ul-site-item-logo" style="background-image: url('/static/images/view.jpg')">
|
|
||||||
</div>
|
|
||||||
<div class="ul-site-item-info">
|
|
||||||
<div class="ul-site-item-title">
|
|
||||||
layui奥宏样式库
|
|
||||||
</div>
|
|
||||||
<div class="ul-site-item-desc">
|
|
||||||
纯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>
|
|
||||||
<div class="ul-site-item-info">
|
|
||||||
<div class="ul-site-item-title">
|
|
||||||
layui奥宏样式库
|
|
||||||
</div>
|
|
||||||
<div class="ul-site-item-desc">
|
|
||||||
纯CSS的组件案例样式大全纯CSS的组件案例样式大全纯CSS的组件案例样式大全
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
<fieldset class="layui-elem-field layui-field-title">
|
|
||||||
<legend>站点导航（卡片修复高度）</legend>
|
|
||||||
<div class="layui-field-box">
|
|
||||||
<div class="ul-site-group ul-bg-gray ul-padding-md" data-repeat="2">
|
|
||||||
<div class="ul-site-group-header">
|
|
||||||
新上线
|
|
||||||
</div>
|
|
||||||
<div class="ul-site-list">
|
|
||||||
|
|
||||||
<div class="ul-site-item card same-height" data-repeat="5">
|
|
||||||
<div class="ul-site-item-logo" style="background-image: url('/static/images/view.jpg')">
|
|
||||||
</div>
|
|
||||||
<div class="ul-site-item-info">
|
|
||||||
<div class="ul-site-item-title">
|
|
||||||
layui奥宏样式库
|
|
||||||
</div>
|
|
||||||
<div class="ul-site-item-desc">
|
|
||||||
纯CSS的组件案例样式大全
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="ul-site-item card same-height">
|
|
||||||
<div class="ul-site-item-logo" style="background-image: url('/static/images/view.jpg')">
|
|
||||||
</div>
|
|
||||||
<div class="ul-site-item-info">
|
|
||||||
<div class="ul-site-item-title">
|
|
||||||
layui奥宏样式库
|
|
||||||
</div>
|
|
||||||
<div class="ul-site-item-desc">
|
|
||||||
纯CSS的组件案例样式大全纯CSS的组件案例样式大全纯CSS的组件案例样式大全
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
@@ -1,2 +1,3 @@
|
|||||||
@import './list/ul-music-list/index';
|
@import './list/ul-music-list/index';
|
||||||
@import './list/ul-order-list-simple-card/index';
|
@import './list/ul-order-list-simple-card/index';
|
||||||
|
@import './list/ul-site-group/index';
|
||||||
|
|||||||
4
source/components/list/ul-site-group/_index.env
Normal file
4
source/components/list/ul-site-group/_index.env
Normal file
@@ -0,0 +1,4 @@
|
|||||||
|
title=站点导航
|
||||||
|
padding=1
|
||||||
|
margin=0
|
||||||
|
gray=1
|
||||||
93
source/components/list/ul-site-group/_index.html
Normal file
93
source/components/list/ul-site-group/_index.html
Normal file
@@ -0,0 +1,93 @@
|
|||||||
|
<div class="ul-site-group">
|
||||||
|
<div class="ul-site-group-header">
|
||||||
|
基础样式
|
||||||
|
</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>
|
||||||
|
<div class="ul-site-item-info">
|
||||||
|
<div class="ul-site-item-title">
|
||||||
|
layui奥宏样式库
|
||||||
|
</div>
|
||||||
|
<div class="ul-site-item-desc">
|
||||||
|
纯CSS的组件案例样式大全
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="ul-site-item">
|
||||||
|
<div class="ul-site-item-logo" style="background-image: url('/static/images/view.jpg')">
|
||||||
|
</div>
|
||||||
|
<div class="ul-site-item-info">
|
||||||
|
<div class="ul-site-item-title">
|
||||||
|
高度修复
|
||||||
|
</div>
|
||||||
|
<div class="ul-site-item-desc">
|
||||||
|
纯CSS的组件案例样式大全纯CSS的组件案例样式大全纯CSS的组件案例样式大全
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="ul-site-group">
|
||||||
|
<div class="ul-site-group-header">
|
||||||
|
卡片
|
||||||
|
</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>
|
||||||
|
<div class="ul-site-item-info">
|
||||||
|
<div class="ul-site-item-title">
|
||||||
|
layui奥宏样式库
|
||||||
|
</div>
|
||||||
|
<div class="ul-site-item-desc">
|
||||||
|
纯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>
|
||||||
|
<div class="ul-site-item-info">
|
||||||
|
<div class="ul-site-item-title">
|
||||||
|
高度修复
|
||||||
|
</div>
|
||||||
|
<div class="ul-site-item-desc">
|
||||||
|
纯CSS的组件案例样式大全纯CSS的组件案例样式大全纯CSS的组件案例样式大全
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="ul-site-group">
|
||||||
|
<div class="ul-site-group-header">
|
||||||
|
卡片(修复高度)
|
||||||
|
</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>
|
||||||
|
<div class="ul-site-item-info">
|
||||||
|
<div class="ul-site-item-title">
|
||||||
|
layui奥宏样式库
|
||||||
|
</div>
|
||||||
|
<div class="ul-site-item-desc">
|
||||||
|
纯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>
|
||||||
|
<div class="ul-site-item-info">
|
||||||
|
<div class="ul-site-item-title">
|
||||||
|
高度修复
|
||||||
|
</div>
|
||||||
|
<div class="ul-site-item-desc">
|
||||||
|
纯CSS的组件案例样式大全纯CSS的组件案例样式大全纯CSS的组件案例样式大全
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
0
source/components/list/ul-site-group/_index.md
Normal file
0
source/components/list/ul-site-group/_index.md
Normal file
77
source/components/list/ul-site-group/_index.scss
Normal file
77
source/components/list/ul-site-group/_index.scss
Normal file
@@ -0,0 +1,77 @@
|
|||||||
|
.ul-site-group {
|
||||||
|
margin-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ul-site-group-header {
|
||||||
|
font-size : 16px;
|
||||||
|
color : #333;
|
||||||
|
padding-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ul-site-list {
|
||||||
|
display : flex;
|
||||||
|
align-items : flex-start;
|
||||||
|
justify-content: flex-start;
|
||||||
|
flex-wrap : wrap;
|
||||||
|
margin-top : 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ul-site-item {
|
||||||
|
width : 20%;
|
||||||
|
margin-right : 5%;
|
||||||
|
display : flex;
|
||||||
|
align-items : flex-start;
|
||||||
|
justify-content: flex-start;
|
||||||
|
margin-bottom : 15px;
|
||||||
|
|
||||||
|
|
||||||
|
&.card {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius : 5px;
|
||||||
|
padding : 10px;
|
||||||
|
margin-right : 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.same-height {
|
||||||
|
align-self: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ul-site-item-logo {
|
||||||
|
width : 34px;
|
||||||
|
height : 34px;
|
||||||
|
margin-right : 8px;
|
||||||
|
margin-top : 4px;
|
||||||
|
background-size : cover;
|
||||||
|
background-position: center;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.ul-site-item-info {
|
||||||
|
width: calc(100% - 34px);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.ul-site-item-title {
|
||||||
|
color : #4662d9;
|
||||||
|
font-weight : bold;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ul-site-item-desc {
|
||||||
|
font-size: 12px;
|
||||||
|
color : #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width:450px) {
|
||||||
|
.ul-site-item {
|
||||||
|
width: 49%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ul-site-item-desc {
|
||||||
|
font-size : 11px;
|
||||||
|
margin-top: 3px;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -1,77 +0,0 @@
|
|||||||
.ul-site-group {
|
|
||||||
margin-bottom: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ul-site-group-header {
|
|
||||||
font-size : 16px;
|
|
||||||
color : #333;
|
|
||||||
padding-bottom: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ul-site-list {
|
|
||||||
display : flex;
|
|
||||||
align-items : flex-start;
|
|
||||||
justify-content: flex-start;
|
|
||||||
flex-wrap : wrap;
|
|
||||||
margin-top : 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ul-site-item {
|
|
||||||
width : 20%;
|
|
||||||
margin-right : 5%;
|
|
||||||
display : flex;
|
|
||||||
align-items : flex-start;
|
|
||||||
justify-content: flex-start;
|
|
||||||
margin-bottom : 15px;
|
|
||||||
|
|
||||||
|
|
||||||
&.card {
|
|
||||||
background-color: #fff;
|
|
||||||
border-radius : 5px;
|
|
||||||
padding : 10px;
|
|
||||||
margin-right : 15px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.same-height {
|
|
||||||
align-self: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ul-site-item-logo {
|
|
||||||
width : 34px;
|
|
||||||
height : 34px;
|
|
||||||
margin-right : 8px;
|
|
||||||
margin-top : 4px;
|
|
||||||
background-size : cover;
|
|
||||||
background-position: center;
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.ul-site-item-info {
|
|
||||||
width: calc(100% - 34px);
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.ul-site-item-title {
|
|
||||||
color : #4662d9;
|
|
||||||
font-weight : bold;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ul-site-item-desc {
|
|
||||||
font-size: 12px;
|
|
||||||
color : #666;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width:450px) {
|
|
||||||
.ul-site-item {
|
|
||||||
width: 49%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ul-site-item-desc {
|
|
||||||
font-size : 11px;
|
|
||||||
margin-top: 3px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user