Firefox 70.0. 64 Bit Win 7

2002Andreas

Zitat von scorpie

leider funktionert der Code für die abgerundeten Tabs auch bei mir mit ff 70 nicht

Der Code funktioniert einwandfrei im Fx 70.

scorpie

Ja das Bild hab ich gesehn und glaub dir, nur bei mir gehts auch nicht, warum auch immer. Der von mir gefundene geht.

Wollte es nur mal anmerken, brauchs ja ned

Nix für ungut

Herman4

danke habe nur den normalen FF

nicht google Chrome

also einfach in den ordner wo die Chrome css ist

im ordner

C:\Users\Herman4\AppData\Roaming\Mozilla\Firefox\Profiles\sl7bvkud.default-1573221343206\chrome

kopiere ich das jetzt rein

Herman4

geholfen hat es nicht

siehe bild

scorpie

@2002Andreas

Mein Fehler, dein Code funktioniert, man sollte schon alles richtig kopieren, hatte ne Klammer vergessen. Sorry.

Da ne Bekannte das auch so möchte hab ich den Code jetzt von dir genommen, aber leider hab ich bei ihr und auch bei mir ein kleines Problem. Wir haben beide nen viereckigen Hintergrund beim aktiven Tab unabhängig vom Theme welches wir benutzten.

Wie kriegt man denn das weg

Danke schon mal

2002Andreas

Zitat von scorpie

nen viereckigen Hintergrund beim aktiven Tab

Kann ich hier nicht bestätigen

Teste bitte mal:

CSS

.tabbrowser-tab:not([selected="true"]) > .tab-stack > .tab-background {
  background: none !important;
      }

#TabsToolbar {
  margin-bottom: 1px !important;
      }

.tab-background[selected="true"],
.tabbrowser-tab:not([selected="true"]) {
  border-radius: 80px !important; 
  border: 1px solid black !important;
      }

.tabbrowser-tab::after, .tabbrowser-tab::before {
    margin-inline-start: 0px!important;
    border-left: 0px solid!important;
    border-image: none !important;
    border-image-slice: 0 !important;
    width: 0px !important;
    box-sizing: border-box;
    opacity: 0 !important;
      }
    
.tab-line { 
    display: none !important
      }

Alles anzeigen

scorpie

Mensch geht die Hilfe hier aber flott, kenn ich aus anderen Foren auch anders, muss ja auch mal gesagt werden, danke

Nein klappt auch nicht, sorry. Nur wenn man bei Windows den klassischen Stil einstellt gehts., aber da sieht Windows sehr bescheiden aus.

BrokenHeart

Bitte auch mal testen:

CSS

#TabsToolbar {
    margin-bottom: 2px !important;
      }

#TabsToolbar .tabbrowser-tab .tab-line {
    display: none !important; 
}      
      
#TabsToolbar .tabbrowser-tab {
    margin-left: 1px !important;
}    
      
#TabsToolbar .tabbrowser-tab,
#TabsToolbar .tabbrowser-tab .tab-background
{
    background: unset;
    border-radius: 80px !important; 
    border: 1px solid rgba(0,0,0,0.33) !important;
}

/* TabLabel settings */
.tabbrowser-tab .tab-label {
    text-shadow: 1px 1px 1px #000000 !important;    
    font-weight: normal !important;
    font-size:   12px !important;
    font-family: "Arial" !important;
    color: white !important;
}
.tabbrowser-tab .tab-label:not(:-moz-lwtheme) {
    text-shadow: none !important; 
    color: black !important; 
}
.tabbrowser-tab .tab-label[selected="true"] {
    text-shadow: 1px 1px 1px #000000 !important;    
    color: white !important; 
    font-weight: normal !important;
    font-size:   12px !important; 
    font-family: "Arial" !important; 
}


/*--- selektiert ---*/
.tab-background[selected=true]:not(:-moz-lwtheme) > spacer {
    background-image:  linear-gradient( rgba(103,171,224,1), rgba(10,58,95,1) ), none !important; /* blau */
    /*background-image:  linear-gradient( rgba(230,175,175,1), rgba(84,25,25,1) ),  none !important;*/  /* rot 1*/
    /*background-image:  linear-gradient( rgba(245,155,155,1), rgba(84,25,25,1) ),  none !important;*/  /* rot 2*/
    filter: drop-shadow(4px 3px 2px rgba(0,0,0,0.33)) drop-shadow(-4px 3px 2px rgba(0,0,0,0.33)) !important; 
    border-radius: 80px !important; 
}
.tab-background[selected=true]:-moz-lwtheme > spacer {
    background-image:  linear-gradient( rgba(103,171,224,1), rgba(10,58,95,1) ), none !important;
    filter: drop-shadow(3px 3px 2px rgba(0,0,0,0.33)) drop-shadow(-2px 3px 2px rgba(0,0,0,0.33)) !important; 
    border-radius: 80px !important; 
}

