Beiträge von Horstmann

  • Lesezeichen-Sidebar automatisch bei Vollbild (F11) ausblenden

    Zitat von Thomas S.

    A) - allerdings gibt es dabei den unschönen Effekt, dass man mit der Maus eine gezielte Bewegung ausführen muss.

    B) Und ein zweiter Effekt, der hinzukommt: das Einblenden überlagert die dargestellte Internetseite, die Darstellung wird nicht nach rechts verschoben, weil die Eingeblendete Sidebar keine Platz beansprucht. Dadurch ist mehr "Ruhe" in der Darstellung beim Einblender der Sidebar

    Zu A): Das ist klar, hover funktioniert nur, wenn man über den angesprochenen Elementen ... hovert. ;)

    Um den Effekt abzumildern, hatte ich die transition eingebaut, so dass man etwas Zeit hat, um mit der Maus von der toolbar zur sidebar zu wechseln, ohne draufbleiben zu müssen - ich hoffe das hast du auch benutzt beim Testen.8)

    Aber generell macht der traditionelle Code, mit der seitlichen hover Leiste, in der praktischen Anwendung auf jeden Fall mehr Sinn - danach hattest du aber ausdrücklich nicht gefragt.;)


    Zu B): Das Verhalten kann man so oder so einbauen, ist aber halt nicht die normale Funktionsweise von Fx.

  • Lesezeichen-Sidebar automatisch bei Vollbild (F11) ausblenden

    Zitat von Thomas S.

    Horstmann nee, das will einfach nicht. #navigator-toolbox:not(:hover) fuktioniert, aber sobald ich bei #browser #sidebar-box das :not(:hover) ergänze, wird die Sidebar gar nicht mehr ausgeblendet.

    Da haben wir beide nicht genau gelesen;).

    Ich sehe gerade erst, du benutzt 115esr, da musst du - wie erwähnt - für meinen Code #navigator-toolbox-background als ID benutzen, statt #navigator-toolbox.

    Also sowas in der Art, falls du das nochmal testen wolltest:

    Zitat von Thomas S.

    Da die Steuerelemente (das nenne ich so, es sind die URL- und die Tab-Leiste mit den Buttons; oder als ID die #navigator-toolbox) einfach dynamisch vom FF per margin-top: -62px nach oben "ausgeblendet" wird, gibt es dazu wohl keine Eigenschaft zur Auswertung.

    Das ist keine originale Firefox Funktion, oder doch? :/

    Könnte keine Auswirkungen haben auf den Code oben, oder halt doch.

  • Lesezeichen-Sidebar automatisch bei Vollbild (F11) ausblenden

    Zitat von Thomas S.

    Horstmann Das funkt nicht - ist genau das Problem, was ich oben nannte. Geht man mit der Maus von den eingeblendeten Steuerelementen weg, ist es nicht mehr "hover" und die Sidebar ist wieder weg, bevor man da drauf ist...

    Die Bedingung muss also so was wie "Steuerelemente oben sichtbar" sein.


    Ah, Mist, mal wieder nicht anständig getestet ;).

    Ich glaube nicht dass man das so einfach mit "Steuerelemente oben" (Screenshot evtl.?) umsetzen kann, aber bei mir am Mac sind einige Leisten anders eingebunden, daher kann ich damit vermutlich nicht arbeiten.

    Damit die Sidebar nicht gleich wieder verschwindet, evtl. sowas probieren (davon ausgehend dass bei dir #navigator-toolbox funktioniert) :

    CSS
    #main-window[sizemode="fullscreen"] #navigator-toolbox:not(:hover) ~ #browser #sidebar-box:not(:hover) {
    width: 0px !important;
    min-width: 0px !important;
}

  • Lesezeichen-Sidebar automatisch bei Vollbild (F11) ausblenden

    Ich kann leider nur raten, weil ich sowohl auf Mac, als auch auf 115esr bin...

    Sowas funktioniert in 115esr:

    CSS
    #main-window[sizemode="fullscreen"] #navigator-toolbox-background:not(:hover) ~ #browser #sidebar-box {
    width: 0px !important;
    min-width: 0px !important;
}


    Geraten für aktuelles Firefox, weil es da #navigator-toolbox-background nicht mehr gibt:

    CSS
    #main-window[sizemode="fullscreen"] #navigator-toolbox:not(:hover) ~ #browser #sidebar-box {
    width: 0px !important;
    min-width: 0px !important;
}


    Zu beachten wäre noch, dass zB Video Vollbild ein etwas anderes Thema ist.

  • Farbe des aktiven Tabs verändern

    Benutzt du denn schon CSS Modifikationen?

    Es sieht fast so aus, und davon hängt es ab was man am besten tun könnte, um eine Markierung für die selektierte Tab zu generieren.

    Wie von Sören erwähnt, es kommt auch darauf an, worüber wir hier reden; eine generelle Markierung oder die welche es bereits gibt für Umgebungen.

    Möglichkeiten dafür gibt es eine Menge.

  • Höhe der Leisten einstellen: Lesezeichenleiste, Menüleiste, Tableiste, Eingabeleiste

    Zitat von gumbl

    Das habe ich versucht, aber es ist keine Änderung feststellbar.

    Habe auch nochmal alles gecheckt, Datei liegt in

    C:\Users\Rae\AppData\Roaming\Mozilla\Firefox\Profiles\jxov5t.default-release\chrome\userChrome.css


    Hmm, du könntest mal versuchen, deine userChrome.css mit der angehängten Datei zu ersetzen.

    Das ist der Code von Andreas, plus noch 2 grelle Hintergrundfarben zum Testen.

    userChrome.css.zip

    Das sollte dann so aussehen:

  • Tableiste GANZ unten Script funktioniert nicht mehr?

    Zitat von FFmic

    So, ich habe die Tableiste nun doch wieder nach unten gesetzt.

    Aber: Auch Minimieren/Maximieren/Schließen sind mit nach unten gewandert. Das ist seltsam.

    Oben erscheint das Trio nur, wenn ich per F10 die Menüleiste aktiviere.

    Ist doch normal so, oder ist das wieder ein Mac Ding?:/

    Die Window Buttons sind generell in der Titelleiste, hier zumindest.

    Ist die Titelleiste "deaktiviert", werden Titelleiste und Tableiste quasi zusammengefasst, und die Window Buttons sind dann Teil dieser kombinierten Titel/Tableiste.

    Wenn du die Tableiste bei deaktivierter Titelleiste verschiebst, wandern die Buttons mit.

    Verschieben kannst du die Dinger danach schon, mit etwas CSS, je nachdem wo sie hinsollen.

  • Bookmark-Button und Bezeichnung

    Zitat von 2002Andreas
    Zitat von Horstmann

    auch in 119+ klappt.

    Im Anpassenfenster

    Danke für's Testen! :)

    Ich habe den Code nochmal gerafft bekommen, das war mir doch zu unhübsch und umständlich . ;)

  • Bookmark-Button und Bezeichnung

    Ich weiss man sollte keine alten Themen ausgraben ;) , aber das hier fand ich generell ganz interessant.

    Die meisten Buttons in Fx haben ja Text, der ist nur nicht sichtbar.

    Dieser Text sitzt in einem ::before Element zu label, und - man kann ihn sich anpassen!

    Diesen Text zu beutzen ist um einiges einfacher als ein neues Pseudoelement zu basteln, wie wir es hier gemacht hatten; weniger Code, und alle nötigen Maße, Farben etc. werden von Fx bereitgestellt.

    Das Prinzip sollte bei den meisten Buttons funktionieren; der eine zusätzliche Aufwand ist für das Anpassen Fenster, da fällt mir gerade nichts eleganteres ein.

    Wer Lust hat kann das hier mal testen; ich bin auf Fx115esr, würd mich interessieren ob das auch in 119+ klappt.

  • userChrome.css bearbeiten

    Zitat von xyzdef

    Sicherlich finde ich zu Haufe Beispielcodes im Netz. Wo befinden sich gute Seiten?

    Gibt ne Menge, aber dieses Forum ist schon mal prima, eine Menge Info und Code findet sich auch auf Reddit (muss man sich halt teils durchquälen), und die beste Anfänger-freundliche CSS Code Sammlung für Fx - die ich kenne - ist diese.

    Gute Quellen für Basiswissen und sehr nützlich als Nachschlagewerke zu einzelnen Themenbereichen sind MDN oder W3schhools; eine gute Übersicht über aktuellen Fx Code gibt es bei searchfox.

    MDN Artikel gibt es teils auch in Deutsch, aber Englisch ist schon gut zu können, der Code selber ist ja auch in Englisch.

  • Tabform

    Zitat von Mira_Belle

    Horstmann

    Danke auch für diesen Code!

    CSS
        #navigator-toolbox { 
        background-image: linear-gradient(0deg, rgba(255, 170, 0, 1) 2%, rgba(223, 144, 0, 1) 4%, rgba(192, 118, 0, 1) 8%, rgba(161, 93, 0, 1) 16%, rgba(131, 69, 0, 1) 32%, rgba(102, 47, 0, 1) 64%, rgba(74, 25, 0, 1) 72%, rgba(47, 3, 0, 1) 80%, rgba(11, 0, 0, 1) 88%, rgba(0, 0, 0, 1) 100%) !important;
    }

    Gerne doch, war eine meiner leichteren Übungen. :)...

    Kleiner Scherz, der Code ist nicht von mir. ;)

    Sieht aus wie ein Verlauf über die ganze Toolbox, das geht im Prinzip.

  • Tabform

    Zitat von Sören Hentzschel


    Dir wird nichts anderes übrig bleiben, wenn du auch neuere Firefox-Versionen anpassen möchtest. Selbst wenn du es in eigenem Code nicht verwenden möchtest, musst du den bestehenden Firefox-Code ja verstehen, um ihn zielführend anpassen zu können. Und wenn du die CSS-Regeln versteht, kannst du sie auch anwenden. So schließt sich der Kreis. Viel gibt es außerdem ja gar nicht, was man dafür lernen müsste, wenn man eh schon im CSS-Thema drin ist. Das lässt sich mit wenigen Sätzen erklären und mehr als das ist es am Ende auch nicht. Das ist leichter als beispielsweise jemandem die Komma-Regeln der eigenen Sprache zu erklären. Also keine Angst davor. ;)

    Stimmt schon; lesen bzw. verstehen kann ich den "neuen" Code halbwegs, und nach meiner kurzen Recherche ist es tatsächlich nicht so komplex, bringt aber wie gesagt interessante neue Möglichkeiten mit sich.

    Mal schauen.

    Wo ich mir nicht ganz sicher bin: ist Komma-Regeln die korrekte Schreibweise, oder sollte das nicht eher Kommaregeln sein? :P

    Kleiner Scherz; bitte nicht nochmal eine Rechtschreibdebatte, oder - ... Rechtschreib-Debatte? ;)

  • Tabform

    Das Gute an Variablen, und den Berechnungsformeln, ist dass man nur einen oder einige wenige Werte ändern muss, um den gesamten Code auf einmal anzupassen.

    Vorrausgesetzt natürlich dass man alles korrekt aufgebaut hat; und ich bin da nicht gerade Experte drin. ;)

    Neu gibt es noch dazu das Nesting und (bald) den :has Selector in Fx, was noch mehr Möglichkeiten eröffnet.

    Aber ob ich dass noch dazulernen will...

    Unser Code hier ist ziemlich einfach, ich hab selber zum Testen meist nur absolute Werte benutzt, wegen der Übersichtlichkeit.

    Für die Anwendung ist dann eine mehr automatisierte Form sinnvoller, weil man nur als Author noch dahintersteigt, welcher Wert warum wo steht.

    Dann schau dir mal die Codes von Aris an, oder auch andere wie der erwähnte von Godie etc., das ist eine komplett andere Welt.

    An sowas kann ich nicht mal kratzen, die Komplexität an sich und der benutzten Variablen ist fantastisch. 8|

    Und gut zu hören dass multiselected klappt - da würde ich nur ungern nochmal drangehen. ;)

  • Tabform

    Zitat von Mira_Belle

    Aber weißt Du, ich wollte mir die Spielerei aufheben, mit dem Farbverlauf und so.

    So was vergesse ich doch sonst, wenn ich es "lösche" und nicht hin und wieder ausprobiere!!

    "Für was war das nochmal so? Muss ich testen. Achja, jetzt weiß ich es wieder!" Selbstgespräch Ende.

    Das kenn ich gut; Stunden am CSS basteln an irgendeiner Ecke, ein paar Wochen später die Frage was, wie und warum überhaupt? ;)

    Für Verläufe gibt's zig Möglichkeiten; kuck mal: ;)

  • Tabform

    /*-------------------------------------------*/

    Um zu wissen dass es anders geht, musst du eigentlich erstmal wissen wie es anders geht, und was der Code macht. ;)

    Aber natürlich geht's anders, wie immer.

    Anmerkungen schreib ich oben rein zu den einzelnen Blöcken, hoffe das macht halbwegs Sinn. :)

    Danke für den Test! :)

    Hmm, das ist wirklich seltsam. :/

    Ich hatte das auch auf meinem Fx 119 Frankencomputer getestet, ohne Probleme; sonst hätte ich gesagt wegen meinem normalen 115esr Testumfeld sind die Selektoren nicht aktuell.

    Aber dann war es eine gute Idee, fill/stroke direkt in die before/after Elemente zu schreiben. :thumbup:

    Ich hatte das eigentlich nur weiter nach oben verlegt, damit alle Farbeinstellungen im gleichen Block liegen, was aber funktionell schnuppe ist. Bzw. in deinem Fall gar nicht klappt.

    Hast du multiselected Tabs mal probiert, gibt's da evtl. auch Ärger?

    Die sind zumindest in meinem Code nämlich aufwendig getrennt farblich.

  • Tabform

    Zitat von Mira_Belle

    Irgendwie komme ich mir blöd vor, Dir all diese Codeschnipsel raus suchen zu müssen.

    Die sind in dem CSS aus Beitrag #130.

    Und ich hätte gerne gewusst, wo diese Formeln herkommen.

    Wieso werden diese Werte berechnet, bzw, so?

    Ginge doch auch anders!

    Einige deiner Codebeispiele von vorher (#133) waren aber so nicht in meinem Code, daher die Frage; raus suchen musst du sie nicht, ich hab sie ja reingeschrieben, die find ich inzwischen im Schlaf. ;)

    Zu den Formeln später mehr.

    Kapier ich nicht, da fehlt die rechte Ecke in der selektierten Tab, in der letzten Tab ist sie da - bei mir aber nicht. :/

    Hast du das mal in einem Testprofil probiert - ohne das ganze andere CSS und Scripts?

    In dem Screenshot ist noch eine Menge anderes CSS etc. beteiligt.

    Du kannst aber fill/stroke auf jeden Fall in die before/after Elemente schreiben (und mit den Variablen von oben), hatte ich ursprünglich auch so, sollte aber eigentlich keinen Unterschied machen.

  • Tabform

    Zitat von Mira_Belle

    :/

    Noch besser bekomme ich es jetzt wirklich nicht mehr hin!


    Das Problem ist, bei mir auf dem Mac ist das alles anders aufgebaut; hier funktioniert #titlebar { order: 1 !important; }, Fensterbuttons noch bei Bedarf verschieben oder ausblenden, und fertig.

    Andreas hat erwähnt dass das in Windows mit aktuellem Fx wohl nicht mehr klappt, kann ich aber halt nichts zu sagen; dein Code klappt am Mac so nicht.

    Es gibt wie immer was von MrOtherGuy, das sieht aktuell aus (benutzt auch order?); den von 2002Andreas finde ich gerade nicht.

    Für eine dicke Kante würde ich sowas probieren, ohne das ganze Padding und Margin unten und Verschieben (Ausnahme:

    #navigator-toolbox padding erhöht um Borderbreite), das geht auch bei mir im groben Schnelltest (aber: am Mac !):