Comment (re)mettre la barre d'onglets sous la barre d'adresse de Firefox89 ?

Signaler
Messages postés
7
Date d'inscription
vendredi 14 mai 2021
Statut
Membre
Dernière intervention
10 juin 2021
-
Messages postés
3
Date d'inscription
mercredi 9 juin 2021
Statut
Membre
Dernière intervention
15 juin 2021
-
Bonjour,

J'utilisais la modification du fichier userchrome.css avec succès jusqu'à cette nouvelle version de Firefox.
La barre d'onglets étant devenue quasi invisible, j'ai cherché ce qui bloquait et je crois que c'est la ligne "position: absolute !important;" dans #TabsToolbar.
En l'enlevant, je récupère mon environnement habituel (barre d'onglets visible et bien calibrée) à ceci près qu'elle est repassée entre la barre de menus et la barre d'adresses....
Une idée de manip. pour la replacer sous la barre personnelle (ce qui était le but premier) ?
Note: tout ceci concerne Firefox 89 bridé par correction (False) des 4 premières lignes de la recherche "Proton" dans about:config.

Merci de toute suggestion et bon weekend ;-)
Fred

10 réponses

Messages postés
3269
Date d'inscription
lundi 11 novembre 2013
Statut
Membre
Dernière intervention
10 juin 2021
1 594
@fabul : re

Essaye ceci, dans ton userChrome
https://pastebin.com/xYnBdfWd

++
Messages postés
28451
Date d'inscription
dimanche 18 janvier 2009
Statut
Contributeur
Dernière intervention
17 juin 2021
3 812
Celui la semble fonctionner, je l'avais trouvé sur Reddit mais je viens juste de le tester, je le recopie ici:

/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Modify to change window drag space width */
/*
Use tabs_on_bottom_menubar_on_top_patch.css if you
have menubar permanently enabled and want it on top
*/

/* IMPORTANT */
/*
Get window_control_placeholder_support.css
Window controls will be all wrong without it.
Additionally on Linux, you may need to get:
linux_gtk_window_control_patch.css
*/

:root{ --uc-titlebar-padding: 0px; }
@media (-moz-os-version: windows-win10){
:root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px }
}
#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container,
#TabsToolbar > .titlebar-buttonbox-container{
position: fixed;
display: block;
top: var(--uc-titlebar-padding,0px);
right:0;
height: 40px;
}
/* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root{ --uc-titlebar-padding: 0px !important }
.titlebar-buttonbox-container{ left:0; right: unset !important; }
}

:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }

#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }

#navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }

.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }

#titlebar{
-moz-box-ordinal-group: 2;
-moz-appearance: none !important;
--tabs-navbar-shadow-size: 0px;
}

.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }

@media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }

/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
#navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }

/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Menubar on top patch - use with tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */

:root{ --uc-window-control-width: 0px !important }

#navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important }

#toolbar-menubar{
position: fixed;
display: flex;
top: var(--uc-titlebar-padding,0px);
height: 29px;
width: 100%;
overflow: hidden;
}

#toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; }

#toolbar-menubar > [flex]{ flex-grow: 100; }
#toolbar-menubar > spacer[flex]{
order: 99;
flex-grow: 1;
min-width: var(--uc-window-drag-space-width,20px);
}

#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }

#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }

/* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important;
--tab-min-width: 80px !important;

#tabbrowser-tabs {
width: 100vw !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;}

.tab-background {
border-radius: 8px 8px 0px 0px !important; border-image: none !important;
}
.tab-line {
display: none;
}

.tab-close-button {
color: red!important;
}
Messages postés
3269
Date d'inscription
lundi 11 novembre 2013
Statut
Membre
Dernière intervention
10 juin 2021
1 594 >
Messages postés
28451
Date d'inscription
dimanche 18 janvier 2009
Statut
Contributeur
Dernière intervention
17 juin 2021

Messages postés
28451
Date d'inscription
dimanche 18 janvier 2009
Statut
Contributeur
Dernière intervention
17 juin 2021
3 812 >
Messages postés
3269
Date d'inscription
lundi 11 novembre 2013
Statut
Membre
Dernière intervention
10 juin 2021

Exact,

J'avais fait Ctrl+F et, ça me l'a ressorti, donc exact, mais j'ai recommencé et je n'y arrive pas.

Il y a juste un espace avant le / que je viens d'enlever, de toute façon c'est le même.

Ok, la j'y suis arrivé.

@+
Messages postés
28451
Date d'inscription
dimanche 18 janvier 2009
Statut
Contributeur
Dernière intervention
17 juin 2021
3 812
Messages postés
37
Date d'inscription
jeudi 6 juin 2013
Statut
Membre
Dernière intervention
12 juin 2021

Ahh ! j’avais pas le bon a premier vu maintenant sa marche merci
Me reste plus cas retrouvais le thème classic qui avais avant ( énervant firefox a tout changer une fois que tu t'es habitué a un pour si retrouvé après ....)
Merci encore Fabul
Messages postés
3
Date d'inscription
mercredi 9 juin 2021
Statut
Membre
Dernière intervention
15 juin 2021
2
Bonjour,

J'ai aussi galéré pour remettre FIREFOX à ma façon. Je ne connais pas le langage CSS.
Ci-dessous ''mon FIREFOX'' après ajout des données dans USERCHROIME.css



Il me reste encore un petit souci.
La barre des Menus (Fichier, Edition, ...) est placée tout en haut de la ligne ... j'aimerai la centrer pour la rendre plus visible.


Exemple avec d'autres couleur




Je partage mes données USERCHROME.CSS.

Barre des marques page sur plusieurs lignes


/* 1-BOOKMARKS TAB multiple rows - barre des marques page sur plusieurs lignes */

#PersonalToolbar{
--multirow-bmb-n-rows: 5; /* Nombre de lignes de la barre des marques page modifiable */
--multirow-bmb-row-margin: 50px; /* Controle l'espace entre les lignes */
max-height: none !important;
}

#PlacesToolbar > hbox{
display: block;
width: 100vw;
}

#PlacesToolbarItems{
display: flex;
flex-wrap: wrap;
/* --uc-bm-padding is defined in autohide_bookmarks_toolbar.css */
max-height: calc(var(--multirow-bmb-n-rows) * (5px + 1em + (2 * (var(--multirow-bmb-row-margin) + var(--uc-bm-padding,3px))))) !important;
overflow-y:auto;
scrollbar-color: var(--lwt-accent-color) var(--toolbar-bgcolor) ;
scrollbar-width: thin;
font-size: 18px !important; /* Hauteur police modifiable */
font-style: italic; /* Format de la police modifiable */
font-family:calibri ; /* Police de caractères modifiable */
}




Couleur des dossiers de la barre des marques page

    
/* 2-Couleur des dossiers Marques page--- */

