[Ext] Classic Theme Restorer

[Aris]

For me using middle click on search glass also opened search in a foreground tab back on Fx 50.

Please setup a new browser profile with only CTR installed and repeat tests with Fx 50, 51 and 52.

[zzzzzzzzzz]

Aris, I have noticed that Firefox with the Australis UI has the Private Browsing indicator on the Tabs Bar as a non-movable indicator. Before the Australis UI, the Private Browning indicator was placed on the Menu Bar as a non-movable indicator.

I particularly believe that the indicator would better perform its function on toolbars other than the Tab Bar toolbar. The Tab Bar seems to be the worst toolbar location for the indicator. Further, there value of the Private Browsing indicator is lost completely if the Tab Bar is hidden (such as with the Classic Theme Restorer option to do so (Tabs --> Page 2 --> [Tabs Toolbar section] --> Hide tabs toolbar with only one visible tab)).

I request that Classic Theme Restorer allow for the relocation of the Private Browsing indicator.

At the time of this post the current version of Classic Theme Restorer is version 1.6.2.1 and it is the only version that I have used. The versions of Firefox I have tested are version 45.7.0 (32-bit) and 52.0b9 (32-bit) on Windows XP Professional with Service Pack 3 and Windows Vista with Service Pack 2.

I am providing some pictures for reference:


CTR_Private_Browsing_Tabs Bar_Hidden_FF45.7.0.gif - Windows picture capture of the Firefox 45.7.0 with Classic Theme Restorer 1.6.2.1 browser window in Private Browsing. The Tabs Bar is hidden, and the Private Browsing indicator is not available.



CTR_Private_Browsing_Tabs Bar_Shown_FF45.7.0.gif - Windows picture capture of the Firefox 45.7.0 with Classic Theme Restorer 1.6.2.1 browser window in Private Browsing. The Tabs Bar is shown, and the Private Browsing indicator is available on the Tabs Bar.



Private_Browsing_Tabs Bar_Hidden_FF24.8.1.gif - Windows picture capture of the Firefox 24.8.1 (Firefox before Australis UI) browser window in Private Browsing. The Tabs Bar is hidden, and the Private Browsing indicator is available on the Menu Bar.



Private_Browsing_Tabs Bar_Shown_FF24.8.1.gif - Windows picture capture of the Firefox 24.8.1 (Firefox before Australis UI) browser window in Private Browsing. The Tabs Bar is shown, and the Private Browsing indicator is available on the Menu Bar.

[Kyogre]

For me using middle click on search glass also opened search in a foreground tab back on Fx 50.

Anyway, can you make an option to open search in background tab?

[Aris]

@zzzzzzzzzz
I can add a movable mask on next CTR update.

Default mask indicators (on titlebar and tabs toolbar) can be hidden by the corresponding CTR option "General UI > page 4 > private browsing: hide mask indicator". That way only the "new" item will be visible in private mode, if placed on toolbar.

@Kyogre
I will add a second "middle clicks..." option to control the middle click event on search glass, but why now just using "shift key + middle mouse button/wheel" on search glass to open tabs in background like in Fx 29?

[FirefoxUser39]

Can the SVG colors be customized?

[Aris]

Do you mean the ones provided by CTR or in general?

Here is what CTR uses (change the way you like and paste it into a Stylish style):

