altes TB2 Theme in neue TB3 userchrome.css "retten"?[erl.]

graba

Hallo,

Zitat von "Rianna"

Ja, einen Screenshot kann ich natürlich machen, aber leider kann man ihn hier nirgends direkt hochladen. Das hatte ich gemeint. Auf meinen privaten Webspace möchte ich ihn logischerweise auch nicht laden, dann ist er ja nicht mehr anonym. Hier im Netz geht heute abend mal wieder gar nix mehr. Ich schau mal morgen nach einem anonymen Bilderhoster.

auch die Informationen zu Bildhostern sind in den Links enthalten!

muellerpaul

Hallo,

Zitat von "Rianna"

Ich schau mal morgen nach einem anonymen Bilderhoster

dann lässt sich zu deinem obigen Problem auch leichter etwas sagen. Jetzt erst mal Thema Folder-Icons:

Für die Icons der Folder pane ist mir - nach kurzem stöbern in den Modoki-Dateien - eine äußerst praktische Vorgehensweise eingefallen Der Code aus der dort vorhandende "folderPane.css" kann nämlich komplett für die userChrome übernommen werden! Sie ist zu finden unter chrome\messenger\folderPane.css Es muss jetzt natürlich immer die url der Icons angepasst werden und jeweils ein beherztes " !important;" hinter jedes Attribut angefügt werden. Ich hab das mal auf den Screenshots verdeutlicht. Sollte eigentlich ganz fix gehen, wenn du es mit dem Sortieren der Icons-png. doch ein klein wenig anders handhabst, als vorhin beschrieben, weil: Die Folder Icons liegen ja auch als einzelne Bilddateien vor und liegen - im Modoki-Theme - zusammen mit den Thread-Icons ja schon in dem Ordner "icons". Du kannst also diesen Ordner komplett in deinen chrome-Ordner kopieren und jetzt - wie schon gesagt - den kopierten Code der folderPane.css editiern.

Externer Inhalt www.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Externer Inhalt www.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Falls du noch die Icons u. den Code für RSS-Feeds benötigts - die sind in der folderPane.css nicht enthalten - ginge die Methode analog mit der "newsBlogOverlay.css", die auch komplett übernommen werden kann. Die dazugehörigen Icons liegen zusammen mit der *.css: chrome\messenger-newsblog

Gruß
muellerpaul

Rianna

Hallo muellerpaul und graba,

hier kommt nun, hoffentlich, mal ein Screenshot:

Externer Inhalt www.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Bei der Header Pane kommen komischerweise nur die Symbole für Delete und Junk, obwohl ja in der toolbar-small alle drin sind.

Im Menü oben kommt nun alles bis auf Compact, das Symbol gab es damals nicht, da muss ich ein neues machen, brauche nur noch den Code.

Leider hat das mit der Folder Pane irgendwie nicht funktioniert, obwohl ich es genau nach Anleitung gemacht habe (Icon Ordner kopiert und die Pfadangaben/important eingefügt).

Hier sind meine userchrome Angaben zur Folder Pane:

/* ::::: Folder Pane ::::: */

treechildren::-moz-tree-image(folderNameCol) {
margin-right: 2px;
list-style-image: url("icons/folder-closed.png") !important;
}

treechildren::-moz-tree-image(folderNameCol, selected, open) {
list-style-image: url("icons/folder-open.png") !important;
}

treechildren::-moz-tree-image(folderNameCol, selected, open, newMessages-true) {
list-style-image: url("icons/folder-new-open.png") !important;
}

treechildren::-moz-tree-image(folderNameCol, newMessages-true) {
list-style-image: url("icons/folder-new-closed.png") !important;
}

/* ..... Inbox ..... */

treechildren::-moz-tree-image(folderNameCol, specialFolder-Inbox) {
list-style-image: url("icons/folder-inbox.png") !important;
}

treechildren::-moz-tree-image(folderNameCol, specialFolder-Inbox, newMessages-true) {
list-style-image: url("icons/folder-inbox-new.png") !important;
}

/* ..... Sent ..... */

