1
0
mirror of https://github.com/processwire/processwire.git synced 2025-08-16 11:44:42 +02:00

Updates to TinyMCE content.css styles, primarily to make more readable code and pre element styles

This commit is contained in:
Ryan Cramer
2025-07-18 16:30:13 -04:00
parent 95cca5ad62
commit 0da85dd55c
2 changed files with 31 additions and 14 deletions

View File

@@ -6,7 +6,8 @@
margin: 1rem; margin: 1rem;
font-size: 16px; font-size: 16px;
color: var(--text-color, #333); color: var(--text-color, #333);
background: var(--inputs-background, #f8f8f8); /*background: var(--inputs-background, #f8f8f8);*/
background: transparent;
} }
a { a {
text-underline-offset: 0.125em; text-underline-offset: 0.125em;
@@ -59,7 +60,7 @@ a {
.mce-content-body code { .mce-content-body code {
border-radius: 3px; border-radius: 3px;
padding: 0.1rem 0.2rem; padding: 0.1rem 0.2rem;
background-color: var(--muted-color, #f5f2f0); /* background-color: var(--muted-color, #f5f2f0); */
color: var(--text-color, #222); color: var(--text-color, #222);
font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
} }
@@ -233,19 +234,35 @@ a > .mce-content-body img {
outline: 1px solid var(--main-color, #0782c1); outline: 1px solid var(--main-color, #0782c1);
} }
.mce-content-body pre { .mce-content-body pre {
color: #333; /*border: 1px dashed var(--border-color, #ccc);*/
border: 1px dashed var(--border-color, #ccc); /*padding: 0.5rem 1rem !important;*/
padding: 0.5rem 1rem !important; border: 0;
white-space: pre-wrap; white-space: pre-wrap;
word-wrap: break-word; word-wrap: break-word;
-moz-tab-size: 4; -moz-tab-size: 4;
-o-tab-size: 4; -o-tab-size: 4;
-webkit-tab-size: 4; -webkit-tab-size: 4;
tab-size: 4; tab-size: 4;
font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
font-size: 15px;
color: light-dark(#333, #fff);
background: light-dark(#eee, #333);
font-size: 0.9375rem;
margin: 0.5em 0;
padding: 0.5rem 1rem;
border-radius: 4px;
}
.mce-content-body code {
font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
font-size: 15px;
color: light-dark(#333, #fff);
background-color: light-dark(#eee, #333);
} }
.mce-content-body pre code { .mce-content-body pre code {
background-color: initial; background-color: initial;
} }
/*
.mce-content-body pre[class*="language-"] { .mce-content-body pre[class*="language-"] {
font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
font-size: 0.9375rem; font-size: 0.9375rem;
@@ -254,5 +271,4 @@ a > .mce-content-body img {
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
color: var(--muted-color, #777); color: var(--muted-color, #777);
} }
*/
/*# sourceMappingURL=wire.css.map */

View File

@@ -844,13 +844,6 @@ var InputfieldTinyMCE = {
this.debug = ProcessWire.config.InputfieldTinyMCE.debug; this.debug = ProcessWire.config.InputfieldTinyMCE.debug;
this.isDocumentReady = true; this.isDocumentReady = true;
this.log('documentReady', this.editorIds); this.log('documentReady', this.editorIds);
while(this.editorIds.length > 0) {
var editorId = this.editorIds.shift();
this.init(editorId, 'documentReady');
}
this.initDocumentEvents();
var $placeholders = jQuery('.' + this.cls.placeholder + ':visible');
if($placeholders.length) this.initPlaceholders($placeholders);
this.onSetup(function(editor) { this.onSetup(function(editor) {
editor.on('focus', function(e) { editor.on('focus', function(e) {
@@ -861,6 +854,14 @@ var InputfieldTinyMCE = {
}); });
}); });
while(this.editorIds.length > 0) {
var editorId = this.editorIds.shift();
this.init(editorId, 'documentReady');
}
this.initDocumentEvents();
var $placeholders = jQuery('.' + this.cls.placeholder + ':visible');
if($placeholders.length) this.initPlaceholders($placeholders);
if(this.debug) { if(this.debug) {
this.log('qty', this.log('qty',
'normal=' + jQuery('.' + this.cls.normal).length + ', ' + 'normal=' + jQuery('.' + this.cls.normal).length + ', ' +