提交 6eb4c9b7 编写于 作者: Skyeye云's avatar Skyeye云

样式更新

上级 96cd71cd
此差异已折叠。
此差异已折叠。
/**
@Name: winui
@Author: Leo
@Site: www.leo96.com
*/
/*全局*/
......@@ -222,177 +218,181 @@
overflow: auto;
}
.color-choose > div {
float: left;
margin-right: 2px;
margin-bottom: 3px;
width: 46px;
height: 46px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
.color-choose > div {
float: left;
margin-right: 2px;
margin-bottom: 3px;
width: 46px;
height: 46px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.color-choose > div:hover {
border: 2px solid #000;
}
.color-choose > div:hover {
border: 2px solid #000;
}
.color-choose .theme-color-11 {
background-color: #FFB900;
}
.color-choose .theme-color-11 {
background-color: #FFB900;
}
.color-choose .theme-color-12 {
background-color: #FF8C00;
}
.color-choose .theme-color-12 {
background-color: #FF8C00;
}
.color-choose .theme-color-13 {
background-color: #F7630C;
}
.color-choose .theme-color-13 {
background-color: #F7630C;
}
.color-choose .theme-color-14 {
background-color: #CA5010;
}
.color-choose .theme-color-14 {
background-color: #CA5010;
}
.color-choose .theme-color-15 {
background-color: #DA3B01;
}
.color-choose .theme-color-15 {
background-color: #DA3B01;
}
.color-choose .theme-color-16 {
background-color: #EF6950;
}
.color-choose .theme-color-16 {
background-color: #EF6950;
}
.color-choose .theme-color-17 {
background-color: #D13438;
}
.color-choose .theme-color-17 {
background-color: #D13438;
}
.color-choose .theme-color-18 {
background-color: #D13438;
}
/*第二排*/
.color-choose .theme-color-21 {
background-color: #E74856;
}
.color-choose .theme-color-18 {
background-color: #D13438;
}
/*第二排*/
.color-choose .theme-color-21 {
background-color: #E74856;
}
.color-choose .theme-color-22 {
background-color: #E81123;
}
.color-choose .theme-color-22 {
background-color: #E81123;
}
.color-choose .theme-color-23 {
background-color: #EA005E;
}
.color-choose .theme-color-23 {
background-color: #EA005E;
}
.color-choose .theme-color-24 {
background-color: #C30052;
}
.color-choose .theme-color-24 {
background-color: #C30052;
}
.color-choose .theme-color-25 {
background-color: #E3008C;
}
.color-choose .theme-color-25 {
background-color: #E3008C;
}
.color-choose .theme-color-26 {
background-color: #BF0077;
}
.color-choose .theme-color-26 {
background-color: #BF0077;
}
.color-choose .theme-color-27 {
background-color: #C239B3;
}
.color-choose .theme-color-27 {
background-color: #C239B3;
}
.color-choose .theme-color-28 {
background-color: #9A0089;
}
/*第三排*/
.color-choose .theme-color-31 {
background-color: #0078D7;
}
.color-choose .theme-color-28 {
background-color: #9A0089;
}
/*第三排*/
.color-choose .theme-color-31 {
background-color: #0078D7;
}
.color-choose .theme-color-32 {
background-color: #0063B1;
}
.color-choose .theme-color-32 {
background-color: #0063B1;
}
.color-choose .theme-color-33 {
background-color: #8E8CD8;
}
.color-choose .theme-color-33 {
background-color: #8E8CD8;
}
.color-choose .theme-color-34 {
background-color: #6B69D6;
}
.color-choose .theme-color-34 {
background-color: #6B69D6;
}
.color-choose .theme-color-35 {
background-color: #8764B8;
}
.color-choose .theme-color-35 {
background-color: #8764B8;
}
.color-choose .theme-color-36 {
background-color: #744DA9;
}
.color-choose .theme-color-36 {
background-color: #744DA9;
}
.color-choose .theme-color-37 {
background-color: #B146C2;
}
.color-choose .theme-color-37 {
background-color: #B146C2;
}
.color-choose .theme-color-38 {
background-color: #881798;
}
/*第四排*/
.color-choose .theme-color-41 {
background-color: #0099BC;
}
.color-choose .theme-color-38 {
background-color: #881798;
}
/*第四排*/
.color-choose .theme-color-41 {
background-color: #0099BC;
}
.color-choose .theme-color-42 {
background-color: #2D7D9A;
}
.color-choose .theme-color-42 {
background-color: #2D7D9A;
}
.color-choose .theme-color-43 {
background-color: #00B7C3;
}
.color-choose .theme-color-43 {
background-color: #00B7C3;
}
.color-choose .theme-color-44 {
background-color: #038387;
}
.color-choose .theme-color-44 {
background-color: #038387;
}
.color-choose .theme-color-45 {
background-color: #00B294;
}
.color-choose .theme-color-45 {
background-color: #00B294;
}
.color-choose .theme-color-46 {
background-color: #018574;
}
.color-choose .theme-color-46 {
background-color: #018574;
}
.color-choose .theme-color-47 {
background-color: #00CC6A;
}
.color-choose .theme-color-47 {
background-color: #00CC6A;
}
.color-choose .theme-color-48 {
background-color: #00CC6A;
}
/*第五排*/
.color-choose .theme-color-51 {
background-color: #7A7574;
}
.color-choose .theme-color-48 {
background-color: #00CC6A;
}
/*第五排*/
.color-choose .theme-color-51 {
background-color: #7A7574;
}
.color-choose .theme-color-52 {
background-color: #5D5A58;
}
.color-choose .theme-color-52 {
background-color: #5D5A58;
}
.color-choose .theme-color-53 {
background-color: #68768A;
}
.color-choose .theme-color-53 {
background-color: #68768A;
}
.color-choose .theme-color-54 {
background-color: #515C6B;
}
.color-choose .theme-color-54 {
background-color: #515C6B;
}
.color-choose .theme-color-55 {
background-color: #567C73;
}
.color-choose .theme-color-55 {
background-color: #567C73;
}
.color-choose .theme-color-56 {
background-color: #486860;
}
.color-choose .theme-color-56 {
background-color: #486860;
}
.color-choose .theme-color-57 {
background-color: #498205;
}
.color-choose .theme-color-57 {
background-color: #498205;
}
.color-choose .theme-color-58 {
background-color: #107C10;
}
.color-choose .theme-color-58 {
background-color: #107C10;
}
.color-choose .theme-color-59 {
background-color: RGB(6, 13, 22);
}
......@@ -278,10 +278,10 @@ button{
line-height: 56px;
}
.winui-desktop-item > .winui-icon-img > img {
max-width: 45px;
max-height: 45px;
}
.winui-desktop-item > .winui-icon-img > img {
max-width: 45px;
max-height: 45px;
}
.winui-desktop-item > .winui-icon-font > i {
font-size: 38px;
......@@ -355,50 +355,49 @@ button{
overflow: hidden;
}
.winui-taskbar-task .winui-task-item {
position: relative;
display: inline-block;
vertical-align: middle;
line-height: 40px;
width: 160px;
padding: 0 10px;
text-align: center;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
cursor: default;
margin-right: 5px;
}
.winui-taskbar-task .winui-task-item {
position: relative;
display: inline-block;
vertical-align: middle;
line-height: 40px;
width: 160px;
padding: 0 10px;
text-align: center;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
cursor: default;
margin-right: 5px;
}
.winui-taskbar-task .winui-task-item:last-child {
margin-right: 0;
}
.winui-taskbar-task .winui-task-item:last-child {
margin-right: 0;
}
.winui-taskbar-task .winui-task-item:after {
position: absolute;
left: 0;
top: 0;
content: '';
width: 100%;
height: 41px;
-webkit-box-sizing: border-box !important;
-moz-box-sizing: border-box !important;
box-sizing: border-box !important;
pointer-events: none;
border: none;
border-radius: 0;
border-bottom: 3px solid rgba(255, 255, 255, 0.5);
}
.winui-taskbar-task .winui-task-item:after {
position: absolute;
left: 0;
top: 0;
content: '';
width: 100%;
height: 41px;
-webkit-box-sizing: border-box !important;
-moz-box-sizing: border-box !important;
box-sizing: border-box !important;
pointer-events: none;
border: none;
border-radius: 0;
border-bottom: 3px solid rgba(255, 255, 255, 0.5);
}
.winui-taskbar-task .winui-task-item.winui-this {
/*任务Item选中样式*/
/*background-color: #004275;*/
}
.winui-taskbar-task .winui-task-item.winui-this {
/*任务Item选中样式*/
}
.winui-taskbar-task .winui-task-item.winui-this:hover {
/*任务Item选中悬浮样式*/
/*background-color: #195583;*/
}
.winui-taskbar-task .winui-task-item.winui-this:hover {
/*任务Item选中悬浮样式*/
/*background-color: #195583;*/
}
/*任务栏时间*/
......@@ -462,15 +461,15 @@ button{
}
/*任务栏统一悬浮样式*/
/*任务栏统一悬浮样式*/
.winui-taskbar-start:hover,
.winui-taskbar-task .winui-task-item:hover,
.winui-taskbar-time:hover,
.winui-taskbar-console:hover,
.winui-taskbar-desktop:hover {
/*background: #194260;*/
}
.winui-taskbar-start:hover,
.winui-taskbar-task .winui-task-item:hover,
.winui-taskbar-time:hover,
.winui-taskbar-console:hover,
.winui-taskbar-desktop:hover {
/*background: #194260;*/
}
/*任务项和菜单项右键菜单*/
......@@ -548,72 +547,71 @@ button{
.winui-start {
position: fixed;
/*background: #004275;*/
width: 960px;
width: 975px;
height: 60vh;
z-index: 201704011157;
}
.winui-start > * {
float: left;
}
.winui-start.winui-start-size-sm {
width: 640px;
}
.winui-start > * {
float: left;
}
.winui-start.winui-start-size-sm .winui-start-right {
width: 332px;
}
.winui-start.winui-start-size-sm {
width: 640px;
}
.winui-start.winui-start-size-sm .winui-start-right .winui-nav-tile {
width: 320px;
}
.winui-start.winui-start-size-sm .winui-start-right {
width: 332px;
}
.winui-start.winui-start-size-xs {
width: 308px;
}
.winui-start.winui-start-size-sm .winui-start-right .winui-nav-tile {
width: 320px;
}
.winui-start.winui-start-size-xs .winui-start-right {
width: 0;
}
/*开始菜单滚动条样式*/
.winui-start.winui-start-size-xs {
width: 308px;
}
.winui-start .layui-side-scroll {
width: 100%;
}
.winui-start.winui-start-size-xs .winui-start-right {
width: 0;
}
/*开始菜单滚动条样式*/
.winui-start .layui-side-scroll::-webkit-scrollbar {
/*滚动条整体*/
width: 12px;
}
.winui-start .layui-side-scroll {
width: 100%;
}
.winui-start .layui-side-scroll::-webkit-scrollbar-thumb,
.winui-message .layui-side-scroll::-webkit-scrollbar-thumb {
/*滚动条滑块背景色*/
/*background-color: #47779C;*/
background-color: rgba(255, 255, 255, 0.2);
}
.winui-start .layui-side-scroll::-webkit-scrollbar {
/*滚动条整体*/
width: 12px;
}
.winui-start .layui-side-scroll::-webkit-scrollbar-thumb:vertical:hover,
.winui-message .layui-side-scroll::-webkit-scrollbar-thumb:vertical:hover {
/*滚动条滑块悬浮背景色*/
/*background-color: #7599B5;*/
background-color: rgba(255, 255, 255, 0.4);
}
.winui-start .layui-side-scroll::-webkit-scrollbar-thumb,
.winui-message .layui-side-scroll::-webkit-scrollbar-thumb {
/*滚动条滑块背景色*/
/*background-color: #47779C;*/
background-color: rgba(255, 255, 255, 0.2);
}
.winui-start .layui-side-scroll::-webkit-scrollbar-thumb:vertical:active,
.winui-message .layui-side-scroll::-webkit-scrollbar-thumb:vertical:active {
/*滚动条滑块按住背景色*/
/*background-color: #A3BBCD;*/
background-color: rgba(255, 255, 255, 0.6);
}
.winui-start .layui-side-scroll::-webkit-scrollbar-thumb:vertical:hover,
.winui-message .layui-side-scroll::-webkit-scrollbar-thumb:vertical:hover {
/*滚动条滑块悬浮背景色*/
/*background-color: #7599B5;*/
background-color: rgba(255, 255, 255, 0.4);
}
.winui-start .layui-side-scroll::-webkit-scrollbar-track,
.winui-start .layui-side-scroll::-webkit-scrollbar-corner {
/*滚动条轨道和边角*/
/*background-color: #195583;*/
}
.winui-start .layui-side-scroll::-webkit-scrollbar-thumb:vertical:active,
.winui-message .layui-side-scroll::-webkit-scrollbar-thumb:vertical:active {
/*滚动条滑块按住背景色*/
/*background-color: #A3BBCD;*/
background-color: rgba(255, 255, 255, 0.6);
}
.winui-start .layui-side-scroll::-webkit-scrollbar-track,
.winui-start .layui-side-scroll::-webkit-scrollbar-corner {
/*滚动条轨道和边角*/
/*background-color: #195583;*/
}
/*开始菜单——END——*/
......@@ -623,49 +621,67 @@ button{
.winui-start-left {
width: 48px;
height: 100%;
position: relative;
position: absolute;
zoom: 1;
z-index: 50;
background-color:rgba(0, 0, 0, 0.6);
white-space: nowrap;
overflow: hidden;
}
.winui-start-left .winui-start-item {
width: 48px;
height: 48px;
position: absolute;
text-align: center;
}
.winui-start-left .winui-start-item {
width: 210px;
height: 48px;
position: absolute;
text-align: center;
cursor: pointer;
transition: opacity 0.3s, top 0.3s, left 0.3s, border 0.3s, background-color 0.3s;
white-space: nowrap;
overflow: hidden;
}
.winui-start-left .winui-start-item:hover {
/*background: #195583;*/
}
.winui-start-left .winui-start-item:hover {
/*background: #195583;*/
}
.winui-start-left .winui-start-item i {
line-height: 48px;
color: #fff;
font-size: 18px;
display: block;
}
.winui-start-left .winui-start-item i {
line-height: 48px;
width: 48px;
height: 48px;
color: #fff;
font-size: 18px;
display: block;
float: left;
}
.winui-start-left .winui-start-item.bottom:nth-last-child(1) {
bottom: 0;
}
.winui-start-left .winui-start-item span {
float: left;
line-height: 48px;
color: white;
}
.winui-start-left .winui-start-item.bottom:nth-last-child(2) {
bottom: 48px;
}
.winui-start-left .winui-start-item.bottom:nth-last-child(1) {
bottom: 0;
}
.winui-start-left .winui-start-item.bottom:nth-last-child(3) {
bottom: 96px;
}
.winui-start-left .winui-start-item.bottom:nth-last-child(2) {
bottom: 48px;
}
.winui-start-left .winui-start-item.bottom:nth-last-child(4) {
bottom: 144px;
}
.winui-start-left .winui-start-item.bottom:nth-last-child(3) {
bottom: 96px;
}
.winui-start-left .winui-start-item.bottom:nth-last-child(5),
.winui-start-left .winui-start-item.bottom:nth-last-child(6),
.winui-start-left .winui-start-item.bottom:nth-last-child(7),
.winui-start-left .winui-start-item.bottom:nth-last-child(8) {
display: none;
}
.winui-start-left .winui-start-item.bottom:nth-last-child(4) {
bottom: 144px;
}
.winui-start-left .winui-start-item.bottom:nth-last-child(5),
.winui-start-left .winui-start-item.bottom:nth-last-child(6),
.winui-start-left .winui-start-item.bottom:nth-last-child(7),
.winui-start-left .winui-start-item.bottom:nth-last-child(8) {
display: none;
}
.leftbtnhovertext {
background: #2b2b2b;
......@@ -690,102 +706,101 @@ button{
width: 260px;
height: 100%;
position: relative;
margin-left: 55px;
}
/*开始菜单中间导航样式*/
.winui-start-center .layui-nav-tree {
/*导航DIV样式*/
width: 248px;
background-color: initial;
}
/*开始菜单中间导航样式*/
.winui-start-center .layui-nav-tree {
/*导航DIV样式*/
width: 248px;
background-color: initial;
}
.winui-start-center .layui-nav-tree * {
/*导航字体大小*/
font-size: 12px;
}
.winui-start-center .layui-nav-tree * {
/*导航字体大小*/
font-size: 12px;
}
.winui-start-center .layui-nav-tree a {
/*导航下所有a表情鼠标样式改为默认*/
cursor: default;
line-height: 36px;
}
.winui-start-center .layui-nav-tree a {
/*导航下所有a表情鼠标样式改为默认*/
cursor: default;
line-height: 36px;
}
.winui-start-center .layui-nav-tree .layui-nav-itemed .layui-nav-child {
/*展开的子项div背景*/
background-color: initial !important;
}
.winui-start-center .layui-nav-tree .layui-nav-itemed .layui-nav-child {
/*展开的子项div背景*/
background-color: initial !important;
}
.winui-start-center .layui-nav-tree .layui-nav-child dd.layui-this,
.winui-start-center .layui-nav-tree .layui-this,
.winui-start-center .layui-nav-tree .layui-this > a,
.winui-start-center .layui-nav-tree .layui-this > a:hover {
/*导航选中背景*/
background-color: initial;
}
.winui-start-center .layui-nav-tree .layui-nav-child dd.layui-this,
.winui-start-center .layui-nav-tree .layui-this,
.winui-start-center .layui-nav-tree .layui-this > a,
.winui-start-center .layui-nav-tree .layui-this > a:hover {
/*导航选中背景*/
background-color: initial;
}
.winui-start-center .layui-nav-tree .layui-nav-item {
/*导航项li样式*/
line-height: 35px;
}
.winui-start-center .layui-nav-tree .layui-nav-item {
/*导航项li样式*/
line-height: 35px;
}
.winui-start-center .layui-nav-tree .layui-nav-item a {
/*导航项a样式*/
height: 35px;
color: #fff;
padding: 0 17px;
}
.winui-start-center .layui-nav-tree .layui-nav-item a {
/*导航项a样式*/
height: 35px;
color: #fff;
padding: 0 17px;
}
.winui-start-center .layui-nav-tree .layui-nav-item a:hover,
.winui-start-center .layui-nav-tree .layui-nav-child dd.layui-this a:hover {
/*导航项悬浮背景*/
/*background-color: #195583;*/
}
.winui-start-center .layui-nav-tree .layui-nav-item a:hover,
.winui-start-center .layui-nav-tree .layui-nav-child dd.layui-this a:hover {
/*导航项悬浮背景*/
/*background-color: #195583;*/
}
.winui-start-center .layui-nav-tree .layui-nav-itemed > a {
/*一级菜单展开背景*/
background-color: initial !important;
}
.winui-start-center .layui-nav-tree .layui-nav-itemed > a {
/*一级菜单展开背景*/
background-color: initial !important;
}
.winui-start-center .layui-nav-tree .layui-nav-itemed > a:hover {
/*一级菜单展开悬浮背景*/
/*background-color: #195583 !important;*/
}
.winui-start-center .layui-nav-tree .layui-nav-itemed > a:hover {
/*一级菜单展开悬浮背景*/
/*background-color: #195583 !important;*/
}
.winui-start-center .layui-nav-tree .layui-nav-child a {
/*二级导航*/
padding-left: 27px;
line-height: 35px;
}
.winui-start-center .layui-nav-tree .layui-nav-child a {
/*二级导航*/
padding-left: 27px;
line-height: 35px;
}
.winui-start-center .layui-nav-tree .layui-nav-child dd.layui-this a {
/*二级导航选中样式*/
background-color: inherit;
}
.winui-start-center .layui-nav-tree .layui-nav-child dd.layui-this a {
/*二级导航选中样式*/
background-color: inherit;
}
.winui-start-center .layui-nav-tree .layui-nav-more {
border-color: #fff transparent transparent;
top: 15px;
}
.winui-start-center .layui-nav-tree .layui-nav-more {
border-color: #fff transparent transparent;
top: 15px;
}
.winui-start-center .layui-nav-tree .layui-nav-itemed .layui-nav-more {
border-color: transparent transparent #fff;
top: 9px;
}
.winui-start-center .layui-nav-tree .layui-nav-itemed .layui-nav-more {
border-color: transparent transparent #fff;
top: 9px;
}
/*菜单图标*/
/*菜单图标*/
.winui-start-center .layui-nav-tree .winui-menu-icon {
position: relative;
top: 2px;
float: left;
height: 31px;
width: 31px;
/*background-color: #0063B1;*/
text-align: center;
}
.winui-start-center .layui-nav-tree .winui-menu-icon {
position: relative;
top: 2px;
float: left;
height: 31px;
width: 31px;
/*background-color: #0063B1;*/
text-align: center;
}
.winui-start-center .layui-nav-tree .winui-menu-icon i {
font-size: 18px;
......@@ -1650,6 +1665,15 @@ body .layer-ext-winconfirm {
--start-btn-color: #3D9C3D;
}
.winui-color59 {
--taskbar-color: RGB(7, 16, 24);
--start-color: RGB(16, 35, 33);
--navhover-color: RGB(39, 54, 31);
--tile-color: RGB(191, 211, 180);
--taskbar-btnhover-color: RGB(56, 77, 45);
--start-btn-color: RGB(63, 86, 50);
}
/* 第六排 */
......
......@@ -341,6 +341,25 @@
$('.winui-start-item.winui-start-syspersonal').on('click', function () {
winui.window.openSysPersonal();
});
//展开
$('.winui-start-item.winui-start-show').on('click', function () {
if($(".winui-start-left").css("width") === '210px'){//当前状态:展开
$(".winui-start-left").animate({
width: '48px',
});
}else{//当前状态:关闭
$(".winui-start-left").animate({
width: '210px',
});
}
});
$(".winui-start-left").mouseleave(function (){console.log(1);
$(".winui-start-left").animate({
width: '48px',
});
});
//打开窗口的方法(可自己根据需求来写)
function OpenWindow(menuItem) {
......
......@@ -23,9 +23,10 @@
<div class="winui-start sp" style="display: none;">
<!-- 左边设置 -->
<div class="winui-start-left">
<div class="winui-start-item winui-start-syspersonal bottom" data-text="个人中心"><i class="fa fa-user"></i></div>
<div class="winui-start-item winui-start-individuation bottom" data-text="主题设置"><i class="fa fa-cog"></i></div>
<div class="winui-start-item bottom logout" data-text="注销登录"><i class="fa fa-power-off"></i></div>
<div class="winui-start-item winui-start-show top" data-text="开始"><i class="fa fa-align-justify"></i><span>开始</span></div>
<div class="winui-start-item winui-start-syspersonal bottom" data-text="个人中心"><i class="fa fa-user"></i><span>个人中心</span></div>
<div class="winui-start-item winui-start-individuation bottom" data-text="主题设置"><i class="fa fa-cog"></i><span>主题设置</span></div>
<div class="winui-start-item bottom logout" data-text="注销登录"><i class="fa fa-power-off"></i><span>注销登录</span></div>
</div>
<!-- 中间导航 -->
<div class="winui-start-center">
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册