treechildren::-moz-tree-image(folderNameCol, specialFolder-Sent) {
list-style-image: url("icons/folder-sent.png") !important;
}

/* ..... Unsent ..... */

treechildren::-moz-tree-image(folderNameCol, specialFolder-Unsent Messages) {
list-style-image: url("icons/folder-outbox.png") !important;
}

/* ..... Drafts ..... */

treechildren::-moz-tree-image(folderNameCol, specialFolder-Drafts) {
list-style-image: url("icons/folder-draft.png") !important;
}

/* ..... Templates ..... */

treechildren::-moz-tree-image(folderNameCol, specialFolder-Templates) {
list-style-image: url("icons/folder-template.png") !important;
}

/* ..... Junk ..... */

treechildren::-moz-tree-image(folderNameCol, specialFolder-Junk) {
list-style-image: url("icons/folder-junk.png") !important;
}

/* ..... Trash ..... */

treechildren::-moz-tree-image(folderNameCol, specialFolder-Trash) {
list-style-image: url("icons/folder-trash.png") !important;
}

/* ..... Servers ..... */

treechildren::-moz-tree-image(folderNameCol, isServer-true) {
list-style-image: url("icons/server-mail.png") !important;
}

treechildren::-moz-tree-image(folderNameCol, biffState-NewMail, isServer-true) {
list-style-image: url("icons/server-mail-new.png") !important;
}

treechildren::-moz-tree-cell-text(folderNameCol, biffState-NewMail, isServer-true),
treechildren::-moz-tree-cell-text(folderNameCol, newMessages-true),
treechildren::-moz-tree-cell-text(folderNameCol, specialFolder-Inbox, newMessages-true) {
font-weight: bold !important;
color: blue !important;
}
treechildren::-moz-tree-cell-text(folderNameCol, biffState-NewMail, isServer-true, selected),
treechildren::-moz-tree-cell-text(folderNameCol, newMessages-true, selected),
treechildren::-moz-tree-cell-text(folderNameCol, specialFolder-Inbox, newMessages-true, selected) {
color: black !important;
}
treechildren::-moz-tree-cell-text(folderNameCol, biffState-NewMail, isServer-true, selected, focus),
treechildren::-moz-tree-cell-text(folderNameCol, newMessages-true, selected, focus),
treechildren::-moz-tree-cell-text(folderNameCol, specialFolder-Inbox, newMessages-true, selected, focus) {
color: HighlightText !important;
}

/* ..... Server Folders ..... */

treechildren::-moz-tree-image(folderNameCol, isServer-true, serverType-pop3, isSecure-true) {
list-style-image: url("icons/server-remote-lock.png") !important;
}

treechildren::-moz-tree-image(folderNameCol, isServer-true, serverType-imap, isSecure-true) {
list-style-image: url("icons/server-remote-lock.png") !important;
}

treechildren::-moz-tree-image(folderNameCol, biffState-NewMail, isServer-true, isSecure-true) {
list-style-image: url("icons/server-remote-lock-new.png") !important;
}

treechildren::-moz-tree-image(folderNameCol, isServer-true, serverType-none) {
list-style-image: url("icons/server-local.png") !important;
}

/* ..... News Folders ..... */

treechildren::-moz-tree-image(folderNameCol, serverType-nntp) {
list-style-image: url("icons/folder-newsgroup.png") !important;
}

treechildren::-moz-tree-image(folderNameCol, isServer-true, serverType-nntp) {
list-style-image: url("icons/server-news.png") !important;
}

treechildren::-moz-tree-image(folderNameCol, isServer-true, serverType-nntp, isSecure-true) {
list-style-image: url("icons/server-news-lock.png") !important;
}

/* ..... Saved Search Folder ..... */

treechildren::-moz-tree-image(folderNameCol, specialFolder-Virtual) {
list-style-image: url("icons/folder-search.png") !important;
}

Im Moment sehe ich den Fehler nicht....

Vielen Dank,
Rianna

muellerpaul

Hallo Rianna,