/*
Colored folders for Bookmarks Menus, Bookmarks Sidebar, Bookmarks Toolbar, Library window, Add/Edit Bookmarks dialog
Substitutes a Firefox 57-style folder icon for the new wireframe folder icon
  • //* Standard folder -- on Toolbar and Menus */#PlacesToolbarItems toolbarbutton[container="true"]:not([query="true"]) .toolbarbutton-icon,:-moz-any(#PlacesToolbarItems,#PlacesChevronPopup,#BMB_bookmarksPopup,#bookmarksMenu,#OtherBookmarksPopup) menu[container="true"]:not([query="true"]) > .menu-iconic-left > .menu-iconic-icon,/* Standard folder -- in Sidebar, Library, Add/Edit Bookmark dialog */:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container), #editBMPanel_folderMenuList > .menulist-label-box > .menulist-icon,#editBMPanel_folderMenuList menupopup menuitem, #editBMPanel_folderMenuList { fill: #e8bb00 !important; /* Couleur des dossiers modifiable */ /* Specify icon for Firefox 89 Proton (base 64 conversion from old SVG with gold color) */ list-style-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0iI2U4YmIwMCIgZmlsbC1vcGFjaXR5PSJjb250ZXh0LWZpbGwtb3BhY2l0eSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8cGF0aCBkPSJNMTQuNSAzSDYuOTE0YS41LjUgMCAwIDEtLjM1NC0uMTQ2TDUuMTQ2IDEuNDM5QTEuNDkxIDEuNDkxIDAgMCAwIDQuMDg2IDFIMS41QTEuNSAxLjUgMCAwIDAgMCAyLjV2MTFBMS41IDEuNSAwIDAgMCAxLjUgMTVoMTNhMS41IDEuNSAwIDAgMCAxLjUtMS41di05QTEuNSAxLjUgMCAwIDAgMTQuNSAzem0uNSAxMC41YS41LjUgMCAwIDEtLjUuNWgtMTNhLjUuNSAwIDAgMS0uNS0uNVY2aDE0ek0xIDVWMi41YS41LjUgMCAwIDEgLjUtLjVoMi41ODZhLjUuNSAwIDAgMSAuMzU0LjE0NmwxLjQxNCAxLjQxNUExLjQ5MSAxLjQ5MSAwIDAgMCA2LjkxNCA0SDE0LjVhLjUuNSAwIDAgMSAuNS41VjV6Ii8+CiAgPHBhdGggZD0iTTE1IDEzLjVhLjUuNSAwIDAgMS0uNS41aC0xM2EuNS41IDAgMCAxLS41LS41VjZoMTR6IiBmaWxsLW9wYWNpdHk9Ii4yIi8+CiAgPHBhdGggZD0iTTEgNVYyLjVhLjUuNSAwIDAgMSAuNS0uNWgyLjU4NmEuNS41IDAgMCAxIC4zNTQuMTQ2bDEuNDE0IDEuNDE1QTEuNDkxIDEuNDkxIDAgMCAwIDYuOTE0IDRIMTQuNWEuNS41IDAgMCAxIC41LjVWNXoiIGZpbGwtb3BhY2l0eT0iLjEiLz4KICA8cGF0aCBkPSJNMTUgMTMuNWEuNS41IDAgMCAxLS41LjVoLTEzYS41LjUgMCAwIDEtLjUtLjVWMTNoMTR6IiBmaWxsLW9wYWNpdHk9Ii4wNSIvPgo8L3N2Zz4=") !important;}/* Smart bookmark folder -- on Toolbar and Menus */#PlacesToolbarItems toolbarbutton[container="true"][query="true"] .toolbarbutton-icon,:-moz-any(#PlacesToolbarItems,#PlacesChevronPopup,#BMB_bookmarksPopup,#bookmarksMenu,#OtherBookmarksPopup) menu[container="true"][query="true"] > .menu-iconic-left > .menu-iconic-icon,/* Smart bookmark folder -- in Sidebar, Library, Add/Edit Bookmark dialog */:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, query) { /* Specify icon for Firefox 89 Proton to override basic folder */ list-style-image: url("chrome://browser/skin/places/folder-smart.svg") !important; fill: #69c !important; /* similar to blue smart folder color */}/*** Top-level "container" icons (otherwise would be Standard folder color) ***//* Bookmarks Menu -- in Sidebar, Library, Add/Edit Bookmark dialog */:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksMenu),:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, queryFolder_menu________),#editBMPanel_bmRootItem > .menu-iconic-left, #editBMPanel_folderMenuList[selectedIndex="1"] > .menulist-label-box > .menulist-icon, #editBMPanel_folderMenuList[selectedGuid="menu________"] { /* Specify icon for Firefox 89 Proton to override basic folder */ list-style-image: url("chrome://browser/skin/places/bookmarksMenu.svg") !important; fill: olive !important;}/* Bookmarks Toolbar -- on Menus */#BMB_bookmarksPopup #BMB_bookmarksToolbar > .menu-iconic-left > .menu-iconic-icon,#bookmarksMenuPopup #bookmarksToolbarFolderMenu > .menu-iconic-left > .menu-iconic-icon,/* Bookmarks Toolbar -- in Sidebar, Library, Add/Edit Bookmark dialog */:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksToolbar),:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, queryFolder_toolbar_____),#editBMPanel_toolbarFolderItem > .menu-iconic-left, #editBMPanel_folderMenuList[selectedIndex="0"] > .menulist-label-box > .menulist-icon, #editBMPanel_folderMenuList[selectedGuid="toolbar_____"] { /* Specify icon for Firefox 89 Proton to override basic folder */ list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.svg") !important; fill: olive !important;}/* Other Bookmarks -- on Menus */#BMB_bookmarksPopup #BMB_unsortedBookmarks > .menu-iconic-left > .menu-iconic-icon,#bookmarksMenuPopup #menu_unsortedBookmarks > .menu-iconic-left > .menu-iconic-icon,/* Other Bookmarks -- in Sidebar, Library, Add/Edit Bookmark dialog */:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks),:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, queryFolder_unfiled_____),#editBMPanel_unfiledRootItem > .menu-iconic-left, #editBMPanel_folderMenuList[selectedIndex="2"] > .menulist-label-box > .menulist-icon, #editBMPanel_folderMenuList[selectedGuid="unfiled_____"],#OtherBookmarksPopup + .toolbarbutton-icon { /* Specify icon for Firefox 89 Proton (base 64 conversion from old SVG with olive color) */ list-style-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ib2xpdmUiIGZpbGwtb3BhY2l0eT0iY29udGV4dC1maWxsLW9wYWNpdHkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZmlsbC1vcGFjaXR5PSIuMDUiIGQ9Ik0xMi43LDFIMy4zbC0uMi42TC4xLDksMCw5LjJWMTNhMi4wMDYsMi4wMDYsMCwwLDAsMiwySDE0YTIuMDA2LDIuMDA2LDAsMCwwLDItMlY5LjJMMTUuOSw5bC0zLTcuNEwxMi43LDFaIi8+CiAgPHBhdGggZD0iTTEyLDJsMyw3LjRWMTNhLjk0NS45NDUsMCwwLDEtMSwxSDJhLjk0NS45NDUsMCwwLDEtMS0xVjkuNEw0LDJoOG0uNy0xSDMuM0wuMSw5LjEsMCw5LjJWMTNhMi4wMDYsMi4wMDYsMCwwLDAsMiwySDE0YTIuMDA2LDIuMDA2LDAsMCwwLDItMlY5LjJMMTUuOSw5LDEyLjcsMVoiLz4KICA8cGF0aCBmaWxsLW9wYWNpdHk9Ii4wNSIgZD0iTTE0Ljk4OCw5LDEyLDJINEwuODUxLDlINS4wMjNBMi45MzEsMi45MzEsMCwwLDAsOCwxMS42LDIuODg5LDIuODg5LDAsMCwwLDExLjAxMiw5WiIvPgogIDxwYXRoIGQ9Ik0xMCw5QTIsMiwwLDAsMSw2LDlIMHYxSDUuMTg0YTIuOTgzLDIuOTgzLDAsMCwwLDUuNjMzLDBIMTZWOVoiLz4KPC9zdmc+") !important;}/* (Older Firefox) Avoid overriding classic Bookmarks Toolbar and Other Bookmarks icons in menus */#BMB_bookmarksPopup #BMB_bookmarksToolbar.menu-iconic-icon, #bookmarksMenu #bookmarksToolbarFolderMenu.menu-iconic-icon { list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png") !important;}#BMB_bookmarksPopup #BMB_unsortedBookmarks.menu-iconic-icon, #bookmarksMenu #menu_unsortedBookmarks.menu-iconic-icon { /* Specify icon for Firefox 89 Proton (base 64 conversion from old SVG with olive color) */ list-style-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ib2xpdmUiIGZpbGwtb3BhY2l0eT0iY29udGV4dC1maWxsLW9wYWNpdHkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZmlsbC1vcGFjaXR5PSIuMDUiIGQ9Ik0xMi43LDFIMy4zbC0uMi42TC4xLDksMCw5LjJWMTNhMi4wMDYsMi4wMDYsMCwwLDAsMiwySDE0YTIuMDA2LDIuMDA2LDAsMCwwLDItMlY5LjJMMTUuOSw5bC0zLTcuNEwxMi43LDFaIi8+CiAgPHBhdGggZD0iTTEyLDJsMyw3LjRWMTNhLjk0NS45NDUsMCwwLDEtMSwxSDJhLjk0NS45NDUsMCwwLDEtMS0xVjkuNEw0LDJoOG0uNy0xSDMuM0wuMSw5LjEsMCw5LjJWMTNhMi4wMDYsMi4wMDYsMCwwLDAsMiwySDE0YTIuMDA2LDIuMDA2LDAsMCwwLDItMlY5LjJMMTUuOSw5LDEyLjcsMVoiLz4KICA8cGF0aCBmaWxsLW9wYWNpdHk9Ii4wNSIgZD0iTTE0Ljk4OCw5LDEyLDJINEwuODUxLDlINS4wMjNBMi45MzEsMi45MzEsMCwwLDAsOCwxMS42LDIuODg5LDIuODg5LDAsMCwwLDExLjAxMiw5WiIvPgogIDxwYXRoIGQ9Ik0xMCw5QTIsMiwwLDAsMSw2LDlIMHYxSDUuMTg0YTIuOTgzLDIuOTgzLDAsMCwwLDUuNjMzLDBIMTZWOVoiLz4KPC9zdmc+") !important;}