/*--- hover(nicht selektiert) ---*/
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]):not(:-moz-lwtheme) > spacer {
    background-image:  linear-gradient( rgba(255,255,255,1), rgba(115,115,115,1) ),  none !important; 
    filter: brightness(130%) contrast(95%) drop-shadow(1px 1px 1px rgba(0,0,0,0.33)) drop-shadow(-1px 1px 1px rgba(0,0,0,0.33)) !important; 
    border-radius: 80px !important; 
}
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]):-moz-lwtheme > spacer {
    background-image:  linear-gradient( rgba(225,225,225,0.66), rgba(100,125,145,0.66) ),  none !important; 
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
    border-radius: 80px !important; 
}

/*--- nicht selektiert ---*/
.tab-background:not([selected=true]):not(:-moz-lwtheme) > spacer {
    background-image:  linear-gradient( rgba(255,255,255,1), rgba(125,125,125,1) ),  none !important; 
    filter: brightness(115%) contrast(90%) drop-shadow(1px 1px 1px rgba(0,0,0,0.33)) drop-shadow(-1px 1px 1px rgba(0,0,0,0.33)) !important; 
    border-radius: 80px !important; 
}
.tab-background:not([selected=true]):-moz-lwtheme > spacer {
    background-image:  linear-gradient( rgba(255,255,255,0.33), rgba(110,110,110,0.33) ),  none !important; 
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75);
    border-radius: 80px !important; 
}

/*--- Multi-selektiert ---*/
.tab-background[multiselected=true]:not([selected=true]) {
    background-image:  linear-gradient( rgba(225,225,225,1), rgba(50,98,135,1) ), none !important;
    border-radius: 80px !important; 
}
.tabbrowser-tab:hover > .tab-stack > .tab-background[multiselected=true]:not([selected=true]) {
    background-image:  linear-gradient( rgba(225,225,225,1), rgba(50,98,135,1) ), none !important; 
    border-radius: 80px !important; 
}

Alles anzeigen

scorpie

Leider nein, hab auch scon alles andere deaktiviert, addons scripte

FuchsFan

Dann versuche mal diesen Code, läuft bei mir bis zur aktuellen Nightly. Farben sind alle anpassbar. Ich nutze Tabs nur oben abgerundet, wenn du unten dazu haben willst, kein Problem.

CSS

/**********************************************************************************************************/    
/************************ Anpassen der TAB-Leiste *********************************************************/
/**********************************************************************************************************/


/*** inaktiver Tab Rand Stärke und Farbe ****************/
.tab-background[selected="true"],
.tabbrowser-tab:not([selected="true"]) {
  border-radius: 10px 10px 0 0 !important; 
  border: 1px solid #4682B4 !important;
      }

/****** entfernt störende Teile des Tab-Hintergrundes ********/
.tabbrowser-tab::after, .tabbrowser-tab::before {
    margin-inline-start: 0px!important;
    border-left: 0px solid!important;
    border-image: none !important;
    border-image-slice: 0 !important;
    width: 0px !important;
    box-sizing: border-box;
    opacity: 0 !important;
      }
      
/************* Tabschliessen-Button ****************/
.tab-close-button.close-icon{
    display: -moz-box !important;
    width: 20px; height: 20px !important;
    border: none !important;
    border-radius: 5px !important;
    background-color: none !important;
}

.tab-close-button {
    color: red !important; /* Farbe des Kreuzes */
}      
      
      
/**** blendet den Hintergrund aller Tabs aus *******/
.tab-background {
    background: none !important;
}      
      
/*** nicht aktiver Tab ändert Farbe nach Überfahren mit der Maus ******/
.tabbrowser-tab:hover {
  background-image: linear-gradient(to top, gold 30%, yellow 60%)!important;/*background: yellow !important;*/
  color: black !important;
  
}      
      
/************* Hintergrund aktiver Tab ****************/
.tab-background[selected] {
  background-image: linear-gradient(to top, orange 15%, yellow 90%)!important;/*background: gold !important;*/
  border-radius: 10px 10px 0 0 !important;
  border: 1px solid black !important;
}        
      
/************* Schrift aktiver Tab ****************/
.tabbrowser-tab[selected] {
  background: none !important;
  font-weight: bold !important;  /* fette Schrift */
}      
      