die Symbolleiste im Menü und die Icons in der Thread pane scheinen ja schon mal zu funktionieren - bis auf den komischen Besen

Für mich sieht es so aus, als ob du für die Headerpane-Buttons den 1. Code für "ohne installierten CompactHeader" in deiner userChrome übernommen hast - weil z.Zt. dort nur der Junk- und Löschen-Button korrekt angezeigt wird. Außerdem hast du dort einen Button zu liegen, vom dem bislang noch nicht die Rede war -> "Verschieben", bzw. hast du dafür noch keinen Code.

Ich schrieb ja, als ich den "versteckten" Hinweis von dir bekam das du CompactHeader installiert hast - und du damit ja zusätzliche Buttons in die Header pane ziehen kannst,
dass es dann wegen der kleinern Icons dort, noch 'ne zusätzliche Bezeichung im Code bedarf, um sie von den größeren Icons - die man ja auch in die Symbolleiste ziehen könnte - unterscheidbar zu machen. Ausgenommen scheinen da Junk- u. Lösch-Button zu sein, die "automatisch" vergrößert/verkleinert werden. Der Programmcode macht das irgendwo, wir machen ja nur "Basteln" mit Hilfe der userChrome

An der Stelle liegt dann bei mir der Fehler im 2. Header-Code - Löschen u. Junk funktionieren garnicht mit dem Zusatz. Weil bei mir auch noch der 1. Header-Code aktiv ist,
hat es hier dann komplett funktioniert.

Wenn es nicht an dem ist, dann kann es eigentlich nur ein "Schreibfehler" o. ein von dir unbemerkt gesetztes Zeichen sein, das den Code u.U. unterbricht. Also nochmal alles
in Ruhe prüfen - bei mir würde es passen. " * " und " / " können die Übeltäter seien.

Jetzt nochmal die Combi aus 1 + 2 für die Header pane, für mit installiertem CompactHeader:

CSS

/* Header pane Buttons mit installiertem CompactHeader */




/* CompactHeader - Adressbuch */
#button-address.msgHeaderView-button  {
  list-style-image: url(mail-toolbar-small.png) !important;
  -moz-image-region: rect(23px 69px 46px 46px) !important;
}

/* CompactHeader - Antworten */
#button-reply.msgHeaderView-button,
#button-replytosender.msgHeaderView-button {
  list-style-image: url(mail-toolbar-small.png) !important;
  -moz-image-region: rect(23px 92px 46px 69px) !important;
}




/* CompactHeader - allen antworten */
#button-replyall.msgHeaderView-button {
   list-style-image: url(mail-toolbar-small.png) !important;
  -moz-image-region: rect(23px 115px 46px 92px) !important;
}
 
/* CompactHeader - weiterleiten */
#button-forward.msgHeaderView-button {
   list-style-image: url(mail-toolbar-small.png) !important;
  -moz-image-region: rect(23px 138px 46px 115px) !important;
}
 
/* CompactHeader - archivieren */
#button-archive.msgHeaderView-button {
   list-style-image: url(mail-toolbar-small.png) !important;
  -moz-image-region: rect(23px 230px 46px 207px) !important;
}
 
/* mit u. ohne CompactHeader - Junk */
#hdrJunkButton {
   list-style-image: url(mail-toolbar-small.png) !important;
  -moz-image-region: rect(23px 184px 46px 161px) !important;
}
 
/* mit u. ohne CompactHeader - Löschen */
#hdrTrashButton {
  list-style-image: url(mail-toolbar-small.png) !important;
  -moz-image-region: rect(23px 161px 46px 138px) !important;  
}

Alles anzeigen

Bei der Folder pane ist dein Code korrekt u. funktioniert hier! Deshalb die userChrome daraufhin überprüfen ob mittendrin irgend etwas falsch gesetzt ist
und somit der Code inaktiv ist - wäre hier mit Notepad++ sehr schell zu erkennen. Das die Icons vielleicht am "falschen" Ort liegen, kann man glaube ich
ausschließen, sonst wären unter der url keine Icons zu finden - also auch nicht die Standard-Icons zu sehen. Aber prüfen kannst du es trotzdem...

