mirror of
https://gitee.com/ShopeX/OMS
synced 2026-04-06 23:05:36 +08:00
147 lines
2.8 KiB
CSS
147 lines
2.8 KiB
CSS
/**
|
||
* Copyright © ShopeX （http://www.shopex.cn）. All rights reserved.
|
||
* See LICENSE file for license details.
|
||
*/
|
||
|
||
.header-tabs {
|
||
height: 56px;
|
||
padding-bottom: 16px;
|
||
position: relative;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.header-tab-list {
|
||
display: flex;
|
||
align-items: center;
|
||
width: 100%;
|
||
height: 40px;
|
||
overflow: auto;
|
||
background: #FFFFFF;
|
||
}
|
||
|
||
.header-tab-list::-webkit-scrollbar {
|
||
height: 0px;
|
||
}
|
||
|
||
.header-tabs .tabs-ctl-right {
|
||
position: absolute;
|
||
right: -16px;
|
||
}
|
||
.header-tabs .tabs-ctl-left {
|
||
position: absolute;
|
||
left: -16px;
|
||
}
|
||
|
||
.header-tabs .tabs-ctl-right,
|
||
.header-tabs .tabs-ctl-left {
|
||
top: 0;
|
||
background: #ffffff;
|
||
height: 40px;
|
||
width: 16px;
|
||
line-height: 40px;
|
||
color: #a3a3a3;
|
||
cursor: pointer;
|
||
display: none;
|
||
}
|
||
|
||
.header-tabs .tabs-ctl-right:hover,
|
||
.header-tabs .tabs-ctl-left:hover {
|
||
color: #157FE3;
|
||
}
|
||
|
||
.header-tabs .header-tabs-item {
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
box-sizing: border-box;
|
||
padding: 0 10px 0 10px;
|
||
font-size: 13px;
|
||
cursor: pointer;
|
||
height: 100%;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
text-decoration: none;
|
||
min-width: fit-content;
|
||
}
|
||
|
||
.header-tabs .header-tabs-item a {
|
||
white-space: nowrap;
|
||
height: 40px;
|
||
line-height: 40px;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
text-decoration: none;
|
||
display: block;
|
||
color: #666666;
|
||
min-width: fit-content;
|
||
}
|
||
|
||
.header-tabs .header-tabs-item i {
|
||
visibility: hidden;
|
||
font-size: 12px;
|
||
margin-left: 10px;
|
||
}
|
||
|
||
.header-tabs .header-tabs-active,
|
||
.header-tabs .header-tabs-active a{
|
||
background: #eef5f9;
|
||
color: #157FE3;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.header-tabs .header-tabs-active i {
|
||
visibility: visible;
|
||
margin-left: 10px;
|
||
}
|
||
|
||
.header-tabs .header-tabs-item:hover a,
|
||
.header-tabs .header-tabs-item:hover i{
|
||
color: #157FE3;
|
||
}
|
||
.header-tabs .header-tabs-item:hover i {
|
||
visibility: visible;
|
||
}
|
||
|
||
/* 自定义右键菜单 */
|
||
.context-menu{
|
||
position: fixed;
|
||
border-radius: 4px;
|
||
background: rgba(59, 59, 59, 0.75);
|
||
box-sizing: border-box;
|
||
max-width: 300px;
|
||
display: none;
|
||
flex-direction: column;
|
||
min-width: 150px;
|
||
overflow: hidden;
|
||
border: 1px solid #969696;
|
||
z-index: 999999;
|
||
}
|
||
.context-menu> :last-child {
|
||
border-bottom: none;
|
||
}
|
||
.context-menu-item {
|
||
width: 100%;
|
||
line-height: 30px;
|
||
text-align: left;
|
||
overflow: hidden;
|
||
cursor: pointer;
|
||
padding: 0 10px;
|
||
color: #f7f7f7;
|
||
font-size: 12px;
|
||
box-sizing: border-box;
|
||
}
|
||
.context-menu-divider {
|
||
width: 100%;
|
||
height: 2px;
|
||
background-color: #b0b0b0;
|
||
}
|
||
.context-menu-item:hover {
|
||
background: #4690d8;
|
||
}
|
||
.context-menu-item-disabled {
|
||
color: #afafaf;
|
||
cursor: not-allowed;
|
||
pointer-events: none;
|
||
}
|