349 lines
6.4 KiB
CSS
349 lines
6.4 KiB
CSS
/* 单选框 */
|
||
.box-radio label.fgc-toggle-button {
|
||
background-color: transparent !important;
|
||
border: none !important;
|
||
border-radius: 6px !important;
|
||
}
|
||
|
||
.box-radio .FUI-radio.FUI-checked {
|
||
border: none !important;
|
||
background-color: #FFF !important;
|
||
border-radius: 6px !important;
|
||
}
|
||
|
||
.FUI-radio.FUI-checked.FUI-focus {
|
||
box-shadow: none !important;
|
||
background-color: #FFF;
|
||
}
|
||
|
||
.box-radio {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
border-radius: 0.5rem;
|
||
background-color: #EEE;
|
||
box-sizing: border-box;
|
||
box-shadow: 0 0 0px 1px rgba(0, 0, 0, 0.06);
|
||
padding: 0.25rem;
|
||
height: auto !important;
|
||
}
|
||
|
||
/* 去掉背景色 */
|
||
.none-background > div{
|
||
background: none !important;
|
||
}
|
||
|
||
/* 标签必填 */
|
||
.required label:before {
|
||
content: '*';
|
||
color: #ff3b30;
|
||
left: -10px;
|
||
position: absolute;
|
||
}
|
||
|
||
/* todo里的图标 */
|
||
.todo-img label {
|
||
background: #ff0000;
|
||
width: auto;
|
||
height: 16px;
|
||
border-radius: 20px;
|
||
line-height: 16px;
|
||
right: -8px;
|
||
top: -2px;
|
||
position: absolute;
|
||
padding-left: 3px;
|
||
padding-right: 3px;
|
||
min-width: 16px;
|
||
min-height: 16px;
|
||
}
|
||
|
||
/* 调整时间线边距 */
|
||
.el-timeline {
|
||
padding-inline-start: 0 !important;
|
||
}
|
||
|
||
/* 子元素溢出 */
|
||
.overflowvisible {
|
||
overflow: visible !important;
|
||
}
|
||
|
||
/* 图片满铺 */
|
||
.img-cover>*> :first-child {
|
||
background-size: cover;
|
||
}
|
||
|
||
.img-cover .fgc-align {
|
||
overflow: hidden !important;
|
||
width: 100% !important;
|
||
height: 100% !important;
|
||
display: block;
|
||
}
|
||
|
||
.img-cover .fgc-align__inner {
|
||
height: 100% !important;
|
||
display: block;
|
||
}
|
||
|
||
.img-cover label.fgc-whitespace-pre {
|
||
background: #0000007a;
|
||
height: 100% !important;
|
||
padding: 15px;
|
||
text-align: left;
|
||
transition-duration: 0.3s;
|
||
opacity: 0;
|
||
overflow: hidden !important;
|
||
text-overflow: ellipsis;
|
||
white-space: normal !important;
|
||
-webkit-line-clamp: 3;
|
||
-webkit-box-orient: vertical;
|
||
display: -webkit-box !important;
|
||
}
|
||
|
||
/* 动态文字 */
|
||
.img-cover label.fgc-whitespace-pre {
|
||
background: #0000007a;
|
||
height: 100%;
|
||
padding: 15px;
|
||
text-align: left;
|
||
text-wrap: wrap !important;
|
||
transition-duration: 0.3s;
|
||
opacity: 0;
|
||
}
|
||
|
||
.img-cover:hover label.fgc-whitespace-pre {
|
||
opacity: 1;
|
||
}
|
||
|
||
/* 版本标签样式 */
|
||
.versionTag label,.versionTag a {
|
||
width: auto !important;
|
||
display: inline !important;
|
||
padding: 2px 6px;
|
||
border-radius: 20px;
|
||
background: #ffffff26;
|
||
font-size: 10px !important;
|
||
/* border: 2px solid #ffffff1c; */
|
||
position: absolute;
|
||
top: 0px;
|
||
left: -15px;
|
||
transition: 0.3s;
|
||
}
|
||
|
||
/* 优化EL头像 */
|
||
.el-avatar-custom div:first-child {
|
||
align-items: center;
|
||
}
|
||
|
||
/* 优化弹出窗口背景和圆角 */
|
||
#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;
|
||
}
|
||
|
||
.toolbar .fgc-plugin-menu-arrow {
|
||
display: none;
|
||
}
|
||
|
||
/* 定义淡入动画 */
|
||
@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像素 */
|
||
}
|
||
|
||
/* 聊天气泡框 */
|
||
.chatEditor .editormd-html-preview {
|
||
padding: 0 !important;
|
||
background-color: transparent !important;
|
||
white-space: normal !important;
|
||
}
|
||
|
||
/* 定义旋转动画 */
|
||
@keyframes rotate-and-fade {
|
||
0% {
|
||
transform: rotate(0deg);
|
||
opacity: 1;
|
||
}
|
||
|
||
25% {
|
||
transform: rotate(90deg);
|
||
opacity: 0.6;
|
||
}
|
||
|
||
50% {
|
||
transform: rotate(180deg);
|
||
opacity: 1;
|
||
}
|
||
|
||
100% {
|
||
transform: rotate(360deg);
|
||
opacity: 0.6;
|
||
}
|
||
}
|
||
|
||
/* 应用动画的CSS类 */
|
||
.rotate-slow {
|
||
animation: rotate-and-fade 10s linear infinite;
|
||
/* 持续时间10秒，线性速率，无限循环 */
|
||
}
|
||
|
||
/* 图文列表中按钮 */
|
||
.repeater-item:hover .hover-btn {
|
||
transition: all 0.5s;
|
||
opacity: 1;
|
||
}
|
||
|
||
.repeater-item .hover-btn {
|
||
opacity: 0;
|
||
}
|
||
|
||
/* 隐藏未注册提示条 */
|
||
a[href="https://www.grapecity.com.cn/solutions/huozige?utm_source=exe&utm_medium=huozige"] {
|
||
display: none;
|
||
}
|
||
|
||
.fgc-page-elements-container {
|
||
transition: all cubic-bezier(0.26, 0.79, 0.58, 1) .3s;
|
||
} |