/************* Schrift im Zentrum des Tabs ****************/
.tab-label {
  -moz-box-flex: 1 !important;
  text-align: center !important;
}      
      
/*********** Abstand zwischen den Tabs ******************/

.tabbrowser-tab {
    margin-left: 1px !important;
    }      
    
/********** obere sichtbare Tablinie entfernt ****************/
.tab-line { 
    display:none!important
}
      
/*** doppelte graue Linie unter der Tabs-Toolbar entfernt ***/
#nav-bar{
  box-shadow: none !important;
  }      

/******* Höhe und Breite der Tabs einstellen ********/
.tabbrowser-tab{
    max-height: 24px!important;  
    -moz-box-flex: 0!important;
    width: 180px!important;      /** Breite der Tabs **/
}    

/******** Icon im Tab versetzt ********************************/
#TabsToolbar .tab-icon-image {
  height: 15px !important;
  width:  15px !important;
  margin-left: -4px !important;
  margin-bottom: 2px !important;
}  

/****************/

Alles anzeigen

BrokenHeart

Und der obere CSS-Code ist das einzige, was in deiner userChrome.css steht?

So wie es aussieht wurde (fast) nichts von dem Code übernommen.

Kannst du mal den Inhalt deiner userChrome.css hier posten...

scorpie

Das steht im Moment drin, mehr nicht. Auch mit ändern des Wertes auf 2px hat sich nichts geändert

CSS

.tabbrowser-tab:not([selected="true"]) > .tab-stack > .tab-background {
  background: none !important;
      }
#TabsToolbar {
  margin-bottom: 1px !important;
      }
.tab-background[selected="true"],
.tabbrowser-tab:not([selected="true"]) {
  border-radius: 80px !important; 
  border: 1px solid black !important;
      }
.tabbrowser-tab::after, .tabbrowser-tab::before {
    margin-inline-start: 0px!important;
    border-left: 0px solid!important;
    border-image: none !important;
    border-image-slice: 0 !important;
    width: 0px !important;
    box-sizing: border-box;
    opacity: 0 !important;
      }
    
.tab-line { 
    display: none !important
      }

Alles anzeigen

BrokenHeart

Versteh ich jetzt nicht. Hast du den Code, den ich gepostet habe in die userChrome.css geschrieben und damit deinen alten Code ersetzt?

scorpie

@BrokenHeart

Fehler meinerseitz, entschuldige hab nur den einen Wert geändert. Moment machs gleich

scorpie

@BrokenHeart

mit deinem kompletten code, sieht man noch so ne Art Trennlinie zwischen den Tabs. Stärker link und rechts von aktiven Tab zeimlich schwach neben den inaktiven

scorpie

@FuchsFan

ich hab noch so ne dünne Linie über den aktiven tab mit deinem Code

BrokenHeart

Füge das noch zusätzlich in den Code ein:

CSS

/* Tab-Seperatoren entfernen */
.tabbrowser-tab::after,
.tabbrowser-tab::before {
  opacity: 0 !important;
  border-image: unset !important;
  border-image-slice: none !important;
  width: 2 !important;
}

FuchsFan

Die graue Linie unter den Tabs bekommst du damit weg, zusätzlich einfügen:

CSS

/*** doppelte graue Linie unter der Tabs-Toolbar entfernen ***/
#nav-bar{
  box-shadow: none !important;
  }

scorpie

Perfekt jetzt muss ich noch mit den Farben spielen, danke

Wenn ich noch irgendwie rausfinde welcher Farbcode für was steht

FuchsFan

Zitat von scorpie

ich hab noch so ne dünne Linie über den aktiven tab mit deinem Code

Nun waren wir ja erst einmal bei dem Code von @BrokenHeart, dafür waren jetzt die Code_Schnipsel gedacht. Wenn du die jetzt in den Code von BrokenHeart einfügst, dann ist alles bestens. Habe ich jetz probiert.

Nimmst du jetzt meinen Code, dann darfst du nichts weiter verwenden, außerdem musst du ein Theme von Mozilla installieren (ich habe Clouds), sonst werden die Farben nicht richtig dargestellt. Frage nicht warum, das Thema hatten wir schon mal.

Firefox 70.0. 64 Bit Win 7

Ähnliche Themen

Frage zu --allow-downgrade

Fehler beim Öffnen der 'Browser-Werkzeuge' unter FF70/Nigthly...

Firefox 69 64bit - Mods für Tabs Dateien js und css beißen sich

Anzeige der Buttons Einstellungen - Deaktivieren/Aktivieren - Entfernen für die Addons - falls das wer braucht

Seit Update auf FF 69.0 ist 2. Lesezeichensymbolleiste weg