Code: Select all

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url(chrome://browser/content/browser.xul) {

	/*Blue*/
	#ctraddon_navigator-throbber,
	#save-page-button .toolbarbutton-icon,
	#developer-button .toolbarbutton-icon,
	#preferences-button .toolbarbutton-icon,
	#ctraddon_preferences-button .toolbarbutton-icon,
	#webrtc-status-button .toolbarbutton-icon { 
	  filter: url("data:image/svg+xml;utf8,\
		<svg xmlns='http://www.w3.org/2000/svg'>\
		 <filter id='matrix-b' color-interpolation-filters='sRGB' filterUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'>\
		  <feColorMatrix type='saturate' in='SourceGraphic' values='0' result='A'/>\
		  <feColorMatrix type='matrix' in='A' values='0.38  0.3  0.3  0.0  0.0 0.3  0.38  0.3  0.0  0.0 0.3  0.3  0.38  0.0  0.3 0.0  0.0  0.0  1.0  0.0'/>\
		 </filter>\
		</svg>#matrix-b") !important;
	}

	/*Red*/
	#pocket-button:not([open]) .toolbarbutton-icon,
	#PanelUI-quit:not(:hover) .toolbarbutton-icon,
	#web-apps-button .toolbarbutton-icon,
	#e10s-button .toolbarbutton-icon,
	#panic-button .toolbarbutton-icon,
	toolbarbutton[id^="loop-"]:not([state="error"]):not([state="action"]):not([state="active"]),
	.tabs-closebutton:hover .toolbarbutton-icon,
	.tab-close-button:hover .toolbarbutton-icon,
	#urlbar-stop-button:hover,
	#cut-button .toolbarbutton-icon,
	#zoom-out-button .toolbarbutton-icon,
	#stop-button .toolbarbutton-icon,
	#ctraddon_stop-button .toolbarbutton-icon,
	#characterencoding-button .toolbarbutton-icon { 
	  filter: url("data:image/svg+xml;utf8,\
		<svg xmlns='http://www.w3.org/2000/svg'>\
		  <filter id='matrix-r' color-interpolation-filters='sRGB' filterUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'>\
			<feColorMatrix type='saturate' in='SourceGraphic' values='0' result='A'/>\
			<feColorMatrix type='matrix' in='A' values='0.38  0.3  0.3  0.0  0.4 0.3  0.38  0.3  0.0  0.0 0.3  0.3  0.38  0.0  0.0 0.0  0.0  0.0  1.0  0.0'/>\
		  </filter>\
		</svg>#matrix-r") !important;
	}

	/*Lime*/
	#ctraddon_back-button .toolbarbutton-icon, 
	#ctraddon_forward-button .toolbarbutton-icon,
	#ctraddon_back-forward-dropmarker .toolbarbutton-icon,
	#back-button .toolbarbutton-icon,
	#forward-button .toolbarbutton-icon,
	#new-window-button .toolbarbutton-icon,
	#new-tab-button .toolbarbutton-icon,
	#ctraddon_go-button .toolbarbutton-icon,
	.search-go-button,
	#downloads-button .toolbarbutton-icon,
	#downloads-button[indicator="true"]:not([attention="success"]) #downloads-indicator-icon,
	#go-button:hover,
	#urlbar-go-button:hover,
	#zoom-in-button .toolbarbutton-icon,
	#copy-button .toolbarbutton-icon,
	#add-ons-button .toolbarbutton-icon,
	#find-button .toolbarbutton-icon,
	#sidebar-button .toolbarbutton-icon { 
	  filter: url("data:image/svg+xml;utf8,\
		<svg xmlns='http://www.w3.org/2000/svg'>\
		  <filter id='matrix-ygg' color-interpolation-filters='sRGB' filterUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'>\
			<feColorMatrix type='saturate' in='SourceGraphic' values='0' result='A'/>\
			<feColorMatrix type='matrix' in='A' values='0.38  0.3  0.3  0.0  0.1 0.3  0.38  0.3  0.0  0.28 0.3  0.3  0.38  0.0  0.0 0.0  0.0  0.0  1.0  0.0'/>\
		  </filter>\
		</svg>#matrix-ygg") !important;
	}
	
	/*Royal*/
	#ctraddon_history-menu-toolbar-button .toolbarbutton-icon,
	#history-button .toolbarbutton-icon,
	#history-panelmenu .toolbarbutton-icon,
	#ctraddon_history-button .toolbarbutton-icon,
	#fullscreen-button .toolbarbutton-icon,
	#urlbar-reload-button:hover,
	#paste-button .toolbarbutton-icon,
	#reload-button .toolbarbutton-icon ,
	#ctraddon_reload-button .toolbarbutton-icon { 
	  filter: url("data:image/svg+xml;utf8,\
		<svg xmlns='http://www.w3.org/2000/svg'>\
		  <filter id='matrix-cbb' color-interpolation-filters='sRGB' filterUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'>\
			<feColorMatrix type='saturate' in='SourceGraphic' values='0' result='A'/>\
			<feColorMatrix type='matrix' in='A' values='0.38  0.3  0.3  0.0  0.0 0.3  0.38  0.3  0.0  0.07 0.3  0.3  0.38  0.0  0.3 0.0  0.0  0.0  1.0  0.0'/>\
		  </filter>\
		</svg>#matrix-cbb") !important;
	}

	/*Orange*/
	#feed-button .toolbarbutton-icon {
	  filter: url("data:image/svg+xml;utf8,\
		<svg xmlns='http://www.w3.org/2000/svg'>\
		  <filter id='matrix-ry' color-interpolation-filters='sRGB' filterUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'>\
			<feColorMatrix type='saturate' in='SourceGraphic' values='0' result='A'/>\
			<feColorMatrix type='matrix' in='A' values='0.38  0.3  0.3  0.0  0.4 0.3  0.38  0.3  0.0  0.2 0.3  0.3  0.38  0.0  0.0 0.0  0.0  0.0  1.0  0.0'/>\
		  </filter>\
		</svg>#matrix-ry") !important;
	}
	
	/*Gold */
	#PanelUI-customize .toolbarbutton-icon,
	#password-notification-icon,
	#home-button .toolbarbutton-icon,
	#open-file-button .toolbarbutton-icon,
	#email-link-button .toolbarbutton-icon { 
	  filter: url("data:image/svg+xml;utf8,\
		<svg xmlns='http://www.w3.org/2000/svg'>\
		  <filter id='matrix-ryy' color-interpolation-filters='sRGB' filterUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'>\
			<feColorMatrix type='saturate' in='SourceGraphic' values='0' result='A'/>\
			<feColorMatrix type='matrix' in='A' values='0.38  0.3  0.3  0.0  0.4 0.3  0.38  0.3  0.0  0.3 0.3  0.3  0.38  0.0  0.0 0.0  0.0  0.0  1.0  0.0'/>\
		  </filter>\
		</svg>#matrix-ryy") !important;
	}
	
	/*Cyan*/
	#PanelUI-fxa-status .toolbarbutton-icon,
	#sync-button .toolbarbutton-icon,
	#tabview-button .toolbarbutton-icon,
	#social-share-button .toolbarbutton-icon { 
	  filter: url("data:image/svg+xml;utf8,\
		<svg xmlns='http://www.w3.org/2000/svg'>\
		  <filter id='matrix-c' color-interpolation-filters='sRGB' filterUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'>\
			<feColorMatrix type='saturate' in='SourceGraphic' values='0' result='A'/>\
			<feColorMatrix type='matrix' in='A' values='0.38  0.3  0.3  0.0  0.0 0.3  0.38  0.3  0.0  0.3 0.3  0.3  0.38  0.0  0.3 0.0  0.0  0.0  1.0  0.0'/>\
		  </filter>\
		</svg>#matrix-c") !important;
	}

	/*Purple*/
	#privatebrowsing-button .toolbarbutton-icon,
	#print-button .toolbarbutton-icon { 
	  filter: url("data:image/svg+xml;utf8,\
		<svg xmlns='http://www.w3.org/2000/svg'>\
		  <filter id='matrix-bmm' color-interpolation-filters='sRGB' filterUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'>\
			<feColorMatrix type='saturate' in='SourceGraphic' values='0' result='A'/>\
			<feColorMatrix type='matrix' in='A' values='0.38  0.3  0.3  0.0  0.18 0.3  0.38  0.3  0.0  0.0 0.3  0.3  0.38  0.0  0.26 0.0  0.0  0.0  1.0  0.0'/>\
		  </filter>\
		</svg>#matrix-bmm") !important;
	}
	
	/*Azure*/
	#webide-button .toolbarbutton-icon,
	#PanelUI-help:not(:hover) .toolbarbutton-icon,
	#PanelUI-menu-button .toolbarbutton-icon,
	#nav-bar-overflow-button .toolbarbutton-icon,
	#classic_bm_button23-toolbar-button > .toolbarbutton-icon,
	#ctraddon_bookmarks-menu-toolbar-button .toolbarbutton-icon,
	#ctraddon_bookmarks-button .toolbarbutton-icon,
	#bookmarks-menu-button .toolbarbutton-icon,
	#bookmarks-button .toolbarbutton-icon,
	#bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { 
	  filter: url("data:image/svg+xml;utf8,\
		<svg xmlns='http://www.w3.org/2000/svg'>\
		  <filter id='matrix-cb' color-interpolation-filters='sRGB' filterUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'>\
			<feColorMatrix type='saturate' in='SourceGraphic' values='0' result='A'/>\
			<feColorMatrix type='matrix' in='A' values='0.38  0.3  0.3  0.0  0.0 0.3  0.38  0.3  0.0  0.15 0.3  0.3  0.38  0.0  0.3 0.0  0.0  0.0  1.0  0.0'/>\
		  </filter>\
		</svg>#matrix-cb") !important;
	}

	/* 0-saturation */
	.searchbar-dropmarker-image,
	.urlbar-history-dropmarker { 
	  filter: url("data:image/svg+xml;utf8,\
		<svg xmlns='http://www.w3.org/2000/svg'>\
		  <filter id='desat-0' color-interpolation-filters='sRGB' filterUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'>\
			<feColorMatrix type='saturate' in='SourceGraphic' values='0.0'/>\
		  </filter>\
		</svg>#desat-0") !important;
	}
	
	/*Exclude CTRs star in feed buttons in location bar */
	#urlbar-icons #feed-button .toolbarbutton-icon,
	#urlbar-icons #bookmarks-menu-button .toolbarbutton-icon { 
	  filter: none !important;
	}

}

