MozillaZine

[Ext] Classic Theme Restorer

Announce and Discuss the Latest Theme and Extension Releases.
Aris

User avatar
 
Posts: 3246
Joined: February 27th, 2011, 10:14 am

Post Posted March 3rd, 2019, 8:04 am

Don't use /*AGENT_SHEET*/, it is not required anymore and import code for "about:" pages through userContent.css not userChrome.css.

Brummelchen
 
Posts: 4616
Joined: March 19th, 2005, 10:51 am

Post Posted March 3rd, 2019, 9:07 am

#-o
looks like this now
Code: Select all
@-moz-document url-prefix(about:config) {

:root
{
  --in-content-item-hover: #00ff0040 !important;
  --in-content-item-selected: #00808080 !important;
}

button
{
    background-color: #ff000080 !important;
}

#show-all:not(:focus):not(:hover):not(:active)
{
    background-color: #ff8000c0;
    opacity: 1;
}
#show-all:hover
{
    background-color: #ff8000;
    opacity: 1;
}

body.config-background
{
    background-image: none !important;
}

.config-background > #prefs > tr.has-user-value > th[scope="row"],
.config-background > #prefs > tr.has-user-value > td.cell-value,
.config-background > #prefs > tr.has-user-value > td.cell-edit
{
    background-color: #ff800080 !important;
}

.config-background > #prefs > tr > td.cell-edit > button
{
    background-color: #00800080 !important;
}

.config-background > #prefs > tr > td.cell-edit > .button-edit
{
    background-color: #ff8000b0 !important;
}

.config-background > #prefs > tr > td.cell-edit > .button-toggle
{
    background-color: #0000c080 !important;
}

.config-background > #prefs > tr.has-user-value > td.cell-reset > .button-reset
{
    background-color: #00800080 !important;
}

.config-background > #prefs > tr.locked {
    opacity: 1;
    background-color: #ff000080 !important;
}

/*aris*/
   .config-background #prefs,
   .config-background #prefs * {
     min-height: unset !important;
     /*padding: unset !important;
     margin: unset !important;
     font-size: unset !important;*/
   }

   .config-background #prefs button {
     -moz-margin-start: 1px !important;
   }

   .config-background #prefs #form-edit > * {
     -moz-margin-end: 2px !important;
   }

   .config-background #search-container * {
     min-height: unset !important;
     font-size: unset !important;
     padding-top: unset !important;
     padding-bottom: unset !important;
     margin-top: unset !important;
     margin-bottom: unset !important;
   }

   .config-background #search-container {
     padding: 4px !important;
   }
   
}

tbc

thank you much.

Olofern
 
Posts: 22
Joined: March 6th, 2018, 2:14 am

Post Posted March 19th, 2019, 11:40 pm

I'm switching from Waterfox to Firefox

I'd like to know if exist a css code to implement "Reduce space above toolbar (if possible)" feature of CTR
Image

