Fensterschaltflächen entfernen

Thomas3

Hallo
Ich benutze Hide Caption Titlebar Plus um die Schaltflächen Schließen, Maximieren, Verkleinern auszublenden.
Gibt es eine Möglichkeit ab FF57 diese Schaltflächen zu entfernen oder unsichtbar zumachen?

2002Andreas

Zitat von Thomas3

unsichtbar zumachen?

Teste bitte mal ob das so ist wie du es möchtest, ich nutze diese Erweiterung nämlich nicht.

Code

#titlebar-min > .toolbarbutton-icon,
#titlebar-max > .toolbarbutton-icon,
#titlebar-close > .toolbarbutton-icon {
visibility:hidden!important}

Einzutragen in die userChrome.css

Sollte der Ordner chrome nicht vorhanden sein musst du ihn dir erst erstellen, und in ihm dann eine userChrome.css
Du mußt dir im Profilordner einen neuen Ordner chrome erstellen und in diesem dann eine Textdatei ( mit einem Editor ) in die du den Code kopierst, bzw. einträgst.

Dann schließt du die Datei und speicherst sie als userChrome.css ab.
Danach mußt du den Firefox neu starten.

PS:
Du musst dir dazu die versteckten Dateiendungen anzeigen lassen.

Um das einzustellen geht man im Windows Explorer (wenn man einen Ordner offen hat) links oben auf

"Organisieren" -> "Ordner und Suchoptionen" -> "Ansicht"

und entfernt das Häkchen bei "Erweiterungen bei bekannten Dateitypen ausblenden"

Wo finde ich meinen Profilordner

Thomas3

Hab meine CSS Dateien so angeordnet wie Du es mal vorgeschlagen hattest, also jedes Script eine Datei.

Hab es so eingetragen:

@-moz-document url(chrome://browser/content/browser.xul)

{

#titlebar-min > .toolbarbutton-icon,
#titlebar-max > .toolbarbutton-icon,
#titlebar-close > .toolbarbutton-icon {
visibility:hidden!important}

}

Funktioniert leider nicht.

Die Erweiterung wird wohl nicht weiter mit FF57 funktionieren, deshalb die Suche nach einer Alternative.

milupo

Schreibe nur das hinein, was 2002Andreas im Code-Fenster angegeben hat.

Thomas3

Ändert dann auch nichts.

milupo

Bei mir funktioniert es. Es ist außerdem kein Script. Es sind simple CSS-Anweisungen. Du hast wirklich alles entfernt, was nicht hinein gehört? Es darf wirklich nur folgendes in der userChrome.css stehen:

#titlebar-min > .toolbarbutton-icon,
#titlebar-max > .toolbarbutton-icon,
#titlebar-close > .toolbarbutton-icon {
visibility:hidden!important}

Sonst nichts.

Die Datei muss im Profilverzeichnis sein, dort im Ordner chrome und userChrome.css heißen. Achte beim Dateinamen auf die Schreibung!

Thomas3

Hallo milupo

Ich hatte zuerst eine eigene Datei für die Fensterschaltflächen erstellt, genauso wie für andere Dinge (Tab, URL, etc.) und dann per (Beispiel) „@import "CSS/Windows.css";“ in die userChrome.css importiert.

Ganz nach der Anleitung von Andreas zur besseren Übersicht, wenn man viele Dinge ändern möchte.

Ergebnis: keine Veränderung

Nach deinem Hinweis jetzt noch mal direkt in die userChrome.css geschrieben, ebenfalls keine Veränderung.

Hab zwischenzeitlich einen Style gefunden der die Fensterschaltflächen verändern kann.

https://userstyles.org/styles/135593/firefox-edge-light-dark

Dieser Code funktioniert in Stylish oder der userChrome.css bei mir.

Hab dann versucht den Code mit Hilfe von Stylish zu extrahieren welcher die Fensterschaltflächen verändert.

Hab dann den „Restcode“ in die CSS eingetragen, damit startet aber der FF gar nicht mehr.

Spielt mein Betriebssystem eine Rolle?

Habe Windows 7 mit FF56

Hier der Restcode:

CSS

/*    Firefox Edge v1.12.0    */


@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url("chrome://browser/content/browser.xul"),
               url("chrome://browser/content/bookmarks/bookmarksPanel.xul"),
               url("chrome://browser/content/history/history-panel.xul") {



  /* MAIN WINDOW & TITLEBAR BUTTONS */
  #titlebar-min,
  #titlebar-max,
  #main-window[sizemode="maximized"] #titlebar-max,
  #titlebar-close,
  #minimize-button,
  #restore-button,
  #close-button {

     -moz-appearance: none !important;
    display: -moz-box !important;
    border: none !important;
    opacity: 0.5! important;
  }


  @media (-moz-os-version: windows-xp),
         (-moz-os-version: windows-vista),
         (-moz-os-version: windows-win7),
         (-moz-os-version: windows-win8) {
    #main-window {
      -moz-appearance: none !important;
    }
  }        


  .titlebar-button {


    -moz-context-properties: stroke;
    stroke: yellow;
  }


     
     #titlebar-min {
    list-style-image: url(chrome://browser/skin/window-controls/minimize.svg);
  }


  #titlebar-max {
    list-style-image: url(chrome://browser/skin/window-controls/maximize.svg);
  }

       #titlebar-close {
    list-style-image: url(chrome://browser/skin/window-controls/close.svg);
  }       

}

