145 lines
2.8 KiB
CSS
145 lines
2.8 KiB
CSS
/* 优化弹出窗口背景和圆角 */
|
|
#fgc-popup-dialog{
|
|
border-radius: 8px !important;
|
|
overflow: hidden;
|
|
}
|
|
/* .FUI-dialog-cover.FUI-show{
|
|
backdrop-filter: blur(3px);
|
|
} */
|
|
|
|
/* 单选按钮圆形 */
|
|
.singlebox .fgc-toggle-button {
|
|
border-radius: 20px;
|
|
}
|
|
|
|
/* 活字格菜单组件 */
|
|
.pms-menu-row ul {
|
|
text-align: center;
|
|
}
|
|
.pms-menu-row ul li {
|
|
width: auto !important;
|
|
margin: 0 10px;
|
|
}
|
|
.pms-menu-row ul li a {
|
|
padding: 0px 10px !important;
|
|
}
|
|
|
|
/*文字溢出隐藏*/
|
|
|
|
.ec-label label,
|
|
.ec-label a {
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap !important;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ec-label .fgc-align {
|
|
width: 100%;
|
|
}
|
|
|
|
/* 工具栏bar撑满圆角 */
|
|
.toolbar .menuContainer {
|
|
border-radius: 5px;
|
|
padding: 5px 0;
|
|
height: 100%;
|
|
}
|
|
.toolbar .menuContainer > ul {
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: nowrap;
|
|
align-content: center;
|
|
align-items: center;
|
|
height: 100%;
|
|
}
|
|
|
|
.toolbar-left .menuContainer > ul{
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.toolbar-right .menuContainer > ul{
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.toolbar .menuContainer > ul > li {
|
|
width: auto !important;
|
|
padding: 5px 0;
|
|
margin: 0 10px !important;
|
|
height: auto;
|
|
}
|
|
|
|
.toolbar .menuContainer > ul > li > a {
|
|
padding-left: 12px !important;
|
|
line-height: 0px !important;
|
|
min-height: 26px;
|
|
background: #efefef;
|
|
transition-duration: 0.3s;
|
|
}
|
|
.toolbar .menuContainer > ul > li > a:hover {
|
|
background: #d8d8d8;
|
|
}
|
|
|
|
.toolbar .menuContainer > ul > li > a > i {
|
|
margin: 0 !important;
|
|
}
|
|
|
|
.toolbar .menuContainer > ul > li > ul {
|
|
margin-top: 0px;
|
|
}
|
|
|
|
.toolbar .menuContainer > ul > li > ul li:last-child > a {
|
|
border-radius: 0 0 3px 3px;
|
|
}
|
|
|
|
.toolbar .menuContainer > ul > li > ul li:first-child > a {
|
|
border-radius: 3px 3px 0 0;
|
|
}
|
|
|
|
/* 定义淡入动画 */
|
|
@keyframes fadeIn {
|
|
from {
|
|
opacity: 0; /* 开始时元素完全透明 */
|
|
}
|
|
to {
|
|
opacity: 1; /* 结束时元素完全不透明 */
|
|
}
|
|
}
|
|
|
|
/* 应用淡入动画的CSS类 */
|
|
.fade-in {
|
|
opacity: 0; /* 初始状态为不可见 */
|
|
animation-name: fadeIn; /* 使用定义的fadeIn动画 */
|
|
animation-duration: 3s; /* 动画持续时间为2秒 */
|
|
animation-fill-mode: forwards; /* 动画完成后保持最后一帧的样式 */
|
|
}
|
|
.animation-delay-1{
|
|
animation-delay: 1s;
|
|
}
|
|
.animation-delay-2{
|
|
animation-delay: 3s;
|
|
}
|
|
.animation-delay-3{
|
|
animation-delay: 3s;
|
|
}
|
|
|
|
.max-height-150{
|
|
max-height: 140px;
|
|
overflow: auto !important;
|
|
}
|
|
/* 淡入淡出*/
|
|
.fade-effect {
|
|
transition: opacity 1s ease, transform 1s ease;
|
|
opacity: 1;
|
|
transform: translateY(0);
|
|
}
|
|
|
|
.hidden {
|
|
opacity: 0;
|
|
transform: translateY(20px); /* 向下移动20像素 */
|
|
}
|
|
|
|
/* 聊天气泡框 */
|
|
.chatpop .markdown-body.editormd-html-preview{
|
|
white-space: normal !important;
|
|
padding: 0 !important;
|
|
background-color: transparent !important;
|
|
} |