Files
orico-official-website/public/static/index/pc/css/public.css
2025-07-17 10:36:36 +08:00

1356 lines
32 KiB
CSS
Executable File

@font-face {
font-family: "Montserrat";
src: url("../fonts/Montserrat-Regular.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Montserrat-Bold";
src: url("../fonts/Montserrat-Bold.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: "Montserrat-Medium";
src: url("../fonts/Montserrat-Medium.ttf") format("truetype");
font-weight: normal;
font-style: normal;
}
::-webkit-scrollbar {
width: 0.625rem;
background: #d2eafb;
}
::-webkit-scrollbar-track {
border-radius: 0.5rem;
background: #eeeeee;
}
* {
margin: 0;
padding: 0;
font-family: 'Montserrat';
}
*:hover {
transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
}
body {
font-size: 1.2em;
font-weight: 400;
color: #333;
--max-width: 1920px;
max-width: var(--max-width);
margin: 0 auto;
}
select,
input,
textarea,
button {
outline: none;
font-size: 0.875rem;
border-radius: 0;
-webkit-border-radius: 0;
color: #414446;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
}
a {
color: #333;
cursor: pointer;
text-decoration: none;
transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
text-decoration: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/* img {
display: block;
} */
ul li {
padding: 2px 0;
list-style-type: none;
}
ol,
ul,
a {
list-style: none;
}
/* 修改垂直滚动条 */
::-webkit-scrollbar {
width: 6px;
/* 修改宽度 */
}
/* 修改滚动条轨道背景色 */
::-webkit-scrollbar-track {
background-color: transparent;
}
/* 修改滚动条滑块颜色 */
::-webkit-scrollbar-thumb {
background-color: #ccc;
}
/* 修改滚动条滑块悬停时的颜色 */
::-webkit-scrollbar-thumb:hover {
background-color: #D8DFE8;
}
/* 修改滚动条滑块移动时的颜色 */
::-webkit-scrollbar-thumb:active {
background-color: #D8DFE8;
}
/* 修改滚动条滑块的圆角 */
::-webkit-scrollbar-thumb {
border-radius: 5px;
}
/* 整体滚动条 */
* {
scrollbar-width: thin;
/* 滚动条宽度 */
scrollbar-color: #D8DBE6 transparent;
/* 滚动条颜色(滑块颜色 轨道颜色) */
}
/* 滚动条轨道 */
*::-moz-scrollbar-track {
background-color: #f0f0f0;
}
/* 滚动条滑块 */
*::-moz-scrollbar-thumb {
background-color: #D8DBE6;
border-radius: 5px;
/* 滑块的圆角 */
}
/* 滚动条的上下箭头 */
*::-moz-scrollbar-button {
display: none;
/* 隐藏上下箭头 */
}
/* 滚动条的上下箭头:向上箭头 */
*::-moz-scrollbar-button:vertical:decrement {
display: none;
}
/* 滚动条的上下箭头:向下箭头 */
*::-moz-scrollbar-button:vertical:increment {
display: none;
}
div{
display: block;
}
#header{
height: 60px;
}
.backtop {
position: fixed;
right: 1.25rem;
padding: 10px 5px;
bottom: 10%;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
color: #666;
font-size: 0.75rem;
background: #fff;
cursor: pointer;
border: 1px solid rgb(241, 241, 241);
}
.backtop .ictop {
height: 1.125rem;
width: 0.9375rem;
margin-bottom: 0.25rem;
}
/*屏幕兼容性*/
@media screen and (min-width:150px) and (max-width:749px){
body{
zoom: 0.6;
}
}
@media screen and (min-width:750px) and (max-width:1280px){
body{
zoom: 0.75;
}
}
@media screen and (min-width:1281px) and (max-width:1360px) {
body{
zoom: 0.8;
}
}
@media screen and (min-width:1361px) and (max-width:1460px) {
body{
zoom: 0.85;
}
}
@media screen and (min-width:1461px) and (max-width:1660px) {
body{
zoom: 0.9;
}
}
@media screen and (min-width:1661px) and (max-width:1760px) {
body{
zoom: 0.95;
}
}
@media screen and (min-width:1761px) and (max-width:1960px) {}
@media screen and (min-width:1980px) {}
/*编辑器样式*/
@charset "UTF-8";.ql-container {
box-sizing: border-box;
font-family: Helvetica,Arial,sans-serif;
font-size: 13px;
height: 100%;
margin: 0;
position: relative
}
.ql-container.ql-disabled .ql-tooltip {
visibility: hidden
}
.ql-container.ql-disabled .ql-editor ul[data-checked]>li:before {
pointer-events: none
}
.ql-clipboard {
left: -100000px;
height: 1px;
overflow-y: hidden;
position: absolute;
top: 50%
}
.ql-clipboard p {
margin: 0;
padding: 0
}
.ql-editor {
box-sizing: border-box;
line-height: 1.42;
height: 100%;
outline: none;
overflow-y: auto;
padding: 12px 15px;
tab-size: 4;
-moz-tab-size: 4;
text-align: left;
}
.ql-editor>* {
cursor: text;
}
.ql-editor p,.ql-editor ol,.ql-editor ul,.ql-editor pre,.ql-editor blockquote,.ql-editor h1,.ql-editor h2,.ql-editor h3,.ql-editor h4,.ql-editor h5,.ql-editor h6 {
margin: 0;
padding: 0;
counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
word-wrap: break-word; /* 兼容旧浏览器 */
overflow-wrap: break-word; /* 优先在空格处换行,避免单词拆分 */
word-break: normal; /* 禁止强制拆分单词 */
hyphens: auto; /* 可选:超长单词用连字符换行(更优雅) */
}
.ql-editor ol,.ql-editor ul {
padding-left: 1.5em
}
.ql-editor ol>li,.ql-editor ul>li {
list-style-type: none
}
.ql-editor ul>li:before {
content: "•"
}
.ql-editor ul[data-checked=true],.ql-editor ul[data-checked=false] {
pointer-events: none
}
.ql-editor ul[data-checked=true]>li *,.ql-editor ul[data-checked=false]>li * {
pointer-events: all
}
.ql-editor ul[data-checked=true]>li:before,.ql-editor ul[data-checked=false]>li:before {
color: #777;
cursor: pointer;
pointer-events: all
}
.ql-editor ul[data-checked=true]>li:before {
content: "☑"
}
.ql-editor ul[data-checked=false]>li:before {
content: "☐"
}
.ql-editor li:before {
display: inline-block;
white-space: nowrap;
width: 1.2em
}
.ql-editor li:not(.ql-direction-rtl):before {
margin-left: -1.5em;
margin-right: .3em;
text-align: right
}
.ql-editor li.ql-direction-rtl:before {
margin-left: .3em;
margin-right: -1.5em
}
.ql-editor ol li:not(.ql-direction-rtl),.ql-editor ul li:not(.ql-direction-rtl) {
padding-left: 1.5em
}
.ql-editor ol li.ql-direction-rtl,.ql-editor ul li.ql-direction-rtl {
padding-right: 1.5em
}
.ql-editor ol li {
counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
counter-increment: list-0
}
.ql-editor ol li:before {
content: counter(list-0,decimal) ". "
}
.ql-editor ol li.ql-indent-1 {
counter-increment: list-1
}
.ql-editor ol li.ql-indent-1:before {
content: counter(list-1,lower-alpha) ". "
}
.ql-editor ol li.ql-indent-1 {
counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
}
.ql-editor ol li.ql-indent-2 {
counter-increment: list-2
}
.ql-editor ol li.ql-indent-2:before {
content: counter(list-2,lower-roman) ". "
}
.ql-editor ol li.ql-indent-2 {
counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9
}
.ql-editor ol li.ql-indent-3 {
counter-increment: list-3
}
.ql-editor ol li.ql-indent-3:before {
content: counter(list-3,decimal) ". "
}
.ql-editor ol li.ql-indent-3 {
counter-reset: list-4 list-5 list-6 list-7 list-8 list-9
}
.ql-editor ol li.ql-indent-4 {
counter-increment: list-4
}
.ql-editor ol li.ql-indent-4:before {
content: counter(list-4,lower-alpha) ". "
}
.ql-editor ol li.ql-indent-4 {
counter-reset: list-5 list-6 list-7 list-8 list-9
}
.ql-editor ol li.ql-indent-5 {
counter-increment: list-5
}
.ql-editor ol li.ql-indent-5:before {
content: counter(list-5,lower-roman) ". "
}
.ql-editor ol li.ql-indent-5 {
counter-reset: list-6 list-7 list-8 list-9
}
.ql-editor ol li.ql-indent-6 {
counter-increment: list-6
}
.ql-editor ol li.ql-indent-6:before {
content: counter(list-6,decimal) ". "
}
.ql-editor ol li.ql-indent-6 {
counter-reset: list-7 list-8 list-9
}
.ql-editor ol li.ql-indent-7 {
counter-increment: list-7
}
.ql-editor ol li.ql-indent-7:before {
content: counter(list-7,lower-alpha) ". "
}
.ql-editor ol li.ql-indent-7 {
counter-reset: list-8 list-9
}
.ql-editor ol li.ql-indent-8 {
counter-increment: list-8
}
.ql-editor ol li.ql-indent-8:before {
content: counter(list-8,lower-roman) ". "
}
.ql-editor ol li.ql-indent-8 {
counter-reset: list-9
}
.ql-editor ol li.ql-indent-9 {
counter-increment: list-9
}
.ql-editor ol li.ql-indent-9:before {
content: counter(list-9,decimal) ". "
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
padding-left: 3em
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
padding-left: 4.5em
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
padding-right: 3em
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
padding-right: 4.5em
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
padding-left: 6em
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
padding-left: 7.5em
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
padding-right: 6em
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
padding-right: 7.5em
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
padding-left: 9em
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
padding-left: 10.5em
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
padding-right: 9em
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
padding-right: 10.5em
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
padding-left: 12em
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
padding-left: 13.5em
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
padding-right: 12em
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
padding-right: 13.5em
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
padding-left: 15em
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
padding-left: 16.5em
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
padding-right: 15em
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
padding-right: 16.5em
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
padding-left: 18em
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
padding-left: 19.5em
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
padding-right: 18em
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
padding-right: 19.5em
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
padding-left: 21em
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
padding-left: 22.5em
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
padding-right: 21em
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
padding-right: 22.5em
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
padding-left: 24em
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
padding-left: 25.5em
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
padding-right: 24em
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
padding-right: 25.5em
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
padding-left: 27em
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
padding-left: 28.5em
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
padding-right: 27em
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
padding-right: 28.5em
}
.ql-editor .ql-video {
display: block;
max-width: 100%
}
.ql-editor .ql-video.ql-align-center {
margin: 0 auto
}
.ql-editor .ql-video.ql-align-right {
margin: 0 0 0 auto
}
.ql-editor .ql-bg-black {
background-color: #000
}
.ql-editor .ql-bg-red {
background-color: #e60000
}
.ql-editor .ql-bg-orange {
background-color: #f90
}
.ql-editor .ql-bg-yellow {
background-color: #ff0
}
.ql-editor .ql-bg-green {
background-color: #008a00
}
.ql-editor .ql-bg-blue {
background-color: #06c
}
.ql-editor .ql-bg-purple {
background-color: #93f
}
.ql-editor .ql-color-white {
color: #fff
}
.ql-editor .ql-color-red {
color: #e60000
}
.ql-editor .ql-color-orange {
color: #f90
}
.ql-editor .ql-color-yellow {
color: #ff0
}
.ql-editor .ql-color-green {
color: #008a00
}
.ql-editor .ql-color-blue {
color: #06c
}
.ql-editor .ql-color-purple {
color: #93f
}
.ql-editor .ql-font-serif {
font-family: Georgia,Times New Roman,serif
}
.ql-editor .ql-font-monospace {
font-family: Monaco,Courier New,monospace
}
.ql-editor .ql-size-small {
font-size: .75em;
word-wrap: break-word; /* 兼容旧浏览器 */
overflow-wrap: break-word; /* 优先在空格处换行,避免单词拆分 */
word-break: normal; /* 禁止强制拆分单词 */
hyphens: auto; /* 可选:超长单词用连字符换行(更优雅) */
}
.ql-editor .ql-size-large {
font-size: 1.5em;
word-wrap: break-word; /* 兼容旧浏览器 */
overflow-wrap: break-word; /* 优先在空格处换行,避免单词拆分 */
word-break: normal; /* 禁止强制拆分单词 */
hyphens: auto; /* 可选:超长单词用连字符换行(更优雅) */
}
.ql-editor .ql-size-huge {
font-size: 2.5em;
word-wrap: break-word; /* 兼容旧浏览器 */
overflow-wrap: break-word; /* 优先在空格处换行,避免单词拆分 */
word-break: normal; /* 禁止强制拆分单词 */
hyphens: auto; /* 可选:超长单词用连字符换行(更优雅) */
}
.ql-editor .ql-direction-rtl {
direction: rtl;
text-align: inherit
}
.ql-editor .ql-align-center {
text-align: center
}
.ql-editor .ql-align-justify {
text-align: justify
}
.ql-editor .ql-align-right {
text-align: right
}
.ql-editor.ql-blank:before {
color: #0009;
content: attr(data-placeholder);
font-style: italic;
left: 15px;
pointer-events: none;
position: absolute;
right: 15px
}
.ql-snow.ql-toolbar:after,.ql-snow .ql-toolbar:after {
clear: both;
content: "";
display: table
}
.ql-snow.ql-toolbar button,.ql-snow .ql-toolbar button {
background: none;
border: none;
cursor: pointer;
display: inline-block;
float: left;
height: 24px;
padding: 3px 5px;
width: 28px;
margin-left: 1px;
margin-right: 1px
}
.ql-snow.ql-toolbar button svg,.ql-snow .ql-toolbar button svg {
float: left;
height: 100%
}
.ql-snow.ql-toolbar button:active:hover,.ql-snow .ql-toolbar button:active:hover {
outline: none
}
.ql-snow.ql-toolbar input.ql-image[type=file],.ql-snow .ql-toolbar input.ql-image[type=file] {
display: none
}
.ql-snow.ql-toolbar button:hover,.ql-snow .ql-toolbar button:hover,.ql-snow.ql-toolbar button:focus,.ql-snow .ql-toolbar button:focus,.ql-snow.ql-toolbar .ql-picker-label:hover,.ql-snow .ql-toolbar .ql-picker-label:hover,.ql-snow.ql-toolbar .ql-picker-item:hover,.ql-snow .ql-toolbar .ql-picker-item:hover {
background-color: #f3f4f6
}
.ql-snow.ql-toolbar button.ql-active,.ql-snow .ql-toolbar button.ql-active,.ql-snow.ql-toolbar .ql-picker-label.ql-active,.ql-snow .ql-toolbar .ql-picker-label.ql-active,.ql-snow.ql-toolbar .ql-picker-item.ql-selected,.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
background-color: #dbeafe;
color: #2563eb
}
.ql-snow.ql-toolbar button.ql-active .ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
fill: #2563eb
}
.ql-snow.ql-toolbar button.ql-active .ql-stroke,.ql-snow .ql-toolbar button.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
stroke: #2563eb
}
@media (pointer: coarse) {
.ql-snow.ql-toolbar button:hover:not(.ql-active),.ql-snow .ql-toolbar button:hover:not(.ql-active) {
color:#4b5563
}
.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
fill: #4b5563
}
.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,.ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,.ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
stroke: #4b5563
}
}
.ql-snow,.ql-snow * {
box-sizing: border-box
}
.ql-snow .ql-hidden {
display: none
}
.ql-snow .ql-out-bottom,.ql-snow .ql-out-top {
visibility: hidden
}
.ql-snow .ql-tooltip {
position: absolute;
transform: translateY(10px)
}
.ql-snow .ql-tooltip a {
cursor: pointer;
text-decoration: none
}
.ql-snow .ql-tooltip.ql-flip {
transform: translateY(-10px)
}
.ql-snow .ql-formats {
display: inline-block;
vertical-align: middle
}
.ql-snow .ql-formats:after {
clear: both;
content: "";
display: table
}
.ql-snow .ql-stroke {
fill: none;
stroke: #4b5563;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 2
}
.ql-snow .ql-stroke-miter {
fill: none;
stroke: #4b5563;
stroke-miterlimit: 10;
stroke-width: 2
}
.ql-snow .ql-fill,.ql-snow .ql-stroke.ql-fill {
fill: #4b5563
}
.ql-snow .ql-empty {
fill: none
}
.ql-snow .ql-even {
fill-rule: evenodd
}
.ql-snow .ql-thin,.ql-snow .ql-stroke.ql-thin {
stroke-width: 1
}
.ql-snow .ql-transparent {
opacity: .4
}
.ql-snow .ql-direction svg:last-child {
display: none
}
.ql-snow .ql-direction.ql-active svg:last-child {
display: inline
}
.ql-snow .ql-direction.ql-active svg:first-child {
display: none
}
.ql-snow .ql-editor h1 {
font-size: 2em
}
.ql-snow .ql-editor h2 {
font-size: 1.5em
}
.ql-snow .ql-editor h3 {
font-size: 1.17em
}
.ql-snow .ql-editor h4 {
font-size: 1em
}
.ql-snow .ql-editor h5 {
font-size: .83em
}
.ql-snow .ql-editor h6 {
font-size: .67em
}
.ql-snow .ql-editor a {
text-decoration: underline
}
.ql-snow .ql-editor blockquote {
border-left: 4px solid #ccc;
margin-bottom: 5px;
margin-top: 5px;
padding-left: 16px
}
.ql-snow .ql-editor code,.ql-snow .ql-editor pre {
background-color: #f0f0f0;
border-radius: 3px
}
.ql-snow .ql-editor pre {
white-space: pre-wrap;
margin-bottom: 5px;
margin-top: 5px;
padding: 5px 10px
}
.ql-snow .ql-editor code {
font-size: 85%;
padding: 2px 4px
}
.ql-snow .ql-editor pre.ql-syntax {
background-color: #23241f;
color: #f8f8f2;
overflow: visible
}
.ql-snow .ql-editor img {
max-width: 100%
}
.ql-snow .ql-picker {
color: #4b5563;
display: inline-block;
float: left;
font-size: 14px;
font-weight: 500;
height: 24px;
position: relative;
vertical-align: middle;
margin-right: 1px;
margin-left: 1px
}
.ql-snow .ql-picker-label {
cursor: pointer;
display: flex;
height: 100%;
padding-left: 8px;
padding-right: 2px;
position: relative;
width: 100%
}
.ql-snow .ql-picker-label:before {
display: inline-block;
line-height: 22px
}
.ql-snow .ql-picker-options {
background-color: #fff;
display: none;
min-width: 100%;
position: absolute;
white-space: nowrap
}
.ql-snow .ql-picker-options .ql-picker-item {
cursor: pointer;
display: block;
padding: 5px 8px
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label {
color: #d1d5db;
z-index: 2
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
fill: #d1d5db
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
stroke: #d1d5db
}
.ql-snow .ql-picker.ql-expanded .ql-picker-options {
display: block;
margin-top: -1px;
top: 100%;
z-index: 1
}
.ql-snow .ql-color-picker,.ql-snow .ql-icon-picker {
width: 28px
}
.ql-snow .ql-color-picker .ql-picker-label,.ql-snow .ql-icon-picker .ql-picker-label {
padding: 2px 4px
}
.ql-snow .ql-color-picker .ql-picker-label svg,.ql-snow .ql-icon-picker .ql-picker-label svg {
right: 4px
}
.ql-snow .ql-icon-picker .ql-picker-options {
padding: 3px
}
.ql-snow .ql-icon-picker .ql-picker-item {
height: 24px;
width: 24px;
padding: 2px 4px;
margin: 2px
}
.ql-snow .ql-color-picker .ql-picker-options {
padding: 3px 5px;
width: 152px
}
.ql-snow .ql-color-picker .ql-picker-item {
border: 1px solid transparent;
float: left;
height: 16px;
margin: 2px;
padding: 0;
width: 16px
}
.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
position: absolute;
margin-top: -9px;
right: 0;
top: 50%;
width: 18px
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=""]):before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=""]):before {
content: attr(data-label)
}
.ql-snow .ql-picker.ql-header {
width: 98px
}
.ql-snow .ql-picker.ql-header .ql-picker-label:before,.ql-snow .ql-picker.ql-header .ql-picker-item:before {
content: "Normal"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
content: "Heading 1"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
content: "Heading 2"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
content: "Heading 3"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
content: "Heading 4"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
content: "Heading 5"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
content: "Heading 6"
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
font-size: 2em
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
font-size: 1.5em
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
font-size: 1.17em
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
font-size: 1em
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
font-size: .83em
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
font-size: .67em
}
.ql-snow .ql-picker.ql-font {
width: 108px
}
.ql-snow .ql-picker.ql-font .ql-picker-label:before,.ql-snow .ql-picker.ql-font .ql-picker-item:before {
content: "Sans Serif"
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
content: "Serif"
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
content: "Monospace"
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
font-family: Georgia,Times New Roman,serif
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
font-family: Monaco,Courier New,monospace
}
.ql-snow .ql-picker.ql-size {
width: 98px
}
.ql-snow .ql-picker.ql-size .ql-picker-label:before,.ql-snow .ql-picker.ql-size .ql-picker-item:before {
content: "Normal"
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
content: "Small"
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
content: "Large"
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
content: "Huge"
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
font-size: 10px
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
font-size: 18px
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
font-size: 32px
}
.ql-snow .ql-color-picker.ql-background .ql-picker-item {
background-color: #fff
}
.ql-snow .ql-color-picker.ql-color .ql-picker-item {
background-color: #000
}
.ql-toolbar.ql-snow {
border: 1px solid #d1d5db;
box-sizing: border-box;
font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
padding: 8px
}
.ql-toolbar.ql-snow .ql-formats {
margin-right: 15px
}
.ql-toolbar.ql-snow .ql-picker-label {
border: 1px solid transparent
}
.ql-toolbar.ql-snow .ql-picker-options {
border: 1px solid transparent;
box-shadow: #0003 0 2px 8px
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label,.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
border-color: #d1d5db
}
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
border-color: #000
}
.ql-toolbar.ql-snow+.ql-container.ql-snow {
border-top: 0px
}
.ql-snow .ql-tooltip {
background-color: #fff;
border: 1px solid #d1d5db;
box-shadow: 0 0 5px #d1d5db;
color: #4b5563;
padding: 5px 12px;
white-space: nowrap
}
.ql-snow .ql-tooltip:before {
content: "Visit URL:";
line-height: 26px;
margin-right: 8px
}
.ql-snow .ql-tooltip input[type=text] {
display: none;
border: 1px solid #d1d5db;
font-size: 13px;
height: 26px;
margin: 0;
padding: 3px 5px;
width: 170px
}
.ql-snow .ql-tooltip a.ql-preview {
display: inline-block;
max-width: 200px;
overflow-x: hidden;
text-overflow: ellipsis;
vertical-align: top
}
.ql-snow .ql-tooltip a.ql-action:after {
border-right: 1px solid #d1d5db;
content: "Edit";
margin-left: 16px;
padding-right: 8px
}
.ql-snow .ql-tooltip a.ql-remove:before {
content: "Remove";
margin-left: 8px
}
.ql-snow .ql-tooltip a {
line-height: 26px
}
.ql-snow .ql-tooltip.ql-editing a.ql-preview,.ql-snow .ql-tooltip.ql-editing a.ql-remove {
display: none
}
.ql-snow .ql-tooltip.ql-editing input[type=text] {
display: inline-block
}
.ql-snow .ql-tooltip.ql-editing a.ql-action:after {
border-right: 0px;
content: "Save";
padding-right: 0
}
.ql-snow .ql-tooltip[data-mode=link]:before {
content: "Enter link:"
}
.ql-snow .ql-tooltip[data-mode=formula]:before {
content: "Enter formula:"
}
.ql-snow .ql-tooltip[data-mode=video]:before {
content: "Enter video:"
}
.ql-snow a {
color: #2563eb
}
.ql-container.ql-snow {
border: 1px solid #d1d5db
}
.editor,.ql-toolbar {
line-height: normal!important;
white-space: pre-wrap!important
}
.editor-img-uploader {
display: none
}
.ql-editor {
min-height: 600px;
max-height: 600px;
overflow: auto
}
.ql-snow .ql-tooltip[data-mode=link]:before {
content: "请输入链接地址:"
}
.ql-snow .ql-tooltip.ql-editing a.ql-action:after {
padding-right: 0;
content: "保存";
border-right: 0
}
.ql-snow .ql-tooltip[data-mode=video]:before {
content: "请输入视频地址:"
}
.ql-snow .ql-picker.ql-size .ql-picker-label:before,.ql-snow .ql-picker.ql-size .ql-picker-item:before {
content: "14px"
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]:before {
content: "10px"
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]:before {
content: "18px"
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]:before,.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]:before {
content: "32px"
}
.ql-snow .ql-picker.ql-header .ql-picker-label:before,.ql-snow .ql-picker.ql-header .ql-picker-item:before {
content: "文本"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]:before {
content: "标题1"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]:before {
content: "标题2"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]:before {
content: "标题3"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]:before {
content: "标题4"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]:before {
content: "标题5"
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]:before,.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]:before {
content: "标题6"
}
.ql-snow .ql-picker.ql-font .ql-picker-label:before,.ql-snow .ql-picker.ql-font .ql-picker-item:before {
content: "标准字体"
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]:before {
content: "衬线字体"
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]:before,.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]:before {
content: "等宽字体"
}