Alles anzeigen

Edit 2002Andreas
Text in Klammercode gesetzt.

EffPeh

Also mit Andreas Code werden nur die Icons ausgeblendet, die Schaltflächen selbst bleiben bestehen.
Um die Schaltflächen vollständig auszublenden, kann man dies so erzwingen:

CSS

/* Hiermit werden die Buttons ausgeblendet - der Platz wird aber trotzdem von den Elementen beansprucht  */
#titlebar-buttonbox-container {
	visibility: hidden !important;
}
/* Hiermit werden die Buttons vollständig entfernt */
#titlebar-buttonbox-container {
	display: none !important;
}

Wenn du deine Styles über die @import-Funktion einbindest, musst du immer ein bisschen darauf achten, in welcher Reihenfolge du sie einbindest. Unter Umständen überschreibst du sonst bereits bestehende Anweisungen.

Bitte Code in die dafür vorgesehenen Tags (Button : </>) setzen. Das macht es wesentlich lesbarer. Danke.

2002Andreas

Alle hier genannten Codes funktionieren nur wenn die Titelleiste ausgeblendet ist.

Zitat

nur die Icons ausgeblendet

Das hatte ich extra so gemacht, damit sich die Leistenhöhe nicht verändert wie bei display:none.

EffPeh

> Alle hier genannten Codes funktionieren nur wenn die Titelleiste ausgeblendet ist.
Wie meinst du das? Bei mir im FF58 funktioniert das auch mit Titelleiste.

> Das hatte ich extra so gemacht, damit sich die Leistenhöhe nicht verändert wie bei display:none.
Okay, das kann natürlich sein, wenn ansonsten nichts in der Leiste steckt ausser dem Menü. Könnte man aber evtl. mit einem Spacer ausgleichen. Bin mir nicht sicher, ob deren Höhe fix ist. Oder der Leiste direkt eine feste Höhe zuweisen. Sieht halt bissel blöd aus, wenn in der Leiste vor den eigentlich noch vorhandenen Fenster-Buttons weitere Icons platziert sind und danach freier Platz ist.

EffPeh

Oder alternativ so:

CSS

#titlebar-buttonbox-container {
	visibility: hidden !important;
	max-width: 1px !important;
	width: 1px !important;
	overflow: hidden !important;
}

Dann bleibt die Höhe ebenfalls erhalten.

2002Andreas

Zitat von EffPeh

im FF58 funktioniert das auch mit Titelleiste.

Hier weder im Fx 56...57 noch 58.

Thomas3

Hallo

Auch der letzte Vorschlag zeigt keine Veränderung bei mir.(Sorry, hatte jetzt nur bis Beitrag 8 verfolgt)

Hab jetzt noch etwas mit dem kompletten Style den Ich in Beitrag 7 verlinkt hatte experimentiert.

Ergebnis ist ein Code mit dem man die Schaltflächen anpassen kann.

Trotzdem etwas merkwürdig sind diese Zeilen:

CSS

#main-window {
    background-color: #000!important;
  }

  @media (-moz-os-version: windows-xp),
         (-moz-os-version: windows-vista),
         (-moz-os-version: windows-win7),
         (-moz-os-version: windows-win8) {
    #main-window {
      -moz-appearance: none !important;
    }
  }

Alles anzeigen

Löscht man diesen Bereich erscheinen die Originalen Windows 7 Schaltflächen und die hier im Code implementierten.
Ist es also doch Betriebssystemabhängig?

Ohne Code