Alternatively, do you know how to reduce tab bar height? (I don't mean tab height, I already know it)

Aris

User avatar
 
Posts: 3246
Joined: February 27th, 2011, 10:14 am

Post Posted March 20th, 2019, 1:40 am

Firefox already offers such an option by default. Open customizing mode, the checkbox right next to the titlebar checkbox.

You could also try to change the top padding and margin of #TabsToolbar, #TabsToolbar-customization-target or #tabbrowser-tabs.

Olofern
 
Posts: 22
Joined: March 6th, 2018, 2:14 am

Post Posted March 21st, 2019, 12:25 am

Thanks,

I tried many times your suggestions and I didn't find a way to reduce Tab bar height.
This is my result
Image




Firefox already offers such an option by default. Open customizing mode, the checkbox right next to the titlebar checkbox.

Do you mean this?
Image

It has no effect

Aris

User avatar
 
Posts: 3246
Joined: February 27th, 2011, 10:14 am

Post Posted March 21st, 2019, 2:31 am

Was you result achieved with CustomCSSforFx projects files?

You also have to reduce caption buttons padding/margin values, because it seems like min, max, close buttons are causing the space above your tabs.

Olofern
 
Posts: 22
Joined: March 6th, 2018, 2:14 am

Post Posted March 22nd, 2019, 11:39 am

Ok, I recreate my userChrome.css using CustomCSSforFx projects files

Image

I'd like again reducing tab bar height
As you can see, I moved up min, max and close buttons. I don't remember how I did it, please tell me how I did
I tried to change min, max, close icons using
Code: Select all
@import "./css/generalui/close_icon_gchrome.css"; /**/

and it doesn't work at all, as well as all other close icons


You also have to reduce caption buttons padding/margin values, because it seems like min, max, close buttons are causing the space above your tabs.

I don't know how reducing these values

Aris

User avatar
 
Posts: 3246
Joined: February 27th, 2011, 10:14 am

Post Posted March 23rd, 2019, 8:07 am

Use developer tools to look up ids and classes of ui items. :mrgreen:

Code: Select all
,titlebar-button,
,titlebar-button .toolbarbutton-icon {
  padding: 0 !important;
  margin: 0 !important;
}


The file you imported is not for windows min, max, close buttons, but other general x (close) buttons inside the window.

Brummelchen
 
Posts: 4616
Joined: March 19th, 2005, 10:51 am

Post Posted March 26th, 2019, 1:26 pm

there is a small change in addons page beta5 - the wheel and dropdown marker are gone.
"addons_manager_alternative_appearance.css"

Aris

User avatar
 
Posts: 3246
Joined: February 27th, 2011, 10:14 am

Post Posted March 26th, 2019, 1:53 pm

Are you using the latest files? The wheel and dropmarker are still present for me.

Brummelchen
 
Posts: 4616
Joined: March 19th, 2005, 10:51 am

Post Posted March 27th, 2019, 10:19 am

fit again, had 2.4.5v2 at work. thx

Ledragonnantais
 
Posts: 4
Joined: March 27th, 2019, 11:55 am

Post Posted March 27th, 2019, 12:33 pm

Hi Aris. First,thank you for having created the CTR I'm using for years. I have a problem, and my very basic knowledge can't solve it (I'm going to try to summarize has best has I can). Because I hate Quantum interface, I'm still using FF52 ESR for CTR. Since it's a really outdated version, I need to update asap, so I spent the last few days working on a virtual machine with FF66 to see how your CSScustomfix works, and I successfully got back 95% of my actual FF interface and functionalities.
One last thing however is trolling me: the size of the double chevron of "show more bookmarks" (in the very right of the personal tool bar). It's really big compared to my actual FF. I found something in "buttons_on_bookmarks_toolbar_old_size_and_appearance.css" (since it's the setup I use with userchrome.css): the "toolbarbutton-icon width", but the problem is it changes my whole personal toolbar icons size, not the double chevron only. So my question: how can I change it's size to make it really smaller like my old FF without changing other icons size?

Thanks a ton for the help (and to whoever could help me ) :P .

https://ibb.co/6RFfGBr => my actual FF52 with small chevron (size I would like to have, roughly)
https://ibb.co/1T2W1vh => the fat one from FF66 I want to size down.

Aris

User avatar
 
Posts: 3246
Joined: February 27th, 2011, 10:14 am

Post Posted March 27th, 2019, 2:34 pm

Try to change the chevron using this:
Code: Select all
#PlacesChevron .toolbarbutton-icon {
  min-width: 0px !important;
  min-height: 0px !important;
  width: 10px !important;
  height: 10px !important;
  padding: 0 !important;
  margin: 0 !important;
}

Ledragonnantais
 
Posts: 4
Joined: March 27th, 2019, 11:55 am

Post Posted March 27th, 2019, 4:16 pm

Aris wrote:Try to change the chevron using this:
Code: Select all
#PlacesChevron .toolbarbutton-icon {
  min-width: 0px !important;
  min-height: 0px !important;
  width: 10px !important;
  height: 10px !important;
  padding: 0 !important;
  margin: 0 !important;
}


Thanks a ton, but stupid question, where should I put this ?

Oh well I tried by luck in Button.css mentionned previously, and holy cow, it worked. Thanks a lot Aris, you rock :D

Ledragonnantais
 
Posts: 4
Joined: March 27th, 2019, 11:55 am

Post Posted March 29th, 2019, 6:25 am

Hello there. I come back for a small thing I haven't noticed at first. I moved everything from virtual machine to real FF. Works fine, interface is ok, though, there's a thing that constantly catches my eyes on sites having a dark background. A thin grey line on the Tabs Toolbar as you can see here above the red line https://i.ibb.co/1RngZGq/1.jpg It's even more obvious when I changed a few settings in "tabs_below_navigation_toolbar_fx65.css" (since I use tool bar not on top)=> https://i.ibb.co/M8jD1bV/2.jpg After more values change, I think I found a hint: it seems that grey line ends (and becomes really reduced) with the "List all tabs button" => https://i.ibb.co/NS6fr6B/3.jpg which appears if I change the width below 8vw in:
Code: Select all
#TabsToolbar {
  position: absolute !important;
  bottom: 0 !important;
  width: 100vw !important;

but with the price of having ridiculously small, unpractical tabs toolbar.

So my question: Is there a way to completely remove or maybe recolor in deep black that eye catching grey line? Or perhaps moving the "list all tabs button" on the very left of the tabs toolbar, behind actual tab would remove the line? If yes, which line in which CSS should I modify to change that?

Thanks a lot, have a nice day C:

Return to Extension/Theme Releases


Who is online

Users browsing this forum: No registered users and 3 guests