Beiträge von Mira_Belle

  • Tabform

    Zitat von Horstmann
    ...

    Übrigens - bekommst du auch einen seltsamen schrägen Strich mit deinem Theme, oben links, und nur in Vollformat oder maximierter Ansicht?

    Ich hab's auch ohne CSS probiert, gleiches Spiel. :/

    Das ist das Hintergrundbild des Themes!

    Ist echt nicht schön, aber ich nutze ja den Firefox nie im Vollformat.

  • Tabform

    Horstmann

    Du bist, was CSS angeht, wirklich richtig fit geworden. Super.

    Und es schaut richtig gut aus.

    So wie ich das derzeit sehe, habe ich noch so einige Schwierigkeiten.

    Denn so wie Dein Design, so soll das Meinige auch zum Schluss werden.

    OK, so ähnlich.


    Nachtrag!

    Du hast mich auf die richtige Idee gebracht.

    CSS
    .tabbrowser-tab:not([pinned]) .tab-background::before,
.tabbrowser-tab:not([pinned]) .tab-background::after {
        top: -3px;
}

    Ist des Rätsels Lösung.

    Natürlich mussten noch ein paar kleiner Anpassungen gemacht werden,

    Abstände der Tabs, Größe der Grafiken,

    Aber nun passt es.

    Die nächste Hürde wird sein, dass die Tabs sich überschneiden, ohne dass es zu Darstellungsfehlern kommt.

    Ich hoffe, dass ich das irgendwie hinbekomme, ohne per CSS Elemente erst gar nicht darzustellen.

    Aber wenn es gar nicht anders geht, werde ich mich bei Dir bedienen. Sorry.

  • Tabform

    Zitat von 2002Andreas

    Dein Code aus Beitrag Nr. 38 sieht hier so aus:

    Mit meinem Zusatz im Code so:

    Danke, Andreas, das passt.

    Ich versuche nun gerade an den Selektor während des Ladens einer Seite zu kommen,

    denn Dein Code greift ja nur, wenn die Seite bereits geladen ist.

    Hast Du eine Idee, wie man daran kommt?

    Und hast Du eine Idee, wie man die Grafiken in der Höhe verschieben kann?

    Alternativ auch NUR den Tab als solchen, ohne die Grafiken mitzubewegen.

  • Tabform

    Zwischenstopp :!:

    Meine Tabs sehen z.Z. so aus.

    Die Farben werden so nicht bleiben!

    Woran ich gerade ab verzweifele, die Höhe der Vektorgrafiken!

    Links-rechts ist kein Problem, auch die Größe der Grafiken nicht,

    aber eben hoch oder tief.

    Was ich auch nicht hinbekomme, was wahrscheinlich auch nicht funktionieren wird,

    z.B. den "Closebutton" weiter nach rechts zu bekommen.

    Auch der Anfang des Labels, also das Icon weiter nach links.

    Hier mal mein "Bastelcode".

    Die Grafiken: icons.zip

  • Tabform

    Zitat von Horstmann

    ...

    Was die Tabs angeht, ich würde dabei gerne helfen wenn ich kann, aber du müsstest dich halt für einen Look entscheiden.

    ...

    Wenn ich das nur so genau wüsste.

    Bleiben wir, ICH, bei dem Design.

    Ich schrieb ja schon, dass ich das irgendwie, also die Rundungen, mit Grafiken machen möchte.

    Die Frage, mach ich das dann mit "Bildchen" (*.png) oder besser doch mit Vektorgrafiken.

    Was auf jeden Fall ausgeschlossen sein sollte, ist das "Spiegeln"!

    Es verursacht bei "Hintergründen" mit Farbverlauf Bildfehler.

    Bei Vektorgrafiken kann man ja nur eine ca. 3px- breite Linie definieren

    und per CSS dann die Farbe, die diese haben soll.

    Zum Verständnis, bei den hier zur Verfügung stehenden Vektorgrafiken handelt es sich um zwei Flächen!

    Was ich mich nun frage, ist es möglich auch innerhalb des SVG-Codes Farbverläufe zu definieren?

    Wobei min. eine Farbe von außen per CSS festgelegt werden sollte. Die hardcodet soll dann transparent sein,

    damit die Linie in etwa so ausschaut.

    Im Übrigen kann man in meinem Code die linke und rechte senkrechte "Begrenzung" des Tabs dann ausblenden,

    damit sich die Grafik besser einfügen lässt.

    OK, die Grafik ist hier mein Problem.

    Nicht besonders gut, aber ich hoffe man kann erkennen wohin es gehen soll.

  • Tabform

    Zitat von Sören Hentzschel

    Das ist doch nur ein altes Mockup. So wurde das Firefox-Design nie umgesetzt.

    Oh, sorry.

    Das ist ein Missverständnis :!:

    Es ging mir um das Aero, Fenster mit Rahmen und dieser inkl. Titelleiste transparent.

    Wie ich dieses Windows 10 Design hasse.

    OK, ist aber ot, hier soll es um die Tabs gehen.

    Also, ich habe meinen bisherigen Code etwas umgestellt und finde das Resultat auch einigermaßen annehmbar.

    Was ich aber noch irgendwie umsetzen möchte, sind der "Anfang" und das "Ende" der Tabs.

    Die "Formen" (umgesetzt mit Grafiken) bekommt man ja hin, aber dass die "Umrandung sich dann eben dem Design

    anpasst, wird wohl eine Herausforderung!

    Auch diese halbe Transparenz. :/

  • Tabform

    Zitat von Horstmann

    Die Beispiele sind doch im Prinzip genau das was der CSS Code von MrOtherGuy erzeugt, was ist denn das Problem damit? :/

    Nicht ganz!

    1. Die Abgrenzung fehlt!

    2. Funktioniert nur bei "Hell" oder "Dunkel", mit meinem Theme eben leider nicht!

    Kann aber mal versuchen, den Hintergrund per CSS irgendwie einzubinden.

    Versuche mal "NordOrange"! Der ist zwar einfarbig, aber hat feine Linien um die Tabs.

    Nicht schön, mit diesem Code.

    Ach und ich verwende "abstract Orange-and-blue", da sind die Darstellungsfehler, grrr.

    Aber ja, bei der überwiegenden Mehrheit von den von mir getesteten Themes funktioniert es sehr gut.

    Aber ist es denn nicht langweilig, immer von anderen fertigen Code zu übernehmen?

    AH!

    Die Darstellungsfehler resultieren aus der "Spiegelung" der Vektorgrafik!

    :/ Das müsste ja zu beheben sein

    und die "Linie" bekomme ich auch irgendwie hin.

    Beispiele gibt es ja jetzt zur Genüge.

    Hat aber alles Zeit.

  • Tabform

    Hi,

    die Abbildungen von 2002Andreas, sowie die im zweiten Link von .DeJaVu

    sind in etwa so, wie ich es mir vorgestellt habe.

    Mit "Bildchen" bekomme ich es einfach nicht hin.

    Nun werde ich versuchen, die Vektorgrafiken entsprechend zu bearbeiten.

    Das Problem ist, dass sich immer irgendwelche "Elemente" überschneiden und das schaut dann wirklich grauenhaft aus.

    Werde also noch etwas herumbasteln, sofern mir das z.Z. möglich ist.

    Hat ja Zeit.

  • Tabform

    Zitat von 2002Andreas
    Zitat von Mira_Belle

    Also, dass die "orangen Ecken" nicht durch die "grauen Ecken" ersetzt werden.

    So?

    Andreas! Was denkst Du von mir? :/  ^^

    Nein, so hatte ich es mir nicht vorgestellt!

    "Hovern" soll ja schon sein, "grau", bei allen anderen Tabs, nur eben nicht beim Aktiven!

    ABER, was mich viel mehr stört, dieser Schatten der Tabs!

    Siehst Du das in Deinem Clip?

    Den bekomme ich einfach nicht weg und das sieht so, na ja, bescheiden aus. ;)

  • Tabform

    Besser bekomme ich es nicht hin.

    Irgendwie gefällt es mir nicht.

  • Tabform

    Du hast "meinen" Code genutzt?

    Egal, äh, nein, muss ich wissen, damit ich die richtigen Rückschlüsse daraus ziehen kann.

    Was mich aber viel mehr stört, dass ich nicht weiß, wie ich das Hovern beim Aktiven Tab verhindern kann,

    damit sich die "Rundungen" nicht verändern.

    Also, dass die "orangen Ecken" nicht durch die "grauen Ecken" ersetzt werden.

    Aber auch wenn das Resultat dem "Original" recht nahe kommt, es gefällt mir nicht.

    Es fehlt die durchgängige Linie.

    Auch ist der Tab im Grunde mit dem Fenster verbunden.

    Zieht sich über die gesamte Breite quasi die komplette "Tableiste".

    Selbst wenn ich die nicht aktiven Tabs transparent lasse, sieht das alles andere als gut aus.

    Ich habe noch einmal an diversen Werten "geschraubt",

    sieht, wie ich finde, nun etwas besser aus.

    Aber wie bekomme ich eine 2px dicke Linie über die komplette Breite da hin?

  • Tabform

    Horstmann & 2002Andreas

    Danke für Eure Hinweise und Tipps.

    Meine bisherige "Arbeit":

    Bin aber noch nicht so wirklich zu frieden!

    Die verwendeten Symbole sind eingefärbt!

    Wenn ich "Hovern" aktiviere, werden leider auch die Sybole des aktiven Tabs "ausgetauscht".

    Und was mir vorher nie so aufgefallen war,

    der Schließenbutten, der verändert die Größe, ...

    Da ist also noch der Wurm drin.

  • Tabform

    Da mir gerade danach war und ich mich etwas beschäftigen wollte,

    kam ich auf die glorreiche Idee, auch weil hier z.Z. es andauernd um die Tabs ging,

    die Form der Tabs zu verändern.

    Jedoch, habe ich absolut keine Ahnung, wie ich das so hinbekommen soll.

    Vorweg, bei mir sind die Tabs direkt über dem Fenster!

    Und in etwa so, so habe ich mir das in etwas vorgestellt, hätte ich gerne die Tabs.

    Nur, wie könnte das, wenn es denn überhaupt geht, funktionieren?

    Z.Z. nutze ich das:

    CSS
        .tab-background {
        border-radius: 8px !important;
    }

    Mit dem Selektor bekomme ich es nicht hin.

    Hat jemand eine Idee?