[Blockierte Grafik: http://fs5.directupload.net/images/171112/hrblac7p.png]

mit Code

[Blockierte Grafik: http://fs5.directupload.net/images/171112/xwqbhz6b.png]

Hier der Code zum Schalter verändern:

CSS

/*    Firefox Edge v1.12.0    */


@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url("chrome://browser/content/browser.xul"),
               url("chrome://browser/content/bookmarks/bookmarksPanel.xul"),
               url("chrome://browser/content/history/history-panel.xul") {



  
  /* MAIN WINDOW & TITLEBAR BUTTONS */
  #titlebar-min,
  #titlebar-max,
  #main-window[sizemode="maximized"] #titlebar-max,
  #titlebar-close,
  #minimize-button,
  #restore-button,
  #close-button {
    -moz-appearance: none !important;
    display: -moz-box !important;
    border: none !important;
    width: 46px !important;
    height: 32px !important;




   opacity: 0.99!important;
  }



  #main-window {
    background-color: #000!important;
  }

  @media (-moz-os-version: windows-xp),
         (-moz-os-version: windows-vista),
         (-moz-os-version: windows-win7),
         (-moz-os-version: windows-win8) {
    #main-window {
      -moz-appearance: none !important;
    }
  }


                 
  .titlebar-button {
    border: none;
    margin: 0 !important;
    padding: 10px 17px;
    -moz-context-properties: stroke;
    stroke: black;
  }


  :root[sizemode=maximized] .titlebar-button {
    padding-top: 8px;
    padding-bottom: 8px;
  }


  .titlebar-button > .toolbarbutton-icon {
    width: 12px;
    height: 12px;
  }


  #titlebar-min {
    list-style-image: url(chrome://browser/skin/window-controls/minimize.svg);
  }


  #titlebar-max {
    list-style-image: url(chrome://browser/skin/window-controls/maximize.svg);
  }


  :root[sizemode="maximized"] #titlebar-max {
    list-style-image: url(chrome://browser/skin/window-controls/restore.svg);
  }


  #titlebar-close {
    list-style-image: url(chrome://browser/skin/window-controls/close.svg);
  }


  #titlebar-min,
  #minimize-button,
  toolbar[brighttext] #titlebar-min,
  toolbar[brighttext] #minimize-button {
    stroke: var(--titlebar-min-max-icon-color);
  }


  #titlebar-max {
    stroke: var(--titlebar-min-max-icon-color);
  }


  #main-window[sizemode="maximized"] #titlebar-max,
  #restore-button {
    stroke: var(--titlebar-min-max-icon-color);
  }


  #titlebar-close,
  #close-button {
    stroke: var(--titlebar-close-icon-color);
  }

  #titlebar-close:hover,
  #close-button:hover {
    stroke: var(--titlebar-close-hover-icon-color);
  }


  #titlebar-min:hover,
  #titlebar-max:hover,
  #minimize-button:hover,
  #restore-button:hover {
    background-color: var(--titlebar-min-max-hover-bg-color) !important;
  }


  #titlebar-min:hover:active,
  #titlebar-max:hover:active,
  #minimize-button:hover:active,
  #restore-button:hover:active {
    background-color: var(--titlebar-min-max-active-bg-color) !important;
  }


  #titlebar-close:hover,
  #close-button:hover {
    background-color: var(--titlebar-close-hover-bg-color);
  }


  #titlebar-close:hover:active,
  #close-button:hover:active {
    background-color: var(--titlebar-close-active-bg-color);
  }


  .titlebar-button {
    height: 32px !important;
    margin-bottom: -14px !important;
  }


  }


  :root {
    --titlebar-min-max-icon-color: #000000;
    --titlebar-close-icon-color: #000000;
    --titlebar-close-hover-icon-color: #FFFFFF;
    --titlebar-min-max-hover-bg-color: #B3B3B3;
    --titlebar-min-max-active-bg-color: #9F9F9F;
    --titlebar-close-hover-bg-color: #E81123;
    --titlebar-close-active-bg-color: #F06F79;


  }
}

Alles anzeigen

2002Andreas

Zitat von EffPeh

Oder alternativ so:

Dein Code ergibt so keinen Sinn :-??

Dieser Eintrag war doch so von mir:
visibility: hidden !important;

und mehr braucht da dann auch nicht zu stehen.

Es ging ja darum ein evtl. Problem mit display:none zu umgehen.

milupo

Zitat von 2002Andreas

Alle hier genannten Codes funktionieren nur wenn die Titelleiste ausgeblendet ist.

Das ist sie bei mir.

2002Andreas

Zitat von milupo

Das ist sie bei mir.

Kannst du sie bitte mal einblenden und dann testen.
Hier bleiben die Icons dann nämlich erhalten.

Vielen Dank für deine Hilfe.

milupo

Ja, dann bleiben sie erhalten.

2002Andreas

Zitat

den Ich in Beitrag 7 verlinkt hatte experimentiert.

Hallo Thomas3..

dein Code hat nicht mit dem Ausblenden der 3 Standard Symbole zu tun.

2002Andreas

Zitat von milupo

Ja, dann bleiben sie erhalten.

Danke für den Test, dann hatte ich also recht damit, ist hier nämlich auch so.

EffPeh

> Dein Code ergibt so keinen Sinn[...]
Der ergibt schon Sinn. visibility unterdrückt nur die Sichtbarkeit von Elementen. Der für die Elemente benötigte Platz wird aber trotzdem beansprucht.
Das schaut dann so aus:
[attachment=1]leiste-1.png[/attachment]
display: none dagegen nimmt die Elemente komplett heraus. Wenn man aber nun die Höhe der Elemente berücksichtigen will - also ohne display: none und ohne noch zusätzlich die Höhe der Leiste zu fixen - , kann man es machen, wie in meinem Code, weil die Höhe bestehen bleibt.
Das Ergebnis sieht so aus:
[attachment=0]leiste-2.png[/attachment]