[Solved] Old Palemoon 25 tabs? Topic is solved

[DjogaRo]

Exactly, and with "DOM Inspector" (Add-On) it was easy to figure out the details.

[blind12]

Exactly, and with "DOM Inspector" (Add-On) it was easy to figure out the details.

I didn't know these interface elements were "inspectable", nice to know : )

[DjogaRo]

Indeed. Just choose the open window your interested in by current title from "File" -> "Inspect Chrome Document" -> <some entries>. That some of those entries are actually the open windows is the only thing that wasn't obvious to me. From their its straight forward, if you know a bit about how the DOM, css, JS and that XUL stuff work.

[Freezing Moon]

@DjogaRo

Thank you so much. This user style also solved my problem with weird white frame around active tab (Dark Carbon lightweight theme).

http://imgur.com/n1zJt9D

[DjogaRo]

@Freezing Moon
That's great, but I'm not responsible. I only made sure the given style doesn't hinder TMP's layouting attempts.

[Freezing Moon]

@Freezing Moon
That's great, but I'm not responsible. I only made sure the given style doesn't hinder TMP's layouting attempts.

I guess I am blind. I didn't see that Lootyhoof posted "original" user style which is working fine for me since I don't use TMP.
So, Lootyhoof thank you.

[MrMaguire]

Classically in %appdata%\Palemoon\User\Palemoon\Profiles\Default\chrome\userChrome.css

This doesn't match up with what I have. The closest I have is:

%appdata%\Moonchild Productions\Pale Moon\Profiles\hqpuwmwf.default

None of the directories under hqpuwmwf.default contain UserChrome.css, userChrome-example.css or userContent-example.css

[jumba]

None of the directories under hqpuwmwf.default contain UserChrome.css, userChrome-example.css or userContent-example.css

A tool for that was suggested here:
viewtopic.php?f=45&t=10908

[MrMaguire]

None of the directories under hqpuwmwf.default contain UserChrome.css, userChrome-example.css or userContent-example.css

A tool for that was suggested here:
viewtopic.php?f=45&t=10908

Thanks

I tried ChromeEdit Plus and it didn't seem to do anything at all. Stylish worked perfectly.

[lihatt]

