Fenstergröße (maximized/NOT maximized) in einem .css festellbar/nutzbar?

    Firefox-Version
    94.0.2
    Betriebssystem
    Win10

    nabend...

    Ist es möglich in einem .css festzustellen bzw. zu nutzen, ob das FF-Fenster maximized ist oder nicht?

    Mein FF-Fenster hat bei mir im "Normalbetrieb" 1150x950 und sieht so aus:

    Es gibt aber Momente, wo ich ihn Fullscreen (1280x1024) maximieren will.

    Nicht immer, auch nicht immer öfter, aber halt manchmal ;)

    Dummerweise sieht das dann so aus, weil die Lesezeichen(zeilen) das auch mitbekommen:

    Die "Zeilenümbrüche" bei den blauen Pfeilen fehlen also (noch).

    Denk ich mir das hier aus:

    Sieht nicht schön aus, aber ich hab folgende Gedanken gehabt:

    Wenn FF-Fenster maximized/Fullscreen:

    Neuer Ordner 1.............................. Platz belegen, aber unsichtbar

    Neuer Ordner 2.............................. Platz belegen, aber unsichtbar

    => visibility: hidden !important;

    Wenn FF-Fenster NOT maximized/Fullscreen:

    Neuer Ordner 1.............................. Platz nicht belegen

    Neuer Ordner 2.............................. Platz nicht belegen

    => display: none !important;

    Ich bin über die Browserwerkzeuge auf die idee gekommen, folgendes irgendwie verwenden zu können:

     #PlacesToolbar/

    sowie

    toolbarbutton.bookmark-item label*="Neuer Ordner 1" 

    und

    toolbarbutton.bookmark-item label*="Neuer Ordner 2" 

    Nun fehlt mir nur die zündende Idee, wie ich [maximized] bzw :not[maximized] als Bedingung formulieren könnte.

    Ginge das überhaupt?

    W11 Home 64bit - FF144.x

    Hmpf... ich bin wieder zu Dummzumzum ;(

    Zusatzordner sichtbar eingefügt, sodaß in der Lesezeichenleiste alles verrutscht.

    In die userChrome als letztes eingefügt:

    CSS
    toolbarbutton.bookmark-item[label^="Neuer Ordner"]:not([inFullscreen="true"]) {
    display: none !important; 
}
toolbarbutton.bookmark-item[label^="Neuer Ordner"]([inFullscreen="true"]) {
    visibility: hidden !important; 
}

    FF neu gestarted.

    Beide Ordner verschwunden, aber in der Sidebar noch vorhanden.

    FF maximiert.

    FF neu gestarted.

    Beide Ordner immer noch verschwunden, aber in der Sidebar noch vorhanden.

    Was mach ich falsch?

    Zitat von 2002Andreas

    [sizemode="maximized"]

    Hab ich grad auch versucht - selbes Ergebnis...

    W11 Home 64bit - FF144.x

    Einmal editiert, zuletzt von harff182 (2. Dezember 2021 um 23:22) aus folgendem Grund: Ein Beitrag von harff182 mit diesem Beitrag zusammengefügt.

    Zitat von harff182

    In die userChrome als letztes eingefügt:

    Sofern nicht tatsächlich genau dieses Element das Attribut hat, kann das nicht funktionieren. Mit deinem Code sagst du ja, dass das Element .bookmark-item dieses Attribut haben oder nicht haben soll.

    Wenn schon (ungetestet, nur ausgehend von deinem Code) so:

    CSS
    :root:not([inFullscreen]) toolbarbutton.bookmark-item[label^="Neuer Ordner"] {
  display: none !important; 
}

:root[inFullscreen] toolbarbutton.bookmark-item[label^="Neuer Ordner"] {
  visibility: hidden !important; 
}
    Zitat von grisu2099

    Sind da in Zeile 4 die runden Klammern nicht überflüssig?? :/

    Nicht nur überflüssig, sondern falsch. Das ist in der Form kein gültiges CSS und wird darum gar nichts machen.

    Es gibt keinen Grund, sich so zu fühlen. Im Gegenteil hast du damit doch selbst schöne Beispiele gebracht, an denen du dich verbessern kannst. Ich sehe da die folgenden Lektionen für dich:

    Lektion 1: Nehmen wir die Sache mit den Klammern, die da nicht hingehören. Ich gehe jetzt mal davon aus, dass die daher kommen, dass du für den einen Fall :not([inFullscreen="true"]) geschrieben hast und das dann für den umgekehrten Fall auf ([inFullscreen="true"]) gekürzt hast. Der Ansatz ist ja schon gut. In dem Fall musst du dir nur noch klar machen, dass die runden Klammern zu :not() gehören, d.h. wenn du das :not entfernst, müssen auch die runden Klammern weg. Du hast es selbst in der gleichen Zeile an anderer Stelle sogar richtig gemacht: Das [label^="Neuer Ordner"] hast du auch nicht mit runden Klammern umgeben und das ist hier genau die gleiche Syntax: Du prüfst ein Attribut, daher die Schreibweise mit den eckigen Klammern, nichts weiter.

    Lektion 2: Was den Punkt betrifft, dass du das direkt an .bookmark-item[label^="Neuer Ordner"] dran gehängt hast, ist folgendes Grundlagen-Wissen ganz wichtig, weil das für alle deine Anpassungen relevant ist: Du kannst einen CSS-Selektor praktisch beliebig erweitern. Sobald zwischen zwei Dingen ein Leerzeichen steht, heißt das, dass das rechts vom Leerzeichen eine (oder mehrere) Ebenen tiefer ist als das vor dem Leerzeichen. Wenn da aber kein Leerzeichen ist, ist das eine UND-Verknüpfung, d.h. die Bedingungen beziehen sich auf ein Element und müssen sowohl als auch erfüllt sein. Man kann sich vorstellen, dass die Information, ob sich Firefox im Vollbild-Modus befindet oder nicht, nur einmal im Code steht, nämlich ziemlich weit außen, damit jedes Element darunter auf die Information zugreifen kann, und nicht auf jeder einzelnen Ebene wiederholt wird. Dass ausgerechnet .bookmark-item dieses Attribut hat, war also sehr unwahrscheinlich.

    Lektion 3: Wenn du dich selbst mit Anpassungen befasst, nutzt du vermutlich eh schon die Entwicklerwerkzeuge. inFullscreen kann man ins Suchfeld des Inspektors eingeben und dann sieht man, wo das Attribut gesetzt ist (vorausgesetzt, du befindest dich im Vollbildmodus). Dann ist auch klar, dass das in deinem Selektor eher irgendwo am Anfang und nicht am Ende stehen muss.

    Lektion 4: Und schließlich sei https://searchfox.org/ ans Herz gelegt: Wenn man schaut, wie Mozilla etwas Bestimmtes verwendet, findet man oft Beispiele, wie man selbst etwas lösen kann. Sowohl für die Schreibweise ohne als auch mit :not() findet man Beispiele im Firefox-Code.

    Zitat von Sören Hentzschel

    Es gibt keinen Grund, sich so zu fühlen.

    Nuja, wenn man sich nicht gegenübersitzt, kommt manchmal was falsch an.

    Zitat von Sören Hentzschel

    Ich sehe da die folgenden Lektionen für dich:

    Gebookmarkt für spätere Langeweile ;)

    Zitat von harff182

    Werd ich morgen mal testen,

    Entfällt, bis mir ein neuer Einsatz dafür einfällt ;)

    Grund:

    Mir ist durch den Kopf gegengen, daß meine Rumhampelei mit den Platzhalter-Ordnern eigentlich der berühmnte "Schuß von unten durchs angezogene Knie ins Herz" ist.

    Ich hab mir dann anguckt, wie denn die mehrzeilige Lesezeichen-Zeile zustandekommt.

    Und bin fündig geworden:

    Bei den Regeln für #PlacesToolbarItems einfach max-width: 1120px !important;  hinzu eingefügt und schon war meinereiner Happy :dancing:

    :/ irgendwie eleganter und weniger Angriffsfläche für mich etwas zu verhunzen...

    W11 Home 64bit - FF144.x

    Ich mach den Thread nochmal auf, auch wenn ich für die Lesezeichen-Leiste eine Lösung gefunden habe.

    Mit der "#ExtAppButtons"-Bar habe ich Quasi das realisiert, was ich zu brauchen glaube, wenn ich mit einem maximierten FF arbeiten will.


    Heute wollte ich mich darum kümmern, wie ich diese Bar unterdrücke, wenn der FF im "Normalbetrieb" (1150x950) läuft.

    Als erstes ist mir aufgefallen, daß inFullscreen (F11) keinesfalls ein zutreffendes (Ausschluß-)Kriterium sein kann.

    Logischerweise hab ich mich dann auf sizemode="normal" bzw. sizemode="maximized" gestürzt, das 2002Andreas ins Spiel gebracht hat, und das ich auch im Inspektor wiederfinde.

    Damit ich Probleme mit der #ExtAppButtons-Bar ausschließen kann, hab ich mal versucht, die #navbar verschwinden zu lassen:

    CSS
    :root[sizemode="normal"]#navbar{
    display: none !important;
    appearance: none !important;
}

    ;( Tja, Satz mit "x"....

    Was mach ich Code-mäßg falsch?

    :/ Oder bin ich gedanklich mal wieder aufm Holzweg?

    W11 Home 64bit - FF144.x

    Vorweg: Ich habe den Code weder getestet noch nach einer Lösung gesucht (mich beschäftigt derzeit ein Problem mit meiner Hardware), aber als Drive-By-Kommentar zum gezeigten Code-Ausschnitt: Vor das #navbar muss in jedem Fall mal ein Leerzeichen, weil es sonst die ID von :root wäre, aber :root kann keine ID haben. Das Element mit dieser ID liegt in jedem Fall irgendwo unterhalb von :root.

    ist der Fullscreen deaktiviert, soll der nav-bar ausgeblendet werden.

    ist der Fullscreen aktiviert, soll der nav-bar eingeblendet werden.

    Suchst du eine CSS für sowas? Oder habe ich da was völlig falsch verstanden? :)

    harff182 diese Code funkt.

    CSS
    :root[sizemode="normal"] #nav-bar{
    display: none !important;
    appearance: none !important;
}

    getestet im Stilbearbeitung.

    "Klug sein hat noch nie einen Menschen an Dummheiten gehindert." Stefan Zweig
    Firefox-Version: 144.0.2
    Edition: Windows 11 Home (64-Bit-Betriebssystem)
    Version: 24H2

    2 Mal editiert, zuletzt von omar1979 (9. Dezember 2021 um 23:41) aus folgendem Grund: Ein Beitrag von omar1979 mit diesem Beitrag zusammengefügt.

    Drück mal F11, dann solltest Du sehen, was "fullscreen" ist ;)

    Deswegen gehe ich über sizemode und nicht über inFullscreen.

    maximized ist, wenn man das mittlere der drei Felder rechts oben anklickt.

    normal ist die Größe, wie mein FF sich normalerweise öffnet, bei mir 1150x950.

    Die #navbar hab ich als Beispiel genommen, da nicht jedes Helferlein die #ExtAppButtons zum verschwinde lassen hat.

    Und ja, ich suche den CSS-Code, mit dem ich die #navbar verschwinden lassen kann, wenn mein FF normal ist.

    W11 Home 64bit - FF144.x