mirror of
https://gitee.com/ShopeX/OMS
synced 2026-04-06 14:55:37 +08:00
158 lines
3.3 KiB
CSS
158 lines
3.3 KiB
CSS
/**
|
|
* Copyright 2012-2026 ShopeX (https://www.shopex.cn)
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
|
|
.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;
|
|
}
|