firefox-userchrome/tweak-tabs.css at main · replete/firefox-userchrome · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
/* @replete's Firefox userChrome
 * Tabs tweaks
 * https://github.com/replete/firefox-userchrome
 */


/* This is designed for dark mode MacOS with browser.uidensity = 1 set in about:config */

/* Line up tabs with urlbar configured with back/next/reload on compact uidensity: */
.titlebar-spacer[type="pre-tabs"] {
    width: 21px !important;
}

/* Moooar tab space at right */
.titlebar-spacer[type="post-tabs"] {
    width: 13px !important;
}

/* Shorten gap between pinned tabs and normal */
#tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab[first-visible-unpinned-tab] {
    margin-inline-start: 5px !important;
}

/* Fixes the gap between tab rows */
#tabbrowser-tabs .tabbrowser-tab {
    height:34px !important;
}
#TabsToolbar {
    padding-bottom:1px
}

/* Fix close button right alignment */
.tabbrowser-tab .tab-close-button {
    transform: translate(1px,0) !important;
    height:20px !important;
    margin-inline-end:0px !important;
    padding:5px !important;
    width:20px !important;
}

/* gap above tabs */
#tabbrowser-tabs {
    padding-top:2px !important;
}

/* alignment fix */
.tabbrowser-tab[first-visible-tab=true] {
    padding-left:2px !important
}

/* alignment fix */
.tab-label-container .tab-text {
    transform:translate(0,-1px)
}

/* Removes the side borders from active and inactive tabs. */
.tabbrowser-tab::after,
.tabbrowser-tab::before {
    border-left: none !important; /* Remove borders from inactive tabs */
}

/* Show X on hover tab in multiline */
.tabbrowser-tab:not([selected]):not([pinned]):hover .tab-close-button {
	display: -moz-box !important;
}

/* Align new tab button */
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-icon {
    height:26px !important;
    width:26px !important
}

/* Compact tabs */
.tab-content {
    padding-left:5px !important;
    padding-right:5px !important;
}

:root[uidensity="compact"] {
    --tab-min-height:20px;
    --inline-tab-padding:4px
}

.tabbrowser-tab {
    --tab-min-height:20px;
}