BTW, weshalb hast du den Part "All Servers" nicht übernommen?

Externer Inhalt www.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Gruß
muellerpaul

Rianna

Hallo muellerpaul,

anhand Deiner neuen Infos präsentiere ich nun den aktuellen Screenshot:

Externer Inhalt www.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Die Folder Pane funktioniert nun tatsächlich, ich bin nochmal alles durchgegangen und hatte irgendwo eine geschweifte Klammer "verloren". Ich habe einen Programmiereditor, der die Texte und Kommentare von den Codes farblich unterscheidet, aber die userchrome ist mittlerweile so groß, dass ich die fehlende Klammer mittendrin erst nicht bemerkt habe.

Den Besen hab ich nun auch ersetzt, ich habe einfach mal kühn spekuliert, dass der Befehl vielleicht button-compact heißen könnte

In der Header Pane ist nun auch alles da ausser den Options und "File" (nicht zu verwechseln mit Archivieren, das ist was anderes, den File Button brauche ich). Ich glaube, da fehlen einfach noch die Codes.

Dann könnten wir uns ja an die Codes für eine Antwortmail machen, da stehen im Moment ja noch die classic drin.

Sieht doch schon gut aus, finde ich! Ich habe als Vergleich auch einmal mein jetziges TB2 hochgeladen.

Externer Inhalt img3.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Ganz werden wir vermutlich nicht rankommen, aber es nähert sich an...

All Servers habe ich übernommen, nur vergessen hier rein zu kopieren. In der userchrome ist es aber drin.

Vielen Dank,
Rianna

muellerpaul

Hallo Rianna,

hey, den Besen hast du ja super passend hinbekommen - und überhaupt, es wird doch langsam. Auf die Idee einen Screenshot deines im TB 2 verwendeten Theme ins Forum zu stellen, da hätten wir auch mal eher darauf kommen können. Ich hatte Anfangs das Theme optisch nur aus den Bildkarten/Einzelbilder der Icons vorliegen.

Bei dem noch fehlenden Icon des Verschieben-Buttons in der Headerpane, ist mir allerdings noch immer nicht klar, welcher es auf der Bildkarte mail-toolbar-small.png / mail-toolbar-small-2.png sein könnte - das weißt du viel besser. Deshalb nur der Code des Button:

CSS

/* CompacctHeader - Verschieben */
#button-file {
  list-style-image: url(mail-toolbar-small(-2).png) !important;
  -moz-image-region: rect(?px ?px ?px ?px) !important;  
}

So, jetzt noch die Buttons der Symbolleiste im Verfassenfenster. Da habe ich mal vorsichtshalber alle verfügbaren genommen, die man sich dort über "Symbolleiste anpassen" hinein ziehen könnte. Die verwendetet Bildkarte liegt unter chrome\messenger\messengercompose -> compose-toolbar.png

CSS

/* Verfassenfenster - Menü/Symbolleiste Buttons - */




/* Senden */
#button-send {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(24px 24px 48px 0px) !important;
}




#button-send[disabled="true"] {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(0px 24px 24px 0px) !important;
}




/* Kontakte */
#button-contacts {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(24px 48px 48px 24px) !important;
}




#button-contacts[disabled="true"] {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(0px 48px 24px 24px) !important;
}




/* Rechtschreibprüfung */
#spellingButton {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(24px 72px 48px 48px) !important;
}




#spellingButton[disabled="true"] {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(0px 72px 24px 48px) !important;
}




/* Anhang anfügen */
#button-attach {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(24px 96px 48px 72px) !important;
}




#button-attach[disabled="true"] {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(0px 96px 24px 72px) !important;
} 




/* Sicherheitseinstellungen */
#button-security {
  list-style-image: url(compose-toolbar.png) !important; 
  -moz-image-region: rect(24px 120px 48px 96px) !important;
}




#button-security[disabled="true"] {
  list-style-image: url(compose-toolbar.png) !important; 
  -moz-image-region: rect(0px 120px 24px 96px) !important;
}  




