You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
877 lines
21 KiB
CSS
877 lines
21 KiB
CSS
/* body {
|
|
margin: 0;
|
|
background: #eee;
|
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, ".SFNSText-Regular",
|
|
sans-serif;
|
|
font-weight: 500;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale; */
|
|
/* } */
|
|
.editor-container{
|
|
margin: 0;
|
|
background: #eee;
|
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, ".SFNSText-Regular",
|
|
sans-serif;
|
|
font-weight: 500;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.email-container{
|
|
font-family: system-ui, -apple-system, BlinkMacSystemFont, ".SFNSText-Regular",
|
|
sans-serif;
|
|
font-weight: 500;
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
}
|
|
.other h2 {
|
|
font-size: 18px;
|
|
color: #444;
|
|
margin-bottom: 7px;
|
|
}
|
|
|
|
.other a {
|
|
color: #777;
|
|
text-decoration: underline;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.other ul {
|
|
padding: 0;
|
|
margin: 0;
|
|
list-style-type: none;
|
|
}
|
|
|
|
/* .App {
|
|
font-family: sans-serif;
|
|
text-align: center;
|
|
} */
|
|
|
|
.email-editor-wrapper h1 {
|
|
font-size: 24px;
|
|
color: #333;
|
|
}
|
|
|
|
.ltr {
|
|
text-align: left;
|
|
}
|
|
|
|
.rtl {
|
|
text-align: right;
|
|
}
|
|
|
|
.editor-container {
|
|
margin: 0 auto 20px auto;
|
|
border-radius: 2px;
|
|
/* max-width: 600px; */
|
|
color: #000;
|
|
position: relative;
|
|
line-height: 20px;
|
|
font-weight: 400;
|
|
text-align: left;
|
|
border-top-left-radius: 10px;
|
|
border-top-right-radius: 10px;
|
|
}
|
|
|
|
.editor-inner {
|
|
background: #fff;
|
|
position: relative;
|
|
}
|
|
|
|
.editor-input {
|
|
min-height: 150px;
|
|
resize: none;
|
|
font-size: 15px;
|
|
caret-color: rgb(5, 5, 5);
|
|
position: relative;
|
|
tab-size: 1;
|
|
outline: 0;
|
|
padding: 15px 10px;
|
|
caret-color: #444;
|
|
}
|
|
|
|
.editor-pure-input {
|
|
min-height: 150px;
|
|
resize: none;
|
|
font-size: 15px;
|
|
caret-color: rgb(5, 5, 5);
|
|
position: relative;
|
|
tab-size: 1;
|
|
outline: 0;
|
|
padding: 15px 10px;
|
|
caret-color: #444;
|
|
}
|
|
|
|
.editor-placeholder {
|
|
color: #999;
|
|
overflow: hidden;
|
|
position: absolute;
|
|
text-overflow: ellipsis;
|
|
top: 15px;
|
|
left: 10px;
|
|
font-size: 15px;
|
|
user-select: none;
|
|
display: inline-block;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.editor-text-bold {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.editor-text-italic {
|
|
font-style: italic;
|
|
}
|
|
|
|
.editor-text-underline {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.editor-text-strikethrough {
|
|
text-decoration: line-through;
|
|
}
|
|
|
|
.editor-text-underlineStrikethrough {
|
|
text-decoration: underline line-through;
|
|
}
|
|
|
|
.editor-text-code {
|
|
background-color: rgb(240, 242, 245);
|
|
padding: 1px 0.25rem;
|
|
font-family: Menlo, Consolas, Monaco, monospace;
|
|
font-size: 94%;
|
|
}
|
|
|
|
.editor-link {
|
|
color: rgb(33, 111, 219);
|
|
text-decoration: none;
|
|
}
|
|
.editor-link:hover{
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.tree-view-output {
|
|
display: block;
|
|
background: #222;
|
|
color: #fff;
|
|
padding: 5px;
|
|
font-size: 12px;
|
|
white-space: pre-wrap;
|
|
margin: 1px auto 10px auto;
|
|
max-height: 250px;
|
|
position: relative;
|
|
border-bottom-left-radius: 10px;
|
|
border-bottom-right-radius: 10px;
|
|
overflow: auto;
|
|
line-height: 14px;
|
|
}
|
|
|
|
.editor-code {
|
|
background-color: rgb(240, 242, 245);
|
|
font-family: Menlo, Consolas, Monaco, monospace;
|
|
display: block;
|
|
padding: 8px 8px 8px 52px;
|
|
line-height: 1.53;
|
|
font-size: 13px;
|
|
margin: 0;
|
|
margin-top: 8px;
|
|
margin-bottom: 8px;
|
|
tab-size: 2;
|
|
/* white-space: pre; */
|
|
overflow-x: auto;
|
|
position: relative;
|
|
}
|
|
|
|
.editor-code:before {
|
|
content: attr(data-gutter);
|
|
position: absolute;
|
|
background-color: #eee;
|
|
left: 0;
|
|
top: 0;
|
|
border-right: 1px solid #ccc;
|
|
padding: 8px;
|
|
color: #777;
|
|
white-space: pre-wrap;
|
|
text-align: right;
|
|
min-width: 25px;
|
|
}
|
|
.editor-code:after {
|
|
content: attr(data-highlight-language);
|
|
top: 0;
|
|
right: 3px;
|
|
padding: 3px;
|
|
font-size: 10px;
|
|
text-transform: uppercase;
|
|
position: absolute;
|
|
color: rgba(0, 0, 0, 0.5);
|
|
}
|
|
|
|
.editor-tokenComment {
|
|
color: slategray;
|
|
}
|
|
|
|
.editor-tokenPunctuation {
|
|
color: #999;
|
|
}
|
|
|
|
.editor-tokenProperty {
|
|
color: #905;
|
|
}
|
|
|
|
.editor-tokenSelector {
|
|
color: #690;
|
|
}
|
|
|
|
.editor-tokenOperator {
|
|
color: #9a6e3a;
|
|
}
|
|
|
|
.editor-tokenAttr {
|
|
color: #07a;
|
|
}
|
|
|
|
.editor-tokenVariable {
|
|
color: #e90;
|
|
}
|
|
|
|
.editor-tokenFunction {
|
|
color: #dd4a68;
|
|
}
|
|
|
|
.editor-paragraph {
|
|
margin: 0;
|
|
margin-bottom: 8px;
|
|
position: relative;
|
|
}
|
|
|
|
.editor-paragraph:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.editor-heading-h1 {
|
|
font-size: 24px;
|
|
color: rgb(5, 5, 5);
|
|
font-weight: 400;
|
|
margin: 0;
|
|
margin-bottom: 12px;
|
|
padding: 0;
|
|
}
|
|
|
|
.editor-heading-h2 {
|
|
font-size: 15px;
|
|
color: rgb(101, 103, 107);
|
|
font-weight: 700;
|
|
margin: 0;
|
|
margin-top: 10px;
|
|
padding: 0;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.editor-heading-h3 {
|
|
font-size: 14px;
|
|
/* color: rgb(101, 103, 107); */
|
|
font-weight: 700;
|
|
margin: 0;
|
|
margin-top: 10px;
|
|
padding: 0;
|
|
/* text-transform: uppercase; */
|
|
}
|
|
|
|
.editor-quote {
|
|
margin: 0;
|
|
margin-left: 20px;
|
|
font-size: 15px;
|
|
color: rgb(101, 103, 107);
|
|
border-left-color: rgb(206, 208, 212);
|
|
border-left-width: 4px;
|
|
border-left-style: solid;
|
|
padding-left: 16px;
|
|
}
|
|
|
|
.editor-list-ol {
|
|
padding: 0;
|
|
margin: 0;
|
|
margin-left: 16px;
|
|
}
|
|
|
|
.editor-list-ul {
|
|
padding: 0;
|
|
margin: 0;
|
|
margin-left: 16px;
|
|
}
|
|
|
|
.editor-listitem {
|
|
margin: 8px 32px 8px 32px;
|
|
}
|
|
|
|
.editor-nested-listitem {
|
|
list-style-type: none;
|
|
}
|
|
|
|
pre::-webkit-scrollbar {
|
|
background: transparent;
|
|
width: 10px;
|
|
}
|
|
|
|
pre::-webkit-scrollbar-thumb {
|
|
background: #999;
|
|
}
|
|
|
|
.debug-timetravel-panel {
|
|
overflow: hidden;
|
|
padding: 0 0 10px 0;
|
|
margin: auto;
|
|
display: flex;
|
|
}
|
|
|
|
.debug-timetravel-panel-slider {
|
|
padding: 0;
|
|
flex: 8;
|
|
}
|
|
|
|
.debug-timetravel-panel-button {
|
|
padding: 0;
|
|
border: 0;
|
|
background: none;
|
|
flex: 1;
|
|
color: #fff;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.debug-timetravel-panel-button:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.debug-timetravel-button {
|
|
border: 0;
|
|
padding: 0;
|
|
font-size: 12px;
|
|
top: 10px;
|
|
right: 15px;
|
|
position: absolute;
|
|
background: none;
|
|
color: #fff;
|
|
}
|
|
|
|
.debug-timetravel-button:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.email-editor-wrapper .emoji {
|
|
color: transparent;
|
|
background-size: 16px 16px;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
vertical-align: middle;
|
|
margin: 0 -1px;
|
|
}
|
|
|
|
.emoji-inner {
|
|
padding: 0 0.15em;
|
|
}
|
|
|
|
.emoji-inner::selection {
|
|
color: transparent;
|
|
background-color: rgba(150, 150, 150, 0.4);
|
|
}
|
|
|
|
.emoji-inner::moz-selection {
|
|
color: transparent;
|
|
background-color: rgba(150, 150, 150, 0.4);
|
|
}
|
|
|
|
.emoji.happysmile {
|
|
background-image: url(./images/emoji/1F642.png);
|
|
}
|
|
|
|
.toolbar {
|
|
display: flex;
|
|
margin-bottom: 1px;
|
|
background: #fff;
|
|
padding: 4px;
|
|
border-top-left-radius: 10px;
|
|
border-top-right-radius: 10px;
|
|
vertical-align: middle;
|
|
width: inherit;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.toolbar button.toolbar-item {
|
|
border: 0;
|
|
display: flex;
|
|
background: none;
|
|
border-radius: 10px;
|
|
padding: 8px;
|
|
cursor: pointer;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.toolbar button.toolbar-item:disabled {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.toolbar button.toolbar-item.spaced {
|
|
margin-right: 2px;
|
|
}
|
|
|
|
.toolbar button.toolbar-item i.format {
|
|
background-size: contain;
|
|
display: inline-block;
|
|
height: 18px;
|
|
width: 18px;
|
|
margin-top: 2px;
|
|
vertical-align: -0.25em;
|
|
display: flex;
|
|
opacity: 0.6;
|
|
}
|
|
|
|
.toolbar button.toolbar-item:disabled i.format {
|
|
opacity: 0.2;
|
|
}
|
|
|
|
.toolbar button.toolbar-item.active {
|
|
background-color: rgba(223, 232, 250, 0.3);
|
|
}
|
|
|
|
.toolbar button.toolbar-item.active i {
|
|
opacity: 1;
|
|
}
|
|
|
|
.toolbar .toolbar-item:hover:not([disabled]) {
|
|
background-color: #eee;
|
|
}
|
|
|
|
.toolbar .divider {
|
|
width: 1px;
|
|
background-color: #eee;
|
|
margin: 0 4px;
|
|
}
|
|
.dropdown .divider {
|
|
width: auto;
|
|
background-color: #eee;
|
|
margin: 4px 8px;
|
|
height: 1px;
|
|
}
|
|
.toolbar select.toolbar-item {
|
|
border: 0;
|
|
display: flex;
|
|
background: none;
|
|
border-radius: 10px;
|
|
padding: 8px;
|
|
vertical-align: middle;
|
|
-webkit-appearance: none;
|
|
-moz-appearance: none;
|
|
width: 70px;
|
|
font-size: 14px;
|
|
color: #777;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.toolbar select.code-language {
|
|
text-transform: capitalize;
|
|
width: 130px;
|
|
}
|
|
|
|
.toolbar .toolbar-item .text {
|
|
display: flex;
|
|
line-height: 20px;
|
|
width: 200px;
|
|
vertical-align: middle;
|
|
font-size: 14px;
|
|
color: #777;
|
|
text-overflow: ellipsis;
|
|
width: 70px;
|
|
overflow: hidden;
|
|
height: 20px;
|
|
text-align: left;
|
|
}
|
|
|
|
.toolbar .toolbar-item .icon {
|
|
display: flex;
|
|
width: 20px;
|
|
height: 20px;
|
|
user-select: none;
|
|
margin-right: 8px;
|
|
line-height: 16px;
|
|
background-size: contain;
|
|
}
|
|
|
|
.toolbar i.chevron-down {
|
|
margin-top: 3px;
|
|
width: 16px;
|
|
height: 16px;
|
|
display: flex;
|
|
user-select: none;
|
|
}
|
|
|
|
.toolbar i.chevron-down.inside {
|
|
width: 16px;
|
|
height: 16px;
|
|
display: flex;
|
|
margin-left: -25px;
|
|
margin-top: 11px;
|
|
margin-right: 10px;
|
|
pointer-events: none;
|
|
}
|
|
|
|
i.chevron-down {
|
|
background-color: transparent;
|
|
background-size: contain;
|
|
display: inline-block;
|
|
height: 8px;
|
|
width: 8px;
|
|
background-image: url(/images/icons/chevron-down.svg);
|
|
}
|
|
|
|
#block-controls button:hover {
|
|
background-color: #efefef;
|
|
}
|
|
|
|
#block-controls button:focus-visible {
|
|
border-color: blue;
|
|
}
|
|
|
|
#block-controls span.block-type {
|
|
background-size: contain;
|
|
display: block;
|
|
width: 18px;
|
|
height: 18px;
|
|
margin: 2px;
|
|
}
|
|
|
|
#block-controls span.block-type.paragraph {
|
|
background-image: url(/images/icons/text-paragraph.svg);
|
|
}
|
|
|
|
#block-controls span.block-type.h1 {
|
|
background-image: url(/images/icons/type-h1.svg);
|
|
}
|
|
|
|
#block-controls span.block-type.h2 {
|
|
background-image: url(/images/icons/type-h2.svg);
|
|
}
|
|
|
|
#block-controls span.block-type.quote {
|
|
background-image: url(/images/icons/chat-square-quote.svg);
|
|
}
|
|
|
|
#block-controls span.block-type.ul {
|
|
background-image: url(/images/icons/list-ul.svg);
|
|
}
|
|
|
|
#block-controls span.block-type.ol {
|
|
background-image: url(/images/icons/list-ol.svg);
|
|
}
|
|
|
|
#block-controls span.block-type.code {
|
|
background-image: url(/images/icons/code.svg);
|
|
}
|
|
|
|
.dropdown {
|
|
z-index: 5;
|
|
display: block;
|
|
position: absolute;
|
|
box-shadow: 0 12px 28px 0 rgba(0, 0, 0, 0.2), 0 2px 4px 0 rgba(0, 0, 0, 0.1),
|
|
inset 0 0 0 1px rgba(255, 255, 255, 0.5);
|
|
border-radius: 8px;
|
|
min-width: 100px;
|
|
min-height: 40px;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.dropdown .item {
|
|
margin: 0 8px 0 8px;
|
|
padding: 8px;
|
|
color: #050505;
|
|
cursor: pointer;
|
|
line-height: 16px;
|
|
font-size: 15px;
|
|
display: flex;
|
|
align-content: center;
|
|
flex-direction: row;
|
|
flex-shrink: 0;
|
|
justify-content: space-between;
|
|
background-color: #fff;
|
|
border-radius: 8px;
|
|
border: 0;
|
|
min-width: 268px;
|
|
}
|
|
|
|
.dropdown .item .active {
|
|
display: flex;
|
|
width: 20px;
|
|
height: 20px;
|
|
background-size: contain;
|
|
}
|
|
button.item.dropdown-item-active {
|
|
background-color: #dfe8fa4d;
|
|
}
|
|
|
|
.dropdown .item:first-child {
|
|
margin-top: 8px;
|
|
}
|
|
|
|
.dropdown .item:last-child {
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.dropdown .item:hover {
|
|
background-color: #eee;
|
|
}
|
|
|
|
.dropdown .item .text {
|
|
display: flex;
|
|
line-height: 20px;
|
|
flex-grow: 1;
|
|
width: 200px;
|
|
}
|
|
|
|
.dropdown .item .icon {
|
|
display: flex;
|
|
width: 20px;
|
|
height: 20px;
|
|
user-select: none;
|
|
margin-right: 12px;
|
|
line-height: 16px;
|
|
background-size: contain;
|
|
}
|
|
.dropdown .item.font-m-Arial {
|
|
font-family: Arial, sans-serif;
|
|
}
|
|
.dropdown .item.font-m-Courier_New {
|
|
font-family: 'Courier New', monospace;
|
|
}
|
|
.dropdown .item.font-m-Georgia {
|
|
font-family: Georgia, serif;
|
|
}
|
|
.dropdown .item.font-m-Roboto {
|
|
font-family: Roboto;
|
|
}
|
|
.dropdown .item.font-m-Times_New_Roman {
|
|
font-family: 'Times New Roman', serif;
|
|
}
|
|
.dropdown .item.font-m-Trebuchet_MS {
|
|
font-family: 'Trebuchet MS', sans-serif;
|
|
}
|
|
.dropdown .item.font-m-Verdana {
|
|
font-family: Verdana, sans-serif;
|
|
}
|
|
.link-editor {
|
|
position: absolute;
|
|
z-index: 100;
|
|
top: -10000px;
|
|
left: -10000px;
|
|
margin-top: -6px;
|
|
max-width: 400px;
|
|
width: 100%;
|
|
opacity: 0;
|
|
background-color: #fff;
|
|
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.3);
|
|
border-radius: 8px;
|
|
transition: opacity 0.5s;
|
|
}
|
|
|
|
.link-editor .link-input {
|
|
display: block;
|
|
width: calc(100% - 24px);
|
|
box-sizing: border-box;
|
|
margin: 8px 12px;
|
|
padding: 8px 12px;
|
|
border-radius: 15px;
|
|
background-color: #eee;
|
|
font-size: 15px;
|
|
color: rgb(5, 5, 5);
|
|
border: 0;
|
|
outline: 0;
|
|
position: relative;
|
|
font-family: inherit;
|
|
}
|
|
|
|
.link-editor div.link-edit {
|
|
background-image: url(/images/icons/pencil-fill.svg);
|
|
background-size: 16px;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
width: 35px;
|
|
vertical-align: -0.25em;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
cursor: pointer;
|
|
}
|
|
.link-editor div.link-trash {
|
|
background-image: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20fill='currentColor'%20class='bi%20bi-trash'%3e%3cpath%20d='M5.5%205.5A.5.5%200%200%201%206%206v6a.5.5%200%200%201-1%200V6a.5.5%200%200%201%20.5-.5zm2.5%200a.5.5%200%200%201%20.5.5v6a.5.5%200%200%201-1%200V6a.5.5%200%200%201%20.5-.5zm3%20.5a.5.5%200%200%200-1%200v6a.5.5%200%200%200%201%200V6z'/%3e%3cpath%20fill-rule='evenodd'%20d='M14.5%203a1%201%200%200%201-1%201H13v9a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V4h-.5a1%201%200%200%201-1-1V2a1%201%200%200%201%201-1H6a1%201%200%200%201%201-1h2a1%201%200%200%201%201%201h3.5a1%201%200%200%201%201%201v1zM4.118%204%204%204.059V13a1%201%200%200%200%201%201h6a1%201%200%200%200%201-1V4.059L11.882%204H4.118zM2.5%203V2h11v1h-11z'/%3e%3c/svg%3e");
|
|
background-size: 16px;
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
width: 35px;
|
|
vertical-align: -.25em;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.link-editor .link-input a {
|
|
color: rgb(33, 111, 219);
|
|
text-decoration: none;
|
|
display: block;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
margin-right: 30px;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.link-editor .link-input a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.link-editor .button {
|
|
width: 20px;
|
|
height: 20px;
|
|
display: inline-block;
|
|
padding: 6px;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
margin: 0 2px;
|
|
}
|
|
|
|
.link-editor .button.hovered {
|
|
width: 20px;
|
|
height: 20px;
|
|
display: inline-block;
|
|
background-color: #eee;
|
|
}
|
|
|
|
.link-editor .button i,
|
|
.actions i {
|
|
background-size: contain;
|
|
display: inline-block;
|
|
height: 20px;
|
|
width: 20px;
|
|
vertical-align: -0.25em;
|
|
}
|
|
|
|
i.undo {
|
|
background-image: url(/images/icons/arrow-counterclockwise.svg);
|
|
}
|
|
|
|
i.redo {
|
|
background-image: url(/images/icons/arrow-clockwise.svg);
|
|
}
|
|
|
|
.icon.paragraph {
|
|
background-image: url(/images/icons/text-paragraph.svg);
|
|
}
|
|
|
|
.icon.large-heading,
|
|
.icon.h1 {
|
|
background-image: url(/images/icons/type-h1.svg);
|
|
}
|
|
|
|
.icon.small-heading,
|
|
.icon.h2 {
|
|
background-image: url(/images/icons/type-h2.svg);
|
|
}
|
|
.icon.h3 {
|
|
background-image: url(/images/icons/type-h3.svg);
|
|
}
|
|
|
|
.icon.bullet-list,
|
|
.icon.ul {
|
|
background-image: url(/images/icons/list-ul.svg);
|
|
}
|
|
|
|
.icon.numbered-list,
|
|
.icon.ol {
|
|
background-image: url(/images/icons/list-ol.svg);
|
|
}
|
|
|
|
.icon.quote {
|
|
background-image: url(/images/icons/chat-square-quote.svg);
|
|
}
|
|
|
|
.icon.code {
|
|
background-image: url(/images/icons/code.svg);
|
|
}
|
|
|
|
.icon.font-family {
|
|
background-image: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20fill='currentColor'%20class='bi%20bi-fonts'%3e%3cpath%20d='M12.258%203h-8.51l-.083%202.46h.479c.26-1.544.758-1.783%202.693-1.845l.424-.013v7.827c0%20.663-.144.82-1.3.923v.52h4.082v-.52c-1.162-.103-1.306-.26-1.306-.923V3.602l.431.013c1.934.062%202.434.301%202.693%201.846h.479L12.258%203z'/%3e%3c/svg%3e")
|
|
}
|
|
/* .icon.font-color {
|
|
background-image: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='14'%20height='14'%20viewBox='0%200%20512%20512'%3e%3cpath%20fill='%23777'%20d='M221.631%20109%20109.92%20392h58.055l24.079-61h127.892l24.079%2061h58.055L290.369%20109Zm-8.261%20168L256%20169l42.63%20108Z'/%3e%3c/svg%3e");
|
|
} */
|
|
.icon.font-color {
|
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23777'%3E%3Cpath d='M15.2459 14H8.75407L7.15407 18H5L11 3H13L19 18H16.8459L15.2459 14ZM14.4459 12L12 5.88516L9.55407 12H14.4459ZM3 20H21V22H3V20Z'%3E%3C/path%3E%3C/svg%3E");
|
|
}
|
|
.icon.bg-color {
|
|
background-image: url("data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2048%2048'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill='%23fff'%20fill-opacity='.01'%20d='M0%200h48v48H0z'/%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M37%2037a4%204%200%200%200%204-4c0-1.473-1.333-3.473-4-6-2.667%202.527-4%204.527-4%206a4%204%200%200%200%204%204Z'%20fill='%23777'/%3e%3cpath%20d='m20.854%205.504%203.535%203.536'%20stroke='%23777'%20stroke-width='4'%20stroke-linecap='round'/%3e%3cpath%20d='M23.682%208.333%208.125%2023.889%2019.44%2035.203l15.556-15.557L23.682%208.333Z'%20stroke='%23777'%20stroke-width='4'%20stroke-linejoin='round'/%3e%3cpath%20d='m12%2020.073%2016.961%205.577M4%2043h40'%20stroke='%23777'%20stroke-width='4'%20stroke-linecap='round'/%3e%3c/svg%3e");
|
|
}
|
|
.icon.left-align, i.left-align {
|
|
background-image: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20fill='currentColor'%20class='bi%20bi-text-left'%3e%3cpath%20fill-rule='evenodd'%20d='M2%2012.5a.5.5%200%200%201%20.5-.5h7a.5.5%200%200%201%200%201h-7a.5.5%200%200%201-.5-.5zm0-3a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5zm0-3a.5.5%200%200%201%20.5-.5h7a.5.5%200%200%201%200%201h-7a.5.5%200%200%201-.5-.5zm0-3a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5z'/%3e%3c/svg%3e");
|
|
}
|
|
|
|
.icon.center-align,i.center-align {
|
|
background-image: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20fill='currentColor'%20class='bi%20bi-text-center'%3e%3cpath%20fill-rule='evenodd'%20d='M4%2012.5a.5.5%200%200%201%20.5-.5h7a.5.5%200%200%201%200%201h-7a.5.5%200%200%201-.5-.5zm-2-3a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5zm2-3a.5.5%200%200%201%20.5-.5h7a.5.5%200%200%201%200%201h-7a.5.5%200%200%201-.5-.5zm-2-3a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5z'/%3e%3c/svg%3e")
|
|
}
|
|
|
|
.icon.right-align,i.right-align {
|
|
background-image: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20fill='currentColor'%20class='bi%20bi-text-right'%3e%3cpath%20fill-rule='evenodd'%20d='M6%2012.5a.5.5%200%200%201%20.5-.5h7a.5.5%200%200%201%200%201h-7a.5.5%200%200%201-.5-.5zm-4-3a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5zm4-3a.5.5%200%200%201%20.5-.5h7a.5.5%200%200%201%200%201h-7a.5.5%200%200%201-.5-.5zm-4-3a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5z'/%3e%3c/svg%3e")
|
|
}
|
|
|
|
.icon.justify-align,i.justify-align {
|
|
background-image: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20fill='currentColor'%20class='bi%20bi-justify'%3e%3cpath%20fill-rule='evenodd'%20d='M2%2012.5a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5zm0-3a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5zm0-3a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5zm0-3a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5z'/%3e%3c/svg%3e")
|
|
}
|
|
|
|
i.indent {
|
|
background-image: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20fill='currentColor'%20class='bi%20bi-text-indent-left'%3e%3cpath%20d='M2%203.5a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5zm.646%202.146a.5.5%200%200%201%20.708%200l2%202a.5.5%200%200%201%200%20.708l-2%202a.5.5%200%200%201-.708-.708L4.293%208%202.646%206.354a.5.5%200%200%201%200-.708zM7%206.5a.5.5%200%200%201%20.5-.5h6a.5.5%200%200%201%200%201h-6a.5.5%200%200%201-.5-.5zm0%203a.5.5%200%200%201%20.5-.5h6a.5.5%200%200%201%200%201h-6a.5.5%200%200%201-.5-.5zm-5%203a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5z'/%3e%3c/svg%3e")
|
|
}
|
|
i.outdent {
|
|
background-image: url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='16'%20height='16'%20fill='currentColor'%20class='bi%20bi-text-indent-right'%3e%3cpath%20d='M2%203.5a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5zm10.646%202.146a.5.5%200%200%201%20.708.708L11.707%208l1.647%201.646a.5.5%200%200%201-.708.708l-2-2a.5.5%200%200%201%200-.708l2-2zM2%206.5a.5.5%200%200%201%20.5-.5h6a.5.5%200%200%201%200%201h-6a.5.5%200%200%201-.5-.5zm0%203a.5.5%200%200%201%20.5-.5h6a.5.5%200%200%201%200%201h-6a.5.5%200%200%201-.5-.5zm0%203a.5.5%200%200%201%20.5-.5h11a.5.5%200%200%201%200%201h-11a.5.5%200%200%201-.5-.5z'/%3e%3c/svg%3e")
|
|
}
|
|
|
|
i.bold {
|
|
background-image: url(/images/icons/type-bold.svg);
|
|
}
|
|
|
|
i.italic {
|
|
background-image: url(/images/icons/type-italic.svg);
|
|
}
|
|
|
|
i.underline {
|
|
background-image: url(/images/icons/type-underline.svg);
|
|
}
|
|
|
|
i.strikethrough {
|
|
background-image: url(/images/icons/type-strikethrough.svg);
|
|
}
|
|
|
|
i.code {
|
|
background-image: url(/images/icons/code.svg);
|
|
}
|
|
|
|
i.link {
|
|
background-image: url(/images/icons/link.svg);
|
|
}
|
|
i.horizontal-rule {
|
|
background-image: url(/images/icons/horizontal-rule.svg);
|
|
}
|
|
|
|
i.left-align {
|
|
background-image: url(/images/icons/text-left.svg);
|
|
}
|
|
|
|
i.center-align {
|
|
background-image: url(/images/icons/text-center.svg);
|
|
}
|
|
|
|
i.right-align {
|
|
background-image: url(/images/icons/text-right.svg);
|
|
}
|
|
|
|
i.justify-align {
|
|
background-image: url(/images/icons/justify.svg);
|
|
}
|