Beiträge von Horstmann

  • Tabform

    Zitat von Mira_Belle

    Bugs.

    Wieder die fehlenden Vektorgrafiken.

    Korrektur:

    Da kann entweder die Grafik komplett fehlen, und dann macht dieser geänderte CSS Code gar keinen Unterschied, weil er nur die Kanten der Grafik betrifft.

    Oder du hast evtl. die Farben verändert bevor du den Code unverändert probiert hast, und in einem Profil ohne andere CSS; die Farben sind sonst eigentlich festgemeisselt.

    Zitat von Mira_Belle

    Code für Tabs unten

    Da habe ich lange für gebraucht, dass das Ergebnis gut ausschaut.

    Bei allen anderen Ideen, die ich hatte, war nie das Ergebnis zufriedenstellend.

    Andere Baustelle, aber der Code ist ... Müll. Sorry. ;)

    Zuerst mal, calc( var(--tab-min-height) + 10px ); kommt aus deinem Tabs unten Code, nicht von mir - damit will ich nichts zu tun haben. ;)

    Generell ist --tab-min-height eine interne Firefox Variable, mit der man eine Menge Sinn und Unsinn anrichten kann, genauso wie mit --tab-block-margin.


    Die var(--ug-corner-size) Regeln in dem Beispiel kommen mir teilweise auch unbekannt vor - hast du daran selber was gedreht, oder von alten Versionen übernommen?

    Falls ja - keine gute Idee. 8)

    --ug-corner-size ist schlicht eine selber gemachte Variable für die Höhe und Breite der Eckengrafik, und gleich mit --tab-min-height, die ganz oben neu definiert wird.

    Und eigentlich nur deshalb um den schwachsinnigen Kompaktmodus mit zu bedienen. X/

    Der Code ist eigentlich nur dafür gedacht die Farben im oberen Bereich zu ändern und ein evtl. paar Kleinigkeiten für Buttons etc., und sieht keine anderweitige CSS vor die eingreift oder manche Teile überschreibt - wofür man auch nicht planen kann.

    Wenn also der Code in einem sonst unveränderten Testprofil nicht funktioniert, kann ich mir das gerne anschauen.

    Andernfalls eben nicht. :|

  • Tabform

    Zitat von Mira_Belle

    Horstmann

    Die letzte, neue Version gefiel mir sehr gut, vielen Dank.
    Ich habe noch ein paar Kleinigkeiten verändert, klitzekleine Bugs beseitigt und Farben angepasst.

    Hier das komplette CSS

    Prima! :)

    Was für Bugs hast du denn selber noch gefunden/geändert, gibt ja bestimmt noch einige?

    Die Border unten war in meinem Setup aber so gewollt, macht die seitlichen runden Kanten sauberer, aber das hängt von den anderen Farben etc. ab.

    Sonst hab ich auf den ersten Blick nichts gesehen, ausser dass dein Code für Tabs unten bei mir gar nicht funktioniert, aber das ist nur weil ich auf einem Mac bin. ;)

    Trotzdem sieht der Code dafür nicht dolle aus, würd ich bei Gelegenheit nochmal rangehen.

  • Tabform

    Zitat von Mira_Belle

    Werde ich machen, danke.

    Aufgeräumt und besser kommentiert, eine Version für dein dunkles Theme, ist evtl. einfacher zu arbeiten mit.

    Edit: mehr Overflow Bug Fixes.

  • Tabform

    Zitat von Mira_Belle

    Da nun an dieser Stelle die Entwicklung eingestellt wird, kann ich mich ja beruhigt an eine verbesserte Version

    der meinigen machen.

    Bevor ich den dringend nötigen Termin bei der Suchtberatung mache ;) - einen könntest du vielleicht noch testen. 8)

    Der hier sollte kaum noch Auffälligkeiten im Overflow haben, und sollte besser als der ältere Code sein den du benutzt...
    Farben kann man wieder komplett oben anpassen, ist hier zum Testen auf ein helles Profil eingestellt.

    Für dein Theme wie du es benutzt, könnte sowas evtl. ein Anfang sein:

  • Tabform

    Zitat von Mira_Belle

    Und was genau hast Du geändert?

    Denn rein von der Optik sehe ich keinen Unterschied

    und auch das Überlaufproblem besteht noch.

    Wobei, wenn ich genau hinschaue, es ist nicht mehr gar so krass.

    Hmm, stimmt leider. :/

    Ich denke ich lass es jetzt lieber bleiben; da sind zu viele Anpassungen in Firefox involviert in dem Bereich, mit dem Overflow und angehefteten Tabs, das krieg ich einfach nicht sauber hin. ;( ;)

  • Tabform

    Zitat von Mira_Belle

    Na da bin ich aber mal gespannt. 8o Kann es kaum erwarten.

    Und betrifft es wieder den kompletten Code,

    oder nur einen bestimmten Teil, bestimmte Selektoren?

    Ich habe am Rest natürlich auch wieder rumgefummelt ;) , aber generell ist der Code in der Basis der selbe.

    Du solltest eigentlich - ohne irgendwo unten reinzugehen - alle Farben im oberen General adjustments Block einstellen können.

    Die unter Tableisten Kante hab ich mal rausgeworfen und mit was Anderem ersetzt, es geht ja nur um Abrenzung, oder?

    Aber das kann man aufbauen wie man will, da gibt es zig Möglichkeiten.

    Hier ist mein momentaner Testcode; den hab ich nur kurz in Fx119 getestet, ist immer ein Akt das System anzuwerfen, aber sah ok aus.

    Die Grafik ist hier auch wieder eingebunden.

  • Blauer Rahmen um Tabbar oder Titlebar

    Zitat von Nikolaus2001at

    Hallo zusammen,

    nachdem ich gestern abend in Bastellaune war hab ich mir mit unten stehenden css Code einen blauen Rahmen um meine Tabbar oder Titlebar gebaut.

    Warum so kompliziert; der Rahmen soll jeweils einmal rund um die Tableiste und die Navbar gehen, korrekt?

    Border würde ich dazu eher nicht benutzen, weil das ins Layout eingreift (v.a. in der Navbar, sieht man gut an deinem Screenshot) und Grössen verändert; vielleicht eher sowas?

    CSS
     /* Tab-Bar, Navbar: Blauer Rahmen  */