/* Speichern */
#button-save {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(24px 144px 48px 120px) !important;
}




#button-save[disabled="true"] {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(0px 144px 24px 120px) !important;
}




/* Zitieren */
#quoteButton {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(24px 168px 48px 144px) !important;
}




#quoteButton[disabled="true"] {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(0px 168px 24px 144px) !important;
}




/* Ausschneiden */
#cut-button {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(24px 192px 48px 168px) !important;
}




#cut-button[disabled="true"] {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(0px 192px 24px 168px) !important;
}




/* Kopieren */
#copy-button {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(24px 216px 48px 192px) !important;
}




#copy-button[disabled="true"] {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(0px 216px 24px 192px) !important;
}




/* Einfügen */
#paste-button {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(24px 240px 48px 216px) !important;
}




#paste-button[disabled="true"] {
  list-style-image: url(compose-toolbar.png) !important;
  -moz-image-region: rect(0px 240px 24px 216px) !important;
}

Alles anzeigen

Die jetzt noch fehlenden Buttons aus deiner Symbolleiste des TB2er, würden dann noch folgen falls du sie benötigtst. Für die Icons in der Tab-Leiste sehe ich im Moment noch schwarz, weil mir nicht klar ist, wie die Icons mit den Ordnern dort gekoppelt sind. Ich hatte ja gehofft, dass sie automatisch aus der Folder pane übernommen werden. Ausblenden ist kein Problem u. finde ich besser, als dort nicht mehr passende Icons des Standard-Theme vor Augen zu haben.

CSS

/* Tabs-Icons ausblenden */
.tab-icon-image {
  list-style-image: none !important;
}

Gruß
muellerpaul

muellerpaul

Hallo nochmal,

ich sehe gerade, dass deine Icons im Verfassenfenster des TB2 ein anderes Design haben, als die mir vorliegenden Bilddateien. Kann also sein, dass ich ein anderes Versionspaket zur Verfügung habe und die Bildpositionen u.U. im Code ebenfalls nicht mehr hinhauen. Musste dann ggf. Anpassen.

Externer Inhalt www.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Gruß
muellerpaul

Rianna

Morgen muellerpaul,

anbei der neueste Screenshot:

Externer Inhalt www.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Die Tabicons habe ich nun wie vorgeschlagen ausgeblendet.

Die Header Pane ist bis auf das Options Icon nun fertig, das gab es natürlich nicht, da muss ich ein neues machen. Hast Du da zufällig den Code?

Das Verschieben Bild ist übrigens die Kladde mit dem Pfeil nach unten.

Im Verfassen Fenster habe ich inzwischen das Geheimnis der verschiedenen Icons gelöst, offenbar gab es mal ein Update und im Theme liegen aber nach wie vor beide Versionen vor. Die Icons, die Du drin hast, sind die alten, meine die neueren. Die liegen im ausgepackten Theme unter messenger/modoki. Ich habe sie in die chrome kopiert, allerdings haben wie Du schon befürchtet hast die Werte alle nicht gestimmt, aber nun habe ich sie angepasst. Blöd ist nur, dass im Verfassen Fenster beim Anklicken die kleinen Pfeile für die weiteren Optionen nicht mit angehoben werden, anscheinend müsste dafür der definierte Bereich der einzelnen Links größer sein. Kann man da irgendwie Breitenangaben machen?

Welche Icons ich vielleicht sonst noch brauche, muss ich mal sehen.

Leider ist das classic Theme ja so, dass beim Drüberfahren und Dnklicken ein Teil der Leiste optisch herausgehoben wird, im Modoki hatte ich einfach nur verschieden eingefärbte Buttons, wie man ja auch an den toolbar pgn sieht. Ich vermute aber, das kann man nicht ändern.

Siehst Du eine Möglichkeit, den leichten Farbverlauf im Hintergrund reinzukriegen?

Edit: Ich sehe gerade, die Reihenfolge der Folder ist bei 3 anders, brauche ich da wieder ein Add-On, um die umzusortieren? Ich hätte die Outbox gerne unter der Inbox.