Barres d'onglet en dessous

 
/* 3-Barres d'onglet en dessous */


@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root{ --uc-titlebar-padding: 0px !important }
.titlebar-buttonbox-container{ left:0; right: unset !important; }}

:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }

#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }

#navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }

.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }

#titlebar{-moz-box-ordinal-group: 2;-moz-appearance: none !important;--tabs-navbar-shadow-size: 0px;}

.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }

/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }

@media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }

/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
#navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }



Couleur des onglets


/* 4-Color TABS - couleur des onglets */

tab {
font-size: 15px !important; /* Hauteur police modifiable */
font-family: Arial !important;} /* Police de caractères modifiable */

/* Use color and shape to make the tabs look more like tabs */

.tab-background {
background: #dbdbdb ; /* Couleur de l'arrière plan modifiable */
border-radius: 0px 20px 0 0 !important;
margin-bottom: 0px !important;
box-shadow: 0 0 2px 2px rgba(0,0,0,0.1) !important;
border: 1px solid rgba(255,0,0,.5) !important;
border-bottom-width: 0px !important;
}

/* Selected tabs I want a bright background with a dark foreground */

.tabbrowser-tab[selected] .tab-background {
background: #ffffff !important; /* Couleur de l'arrière plan modifiable */
}
.tabbrowser-tab[selected] .tab-label {
color: red !important; /* Couleur de l'arrière plan modifiable */
font-weight: normal !important;}