Using the most recent code block posted in this thread by DjogaRo (http://forum.palemoon.org/viewtopic.php ... 842#p76656) - Does anyone else notice a significant visual delay in the drawing of a new tab when you open one? Actually, sitting here opening and closing tabs to try to gauge the length of time, I'm starting to see other odd effects, like the thin line outlining the top of the tab disappearing, new tab not having the lighter background that a focused tab has, odd flickerings when opening and closing tabs, like a new tab is not actually appearing until I've tried to open yet one more beyond it... I can't really take a video to show all that, but here's a screenshot showing some of the missing border lines:

Untitled.jpg

And got this oddity when CTRL+TABing to cycle through open tabs...

Untitled2.jpg

[DjogaRo]

Well, styling with "!important" can easily break things that weren't considered during styling - like Themes or Add-ons that rely on being able to change those values one pinned down with "!important".

So, depending on what else you use, you might need something custom-tailored. No way to make a style like this, that works fine everywhere.

[SGvagon]

Fix for Palemoon 26.1.0 .

Code: Select all

.tabbrowser-tab, .tabs-newtab-button {
  border-radius: 3.5px 3.5px 0 0!important;
  margin: -1px !important;
  border-style: solid !important;
  border-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAcCAYAAABYvS47AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAJBJREFUeNpiFBGXYmJgYABhZihGBn+h+B8LkGAFYhUgVgBiPjSFn4D4ARDfAZmka2Ntpb9t80bO1y+ePkfGIDGQHEgNA9DqkKfPnnn9//9fGIiZgJgBikFsYZAcSA3IRHYpSUmQ8e9AbkGyFsR+B5VjZ4IK/gHi/wyY4D9UDuxbRgbCgHFU4ajCUYU0UggQYADV1D8Ak746KgAAAABJRU5ErkJggg==') 4 3 0 fill repeat stretch !important;
}

[GeoRmr]

Fix for Palemoon 26.1.0 .

Code: Select all

.tabbrowser-tab, .tabs-newtab-button {
  border-radius: 3.5px 3.5px 0 0!important;
  margin: -1px !important;
  border-style: solid !important;
  border-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAcCAYAAABYvS47AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAJBJREFUeNpiFBGXYmJgYABhZihGBn+h+B8LkGAFYhUgVgBiPjSFn4D4ARDfAZmka2Ntpb9t80bO1y+ePkfGIDGQHEgNA9DqkKfPnnn9//9fGIiZgJgBikFsYZAcSA3IRHYpSUmQ8e9AbkGyFsR+B5VjZ4IK/gHi/wyY4D9UDuxbRgbCgHFU4ajCUYU0UggQYADV1D8Ak746KgAAAABJRU5ErkJggg==') 4 3 0 fill repeat stretch !important;
}

This hasn't worked for me, the -1px caused problems with movement and resizing when closing multiple tabs. After messing with it for a while I think i've got there with this.

Code: Select all

.tabbrowser-tab, .tabs-newtab-button {
  border-radius: 2.5px 2.5px 0 0!important;
  margin: 0.1px !important;
  border-style: solid !important;
    border-width: 1px 1px 0 !important;
  border-image:  
url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAcCAYAAABYvS47AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAJBJREFUeNpiFBGXYmJgYABhZihGBn+h+B8LkGAFYhUgVgBiPjSFn4D4ARDfAZmka2Ntpb9t80bO1y+ePkfGIDGQHEgNA9DqkKfPnnn9//9fGIiZgJgBikFsYZAcSA3IRHYpSUmQ8e9AbkGyFsR+B5VjZ4IK/gHi/wyY4D9UDuxbRgbCgHFU4ajCUYU0UggQYADV1D8Ak746KgAAAABJRU5ErkJggg==') 4 3 0 fill repeat stretch !important;
}

[SGvagon]

With 0.1px margin there is bigger problem with spacing

[GeoRmr]

With 0.1px margin there is bigger problem with spacing

(this looks smaller on my pm, do you have tabs on top? Wasn't there a gap between the tabs in pm25 anyway?)

your code leaves a margin below the tabs for some reason....

EDIT: I just noticed that the spacing is of different sizes, 0px seems to work

[Vallek]

Posted this elsewhere, but I'll copy it here too so it's in somewhere a bit more permanent:

Code: Select all

.tabbrowser-tab,
.tabs-newtab-button {
  background-position: 1px 2px !important;
  background-size: calc(100% - 2px) calc(100% - 2px) !important;
  margin: 0 !important;
  padding: 2px 0 4px !important;
  border-width: 4px 3px 0 !important;
  border-style: solid !important;
  border-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAcCAYAAABYvS47AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAJBJREFUeNpiFBGXYmJgYABhZihGBn+h+B8LkGAFYhUgVgBiPjSFn4D4ARDfAZmka2Ntpb9t80bO1y+ePkfGIDGQHEgNA9DqkKfPnnn9//9fGIiZgJgBikFsYZAcSA3IRHYpSUmQ8e9AbkGyFsR+B5VjZ4IK/gHi/wyY4D9UDuxbRgbCgHFU4ajCUYU0UggQYADV1D8Ak746KgAAAABJRU5ErkJggg==') 4 3 0 fill repeat stretch !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

It doesn't work in 26.1 no more. Actually NONE of styles that removes gasps between tabs are working right. Can you please fix it?

[Vallek]

Ok i think i solved it! I took this style

Just add this

Code: Select all

.tabbrowser-tab, .tabs-newtab-button {
border-radius: 0px 0px 0 0!important;
margin-right: 0.5px !important;
margin-left: 0.5px !important;
}

You can change margin for your the best result.

and changed it to this

.tabbrowser-tab:not([pinned]):not([tabmix-firstTabInRow]), .tabs-newtab-button {
border-radius: 0px 0px 0 0!important;
margin-right: -1.0px !important;
margin-left: -1.0px !important;
box-shadow: none !important;
}

[SGvagon]

Vallek: How I said, this works for me in 26.1.0

Code: Select all

.tabbrowser-tab, .tabs-newtab-button {
  border-radius: 3.5px 3.5px 0 0!important;
  margin: -1px !important;
  border-style: solid !important;
  border-image:  url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAcCAYAAABYvS47AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAJBJREFUeNpiFBGXYmJgYABhZihGBn+h+B8LkGAFYhUgVgBiPjSFn4D4ARDfAZmka2Ntpb9t80bO1y+ePkfGIDGQHEgNA9DqkKfPnnn9//9fGIiZgJgBikFsYZAcSA3IRHYpSUmQ8e9AbkGyFsR+B5VjZ4IK/gHi/wyY4D9UDuxbRgbCgHFU4ajCUYU0UggQYADV1D8Ak746KgAAAABJRU5ErkJggg==') 4 3 0 fill repeat stretch !important;
}

[Vallek]

Vallek: How I said, this works for me in 26.1.0

It creates thick white line on top of the tabs.

[DjogaRo]

I changed mine to:

Code: Select all

#main-window[sizemode="normal"] #TabsToolbar[tabsontop="true"] {
	margin-top: 2px !important;
}

.tabbrowser-tab,
.tabs-newtab-button {
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  margin-top: 0 !important;
  padding: 1px 0 3px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.tabbrowser-tab:not([pinned]):not([tabmix-firstTabInRow]) {
  margin-left: 0 !important;
}

.tabbrowser-tab .tab-throbber,
.tabbrowser-tab .tab-icon-image,
.tabbrowser-tab .tab-icon-overlay,
.tabbrowser-tab .tab-protect-icon,
.tabbrowser-tab .tab-lock-icon,
.tabbrowser-tab .tab-reload-icon {
  margin-left: 2px !important;
  margin-right: 3px !important;
}

.tabbrowser-tab[pinned] .tab-throbber,
.tabbrowser-tab[pinned] .tab-icon-image,
.tabbrowser-tab[pinned] .tab-icon-overlay,
.tabbrowser-tab[pinned] .tab-protect-icon,
.tabbrowser-tab[pinned] .tab-lock-icon,
.tabbrowser-tab[pinned] .tab-reload-icon {
  margin-left: 1px !important;
  margin-right: 1px !important;
}

(using default theme and TabMixPlus)

It's also less spacious than what I had before, which I intended.