[/size]

[FirefoxUser39]

CTR. The colors are too dull and desaturated.

[Frank Lion]

CTR. The colors are too dull and desaturated.

Recode the svg coding yourself then.

[zzzzzzzzzz]

@zzzzzzzzzz
I can add a movable mask on next CTR update.

Default mask indicators (on titlebar and tabs toolbar) can be hidden by the corresponding CTR option "General UI > page 4 > private browsing: hide mask indicator". That way only the "new" item will be visible in private mode, if placed on toolbar.

Thanks. I appreciate it.

[That Random Guy]

Not important, but... how "impossible" is it to achieve some minimum flexibility with appearance (and tweaking) with the new WebExtensions?

I feel like the author(s) is/are making it sound as if there's no hope for any customization down the line. And by extension, that there's almost no future prospect of even trying to with the new environment.

While Mozilla has available documentation and knowing there's a multitude of resources I could find online to answer this, I don't understand why it's "impossible".

Are they just not going to allow any customization?

Follow up question: If even the slightest chance of allowing a similar avenue for CTR, would the authors even consider it?

Cause I'll tell you right now: If you aren't going to do it, then It's not over. Someone WILL find a way to get "what we want". If you're just going to quit, then all the same. I will not let your efforts go to waste.

If I have to spend nights learning to do what you've done, I'll do it. No promises, but I'll do whatever is in my power to keep this functionality alive.