/* Draw a solid line underneath to make the selected tab look *connected* to the rest of the browser */
#TabsToolbar {
border-bottom: 5px solid #ff0000 !important; /* Couleur de l'arrière plan modifiable */
}

/* Hover over tabs */
.tabbrowser-tab:hover .tab-background:not([selected]) {
background: #afedaf !important; /* Couleur de l'arrière plan modifiable */
}





Barre des menus en haut


/* 5-Barre des menus en haut - use with tabs_on_bottom.css */

/* Menubar on top patch - use with tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */

:root:not([sizemode="fullscreen"]){ --uc-window-control-width: 0px !important }

:root{
/* height if native titlebar is enabled, assumes empty menubar */
--uc-menubar-height: 20px;
}
:root[tabsintitlebar]{
/* height when native titlebar is disabled, more roomy so can fit buttons etc. */
--uc-menubar-height: 29px;
}

#navigator-toolbox{ padding-top: calc(var(--uc-menubar-height) + var(--uc-titlebar-padding,0px)) !important }
:root[sizemode="fullscreen"] #navigator-toolbox{ padding-top: 0px !important; }
#toolbar-menubar{
position: fixed;
display: flex;
top: var(--uc-titlebar-padding,0px);
height: var(--uc-menubar-height);
width: 100%;
overflow: hidden;
}

#toolbar-menubar > .titlebar-buttonbox-container{ height: 100%; order: 100; }