#TabsToolbar, #nav-bar {
    /*border: 2px solid #00bbff !important;*/
    border-image:  linear-gradient(#00bbff, #00bbff) 1 / 2px !important;
}

  • Tabform

    Auf den Punkt getroffen! :)

    Ich habe eine Lösung für den Überlauf, aber dann verändern sich die Breiten je nach gewählter/nicht gewählter etc. Tab.

    Dafür hab ich im Prinzip auch eine Lösung - aber die hat noch einen massiven Bug... :/

  • Tabform

    Zitat von Mitleser
    Zitat von Horstmann

    Wenn du einen direkt mit dem Code anwendbaren, und für den Code funktionierenden Vorschlag für eine Lösung hast

    Nö, habe ich nicht. Damit habe und werde ich mich auch nicht beschäftigen, 'form follows funktion' ist bei diesem Thema auch nicht Programm, sondern eher 'mir ist gerade langweilig'. Entschuldigung für den vorherigen Beitrag.

    Also mal kurz vorbeigeschaut um über unser nutzloses Getue die Nase zu rümpfen, hmm? 8)

    Vielleicht nicht ganz im Geiste dieses Unter-Forums, aber was weiss ich schon. ;)

    Zitat von Mira_Belle

    Apropos, Du hast zwar --ug-color3 definiert, aber diese "Farbe" kommt gar nicht zur Anwendung!

    Die soll wohl für die Linie zwischen den Tabs und dem Fensterinhalt sein, richtig?

    Richtig; einiges an Einträgen wird nicht benutzt, ist aber noch da als eventuelle Option und weil es halt immer noch ein Test ist, kein fertiger Code.

    Sorry dass es so kompliziert ist und sich dauernd ändert, aber es hängt halt so vieles zusammen und voneinander ab... ?(

    Wenn es denn je fertig wird... ;)

    Der Overflow ist die ultimative Hürde; das nervt wirklich.

    Ich bin momentan dabei die Tabs komplett neu aufzubauen, mit den Rundungen innerhalb vom Tab selber, aber erst mal schauen ob was geht damit.

    Der letzte Code sollte eigentlich fast funktionieren im Overflow, mit wenigen Ausnahmen, aber ist halt wirklich übles Gehacke; das muss besser gehen. :!: ;)

  • Tabform

    Danke, hab ich aber alles schon (zumindest kurz) probiert, leider ohne Erfolg.

    Wenn du einen direkt mit dem Code anwendbaren, und für den Code funktionierenden Vorschlag für eine Lösung hast - nur zu! :thumbup: :)

  • Tabform

    Zitat von Mira_Belle

    Das ist in allen Versionen des CSS so, schon ab der Ersten.

    Daran habe ich mich auch schon versucht, ohne bisher eine Lösung dafür zu haben.

    Ich hab mal beim Chef ;) nachgefragt, der freundlicherweise prompt geantwortet hat.

    Das Problem ist tatsächlich dass die Ecken eigentlich innerhalb der Tabs an sich sein müssten, nicht aussen angehängt.

    Hatte ich auch schon probiert, aber hatte nicht geklappt, muss ich evtl. nochmal ran.

    Ich weiss nicht ob der eingebaute svg code, den ich für diesen schnellen Test benutzt habe, auf Windows funktioniert, aber hier wäre ein ganz grober erster Versuch nur mit Abständen.

    Die neuen Anpassungen sind zum Grossteil ganz unten.

  • Tabform

    Danke an alle für die Mithilfe. :)

    Das Bessere ist ja des Guten Feind, also eine neue Version. ;)

    Ein paar Bugs beseitigt, aber ein Problem kann ich auf Teufel komm raus nicht in den Griff bekommen: wenn die Tabs überlaufen, werden die angesetzten Tab-Ecken abgeschnitten am Anfang und Ende des "Scrollfensters" mit Ausnahme des ersten und letzten Tabs, wenn diese nicht versteckt sind in Overflow.

    Diese beiden sind aber ja auch im Code schon mit Abstand nach aussen versehen.

    Alle anderen Tabs an den extremen Enden werden nicht komplett angezeigt.

    Ich habe jeden möglichen und unmöglichen Selektor und alle umgebenden Elemente probiert, um dieses "Fenster" im Overflow etwas breiter zu bekommen, bzw. die Tabs am Anfang und Ende anders abgeschnitten zu bekommen - nix hat funktioniert... :/

    Wenn dazu jemand eine Idee hätte, das wäre prima. :)

    Hier erstmal der mit Spannung erwartete ;) , zart aktualisierte Code mit den erwähnten Bug Korrekturen, Grafik wie gehabt.

    tab_corner_ug.svg.zip

  • Tabform

    Ahh, danke für die Rückmeldung! :)

    Ich bin mir zu 99% sicher dass das Problem bei [pinned] liegt, das ist glaube ich in Fx119 anders eingebunden.

    .tabbrowser-tab:is([visuallyselected]) ist im Prinzip das gleiche wie .tabbrowser-tab[visuallyselected], nur mit höherer Priorität und eigentlich für andere Zwecke gedacht, die wir hier aber nicht brauchen.

    Was du nochmal schauen könntest, ist ob angeheftete Tab sauber aussehen oder plötzlich auch untere Ecken haben.

  • Tabform

    Zitat von 2002Andreas

    Ergibt hier:

    Vielen Dank für's Testen - dann fällt mir aber nichts mehr dazu ein. :/

    Die oben genannten Probleme habe ich alle gesehen in Fx119 nachdem es hier lief, und der letzte Code hat das auf meiner Seite repariert.

    Wenn jetzt der linke statt der rechte Bogen fehlt, dann bin ich ratlos.

    Oder es ist ein OS Ding? :/

    Wenn ich dich nochmal belästigen dürfte: ;)

  • Tabform

    Ich hätte noch einen anderen Vorschlag, ich glaube es braucht nur eine kleine Änderung; bitte kurz testen wenn's passt. :)

    Nachdem ich ein altes Laptop gehackt habe um Fx119 zum Laufen zu bekommen, scheint sowas halbwegs zu funktionieren.

    Das gehackte System läuft auf einer externen USB 2.0 Platte, daher läuft alles etwas zäh und die Anpassungen sind mangels Geduld vermutlich suboptimal. ;)

    Dateipfade wieder anpassen, Grafik wie zuvor, häng ich auch nochmal an; Randfarben hier jetzt für ein helles Theme eingestellt.

    svg.context-properties.content.enabled auf true setzen für die volle Funktion.

    tab_corner_ug.svg.zip

  • Tabform

    Zitat von Sören Hentzschel

    Ich denke nicht. Der Grund, wieso es diese Option gibt und diese standardmäßig auf false steht, ist der, dass diese Funktionalität kein Teil eines Webstandards ist und daher nicht für Websites zur Verfügung stehen soll. Für den chrome-Prozess und damit auch für Aufrufe via chrome:// oder resource:// steht die Funktionalität immer zur Verfügung, unabhängig von dieser Option.

    Danke! :)