[Tintenklecks]

Hallo!

Ich bin leider über die Suche nicht fündig geworden, und hoffe überdies hier im richtigen Bereich zu sein. 

Ich nutze bei meinem farbmodifizierten MyBB Default-Theme den Office-Editor (den ich auch nicht austauschen kann, da einige User den unbedingt wollen). 

Nun ist dieser hellblau und bringt auch einen ebensolchen Farbverlauf im Hintergrund mit, was zu meinem dunkelgrünen Theme doch sehr unschön aussieht. Ändern kann man das aber scheinbar nicht in der global.css, sondern nur in der office.css im jscripts-Ordner. Dort gelten die Änderungen jedoch für alle Themes, was ich wiederum auch nicht möchte. 

Frage: Gibt es eine Möglichkeit, den Office-Editor so anzupassen, dass es nur spezifisch für ein einzelnes Theme gilt? 

Vielen Dank im Voraus 

[Schnapsnase]

Frage: Gibt es eine Möglichkeit, den Office-Editor so anzupassen, dass es nur spezifisch für ein einzelnes Theme gilt?

So einfach nicht. Der Editor wird mittels Javascript generiert und auch erst dann wir das CSS eingebunden.
Eine Möglichkeit wäre (ungetestet):
Erstelle eine eigene xyz.css. Definiere dort die Klassen oder ID`s aus Deiner office.css, nur eben nach Deinen Wünschen abgeändert.
Diese xyz.css musst Du dann in den Templates "newthread", "newreply" und "editpost" einbinden nachdem der Editor generiert wurde. Also z.B. ganz unten nach {$footer}.
Somit werden die entsprechenden css-Angaben aus der office.css überschrieben.

Probier`s aus.

[StefanT]

Im Prinzip müsste es auch über das Stylesheet des Themes möglich sein. Der Selektor muss nur spezifischer sein oder es muss mit !important gearbeitet werden.

[Schnapsnase]

Hallo Stefan!

Ja "important" könnte funktionieren. Ich bin prinzipiell dagegen, solche Dinge in der global.css zu definieren.
Wenn ich es da nicht mit Kommentaren versehe, weiß ich nach einem Jahr nicht mehr, ob`s zu MyBB gehört oder selfmade ist.
Jaaa, das kann am Alter liegen , und es kann jeder tun, wie er gern möchte.

Grüße

[Tintenklecks]

Vielen Dank für die Tipps, ihr zwei! 

Ich bin ja experimentierfreudig 

Das teste ich jedenfalls mal und werde berichten! 

Liebe Grüße 

[[ExiTuS]]

[...] Ich bin prinzipiell dagegen, solche Dinge in der global.css zu definieren.
Wenn ich es da nicht mit Kommentaren versehe, weiß ich nach einem Jahr nicht mehr, ob`s zu MyBB gehört oder selfmade ist.

Daher sollte man die selbsterstellten Klassen immer mit eigenem Prefix versehen
nase_class1 { ... }
nase_class2 { ... }

[ExiTuS]

[StefanT]

Was in diesem Fall wohl eher nicht möglich ist...

[Tintenklecks]

Hey hey! 

Also es klappt soweit nach der Anleitung von Schnapsnase!   

Ich mußte allerdings jeweils ein separates Stylesheet für Toolbar, Group und Container erstellen und verlinken, anders hat er es nicht genommen. Was aber soweit auch kein Problem war. 

Jetzt frage ich mich aber, da ich die CSS-Dateien ja in den Default Templates hinterlegt habe, ob die nicht auch wieder von allen Themes genutzt werden? Oder müsste ich dann wieder neue erstellen und verlinken? Das könnte ein ziemlicher Rattenschwanz werden wenn man mal mehrere Themes hat... 

Für das mit den Klassen in der Global.css bin ich wohl leider zu doof, oder hat vielleicht jemand nen Tip wie die aussehen müssen und wo die hingehören?