#toolbar-menubar > [flex]{ flex-grow: 100; }
#toolbar-menubar > spacer[flex]{
order: 99;
flex-grow: 1;
min-width: var(--uc-window-drag-space-width,20px);
}

#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }

#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }




NB. j'ai fait des modifications dans ABOUT:CONFIG

Pour désactiver Proton :
---------------------------
browser.proton.contextmenus.enabled = false
browser.proton.doorhangers.enabled = false
browser.proton.enabled = false
browser.proton.modals.enabled = false

Pour réactiver le mode compact (disparu avec Proton) :
--------------------------------------------------------------
browser.compactmode.show = true
browser.uidensity = 1 (0 = Normal, 2 = Touch).

Pour réactiver userChrome.css qui est parfois désactivé par Firefox lors d'une nouvelle version :
-----------------------------------------------------------------------------------------------------------
toolkit.legacyUserProfileCustomizations.stylesheets = true


Philippe
Messages postés
37
Date d'inscription
jeudi 6 juin 2013
Statut
Membre
Dernière intervention
12 juin 2021

Salut ta config me plais bien sa ressemble aux anciennes versions mais pourrais tu me partager directement ton fichier USERCHROIME.css (ou au moins faire un copier coller intégrale) de la version sur ta 2eme photo "firefox_2" (celle en grise).
ps : au niveau programmation fichier j'y comprend pas grand chose.
Merci
Messages postés
3
Date d'inscription
mercredi 9 juin 2021
Statut
Membre
Dernière intervention
15 juin 2021
2
Voilà mon fichier USERCHROME.css



https://www.cjoint.com/c/KFkhOs2eh5A

philippr
Messages postés
37
Date d'inscription
jeudi 6 juin 2013
Statut
Membre
Dernière intervention
12 juin 2021

Bonjour merci j'utilise ton "userChrome" qui me convient beaucoup je voulais te demandé :
1-si il est possible de réduire l'écart qu'il y a entre la barre d'onglet et la barre personnel (si-joint ma capture d’écran)
2-si on peut modifier la hauteur des cases d'onglets.
3-et si on peut peut soit changer la couleur de la ligne rouge du bas soit la supprimé (je la trouve trop flashy).



j'ai essayer de modifier ton fichier "userChrome" avec notepad++ mais quand j'ai vu toute les infos dedans j'ai peur de faire une bétise(ou plus ^_^) alors j'ai préférais te contacter.
Encore merci
Messages postés
3
Date d'inscription
mercredi 9 juin 2021
Statut
Membre
Dernière intervention
15 juin 2021
2 >
Messages postés
37
Date d'inscription
jeudi 6 juin 2013
Statut
Membre
Dernière intervention
12 juin 2021

Pour supprimer la ligne rouge sous les onglets, il faut modifier la ligne

/* Draw a solid line underneath to make the selected tab look *connected* to the rest of the browser */
#TabsToolbar {
border-bottom: 5px solid #ff0000 !important; /* Couleur de l'arrière plan modifiable */
}



remplacer border-bottom: 5px
par border-bottom: 0px

pour la couleur, il faut remplacer la référence couleur #ff0000 par une autre.
Messages postés
32183
Date d'inscription
mercredi 2 mai 2007
Statut
Modérateur
Dernière intervention
17 juin 2021
7 751
Bonjour,

Sans la barre de menu, c'est faisable : https://forums.commentcamarche.net/forum/affich-37238875-liste-marques-pages#8

mais si comme fabul tu utilises la barre de menus ???
Messages postés
7
Date d'inscription
vendredi 14 mai 2021
Statut
Membre
Dernière intervention
10 juin 2021

Merci pour la suggestion mais je préfère encore la barre d'onglets un chouia trop haut et garder le reste de ma mise en page antérieure (menu + taille, surbrillance et police des onglets) .
Je suppose que dans quelques semaines une nouvelle manip. userchrome.css sera dispo pour régler tout ça.
A+.
F.
Messages postés
3269
Date d'inscription
lundi 11 novembre 2013
Statut
Membre
Dernière intervention
10 juin 2021
1 594
Salut.

Oui, on peut remettre la fameuse barre sous la barre d'adresse.

