в Инструменты

Tree Style Tab для Firefox

Недавно удалил с компьютера Chrome и пересел снова на Firefox, и буквально тут же подглядел у клиента (Игги, привет!) классный плагин для работы со вкладками: Tree Style Tab.

Плагин собирает вкладки в левой части браузера и когда вы переходите по ссылкам внутри какой-то отдельной страницы, он вкладывает их на уровень ниже древовидно, чтобы можно было видеть, как именно вы углубляетесь в исследование какой-то из вкладок.

Выглядит вот так:

Снимок экрана 2021-01-27 в 22.10.48

Установить плагин можно вот тут:

https://addons.mozilla.org/ru/firefox/addon/tree-style-tab/

 

Еще я сразу заметил, что пользуюсь все равно верхними вкладками, которые есть стандартно и решил их снести. Для этого можно добавить специальный код в настройку плагина. А чтобы оставшееся места не было просто пустым, подвинул туда строку ввода адреса.

Чтобы это повторить:

  1. Вводите в строке ввода about:support
  2. Находите строчку «Папка профиля», нажимаете «Показать в Finder»
  3. Заходите внутрь выделенной в Finder папки, создаете в ней папку с названием chrome (маленькими буквами)
  4. Внутри создаем текстовый файл с названием userChrome.css
  5. В файл пишем такой код:
    @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
    
    /* Adapted from https://www.reddit.com/r/FirefoxCSS/comments/ao3ydl/configuring_firefox_for_tree_style_tab_usage/ */
    
    /* hide native tabs and sidebar header */
    
    #TabsToolbar-customization-target {
    
      visibility: collapse;
    
    }
    
    #navigator-toolbox[inFullscreen="true"] #titlebar {
    
      visibility: collapse;
    
    }
    
    #sidebar-header {
    
      visibility: collapse;
    
    }
    
    /* realign elements */
    
    #nav-bar {
    
      margin-top: calc(-1 * var(--tab-min-height));
    
      box-shadow: none !important;
    
    }
    
    #nav-bar[inFullscreen="true"] {
    
      margin-top: unset;
    
      margin-right: unset;
    
    }
    
    .titlebar-buttonbox-container {
    
      min-height: var(--tab-min-height);
    
    }
    
    /* recolor elements and enable window dragging */
    
    #navigator-toolbox {
    
      background-color: var(--toolbar-bgcolor);
    
      background-image: var(--toolbar-bgimage);
    
      background-clip: padding-box;
    
      color: var(--toolbar-color);
    
      
    
      -moz-window-dragging: drag;
    
    }
    
    #TabsToolbar > .toolbar-items,
    
    #TabsToolbar > .titlebar-spacer{ visibility: hidden }
    
    #nav-bar{ margin-top: -32px; padding: 0px 15px 0px 75px !important; }
    
    /* reducing back buttons scale */ 
    
    #back-button > .toolbarbutton-icon,
    
    #forward-button > .toolbarbutton-icon {
    
     transform: scale(.7,.7) !important;
    
    }
  6. Сохраняете файл
  7. В Фаерфоксе вбиваем в строку ввода about:config
  8. Поиском находим строчку userprof
  9. Переключаем toolkit.legacyUserProfileCustomizations.stylesheets в положение true
  10. Перезапускаем браузер, должно получиться так же, как у меня в скриншоте.

 

Поделиться
Плюсануть
Класснуть
Запинить