Beiträge von Mira_Belle

  • Tabform

    Hey @Horstmann ,

    bist Du denn kirre?

    Weißt Du wie lange ich an Deinem Code gesessen habe, um auch nur zu erahnen, wie das alles funktioniert?

    Irgendwie habe ich es geschafft, ihn meinen Vorstellungen anzupassen

    und jetzt kommst Du mit einer noch geileren Version :!: :D

    Woran ich aber verzweifele, einen Rand um den "Neuen Tabbutton" zu zaubern.

    Entweder spricht der Selektor ALLE Buttons an, also die selbsterstellten, oder

    der "Rahmen" steht viel zu weit um den Button und ist auch nicht rund.

    Nun werde ich mich nächste Woche dann mal mit Deinem neuen und besseren Code befassen.

    Und höre auf, diesen noch weiter zu optimieren, der ist gut.

    Apropos anpassen, so habe ich Deinen Code hingebogen.

    Ob ich das mit Deinem neuen Code auch so hinbekomme?

  • Tabform

    @Horstmann

    Du bist ein Schatz!

    Dein letzter Code funktioniert hervorragend und das auch im Kompaktmodus.

    Um die Tableiste nach unten zu versetzen, habe ich nachfolgenden Code noch eingesetzt.

    Nun kann ich daran machen diesen Code auseinander zu pflücken, damit ich dahinterkomme,

    wie das alles zusammen hängt und funktioniert.

    Danach werde ich mir die Farbeinstellungen vornehmen.

    Aber alles eins nach dem anderen.

    Vielen lieben Dank noch mal. :*

  • Tabform

    8| :/ ||

    Dein Code, OHNE Veränderung,

    OK, den Pfad angepasst!

    Deine Vektorgrafiken.

    Hier noch mal der Code, aus Beitrag #43, mit neuen Pfadangaben!

    Warum klappt das nicht?

    Wo mache ich was nicht richtig?

    Und warum ist bei diesem Code die Tableiste zwar "unten" aber dafür die "Nav-bar" ganz oben,

    wo doch die "toolbar-menubar" ganz oben und nicht in der Mitte stehen sollte.

    Ich brauche Zeit!

    Viel Zeit um alles auseinander zu plücken, sonst verstehe ich das nie.

  • Tabform

    @Horstmann

    Ich blicks nicht!

    Da es nicht so geht wie ich es mir vorgestellt habe, bediente ich mich an Deinem Code.

    Nur, der funktioniert bei mir einfach nicht!

    Die Grafiken werden nicht so angezeigt, wie ich es erwarten würde,

    und "Rahmen" (border) werden angezeigt, obwohl da eigentlich gar keine sein sollten.

    Ich habe mal zur besseren Veranschaulichung

    Tab-corner-top2.svg durch ein Herz ersetzt.


    Gib mir doch bitte mal Deine Vektorgrafiken.

    Tab-corner-left2a.svg & Tab-corner-top2.svg

    Und wenn es mehr sind, dann den Rest auch noch.

    Und Sicher, dass der Code so ist?

    Bin am Verzweifeln.

  • 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?