Personnellement, je préfère, dans l'ordre :
- Avoir la barre d'adresse en haut
- Avoir ensuite la barre personnelle.
- Puis avoir la barre d'onglet.

Comme ceci :


Si l'interface te convient :

il faut modifier une préférence dans about:config
-> Ouvre Firefox, tape about:config, et fais une recherche avec : legacy
-> Repère la ligne suivante : toolkit.legacyUserProfileCustomizations.stylesheets
-> Fais la passer en true, via le bouton ou le double-clic

Puis, vérifier si les extensions sont visibles :
-> Ouvre un dossier quelconque
-> Dans le menu, onglet affichage : coche la case Extensions de noms de fichier

Ensuite :
-> Ouvre firefox
-> menu > Aide > Plus d'informations de dépannage
-> Ensuite, repère Dossier de profil > Clique ensuite sur Ouvrir le dossier correspond
-> Une fois le dossier ouvert, créez ensuite un dossier chrome. S'il existe déjà, sauvegarde son contenu, afin que le dossier soit vide.
-> Puis créer un fichier intitulé : userChrome.txt et ouvre-le
-> Met ceci dans ce fichier : https://pastebin.com/28RyCx6E
-> Sauvegarde le fichier et ferme le.
-> Renomme ensuite userChrome.txt en userChrome.css

Note :
Merci pour la suggestion mais je préfère encore la barre d'onglets un chouia trop haut et garder le reste de ma mise en page antérieure (menu + taille, surbrillance et police des onglets) .


Dans ce cas là, adapte le fichier userChrome à ta convenance.

++

Comme un sage m'a dit : « en France, on a le droit de tout faire....
Faut juste ne pas se faire choper. »
Messages postés
28451
Date d'inscription
dimanche 18 janvier 2009
Statut
Contributeur
Dernière intervention
17 juin 2021
3 812
Salut,

merci pour cette contribution.

Néanmoins, il y a deux problèmes pour moi.

La barre personnelle, je ne l’utilise pas, si je veux la cacher, il me reste une barre (Bleue sur un PC test Win7).

2ème problème, quand j'ouvre plus d'un onglet, tous les onglets sont cachés sauf un

Messages postés
3269
Date d'inscription
lundi 11 novembre 2013
Statut
Membre
Dernière intervention
10 juin 2021
1 594 >
Messages postés
28451
Date d'inscription
dimanche 18 janvier 2009
Statut
Contributeur
Dernière intervention
17 juin 2021

Lu'

Vu que je n'utilise pas firefox, si tu veux, trouve moi les scripts d'userchrome.
je pourrais ainsi les tester, barre personnelle non affichée.

Et en effet, en cachant cette barre, j'ai les mêmes symptomes que toi.


je vais voir si je trouve rien d'autre.


++
Bonjour,
Merci pour cette solution. Je vais trouver quelqu'un pour m'aider à la mettre en œuvre (je suis déficiente visuelle, je préfère être accompagnée). J'ai juste une question : ça fonctionne sous Mac ?
Merci de votre aide.
Bonne journée !
Messages postés
7
Date d'inscription
vendredi 14 mai 2021
Statut
Membre
Dernière intervention
10 juin 2021

Merci little boy62 pour ta contribution et pour le presque tuto complet ;-)

Ca fonctionne chez moi (menu puis adresse puis barre personnelle puis barre des onglets) sauf que comme fabul, l'ensemble de la barre des onglets est à 50% recouverte par la fenêtre générale (à l’exception de l'onglet utilisé qui lui repasse au dessus de la fenêtre générale)....

Je suis pas arrivé à joindre une copie écran à mon message....(jpg ou png).

F.
Messages postés
28451
Date d'inscription
dimanche 18 janvier 2009
Statut
Contributeur
Dernière intervention
17 juin 2021
3 812
Chez moi avec le userChrome.css que j'ai copié en dernier, ça donne ça:

https://img-19.ccm2.net/YOqb6hHWAlygT_BvDWfN9gbn-PY=/696254c6c4c542528c6663cdf73d92fb/ccm-ugc/Capture.JPG
Messages postés
37
Date d'inscription
jeudi 6 juin 2013
Statut
Membre
Dernière intervention
12 juin 2021