Vielen Dank,
Rianna

muellerpaul

Hallo Rianna,

ich habe immer noch keinen Plan, wer/was dieses Opitions-Button sein soll. Erklär doch mal die Funktion - dann wird's für mich vielleicht deutlicher.

Zu den "gehoverten" Menübuttons: Klar, die Bildkarten geben es ja her, dass für verschiedene Zustände andere Farbreihen genommen werden können. Dann müssen halt auch alle Zustände für jeden Button im Code berücksichtigt werden: able / hover / hover + active / disabled. Zuerst muß dann die derzeitige Standard-Markierung der Buttons aufgehoben werden. Die "Ausklapppfeile" lassen sich natürlich auch hervorheben, wenn der Button able ist und gehovert wird. Die beiden Sachen würde ich dem Button-Code voranstellen.

CSS

/* Standard-Markierung Menü-Buttons aufheben */
.toolbarbutton-menubutton-button,
.toolbarbutton-1 {
  -moz-appearance: none !important;
  border: none !important;
}  




/* Dropmaker hervorheben */
.toolbarbutton-1:hover .toolbarbutton-menubutton-dropmarker {
  border-top: 1px solid white !important;
  border-right: 1px solid #808080 !important;
  border-bottom: 1px solid #808080 !important;
  border-left: 1px solid white !important;
  margin-top: 8px !important;
  margin-bottom: 8px !important;  
}




.toolbarbutton-1:hover .toolbarbutton-menubutton-dropmarker[disabled="true"] {
  border: none !important;
}

Alles anzeigen

Jetzt musst du halt noch sämtlichen Button-Code editieren, damit die Positionen auf den Bildkarten den einzelnen Zuständen zugeordnet werden. An einem Beispiel hab ich es mal gemacht:

CSS

/* Abrufen */
#button-getmsg {
  list-style-image: url(mail-toolbar.png) !important;
  -moz-image-region: rect(32px 32px 64px 0px) !important;
}
#button-getmsg:hover {
  list-style-image: url(mail-toolbar.png) !important;
  -moz-image-region: rect(64px 32px 96px 0px) !important;
}




#button-getmsg:hover:active {
  list-style-image: url(mail-toolbar.png) !important;
  -moz-image-region: rect(96px 32px 128px 0px) !important;
}




#button-getmsg[disabled] {
  list-style-image: url(mail-toolbar.png) !important;
  -moz-image-region: rect(0px 32px 32px 0px) !important;
}

Alles anzeigen

So... ;-), an deimem letzten Screenshotist ist mir noch aufgefallen, dass im Verfassenfenster etwas durcheinander gekommen ist. Den letzten 2 Buttons hast du nicht unbedingt schlüssige Icons zugeordnet.

Externer Inhalt www.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Sortierung Folder: Manually sort folders

Gruß
muellerpaul

Rianna

Hallo muellerpaul,

der Options Button ist der im Header Pane ganz rechts, den man hat, wenn man CompactHeader installiert hat. Dieses komische kleine Zahnrad oder was immer das sein soll...

Laut meinem alten TB2 sind die Buttons im Antwortfenster korrekt, auch wenn sie in der Tat irgendwie nicht so passend aussehen. Vor allem beim Paste Button ist mir schleierhaft, was der darstellen soll. Da müsste man mal den Modoki Macher fragen...

Mit den hover Buttons beschäftige ich mich dann morgen.

Vielen Dank,
Rianna

muellerpaul

Zitat

Dieses komische kleine Zahnrad oder was immer das sein soll...

heißt im Code:

Code

#hdrOtherActionsButton

Zitat

Vor allem beim Paste Button ist mir schleierhaft, was der darstellen soll. Da müsste man mal den Modoki Macher fragen...

Wie es jetzt auf deinem Screen im Forum zu sehen ist - Gefäß->einfüllen/einfügen - ist das eigentlich schon klar.

Meine Anmerkung bezog sich auf eine ältere Version deines Screens, den ich hier als Feed hatte...;-)

