Ihr E-Mail Programm unterstützt leider keine HTML E-Mails." Ich finde in den Einstellungen und der Hilfe nichts dazu...
Schau doch mal, was im Menü Ansicht unter Nachrichteninhalt eingestellt ist.
Ihr E-Mail Programm unterstützt leider keine HTML E-Mails." Ich finde in den Einstellungen und der Hilfe nichts dazu...
Schau doch mal, was im Menü Ansicht unter Nachrichteninhalt eingestellt ist.
Hmm, und wo wird dieser Header nun bei dir angezeigt?
Hm, funktioniert hier in Tb 128.x esr ohne Probleme, aber Tb 140.x esr zeigt sich zickig, noch ein Grund mehr erst einmal beim128er zu bleiben.
Hmm, und wo wird dieser Header nun bei dir angezeigt?
In der Headerpane und zwar nur mit dem Eintrag in der user.js.

Nun, der TE möchte den Header reinkommender Nachrichten bspw. in der Header-Pane anzeigen lassen und nicht im Composer als Auswahl zusätzlicher Header zur Verfügung stellen.
Dann hast Du nicht richtig gelesen, versuche es noch einmal. ![]()
P.S.: Lese Dein Zitat von mir mal ab dem 2ten Komma.
Wo kann ich einstellen, dass das in der Kopfzeile (oder sonst wo ;)) ebenfalls angezeigt wird?
Irgendwie ein wenig merkwürdig ist, Envelope-To als zusätzlichen manuellen Compose-Header einzutragen, denn hier wird er dann auch merkwürdigerweise als Header von empfangenen Mails angezeigt.
Also einfach das * als Eintrag in die im Profil anzulegende Datei user.js eintragen, Tb starten und Envelope-To sollte angezeigt werden.
*
user_pref("mail.compose.other.header", "Envelope-To");
Sollte die user.js schon mit einem derartigen user_pref("mail.compose.other.header", "…"); Eintrag existieren, einfach dem Eintrag ,Envelope-To hinzufügen.
Könnte ich ihn vielleicht ganz wegbekommen, da ich sowieso nur die E-Mailfunktion nutze ?
Erstelle im Profil einen Ordner Namens chrome, in dem erstellst Du eine Textdatei Namens userChrome.css und fügst dort das * ein.
*
Nun stellst Du unter Extras → Einstellungen → Allgemein und dort ganz unten bei Konfiguration bearbeiten… die ** Pref per Doppelklick auf true und startest Tb neu, jetzt sollte der Bereiche-Button weg sein.
**
toolkit.legacyUserProfileCustomizations.stylesheets
Ins Profil kommst Du am einfachsten per Hilfe → Information zur Fehlerbehebung und einem Klick auf Ordner öffnen bei Profilordner.
Ich würde gerne, den "Alle Konten abrufen" auf der Symbolleiste als ersten Button ganz links haben. Leider läßt sich der "Bereiche-Menü"-Button aber nicht verschieben.
Der Bereiche-Button gehört nicht zur gleichen Leiste wie der Button Alle Konten abrufen, somit lässt der Button Alle Konten abrufen sich nicht vor den Bereiche-Button schieben.
/* Hintergrundfarbe für Unified Toolbar & Tableiste */
#unifiedToolbar,
#tabs-toolbar {
background-image: none !important;
background-color: #666699 !important;
padding: 0 !important; und das → margin-right: 2px !important; dem Eintrag für Tabs (tab {…})}
Das ist so in der Tat falsch, die * Zeile muss raus.
*
padding: 0 !important; und das → margin-right: 2px !important; dem Eintrag für Tabs (tab {…})
Hast Du wirklich in deinem CSS nach tab { gesucht?
Jetzt brauche ich nur noch die dunkelblauen Abstände zwischen den einzelnen Altrosa-Button in der Tableiste/-Zeile auf ca. 1 bis 3 mm verringern. Sie sind ca. 8 mm breit.
Meinst Du die Abstände der Tabs selbst?
Dann füge das → padding: 0 !important; und das → margin-right: 2px !important; dem Eintrag für Tabs (tab {…}) hinzu.
Bitte testen:
Nope, der Stern für Ungelesene muss noch per visibility: initial !important; eingeblendet werden.
Mein funktionierendes Ergebnis sieht jetzt so aus, getrennt nach Ungelesen und Neu.
/* Ungelesene Mails mit Blauen Stern hervorheben. */
tr[data-properties~="unread"] > td.subjectcol-column > div > div.subject-line > img {
visibility: initial !important;
content: var(--icon-sparkle-star-xs) !important;
width: 16px !important;
height: 16px !important;
fill: #0082FC !important;
stroke: #003d76 !important;
}
/* Neue Mails mit Roten Stern hervorheben. */
tr[data-properties~="new"] > td.subjectcol-column > div > div.subject-line > img[data-l10n-id="threadpane-message-new"] {
width: 16px !important;
height: 16px !important;
fill: #F20 !important;
stroke: #900 !important;
}
Alles anzeigen
Ich hatte mal erwähnt, dass oben die Menüleiste (Datei, Bearbeiten usw,...), die darunterliegende Tableiste ebenso insgesamt zu groß ausfallen. Wurde man es mit dem folgenden Code verkleinern können, oder sind mehrere Codes beteiligt?
Teste bitte die Version, ich habe das mal alle font-size:-Einträge auskommentiert und die 3 Leisten oben noch verkleinert.
/* 🧩 Abschnitt 1/6 – Kommentarstruktur, Tabs & allgemeines Layout */
/* --- Hier beginnen die CSS ohne obige Notizen, da sie keine Relevanz für die Code haben --- */
/* Abschnitt 1 – Hauptleisten & Tabzeile (Farben & Popup-Stil) */
/* Hintergrundfarbe für Unified Toolbar & Tableiste */
#unifiedToolbar,
#tabs-toolbar {
background-image: none !important;
background-color: #666699 !important;
}
unified-toolbar[class="icons-beside-text"] {
border: 0 !important;
}
/* Tab-Überhangliste (rechter Pfeil) mit Farbverlauf */
/* Achtung: Färbt auch andere Popups */
.menupopup-arrowscrollbox {
background: linear-gradient(#BA78AB, #666699) !important;
}
/* Schriftgröße im Überhang-Menü */
#alltabs-popup > menuitem > .menu-text {
/* font-size: 14px !important; */
}
/* Abschnitt 1 – Ende */
/* Gesamter Nachrichtenkopf mit Farbverlauf und Layout */
#msgHeaderView {
background: linear-gradient(#BA78AB, #666699) !important;
}
/* ✳️ Feldnamen: „Von“, „Betreff“, „An“ – weiß & fett */
#msgHeaderView label,
#msgHeaderView .headerName,
#msgHeaderView .headerValue label {
color: white !important;
font-family: "Arial Black", Arial, sans-serif !important;
font-weight: bold !important;
white-space: nowrap !important;
text-align: left !important;
}
/* 🖤 Feldwerte: Namen, Betrefftext etc. – schwarz & fett */
#msgHeaderView .headerValue {
color: black !important;
font-family: "Arial Black", Arial, sans-serif !important;
font-weight: bold !important;
text-align: left !important;
}
/* ⚪️ Buttons im Nachrichtenkopf – weiße Schrift, Standard-Hintergrund */
#msgHeaderView toolbarbutton {
color: white !important;
font-family: "Arial Black", Arial, sans-serif !important;
font-weight: bold !important;
background-color: transparent !important; /* Kein eigener Hintergrund */
border: none !important;
outline: none !important;
box-shadow: none !important;
}
/* 🖌️ Hover-Effekt für Buttons – optional */
#msgHeaderView toolbarbutton:hover {
background-color: rgba(255, 255, 255, 0.2) !important;
cursor: pointer !important;
}
/* Hintergrund-Farbverlauf links TB Ordnerbaum */
#folderPane {
appearance: none !important;
background: linear-gradient(#BA78AB, #666699) !important;
/* Erklärung: Gestaltung des linken Bereichs für Ordnerübersicht */
}
/* Account Central – TB-Farbgestaltung der Startseite */
/* Gestaltung der Begrüßungsseite / Accountübersicht */
#accountCentral,
.account-central-section,
.account-central-section > h2,
.account-central-section > div,
#accountCentral > *:first-child {
background-color: #BA78AB !important;
color: #ffffff !important;
/* Erklärung: Einheitliche Farbgestaltung der Account-Übersicht */
}
/* Abschnitt 2/6 – Schriftgrößen, Composer (Verfassen)-Fenster, Nachrichtenliste & Ordnerbaum */
/* ? Ordnerbaum-Konten: Schriftart, - Größe & -Höhe - Schrift in Ordnernamen (Posteingang, Gesendet etc.) */
#folderPaneHeaderBar {
border-bottom: 1px solid #D4D4D8 !important;
padding: 3px 6px 2px 6px !important;
}
/* Button in der Folderpane. */
#folderPaneHeaderBar > button {
font-family: Arial Black !important;
border: 1px solid #C8A2C8 !important;
background-color: #C8A2C8 !important;
color: black !important;
}
#folderPaneHeaderBar > button:hover {
border: 1px solid #967996 !important;
}
#folderPaneHeaderBar,
#today-pane-panel > .sidebar-header {
appearance: none !important;
background-color: #9FA2D5 !important;
}
#today-pane-panel > .sidebar-header {
height: 1.4em !important;
min-height: 31px !important;
}
.sidebar-panel-scroll {
@media not (prefers-contrast) {
&::before, &::after {
height: 0 !important;
}
}
}
/* Höhe der einzelnen Ordnerzeilen */
#folderTree li > .container {
height: 10px !important; /* Ursprüngliche Zeilenhöhe – wird durch folgende Regel überschrieben */
/* Erklärung: Verringert die Zeilenhöhe, damit mehr Ordner auf einmal sichtbar sind */
}
/* Geändert: Höhe auf sinnvolle 24px angepasst (10px ist zu wenig für die Darstellung) */
#folderTree li > .container {
height: 24px !important; /* geändert: von 10 auf 24px Schrifthöhe angepasst */
/* Erklärung: Optimierte Zeilenhöhe für gute Lesbarkeit der Ordner */
}
/* Nachrichten-Eingabefeld oder Kopfzeile - (Compose-Fenster) - Betreffzeile im Composer-Fenster (neue Nachricht) */
@-moz-document url-prefix("chrome://messenger/content/messengercompose/messengercompose.xhtml") {
#msgSubject {
/* font-size: 21px !important; */
font-weight: bold !important;
font-family: Arial Black !important;
/* Erklärung: Der Betreff wird prominent und deutlich dargestellt */
}
}
/* Schnellfilterleiste */
#quick-filter-bar {
background-color: #a66b99 !important;
}
input[type="search"][aria-label="Nachrichten filtern"] {
background-color: #C8A2C8 !important;
}
.quickFilterButtons {
border: 0 !important;
}
#quickFilterBarContainer > button,
#quickFilterBarContainer > div > button {
font-family: Arial Black !important;
border: 1px solid #C8A2C8 !important;
background-color: #C8A2C8 !important;
color: black !important;
border-radius: 4px !important;
margin-right: 2px !important;
/* ? Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
#quickFilterBarContainer > button:hover,
#quickFilterBarContainer > div > button:hover {
border: 1px solid #967996 !important;
/* ? Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
/* Nachrichtenliste / ThreadPane
Farb-Alternative: #BA78AB, #DBA2CC
Liste aller E-Mails in einem Ordner (z.B. Posteingang) */
#threadPaneHeaderBar {
background-color: #9FA2D5 !important;
}
#threadPaneHeaderBar > div > button {
font-family: Arial Black !important;
border: 1px solid #C8A2C8 !important;
background-color: #C8A2C8 !important;
color: black !important;
border-radius: 4px !important;
margin-right: 2px !important;
/* ? Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
#threadPaneHeaderBar > div > button:hover {
border: 1px solid #967996 !important;
/* ? Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
#threadTree {
/* font-size: 30px !important; */
font-family: Arial Black !important;
background-color: #9FA2D5 !important;
/* Erklärung: Große Schrift in der Mail-Liste sorgt für bessere Lesbarkeit */
}
/* Neu durch Dharkness */
/* Ungelesene Mails, Threads mit ungelesenen Mails und neue Mails */
#threadTree tbody {
& .table-layout[data-properties~="unread"] :where(td, .subject-line) {
text-decoration: underline blue !important;
text-decoration-thickness: 2px !important;
}
}
#threadTree tbody {
& .table-layout[data-properties~="read"][data-properties~="hasUnread"] :where(td, .subject-line) {
text-decoration: underline blue !important;
text-decoration-thickness: 2px !important;
}
}
#threadTree tbody {
& .table-layout[data-properties~="read"][data-properties~="hasNew"] :where(td, .subject-line) {
text-decoration: underline red !important;
text-decoration-thickness: 2px !important;
}
}
img[data-l10n-id="threadpane-message-new"] {
width: 16px !important;
height: 16px !important;
fill: #F20 !important;
stroke: #900 !important;
}
/* Kopfleiste der ThreadPane */
th[is="tree-view-table-header-cell"] > div > button,
thead[is="tree-view-table-header"] > tr > [is="tree-view-table-column-picker"] {
background: none !important;
background-color: #DBA2CC !important;
color: black !important;
}
/* HG-Farbe für Server-Zeile in Konten (optional) */
/* Hebt die Hauptkonto-Zeile im Ordnerbaum farblich (#DBA2CC) hervor */
/* #folderTree treechildren::-moz-tree-cell-text(isServer-true) */
#folderPane {
font-family: Arial Black !important;
color: #000 !important;
}
li[data-server-type="imap"] > .container {
margin-top: 2px !important;
}
li[data-server-type="imap"] > .container {
background-color: #DBA2CC !important;
color: black !important;
}
li[data-server-type="none"] > .container {
background-color: #DBA2CC !important;
color: black !important;
}
/* Abschnitt 2 – Schriftarten & Textgestaltung */
/* 📑 Schriftgröße der Tableiste (Tabs) verkleinern */
tab {
/* font-size: 11px !important; */
}
/* 🗂️ Schriftgröße der Menüleiste (Datei, Bearbeiten, Ansicht ...) verkleinern */
menubar > menu {
/* font-size: 11px !important; */
}
/* Abschnitt 3/6 – Scrollbars, Nachrichtenvorschau, Toolbars & Menüleisten */
/* Scrollbars (Scrollbar-Stil im gesamten Thunderbird) */
scrollbar {
-moz-appearance: none !important;
background-color: #BCA5D4 !important;
width: 16px !important;
/* Erklärung: Einheitlicher Look für Scrollbars – helle violette Farbe */
}
scrollbar thumb {
background-color: #673A95 !important;
border-radius: 6px !important;
/* Erklärung: Dunkler Scrollbalken mit abgerundeten Ecken für eleganten Look */
}
/* Scrollbar (Neu - Bildlaufleisten 2 Farben, #CC6699, #666699) */
/* Farbe 1: Thumb (Daumen) - Farbe 2: Hintergrund*/
:root {
scrollbar-color: #CC6699 #666699 !important;
}
/* Vorschau-Fenster (Nachrichtenvorschau unten) */
#messagepane {
/* font-size: 22px !important; */
font-family: Arial Black !important;
background-color: #F1E5FF !important;
/* Erklärung: Vorschau leserlich mit großer Schrift & hellem Hintergrund */
}
/* Toolbars: Button-Schrift und Hintergrundfarbe */
/* 🎯 Buttons im Nachrichtenkopf – Neu - blaugrauer Hintergrund + weiße Schrift */
#msgHeaderView toolbarbutton {
background-color: #8888C1 !important; /* Blaugrau */
color: white !important;
font-family: "Arial Black", Arial, sans-serif !important;
font-weight: bold !important;
border: none !important;
outline: none !important;
box-shadow: none !important;
padding: 2px 4px !important;
border-radius: 4px !important;
}
/* 🖱️ Optional: Neu - Hover-Effekt für Buttons */
#msgHeaderView toolbarbutton:hover {
background-color: #666699 !important; /* dunkleres Blaugrau beim Hover */
cursor: pointer !important;
}
#messageHeader #header-view-toolbar {
min-height: 1.4em !important;
background: none !important;
padding: 0 !important;
margin: 0 !important;
}
#unifiedToolbarContent {
padding: 0 3px !important;
}
#unifiedToolbarContent > li > div > button,
li.extension-action > div > button {
font-family: Arial Black !important;
color: black !important;
background-color: #C8A2C8 !important;
margin-top: 1px !important;
border-radius: 4px !important;
margin-bottom: 1px !important;
/* Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
toolbarbutton {
/* font-size: 18px !important; */
font-family: Arial Black !important;
color: black !important;
background-color: #C8A2C8 !important;
border-radius: 4px !important;
/* Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
toolbarbutton.message-header-view-button,
toolbarbutton.message-header-view-button > toolbarbutton {
/* font-size: 14px !important; */
}
/* ========================
Menüleisten: Schrift und Farbe
========================== */
/* Menüleiste verkleinern */
#toolbar-menubar {
min-height: 26px !important;
min-height: 26px !important;
background-color: #9FA2D5 !important;
}
menubar {
/* font-size: 12px !important; */
padding: 0 0 0 3px !important;
min-height: 26px !important;
min-height: 26px !important;
}
menubar > menu {
min-height: 24px !important;
max-height: 24px !important;
/* font-size: 14px !important; */
font-family: Arial Black !important;
border-radius: 5px !important;
border: 1px solid #D2B9D3 !important;
background-color: #D2B9D3 !important;
color: #000000 !important;
padding-top: 0 !important;
padding-bottom: 1px !important;
margin-top: 2px !important;
margin-right: 3px !important;
margin-bottom: 2px !important;
/* Erklärung: Menüleiste mit klarer Struktur und gut lesbarer Schrift */
}
menubar > menu:hover {
border: 1px solid #967996 !important;
/* Erklärung: Menüleiste mit klarer Struktur und gut lesbarer Schrift */
}
#toolbar-menubar > toolbarbutton,
menubar > toolbarbutton {
margin: 2px !important;
}
/* Neu - Abschnitt 3 – Rahmen & Abstände */
/* Tableiste verkleinern */
tab {
/* font-size: 12px !important; */
padding: 1px 8px 2px 8px !important;
min-height: 26px !important;
}
/* Tabbar kompakter */
#tabs-toolbar {
min-height: 26px !important;
max-height: 26px !important;
padding: 0 3px 0 3px !important;
}
#tabbar-toolbar {
min-height: 26px !important;
max-height: 26px !important;
padding: 0 !important;
}
tab {
min-width: 100px !important;
min-height: 25px !important;
max-height: 25px !important;
margin-top: 4px !important;
margin-right: 2px !important;
}
tab {
.tab-background {
background: none !important;
background-color: #DBA2CC !important;
}
}
tab[selected="true"] {
.tab-background {
background-color: #BA78AB !important;
}
}
.tab-text {
font-family: Arial Black !important;
/* font-size: 13px !important; */
color: #000 !important;
}
.tab-line {
display: none !important;
}
tabs {
overflow-x: auto !important;
scroll-behavior: smooth !important;
display: flex !important;
}
tabpanels {
padding: 0 !important;
}
/* Abschnitt 3 – Ende */
/* Tagesplan */
#mini-day-box,
#agenda-toolbar,
#agenda {
appearance: none !important;
background: linear-gradient(#BA78AB, #666699) !important;
/* ? Erklärung: Gestaltung des Tagesplan. */
}
/* ----------------------------------------------------------------------------------------------
? Abschnitt 4/6 – Tooltip-Stil, Fensterrahmen & Statusleiste
---------------------------------------------------------------------------------------------- */
/* ==================================================
? Tooltip-Stil (z. B. wenn man mit der Maus über Buttons fährt)
==================================================== */
tooltip {
/* font-size: 16px !important; */
font-family: Arial Black !important;
color: #000000 !important;
background-color: #F2DFFF !important;
border: 1px solid #673A95 !important;
border-radius: 5px !important;
padding: 4px !important;
/* Erklärung: Tooltips werden gut lesbar und visuell angenehm dargestellt */
}
/* =================================
Rahmen um das Hauptfenster (optional)
Kann das Gesamtlayout visuell begrenzen
=================================== */
/* #messengerWindow {
border: 5px solid #C0A0D0 !important;
border-radius: 10px !important;
Erklärung: Verleiht dem Hauptfenster einen dekorativen Rahmen
} */
/* =============================================
Statusleiste unten (ganz unten im Thunderbird-Fenster)
===============================================*/
statusbar {
/* font-size: 15px !important; */
font-family: Arial Black !important;
background-color: #EADCF2 !important;
color: #000000 !important;
border-top: 2px solid #BCA5D4 !important;
/* Erklärung: Klarer Kontrast zur Statusleiste mit eleganter Farbgebung */
}
/* --------------------------------------------------------------------------------------------
Abschnitt 5/6 – Kalenderansicht, Adressbuch & Suchleiste
------------------------------------------------------------------------------------------------ */
/* ===================================================
Kalender: Tagesansicht, Wochenansicht, Monatsansicht
=================================================== */
.calendar-day-view, .calendar-week-view, .calendar-month-view {
/* font-size: 18px !important; */
font-family: Arial Black !important;
background-color: #F7F0FF !important;
color: black !important;
/* Erklärung: Einheitliche Optik im Kalender mit gut lesbarer Schrift */
}
/* ================================
--- Adressbuch: Listenansicht & Kontakte
================================== */
#abResultsTree {
/* font-size: 20px !important; */
font-family: Arial Black !important;
background-color: #EFE0F8 !important;
color: black !important;
/* ? Erklärung: Kontaktliste mit großer, kontrastreicher Schrift */
}
#abResultsBox {
border: 2px solid #BCA5D4 !important;
border-radius: 8px !important;
/* ? Erklärung: Visuelle Rahmung des Adressbuch-Bereichs */
}
/* ==================================
Suchleiste (oberhalb der Nachrichtenliste)
==================================== */
#searchInput {
/* font-size: 18px !important; */
font-family: Arial Black !important;
background-color: #F0DDF9 !important;
color: black !important;
border: 1px solid #673A95 !important;
border-radius: 4px !important;
/* ? Erklärung: Suchfeld wird deutlich sichtbar und optisch eingebettet */
}
/* ---------------------------------------------------------------------------------------------------------
Abschnitt 6/6 – Systemfarben, E-Mail-Buttons & Spezialelemente
--------------------------------------------------------------------------------------------------------- */
/* ==============================================
Systemfarben überschreiben (z.B. Dialoge, Rahmen)
============================================== */
:root {
--system-color-background: #F9F0FF !important;
--system-color-text: #000000 !important;
--system-color-accent: #A175D1 !important;
/* Erklärung: Einheitliche Farbpalette für Thunderbird-Systemelemente */
}
/* =================================================
Buttons innerhalb von E-Mails (Antworten, Weiterleiten etc.)
=================================================== */
.mail-action-button {
/* font-size: 17px !important; */
font-family: Arial Black !important;
background-color: #D3A3E1 !important;
color: black !important;
border-radius: 5px !important;
padding: 6px 12px !important;
/* Erklärung: Klare und visuell hervorgehobene Buttons für Mailaktionen */
}
/* ===================================================
Anhangsbereich (Attachment Pane bei empfangener Nachricht)
===================================================== */
.attachmentList {
/* font-size: 16px !important; */
font-family: Arial Black !important;
background-color: #F0E3FF !important;
border: 1px solid #BCA5D4 !important;
border-radius: 5px !important;
padding: 4px !important;
/* ? Erklärung: Anhangsliste übersichtlich und optisch eingebettet */
}
/* Ladeindikator / Fortschrittsbalken (optional) */
progress {
background-color: #E0CCE8 !important;
}
progress::-moz-progress-bar {
background-color: #673A95 !important;
/* ? Erklärung: Ladeleisten im Design integriert – harmonisch in der Farbpalette */
}
/* Abschnitte: 1 bis 6 Ende !!! */
Alles anzeigen
Kannst du mir die Codes genauer benennen, damit ich sie korrigieren kann? Oder ist es in der aktuellen CSS - im Beitrag: 38 schon erledigt?
Ist in der aktuellen CSS enthalten.
Besagte Srollleiste ist bei mir nicht farbig. Alle anderen sind Ok.
Fahre mal mit dem Mauszeiger über besagte Scrollbar, vielleicht wird sie nur nicht korrekt farbig aktualisiert.
Ungelesene Mails haben zwar keinen dunkelroten Punkt
Den habe ich IIRC vergessen, schaue ich mir an.
Das ↓ ist das aktuelle CSS.
/* -----------------------------------------------------------------------------------------------------------
🧩 Abschnitt 1/6 – Kommentarstruktur, Tabs & allgemeines Layout
-------------------------------------------------------------------------------------------------------------- */
/* --- Hier beginnen die CSS ohne obige Notizen, da sie keine Relevanz für die Code haben --- */
/* Abschnitt 1 – Hauptleisten & Tabzeile (Farben & Popup-Stil) */
/* Hintergrundfarbe für Unified Toolbar & Tableiste */
#unifiedToolbar,
#tabs-toolbar {
background-image: none !important;
background-color: #666699 !important;
}
unified-toolbar[class="icons-beside-text"] {
border: 0 !important;
}
/* Tab-Überhangliste (rechter Pfeil) mit Farbverlauf */
/* Achtung: Färbt auch andere Popups */
.menupopup-arrowscrollbox {
background: linear-gradient(#BA78AB, #666699) !important;
}
/* Schriftgröße im Überhang-Menü */
#alltabs-popup > menuitem > .menu-text {
font-size: 14px !important;
}
/* Abschnitt 1 – Ende */
/* Gesamter Nachrichtenkopf mit Farbverlauf und Layout */
#msgHeaderView {
background: linear-gradient(#BA78AB, #666699) !important;
/* min-height: 90px !important;
padding: 12px 20px !important;
display: grid !important;
grid-template-columns: auto 1fr !important;
gap: 16px !important;
align-items: center !important; */
}
/* ✳️ Feldnamen: „Von“, „Betreff“, „An“ – weiß & fett */
#msgHeaderView label,
#msgHeaderView .headerName,
#msgHeaderView .headerValue label {
color: white !important;
font-family: "Arial Black", Arial, sans-serif !important;
font-weight: bold !important;
white-space: nowrap !important;
text-align: left !important;
}
/* 🖤 Feldwerte: Namen, Betrefftext etc. – schwarz & fett */
#msgHeaderView .headerValue {
color: black !important;
font-family: "Arial Black", Arial, sans-serif !important;
font-weight: bold !important;
text-align: left !important;
}
/* ⚪️ Buttons im Nachrichtenkopf – weiße Schrift, Standard-Hintergrund */
#msgHeaderView toolbarbutton {
color: white !important;
font-family: "Arial Black", Arial, sans-serif !important;
font-weight: bold !important;
background-color: transparent !important; /* Kein eigener Hintergrund */
border: none !important;
outline: none !important;
box-shadow: none !important;
}
/* 🖌️ Hover-Effekt für Buttons – optional */
#msgHeaderView toolbarbutton:hover {
background-color: rgba(255, 255, 255, 0.2) !important;
cursor: pointer !important;
}
/* Hintergrund-Farbverlauf links TB Ordnerbaum */
#folderPane {
appearance: none !important;
background: linear-gradient(#BA78AB, #666699) !important;
/* Erklärung: Gestaltung des linken Bereichs für Ordnerübersicht */
}
/* Account Central – TB-Farbgestaltung der Startseite */
/* Gestaltung der Begrüßungsseite / Accountübersicht */
#accountCentral,
.account-central-section,
.account-central-section > h2,
.account-central-section > div,
#accountCentral > *:first-child {
background-color: #BA78AB !important;
color: #ffffff !important;
/* Erklärung: Einheitliche Farbgestaltung der Account-Übersicht */
}
/* -------------------------------------------------------------------------------------------------------------------
? Abschnitt 2/6 – Schriftgrößen, Composer (Verfassen)-Fenster, Nachrichtenliste & Ordnerbaum
------------------------------------------------------------------------------------------------------------------- */
/* =========================================
? Ordnerbaum-Konten: Schriftart, - Größe & -Höhe
Schrift in Ordnernamen (Posteingang, Gesendet etc.)
============================================ */
#folderPaneHeaderBar {
border-bottom: 1px solid #D4D4D8 !important;
padding: 3px 6px 2px 6px !important;
}
/* Button in der Folderpane. */
#folderPaneHeaderBar > button {
font-family: Arial Black !important;
border: 1px solid #C8A2C8 !important;
background-color: #C8A2C8 !important;
color: black !important;
}
#folderPaneHeaderBar > button:hover {
border: 1px solid #967996 !important;
}
#folderPaneHeaderBar,
#today-pane-panel > .sidebar-header {
appearance: none !important;
background-color: #9FA2D5 !important;
}
#today-pane-panel > .sidebar-header {
height: 1.4em !important;
min-height: 31px !important;
}
.sidebar-panel-scroll {
@media not (prefers-contrast) {
&::before, &::after {
height: 0 !important;
}
}
}
/* Höhe der einzelnen Ordnerzeilen */
#folderTree li > .container {
height: 10px !important; /* Ursprüngliche Zeilenhöhe – wird durch folgende Regel überschrieben */
/* Erklärung: Verringert die Zeilenhöhe, damit mehr Ordner auf einmal sichtbar sind */
}
/* Geändert: Höhe auf sinnvolle 24px angepasst (10px ist zu wenig für die Darstellung) */
#folderTree li > .container {
height: 24px !important; /* geändert: von 10 auf 24px Schrifthöhe angepasst */
/* Erklärung: Optimierte Zeilenhöhe für gute Lesbarkeit der Ordner */
}
/* =================================================
Nachrichten-Eingabefeld oder Kopfzeile - (Compose-Fenster)
Betreffzeile im Composer-Fenster (neue Nachricht)
=================================================== */
@-moz-document url-prefix("chrome://messenger/content/messengercompose/messengercompose.xhtml") {
#msgSubject {
font-size: 21px !important;
font-weight: bold !important;
font-family: Arial Black !important;
/* Erklärung: Der Betreff wird prominent und deutlich dargestellt */
}
}
/* */
/* Schnellfilterleiste */
#quick-filter-bar {
background-color: #a66b99 !important;
}
input[type="search"][aria-label="Nachrichten filtern"] {
background-color: #C8A2C8 !important;
}
.quickFilterButtons {
border: 0 !important;
}
#quickFilterBarContainer > button,
#quickFilterBarContainer > div > button {
font-family: Arial Black !important;
border: 1px solid #C8A2C8 !important;
background-color: #C8A2C8 !important;
color: black !important;
border-radius: 4px !important;
margin-right: 2px !important;
/* ? Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
#quickFilterBarContainer > button:hover,
#quickFilterBarContainer > div > button:hover {
border: 1px solid #967996 !important;
/* ? Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
/* ==========================================
Nachrichtenliste / ThreadPane
Farb-Alternative: #BA78AB, #DBA2CC
Liste aller E-Mails in einem Ordner (z.B. Posteingang)
============================================ */
#threadPaneHeaderBar {
background-color: #9FA2D5 !important;
}
#threadPaneHeaderBar > div > button {
font-family: Arial Black !important;
border: 1px solid #C8A2C8 !important;
background-color: #C8A2C8 !important;
color: black !important;
border-radius: 4px !important;
margin-right: 2px !important;
/* ? Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
#threadPaneHeaderBar > div > button:hover {
border: 1px solid #967996 !important;
/* ? Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
#threadTree {
font-size: 30px !important;
font-family: Arial Black !important;
background-color: #9FA2D5 !important;
/* Erklärung: Große Schrift in der Mail-Liste sorgt für bessere Lesbarkeit */
}
/* Neu durch Dharkness */
/* Ungelesene Mails, Threads mit ungelesenen Mails und neue Mails */
#threadTree tbody {
& .table-layout[data-properties~="unread"] :where(td, .subject-line) {
text-decoration: underline blue !important;
text-decoration-thickness: 2px !important;
}
}
#threadTree tbody {
& .table-layout[data-properties~="read"][data-properties~="hasUnread"] :where(td, .subject-line) {
text-decoration: underline blue !important;
text-decoration-thickness: 2px !important;
}
}
#threadTree tbody {
& .table-layout[data-properties~="read"][data-properties~="hasNew"] :where(td, .subject-line) {
text-decoration: underline red !important;
text-decoration-thickness: 2px !important;
}
}
img[data-l10n-id="threadpane-message-new"] {
width: 16px !important;
height: 16px !important;
fill: #F20 !important;
stroke: #900 !important;
}
/* Kopfleiste der ThreadPane */
th[is="tree-view-table-header-cell"] > div > button,
thead[is="tree-view-table-header"] > tr > [is="tree-view-table-column-picker"] {
background: none !important;
background-color: #DBA2CC !important;
color: black !important;
}
/* =====================================
HG-Farbe für Server-Zeile in Konten (optional)
======================================= */
/* Hebt die Hauptkonto-Zeile im Ordnerbaum farblich (#DBA2CC) hervor */
/* #folderTree treechildren::-moz-tree-cell-text(isServer-true) */
#folderPane {
color: #000 !important;
}
li[data-server-type="imap"] > .container {
margin-top: 2px !important;
}
li[data-server-type="imap"] > .container {
background-color: #DBA2CC !important;
color: black !important;
}
li[data-server-type="none"] > .container {
background-color: #DBA2CC !important;
color: black !important;
}
/* Abschnitt 2 – Schriftarten & Textgestaltung */
/* 📑 Schriftgröße der Tableiste (Tabs) verkleinern */
tab {
font-size: 11px !important;
}
/* 🗂️ Schriftgröße der Menüleiste (Datei, Bearbeiten, Ansicht ...) verkleinern */
menubar > menu {
font-size: 11px !important;
}
tab {
min-width: 100px !important;
height: 26px !important;
margin-right: 2px !important;
}
tab {
.tab-background {
background: none !important;
background-color: #DBA2CC !important;
}
}
tab[selected="true"] {
.tab-background {
background-color: #BA78AB !important;
}
}
.tab-text {
font-family: Arial Black !important;
font-size: 13px !important;
color: #000 !important;
}
.tab-line {
display: none !important;
}
tabs {
overflow-x: auto !important;
scroll-behavior: smooth !important;
display: flex !important;
}
tabpanels {
padding: 0 !important;
}
/* ------------------------------------------------------------------------------------------------------------------------
Abschnitt 3/6 – Scrollbars, Nachrichtenvorschau, Toolbars & Menüleisten
---------------------------------------------------------------------------------------------------------------------------- */
/* ===================================================
Scrollbars (Scrollbar-Stil im gesamten Thunderbird)
=================================================== */
scrollbar {
-moz-appearance: none !important;
background-color: #BCA5D4 !important;
width: 16px !important;
/* Erklärung: Einheitlicher Look für Scrollbars – helle violette Farbe */
}
scrollbar thumb {
background-color: #673A95 !important;
border-radius: 6px !important;
/* Erklärung: Dunkler Scrollbalken mit abgerundeten Ecken für eleganten Look */
}
/* Scrollbar (Neu - Bildlaufleisten 2 Farben, #CC6699, #666699) */
/* Farbe 1: Thumb (Daumen) - Farbe 2: Hintergrund*/
:root {
scrollbar-color: #CC6699 #666699 !important;
}
/* ======================================
Vorschau-Fenster (Nachrichtenvorschau unten)
======================================== */
#messagepane {
font-size: 22px !important;
font-family: Arial Black !important;
background-color: #F1E5FF !important;
/* Erklärung: Vorschau leserlich mit großer Schrift & hellem Hintergrund */
}
/* =====================================
Toolbars: Button-Schrift und Hintergrundfarbe
======================================= */
/* 🎯 Buttons im Nachrichtenkopf – Neu - blaugrauer Hintergrund + weiße Schrift */
#msgHeaderView toolbarbutton {
background-color: #8888C1 !important; /* Blaugrau */
color: white !important;
font-family: "Arial Black", Arial, sans-serif !important;
font-weight: bold !important;
border: none !important;
outline: none !important;
box-shadow: none !important;
padding: 2px 4px !important;
border-radius: 4px !important;
}
/* 🖱️ Optional: Neu - Hover-Effekt für Buttons */
#msgHeaderView toolbarbutton:hover {
background-color: #666699 !important; /* dunkleres Blaugrau beim Hover */
cursor: pointer !important;
}
#messageHeader #header-view-toolbar {
min-height: 1.4em !important;
background: none !important;
padding: 0 !important;
margin: 0 !important;
}
#unifiedToolbarContent > li > div > button,
li.extension-action > div > button {
font-family: Arial Black !important;
color: black !important;
background-color: #C8A2C8 !important;
border-radius: 4px !important;
margin-bottom: 1px !important;
/* Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
toolbarbutton {
font-size: 18px !important;
font-family: Arial Black !important;
color: black !important;
background-color: #C8A2C8 !important;
border-radius: 4px !important;
/* Erklärung: Klare Buttons mit auffälliger Hintergrundfarbe */
}
toolbarbutton.message-header-view-button,
toolbarbutton.message-header-view-button > toolbarbutton {
font-size: 14px !important;
}
/* ========================
Menüleisten: Schrift und Farbe
========================== */
#toolbar-menubar {
background-color: #9FA2D5 !important;
}
menubar {
padding: 0 0 0 3px !important;
}
menubar > menu {
font-size: 14px !important;
font-family: Arial Black !important;
border-radius: 5px !important;
border: 1px solid #D2B9D3 !important;
background-color: #D2B9D3 !important;
color: #000000 !important;
padding-top: 0 !important;
padding-bottom: 1px !important;
margin-top: 2px !important;
margin-right: 3px !important;
margin-bottom: 2px !important;
/* Erklärung: Menüleiste mit klarer Struktur und gut lesbarer Schrift */
}
menubar > menu:hover {
border: 1px solid #967996 !important;
/* Erklärung: Menüleiste mit klarer Struktur und gut lesbarer Schrift */
}
/* Neu - Abschnitt 3 – Rahmen & Abstände */
/* Menüleiste verkleinern */
menubar {
font-size: 12px !important;
padding: 2px 6px !important;
min-height: 20px !important;
}
/* Tableiste verkleinern */
tab {
font-size: 12px !important;
padding: 1px 8px 2px 8px !important;
min-height: 26px !important;
}
/* Tabbar kompakter */
#tabs-toolbar {
padding: 3px 3px 0 3px !important;
}
#tabbar-toolbar {
min-height: 28px !important;
padding: 0 !important;
}
/* Abschnitt 3 – Ende */
/* Tagesplan */
#mini-day-box,
#agenda-toolbar,
#agenda {
appearance: none !important;
background: linear-gradient(#BA78AB, #666699) !important;
/* ? Erklärung: Gestaltung des Tagesplan. */
}
/* ----------------------------------------------------------------------------------------------
? Abschnitt 4/6 – Tooltip-Stil, Fensterrahmen & Statusleiste
---------------------------------------------------------------------------------------------- */
/* ==================================================
? Tooltip-Stil (z. B. wenn man mit der Maus über Buttons fährt)
==================================================== */
tooltip {
font-size: 16px !important;
font-family: Arial Black !important;
color: #000000 !important;
background-color: #F2DFFF !important;
border: 1px solid #673A95 !important;
border-radius: 5px !important;
padding: 4px !important;
/* Erklärung: Tooltips werden gut lesbar und visuell angenehm dargestellt */
}
/* =================================
Rahmen um das Hauptfenster (optional)
Kann das Gesamtlayout visuell begrenzen
=================================== */
/* #messengerWindow {
border: 5px solid #C0A0D0 !important;
border-radius: 10px !important;
Erklärung: Verleiht dem Hauptfenster einen dekorativen Rahmen
} */
/* =============================================
Statusleiste unten (ganz unten im Thunderbird-Fenster)
===============================================*/
statusbar {
font-size: 15px !important;
font-family: Arial Black !important;
background-color: #EADCF2 !important;
color: #000000 !important;
border-top: 2px solid #BCA5D4 !important;
/* Erklärung: Klarer Kontrast zur Statusleiste mit eleganter Farbgebung */
}
/* --------------------------------------------------------------------------------------------
Abschnitt 5/6 – Kalenderansicht, Adressbuch & Suchleiste
------------------------------------------------------------------------------------------------ */
/* ===================================================
Kalender: Tagesansicht, Wochenansicht, Monatsansicht
=================================================== */
.calendar-day-view, .calendar-week-view, .calendar-month-view {
font-size: 18px !important;
font-family: Arial Black !important;
background-color: #F7F0FF !important;
color: black !important;
/* Erklärung: Einheitliche Optik im Kalender mit gut lesbarer Schrift */
}
/* ================================
--- Adressbuch: Listenansicht & Kontakte
================================== */
#abResultsTree {
font-size: 20px !important;
font-family: Arial Black !important;
background-color: #EFE0F8 !important;
color: black !important;
/* ? Erklärung: Kontaktliste mit großer, kontrastreicher Schrift */
}
#abResultsBox {
border: 2px solid #BCA5D4 !important;
border-radius: 8px !important;
/* ? Erklärung: Visuelle Rahmung des Adressbuch-Bereichs */
}
/* ==================================
Suchleiste (oberhalb der Nachrichtenliste)
==================================== */
#searchInput {
font-size: 18px !important;
font-family: Arial Black !important;
background-color: #F0DDF9 !important;
color: black !important;
border: 1px solid #673A95 !important;
border-radius: 4px !important;
/* ? Erklärung: Suchfeld wird deutlich sichtbar und optisch eingebettet */
}
/* ---------------------------------------------------------------------------------------------------------
Abschnitt 6/6 – Systemfarben, E-Mail-Buttons & Spezialelemente
--------------------------------------------------------------------------------------------------------- */
/* ==============================================
Systemfarben überschreiben (z.B. Dialoge, Rahmen)
============================================== */
:root {
--system-color-background: #F9F0FF !important;
--system-color-text: #000000 !important;
--system-color-accent: #A175D1 !important;
/* Erklärung: Einheitliche Farbpalette für Thunderbird-Systemelemente */
}
/* =================================================
Buttons innerhalb von E-Mails (Antworten, Weiterleiten etc.)
=================================================== */
.mail-action-button {
font-size: 17px !important;
font-family: Arial Black !important;
background-color: #D3A3E1 !important;
color: black !important;
border-radius: 5px !important;
padding: 6px 12px !important;
/* Erklärung: Klare und visuell hervorgehobene Buttons für Mailaktionen */
}
/* ===================================================
Anhangsbereich (Attachment Pane bei empfangener Nachricht)
===================================================== */
.attachmentList {
font-size: 16px !important;
font-family: Arial Black !important;
background-color: #F0E3FF !important;
border: 1px solid #BCA5D4 !important;
border-radius: 5px !important;
padding: 4px !important;
/* ? Erklärung: Anhangsliste übersichtlich und optisch eingebettet */
}
/* ====================================
Ladeindikator / Fortschrittsbalken (optional)
====================================== */
progress {
background-color: #E0CCE8 !important;
}
progress::-moz-progress-bar {
background-color: #673A95 !important;
/* ? Erklärung: Ladeleisten im Design integriert – harmonisch in der Farbpalette */
}
/* ---------------------------
Abschnitte: 1 bis 6 Ende !!!
--------------------------- */
Alles anzeigen