Liebe Grüße!

[Schnapsnase]

Ich hatte es so verstanden, dass Du die Änderungen nur in einem Theme haben möchtest.
Dann musst Du die CSS natürlich auch nur in diesem einen Theme einbinden.  

Warum Du mehrere CSS-Dateien angelegt hast kann ich momentan nicht nachvollziehen.
Das sollte sich alles in einer definieren lassen.

[Tintenklecks]

Das hattest du auch richtig verstanden!  

Da aber mein Theme ein vom Default vererbtes ist, hat es keine eigenen Templates. Wegen schlechter Erfahrungen installiere ich keine Fremd-Themes mehr, sondern erstelle nur noch selbst welche auf Basis des Default-Themes. Deswegen werden wohl auch zukünftige Themes dieselben Templates nutzen. Daher meine Frage 

Hmmm... das ist interessant. Hier mal meine CSS-Datei "mit alles": 

Code:

/* Stylesheet für Office Editor Woodlands-Theme */

div.sceditor-toolbar {
  border-bottom: 1px solid #031A0B;
  background: #859672;
  background: -moz-linear-gradient(top, #859672 0%, #7F906D 29%, #788A68 61%, #728363 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #859672), color-stop(29%, #7F906D), color-stop(61%, #788A68), color-stop(100%, #728363));
  background: -webkit-linear-gradient(top, #859672 0%, #7F906D 29%, #788A68 61%, #728363 100%);
  background: -o-linear-gradient(top, #859672 0%, #7F906D 29%, #788A68 61%, #728363 100%);
  background: -ms-linear-gradient(top, #859672 0%, #7F906D 29%, #788A68 61%, #728363 100%);
  background: linear-gradient(to bottom, #859672 0%, #7F906D 29%, #788A68 61%, #728363 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#859672', endColorstr='#728363', GradientType=0);
}

div.sceditor-group {
  border: 1px solid #031A0B;
  background: transparent;
  padding: 0;
  background: #B5CC9B;
  background: -moz-linear-gradient(top, #B5CC9B 24%, #ACC394 38%, #A3BA8D 99%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(24%, #B5CC9B), color-stop(38%, #ACC394), color-stop(99%, #A3BA8D));
  background: -webkit-linear-gradient(top, #B5CC9B 24%, #ACC394 38%, #A3BA8D 99%);
  background: -o-linear-gradient(top, #B5CC9B 24%, #ACC394 38%, #A3BA8D 99%);
  background: -ms-linear-gradient(top, #B5CC9B 24%, #ACC394 38%, #A3BA8D 99%);
  background: linear-gradient(to bottom, #B5CC9B 24%, #ACC394 38%, #A3BA8D 99%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#B5CC9B', endColorstr='#A3BA8D, GradientType=0);
}

.sceditor-container {
  background: #859672;
  background: -moz-linear-gradient(top, #859672 0%, #788A68 39%, #6B7D5D 64%, #374C34 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #859672), color-stop(39%, #C9C9C9), color-stop(64%, #6B7D5D), color-stop(100%, #374C34));
  background: -webkit-linear-gradient(top, #859672 0%, #788A68 39%, #6B7D5D 64%, #374C34 100%);
  background: -o-linear-gradient(top, #859672 0%, #788A68 39%, #6B7D5D 64%, #374C34 100%);
  background: -ms-linear-gradient(top, #859672 0%, #788A68 39%, #6B7D5D 64%, #374C34 100%);
  background: linear-gradient(top, #859672 0%, #788A68 39%, #6B7D5D 64%, #374C34 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#859672', endColorstr='#374C34', GradientType=0);
}

Davon wird aber nur der erste Teil übernommen wenn ich die einbinde. Kann auch sein dass ein Fehler drin ist, aber da die Darstellung stimmt wenn ich für jedes Element ein eigenes Stylesheet erstelle, hab ich so keinen gefunden