http://img3.fotos-hochladen.net/uploads/tb3modokiinc2jr5xfvlqh.jpg

Gruß
muellerpaul

Rianna

Hallo muellerpaul,

ach so, da habe ich nochmal dran rumgebastelt, weil wegen der geänderten Koordinaten zunächst ein paar falsche Buttons eingezogen wurden. Das Paste Gefäß finde ich trotzdem etwas eigenwillig

Jetzt muss ich mal sehen, dass ich das Zahnrad loswerde und dann hoffe ich, dass ich heute noch zu den hover Buttons komme.

Vielen Dank,
Rianna

Rianna

Hallo muellerpaul,

ich bin gerade an den hover Buttons dran, aber nun ist mir etwas aufgefallem im Vergleich zum TB2.

Dort erscheinen die Pfeile erst, wenn man mit der Maus über den Button fährt, im TB3 sind sie von vornherein da. Der Pfeil ist auch ein Bild aus dem Modoki Theme und wird offenbar beim Drauffahren neu aufgerufen, so wie es aussieht. Ich hoffe, ich habe das jetzt irgendwie verständlich erklärt. Anbei ein Screenshot von TB2, der es hoffentlich verdeutlicht.

Externer Inhalt img3.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Vielen Dank,
Rianna

muellerpaul

Hallo Rianna,

Zitat

Dort erscheinen die Pfeile erst, wenn man mit der Maus über den Button fährt, im TB3 sind sie von vornherein da

was es so alles gibt...
Okay, dann müssen die Standard-Dropmarker erst einmal ausgeblendet werden und bei Bedarf (hover) die Modoki-Dropmarker eingeblendet werden. Den alten Dropmarker-Code entfernen. Icon: messenger\modoki\toolbarbutton-dropmarker.png

CSS

/* Dropmarker nur beim Hovern - als Icon */
.toolbarbutton-menubutton-dropmarker {
  list-style-image: none !important;
}




.toolbarbutton-1:hover .toolbarbutton-menubutton-dropmarker {
  list-style-image: url("icons/toolbarbutton-dropmarker.png") !important;
  margin-left: -10px !important;
  margin-right: -1px !important;
}




.toolbarbutton-1:hover .toolbarbutton-menubutton-dropmarker[disabled="true"] {
  display: none !important;
}

Alles anzeigen

Die Position des Dropmarker-Icons zum Button, kann mit den margin-Werten angepasst werden. Im Code passt es erst mal so für Buttonansicht ohne Text. Wenn mit Text, dann musst du noch mit margin-top und margin-bottom etwas machen. Für die Buttons, die beim Anklicken prinzipell erst ein Aufklappmenü zeigen bevor es weitergeht (z.B. Schlagwörter), deren Dropmarker musst du dann komplett ausblenden.

CSS

/* Dropmarker f. Button mit prinzipiellen Aufklappmenü ausblenden */
.toolbarbutton-menu-dropmarker {
  display: none !important;
}

Externer Inhalt www.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Gruß
muellerpaul

Rianna

Hallo muellerpaul,

Danke für die neuen Codes, die Toolbar habe ich nun schon mit den hover Buttons ausgestattet. Ist schon der Hammer, wie komplex diese Themes aufgebaut sind.

Ich hoffe, am Wochenende werde ich mit allem fertig.

Vielen Dank,
Rianna

Rianna

Hallo muellerpaul,

ich habe nun das mit den Dropbuttons versucht, aber noch einige Probleme. Bei Get Messages klappt es, wie man auf dem Screenshot sieht, aber bei Tag ist noch der alte Button drin. Muss ich da für jeden Button eigenen Code schreiben? Das mit dem Ausblenden hat irgendwie nicht funktioniert.

Externer Inhalt img3.fotos-hochladen.net

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Noch eine Frage, die Texte neben den Icons habe ich weggemacht, weil ich das störend fand, ich hätte sie gerne wie in TB2 unter den Buttons, geht das auch?

Vielen Dank,
Rianna

muellerpaul

Hallo Rianna,

Zitat von "Rianna"