Bonjour j'ai le même soucis que fredbxlbe2021 barre d'onglets caché a 50% et un séparation entre ma barre personnel et ma barre des onglets ( non nécessaire si possible j'aimerais la réduire).
Fabul sur la capture que tu a transmis je vois que tu a qu'un onglet d'ouvert et quand fredbxlbe2021 et moi on dit que les onglets sont caché à 50% et les onglet ouvert mais en secondaire, l'onglet principal et bien afficher a 100%.
Si quelqu'un a la solution je suis preneur merci
Franchement pourquoi les programmeurs de mozilla sont toujours entrain de retire des fonction utiles a tous pour ne pas nous laissé le choix, c'était le même bordel a l'époque pour la version 56 (si je me rappel bien le n°).
Messages postés
7
Date d'inscription
vendredi 14 mai 2021
Statut
Membre
Dernière intervention
10 juin 2021

bonsoir à tous,

Je suis pas calé en language css mais j'ai fait une compilation des différentes solutions proposées avec comme base une partie des codes de BRABRA62400 relooké avec des morceaux de codes utilisés avant 89 (pour les dimensions et couleurs onglets, lettrages, etc) et je suis satisfait. Les puristes trouveront peut-être des lignes contradictoires ou redondantes mais ça marche pour moi......donc je partage mon userchrome.css


/* 3-Barres d'onglet en dessous */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root{ --uc-titlebar-padding: 0px !important }
.titlebar-buttonbox-container{ left:0; right: unset !important; }}

:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px }

#toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 }

#navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; }

.titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; }

#titlebar{-moz-box-ordinal-group: 2;-moz-appearance: none !important;--tabs-navbar-shadow-size: 0px;}

.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }

/* Also hide the toolbox bottom border which isn't at bottom with this setup */
#navigator-toolbox::after{ display: none !important; }

@media (-moz-gtk-csd-close-button){ .titlebar-button{ -moz-box-orient: vertical } }

/* These exist only for compatibility with autohide-tabstoolbar.css */
toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; }
#navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 }

/* 5-Barre des menus en haut - use with tabs_on_bottom.css */

/* Menubar on top patch - use with tabs_on_bottom.css */
/* Only really useful if menubar is ALWAYS visible */

:root:not([sizemode="fullscreen"]){ --uc-window-control-width: 0px !important }

:root{
/* height if native titlebar is enabled, assumes empty menubar */
--uc-menubar-height: 20px;
}
:root[tabsintitlebar]{
/* height when native titlebar is disabled, more roomy so can fit buttons etc. */
--uc-menubar-height: 29px;
}

#navigator-toolbox{ padding-top: calc(var(--uc-menubar-height) + var(--uc-titlebar-padding,0px)) !important }
:root[sizemode="fullscreen"] #navigator-toolbox{ padding-top: 0px !important; }
#toolbar-menubar{
position: fixed;
display: flex;
top: var(--uc-titlebar-padding,0px);
height: var(--uc-menubar-height);
width: 100%;
overflow: hidden;
}

#toolbar-menubar > .titlebar-buttonbox-container{ height: 100%; order: 100; }

#toolbar-menubar > [flex]{ flex-grow: 100; }
#toolbar-menubar > spacer[flex]{
order: 99;
flex-grow: 1;
min-width: var(--uc-window-drag-space-width,20px);
}

#toolbar-menubar .titlebar-button{ padding: 2px 17px !important; }

#toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px }

/* Largeur des onglets */
.tabbrowser-tab:not([pinned]) {
max-width: 150px !important; min-width: 30px !important; }
.tabbrowser-tab:not([fadein]) {
max-width: 1px !important; min-width: 1px !important; }

.tab-background[selected="true"] {
background-attachment: none!important;
background-color: red!important;
background-image: none!important;
}
/* Make menus big, pretty and readable */
menubar, menubutton, menulist, menu, menuitem {
font-size: 16px !important
}
#TabsToolbar {
width: 100vw !important;
font-size: 18px !important;
}