It's not enough to just say, "oh well".

[Aris]

At the moment we know Mozilla plans to allow "theming" with WebExtenstions in a very restricted way. This is an early example of what "complete themes" will be replaced with:

Code: Select all

{
 "manifest_version": 2,
  "name": "Crazy Theme",
  "description": "I’m going slightly mad...",
  "version": "1.3",
  "applications": {
    "gecko": {
      "id": "it-finally-happened@example.com",
      "strict_min_version": "57.0",
      "strict_max_version": "65.*"
    }
  },
  "icons": {
    "48": "icon.png",
    "96": "icon@2x.png"
  },
 "theme": {
   "colors": {
      "accentcolor": "#d92215",
      "textcolor": "rgb(224, 41, 29)",
      "background_tab": [255, 255, 255, 0.6],
      "background_tab_inactive": [255, 255, 255, 0.2]
   },
   "images": {
     "theme_frame": "sample.jpeg"
   },
   "properties": {
     "square_tabs": true
   }
 }
}

[/size]

From this you can see what they plan to make customizable:
- tabs appearance: rounded, squared
- accent color: most likely toolbars and active tabs color
- tab background colors: inactive/hovered tab color
- text color: most likely toolbars text color
- theme image: similar to what lw-themes (Personas) do now
- toolbar icons: most likely only switching between dark and white icons (for now?)

You know CTR allows you to do much more than that and I'm not just talking about toolbar or tab colors (in fact tab customization is much more complex than just changing the colors: dimensions, borders, color gradients etc....).

Knowing this it is save to say things possible with XUL now will not be possible with WebExtensions. It was confirmed multiple times stuff like moving buttons into different areas (like titlebar, location bar), moving toolbars (tabs [not] on top) or creating movable custom buttons (back, forward, stop, reload etc.) or custom items (activity indicator, additional masks etc.) will not be allowed and therefore not possible. Nobody knows now how Mozillas plans may expand and what might be possible in a year or two, but for now we really can say "CTR can not become a WebExtension". Doing what current "Compact" themes on Nightly channel do is just not what CTR will become:



I did not want to say "nothing will be possible after Fx 57 gets released", but most things that are possible now won't be. This of course does not mean we won't get add-ons to change that very little something Mozilla plans to allow us to change.

[Frank Lion]

Cause I'll tell you right now: If you aren't going to do it, then It's not over. Someone WILL find a way to get "what we want". If you're just going to quit, then all the same. I will not let your efforts go to waste.

If I have to spend nights learning to do what you've done, I'll do it. No promises, but I'll do whatever is in my power to keep this functionality alive.

It's not enough to just say, "oh well".

Slick, sometimes 'sound bite phrases' and singing 'Shall We Gather at the River' just doesn't cut it. Actually, it almost never does.

[rado84]

It's been a while since I used TabMix Plus in combination with CTR and now I notice there's a gap between the bottom of the tabs and the status bar (see the screenshot), pointed by the yellow arrow. Any suggestions what should I write in userChrome.css in order to remove that gap?

[Aris]

CTR does not officially support TMPs "tabs on bottom" feature, but you can try to use CTRs "squared tabs v2" and "tabs not on top v1" to improve this combination.

Edit
Even after multiple tests I could not reproduce your gitch:
- new profile
- latest CTR release/beta
- latest TMP release/beta
- Firefox 45esr/52esr/54
- TMPs "tabs on bottom"
- CTRs "tabs not on top v1"
- CTRs "squared tabs v1/2"

[dbcooper.dk]

Any idea why the vertical padding has become so small with recent nightly builds? (x64 on Win10 x64). Using CTR 1.6.3b3.