mirror of
https://gitee.com/ulthon/layui-ul.git
synced 2026-07-01 10:32:49 +08:00
feat: 迁移经典头部
This commit is contained in:
@@ -22,6 +22,7 @@
|
||||
@import './element/ul-loading-pos/index';
|
||||
@import './group_panel/ul-group-list/index';
|
||||
@import './header/ul-header/index';
|
||||
@import './header/ul-header-a/index';
|
||||
@import './header/ul-header-shape/index';
|
||||
@import './header/ul-shop-header/index';
|
||||
@import './list/ul-ad-list/index';
|
||||
|
||||
6
source/components/header/ul-header-a/_index.env
Normal file
6
source/components/header/ul-header-a/_index.env
Normal file
@@ -0,0 +1,6 @@
|
||||
title=经典头部
|
||||
padding=0
|
||||
margin=0
|
||||
gray=0
|
||||
mobile=0
|
||||
inner_margin=0
|
||||
111
source/components/header/ul-header-a/_index.html
Normal file
111
source/components/header/ul-header-a/_index.html
Normal file
@@ -0,0 +1,111 @@
|
||||
<div class="ul-section">
|
||||
<div class="ul-header-a">
|
||||
<div class="ul-header-a-main">
|
||||
|
||||
<div class="ul-header-a-left">
|
||||
Hi:欢迎来到{:get_system_config('site_name')}
|
||||
</div>
|
||||
<div class="ul-header-a-right">
|
||||
<div
|
||||
class="ul-header-a-nav-item"
|
||||
style="min-width: 100px;"
|
||||
>
|
||||
<div
|
||||
class="ul-header-a-img ul-demo-img-bg"
|
||||
>
|
||||
|
||||
</div>
|
||||
<span>奥宏科技</span>
|
||||
<div
|
||||
class="ul-header-a-nav-plus"
|
||||
style="left: 0;width: 100%"
|
||||
>
|
||||
<div
|
||||
class="ul-nav-min"
|
||||
style="width: 100%"
|
||||
>
|
||||
<div class="ul-nav-min-item">
|
||||
个人中心
|
||||
</div>
|
||||
<div class="ul-nav-min-item">
|
||||
安全中心
|
||||
</div>
|
||||
<div class="ul-nav-min-item">
|
||||
数据中心
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ul-header-a-nav-item">
|
||||
充值
|
||||
</div>
|
||||
<div class="ul-header-a-nav-item">
|
||||
提现
|
||||
</div>
|
||||
<div class="ul-header-a-nav-item">
|
||||
退出
|
||||
</div>
|
||||
<div class="ul-header-a-nav-item">
|
||||
<div class="layui-btn layui-btn-xs">在线客服</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ul-section">
|
||||
<div class="ul-header-a">
|
||||
<div
|
||||
class="ul-header-a-main"
|
||||
style="max-width: 600px;"
|
||||
>
|
||||
|
||||
<div class="ul-header-a-left">
|
||||
Hi:欢迎来到{:get_system_config('site_name')}
|
||||
</div>
|
||||
<div class="ul-header-a-right">
|
||||
<div
|
||||
class="ul-header-a-nav-item"
|
||||
style="min-width: 100px;"
|
||||
>
|
||||
<div
|
||||
class="ul-header-a-img ul-demo-img-bg"
|
||||
>
|
||||
|
||||
</div>
|
||||
<span>奥宏科技</span>
|
||||
<div
|
||||
class="ul-header-a-nav-plus"
|
||||
style="left: 0;width: 100%"
|
||||
>
|
||||
<div
|
||||
class="ul-nav-min"
|
||||
style="width: 100%"
|
||||
>
|
||||
<div class="ul-nav-min-item">
|
||||
个人中心
|
||||
</div>
|
||||
<div class="ul-nav-min-item">
|
||||
安全中心
|
||||
</div>
|
||||
<div class="ul-nav-min-item">
|
||||
数据中心
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ul-header-a-nav-item">
|
||||
充值
|
||||
</div>
|
||||
<div class="ul-header-a-nav-item">
|
||||
提现
|
||||
</div>
|
||||
<div class="ul-header-a-nav-item">
|
||||
退出
|
||||
</div>
|
||||
<div class="ul-header-a-nav-item">
|
||||
<div class="layui-btn layui-btn-xs">在线客服</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
0
source/components/header/ul-header-a/_index.md
Normal file
0
source/components/header/ul-header-a/_index.md
Normal file
5
source/components/header/ul-header-a/_index.php
Normal file
5
source/components/header/ul-header-a/_index.php
Normal file
@@ -0,0 +1,5 @@
|
||||
<?php
|
||||
|
||||
return [
|
||||
|
||||
];
|
||||
56
source/components/header/ul-header-a/_index.scss
Normal file
56
source/components/header/ul-header-a/_index.scss
Normal file
@@ -0,0 +1,56 @@
|
||||
|
||||
.ul-header-a {
|
||||
background-color: #f8f8f8;
|
||||
border-bottom : 1px solid #e8e8e8;
|
||||
color : #666;
|
||||
}
|
||||
|
||||
.ul-header-a-main {
|
||||
display : flex;
|
||||
align-items : center;
|
||||
justify-content: space-between;
|
||||
/* border-width: 1px 0;
|
||||
border-color : #bbb;
|
||||
border-style : solid; */
|
||||
padding : 5px;
|
||||
margin : 0 auto;
|
||||
}
|
||||
|
||||
.ul-header-a-nav-item {
|
||||
margin-right: 15px;
|
||||
position : relative;
|
||||
display : flex;
|
||||
align-items : center;
|
||||
cursor : pointer;
|
||||
}
|
||||
|
||||
.ul-header-a-nav-item:hover .ul-header-a-nav-plus {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.ul-header-a-img {
|
||||
height : 24px;
|
||||
width : 24px;
|
||||
background-size : cover;
|
||||
background-position: center;
|
||||
margin-right : 10px;
|
||||
}
|
||||
|
||||
.ul-header-a-right {
|
||||
display : flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.ul-header-a-nav-plus {
|
||||
position : absolute;
|
||||
top : 100%;
|
||||
left : 50%;
|
||||
display : none;
|
||||
background-color: transparent;
|
||||
z-index : 99999;
|
||||
}
|
||||
|
||||
.ul-header-a-nav-plus>.ul-nav-min {
|
||||
background-color: #fff;
|
||||
margin-top : 15px;
|
||||
}
|
||||
@@ -1,191 +0,0 @@
|
||||
.layui-nav-tree .layui-nav-item a:hover {
|
||||
background-color: #6699CC;
|
||||
}
|
||||
|
||||
.layui-bg-black {
|
||||
background-color: #66CCFF !important;
|
||||
}
|
||||
|
||||
.layui-nav-tree .layui-nav-child dd.layui-this,
|
||||
.layui-nav-tree .layui-nav-child dd.layui-this a,
|
||||
.layui-nav-tree .layui-this,
|
||||
.layui-nav-tree .layui-this > a,
|
||||
.layui-nav-tree .layui-this > a:hover {
|
||||
background-color: #6699CC;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-logo {
|
||||
color: #fff;
|
||||
line-height: 45px;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-header {
|
||||
background-color: #39BDFF;
|
||||
}
|
||||
|
||||
.layui-nav {
|
||||
background-color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-header {
|
||||
height: 45px;
|
||||
}
|
||||
|
||||
.layui-nav .layui-nav-item {
|
||||
line-height: 45px;
|
||||
}
|
||||
|
||||
.layui-nav .layui-nav-item a {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.layui-nav .layui-nav-child a {
|
||||
color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-nav .layui-this::after,
|
||||
.layui-nav-bar,
|
||||
.layui-nav-tree .layui-nav-itemed::after {
|
||||
background-color: #CCFFFF;
|
||||
}
|
||||
|
||||
.layui-tab-brief > .layui-tab-title .layui-this {
|
||||
color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-tab-brief > .layui-tab-more li.layui-this::after,
|
||||
.layui-tab-brief > .layui-tab-title .layui-this::after {
|
||||
border-color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-btn {
|
||||
background-color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-btn-danger {
|
||||
background-color: #FF5722;
|
||||
}
|
||||
|
||||
.layui-btn-primary {
|
||||
background-color: #fff;
|
||||
color: #666;
|
||||
border-color: #d2d2d2;
|
||||
}
|
||||
|
||||
.layui-btn-primary:hover {
|
||||
border-color: #6cf;
|
||||
}
|
||||
|
||||
.layui-btn.layui-btn-disabled {
|
||||
background-color: #FBFBFB;
|
||||
}
|
||||
|
||||
.layui-form-radio > i:hover,
|
||||
.layui-form-radioed > i {
|
||||
color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-form-radio:hover *,
|
||||
.layui-form-radioed,
|
||||
.layui-form-radioed > i {
|
||||
color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-elem-quote {
|
||||
border-color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-laydate td.layui-this {
|
||||
background-color: #66CCFF !important;
|
||||
}
|
||||
|
||||
.layui-form-checkbox[lay-skin=primary]:hover i {
|
||||
border-color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-form-checked[lay-skin=primary] i {
|
||||
border-color: #66CCFF !important;
|
||||
background-color: #66CCFF !important;
|
||||
}
|
||||
|
||||
.layui-form-checked span,
|
||||
.layui-form-checked:hover span {
|
||||
background-color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-form-checked i,
|
||||
.layui-form-checked:hover i {
|
||||
color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-form-select dl dd.layui-this {
|
||||
background-color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-form-label {
|
||||
width: unset;
|
||||
padding: 3px 3px;
|
||||
float: unset;
|
||||
text-align: left;
|
||||
font-weight: 600;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.layui-input-block {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.layui-form-pane .layui-form-label {
|
||||
float: left;
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.layui-nav-tree .layui-nav-item a {
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
}
|
||||
|
||||
.layui-nav-tree {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-side {
|
||||
width: 140px;
|
||||
top: 45px;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-footer {
|
||||
left: 140px;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
}
|
||||
|
||||
.layui-layout-admin .layui-body {
|
||||
top: 45px;
|
||||
}
|
||||
|
||||
.layui-side-scroll {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.layui-body {
|
||||
left: 140px;
|
||||
}
|
||||
|
||||
.layui-nav .layui-nav-child dd.layui-this a,
|
||||
.layui-nav-child dd.layui-this {
|
||||
background-color: #19B3FF;
|
||||
}
|
||||
|
||||
.layui-nav-child {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.layui-nav-tree .layui-nav-bar {
|
||||
background-color: #66CCFF;
|
||||
}
|
||||
|
||||
.layui-form-label .layui-word-aux {
|
||||
font-size: 12px;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -202,61 +202,6 @@
|
||||
color: #6cf;
|
||||
}
|
||||
|
||||
.ul-header-a {
|
||||
background-color: #f8f8f8;
|
||||
border-bottom : 1px solid #e8e8e8;
|
||||
color : #666;
|
||||
}
|
||||
|
||||
.ul-header-a-main {
|
||||
display : flex;
|
||||
align-items : center;
|
||||
justify-content: space-between;
|
||||
/* border-width: 1px 0;
|
||||
border-color : #bbb;
|
||||
border-style : solid; */
|
||||
padding : 5px;
|
||||
margin : 0 auto;
|
||||
}
|
||||
|
||||
.ul-header-a-nav-item {
|
||||
margin-right: 15px;
|
||||
position : relative;
|
||||
display : flex;
|
||||
align-items : center;
|
||||
cursor : pointer;
|
||||
}
|
||||
|
||||
.ul-header-a-nav-item:hover .ul-header-a-nav-plus {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.ul-header-a-img {
|
||||
height : 24px;
|
||||
width : 24px;
|
||||
background-size : cover;
|
||||
background-position: center;
|
||||
margin-right : 10px;
|
||||
}
|
||||
|
||||
.ul-header-a-right {
|
||||
display : flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.ul-header-a-nav-plus {
|
||||
position : absolute;
|
||||
top : 100%;
|
||||
left : 50%;
|
||||
display : none;
|
||||
background-color: transparent;
|
||||
z-index : 99999;
|
||||
}
|
||||
|
||||
.ul-header-a-nav-plus>.ul-nav-min {
|
||||
background-color: #fff;
|
||||
margin-top : 15px;
|
||||
}
|
||||
|
||||
.ul-nav-header-main {
|
||||
display : flex;
|
||||
|
||||
Reference in New Issue
Block a user