aber bei Tag ist noch der alte Button drin. Muss ich da für jeden Button eigenen Code schreiben?

nein musst du nicht, die Codes sind allgemein - aber wie schon geschrieben es gibt zwei Sorten der Aufklappmenüs.

Zitat von "muellerpaul"
Für die Buttons, die beim Anklicken prinzipell erst ein Aufklappmenü zeigen bevor es weitergeht (z.B. Schlagwörter), deren Dropmarker musst du dann komplett ausblenden.
CSS
/* Dropmarker f. Button mit prinzipiellen Aufklappmenü ausblenden */
.toolbarbutton-menu-dropmarker {
  display: none !important;
}

Dieser Code funktioniert bei dir nicht?

Zitat von "Rianna"

Noch eine Frage, die Texte neben den Icons habe ich weggemacht, weil ich das störend fand, ich hätte sie gerne wie in TB2 unter den Buttons, geht das auch?

Im Menü ->Ansicht->Symbolleisten->Anpassen->Zeige: Symbole und Text (untereinander)

Zitat von "muellerpaul"

Im Code passt es erst mal so für Buttonansicht ohne Text. Wenn mit Text, dann musst du noch mit margin-top und margin-bottom etwas machen.

Gruß
muellerpaul

Rianna

Zitat von "muellerpaul"

Hallo Rianna,

nein musst du nicht, die Codes sind allgemein - aber wie schon geschrieben es gibt zwei Sorten der Aufklappmenüs.

Dieser Code funktioniert bei dir nicht?

Genau. Wenn der drin ist, kriegt der Tag Button gar keinen Pfeil, auch nicht bei hover. Wenn der Code draussen ist, kommt der normale Classic Pfeil.

Im Menü ->Ansicht->Symbolleisten->Anpassen->Zeige: Symbole und Text (untereinander)
Manchmal sieht man echt vor lauter Bäumen den Wald nicht...

Das hab ich geschafft, allerdings muss man irgendwie sehr genau den Pfeil treffen, um die Liste zu kriegen, ansonsten holt der TB gleich alle Mails ab...

Vielen Dank,
Rianna

muellerpaul

Hallo,

Zitat von "Rianna"

Genau. Wenn der drin ist, kriegt der Tag Button gar keinen Pfeil, auch nicht bei hover. Wenn der Code draussen ist, kommt der normale Classic Pfeil.

Na dann funktioniert der Code doch so, wie von mir gewünscht Ich hielt diesen Pfeil für überflüssig, weil er ja mit keiner eigentlichen Funktion belegt ist. Wenn du ihn aber als Modoki-Pfeil-Icon beim Hovern sehen möchtest, dann Bedarf es noch diese Codezeilen:

CSS

/* Dropmaker f. Button mit prinzipiellen Aufklappmenü nur beim Hovern - als Icon */
.toolbarbutton-menu-dropmarker {
  list-style-image: none !important;
}  




.toolbarbutton-1:hover .toolbarbutton-menu-dropmarker {
  list-style-image: url("icons/toolbarbutton-dropmarker.png") !important;
  margin-left: -10px !important;
  margin-right: -1px !important;
}




.toolbarbutton-1:hover .toolbarbutton-menu-dropmarker[disabled="true"] {
  display: none !important;
}

Alles anzeigen

Gruß
muellerpaul

Rianna

Hallo muellerpaul,

JETZT versteh ich, was Du gemeint hast Im Prinzip hast Du natürlich recht, der Pfeil ist überflüssig, wenn eh das Auswahlmenü kommt. Ich war nur total verwirrt, weil es im TB2 halt anders ist.

Ich bin noch etwas am experimentieren, die Buttons in der Message Pane sind irgendwie gewöhnungsbedürftig, vielleicht mache ich mir doch noch ein paar alte wieder in die Toolbar, mal sehen.

Vielen Dank,
Rianna

altes TB2 Theme in neue TB3 userchrome.css "retten"?[erl.]

Thunderbird 138.0 veröffentlicht

Thunderbird 128.10.0 ESR veröffentlicht