FontSize control in Firebug3?

78 views
Skip to first unread message

pdev

unread,
Sep 12, 2016, 9:13:21 AM9/12/16
to Firebug
I've installed Firebug 'next' (3b3) in Firefox DevEd (50a2).

Where's the control/option for increasing the FB console display's FontSize?


Sebastian Zartner

unread,
Sep 12, 2016, 2:32:10 PM9/12/16
to Firebug
Firebug 3 is integrated in Firefox as a theme for the DevTools starting from version 48. So there is no need anymore to install it separately. Just go to the DevTools settings and under Themes you can switch to the Firebug theme.

The font size there can be increased with Ctrl++, decreased with Ctrl+- and reset with Ctrl+0 while the DevTools are focused.

Sebastian

pdev

unread,
Sep 12, 2016, 7:22:38 PM9/12/16
to Firebug


Firebug 3 is integrated in Firefox as a theme for the DevTools starting from version 48. So there is no need anymore to install it separately. Just go to the DevTools settings and under Themes you can switch to the Firebug theme.

Got it. Thx.
 
The font size there can be increased with Ctrl++, decreased with Ctrl+- and reset with Ctrl+0 while the DevTools are focused.

Yep, works.  Not ideal, IMO.  All the fonts scale up or down *together* (is there an alternative?), so you either end up with some interface fonts too small, or others too large.

Is this CSS-stylable somewhere?  I'd like to set my preferred-defaults -- for each 'section' of the Tools' interface -- and leave it at that.

Lawrence San

unread,
Sep 12, 2016, 11:41:27 PM9/12/16
to fir...@googlegroups.com
I didn't realize this major change had happened already. I disabled
Firebug (the extension) and enabled it as a theme, as you suggested.

One difference I noticed immediately is that there's no more Firebug
button in my toolbar. Of course I can open the console without it, but
I liked having the little button turn orange when I hit the f12 key,
and then turn gray when I hit shift-f12, telling me that Firebug was
off. Is there no way to turn "off" the developer tools now? Does
simply closing the console window completely turn them off? (Sometimes
it makes a functional difference in how code runs, although it
shouldn't -- it's not just a question of whether the console is
showing or not.)

I also miss the little Inspector button that I had in the toolbar next
to the Firebug button. I see the same icon in the upper-left of the
console window, and it sort of works, but somewhat erratically. Or I
can just use the context menu to "Inspect Element"... but that doesn't
switch on an inspect mode, it's just a one-time action. Is there any
way to get the Inspect button back in my toolbar to toggle an "inspect
mode" like before?

I realize these are very minor concerns, just little interface things. Thanks.
> --
> You received this message because you are subscribed to the Google Groups
> "Firebug" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to firebug+u...@googlegroups.com.
> To post to this group, send email to fir...@googlegroups.com.
> Visit this group at https://groups.google.com/group/firebug.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/firebug/1def8598-f132-4e1b-a0e6-cb5f4068475c%40googlegroups.com.
> For more options, visit https://groups.google.com/d/optout.



--
Lawrence San
Business Writing: Santhology.com
Cartoon Stories for Thoughtful People: Sanstudio.com

Sebastian Zartner

unread,
Sep 13, 2016, 3:32:04 AM9/13/16
to Firebug
On Tuesday, September 13, 2016 at 1:22:38 AM UTC+2, pdev wrote:
The font size there can be increased with Ctrl++, decreased with Ctrl+- and reset with Ctrl+0 while the DevTools are focused.

Yep, works.  Not ideal, IMO.  All the fonts scale up or down *together* (is there an alternative?), so you either end up with some interface fonts too small, or others too large.

As far as I know, this is the only way to scale them. If you think the font sizes don't fit when zooming, I suggest you file a bug.

Is this CSS-stylable somewhere?  I'd like to set my preferred-defaults -- for each 'section' of the Tools' interface -- and leave it at that.

They can probably be styled using Stylish, but I never tried that.

Sebastian

Sebastian Zartner

unread,
Sep 13, 2016, 3:55:00 AM9/13/16
to Firebug
On Tuesday, September 13, 2016 at 5:41:27 AM UTC+2, San wrote:
I didn't realize this major change had happened already. I disabled
Firebug (the extension) and enabled it as a theme, as you suggested.

One difference I noticed immediately is that there's no more Firebug
button in my toolbar. Of course I can open the console without it, but
I liked having the little button turn orange when I hit the f12 key,
and then turn gray when I hit shift-f12, telling me that Firebug was
off. Is there no way to turn "off" the developer tools now? Does
simply closing the console window completely turn them off? (Sometimes
it makes a functional difference in how code runs, although it
shouldn't -- it's not just a question of whether the console is
showing or not.)

As far as I know, the DevTools don't have an option to minimize them like Firebug has it and when you close them, they are off.
It looks like they had a minimize button earlier, though, which might get reimplemented at some point. See bug 1178218.

I also miss the little Inspector button that I had in the toolbar next
to the Firebug button. I see the same icon in the upper-left of the
console window, and it sort of works, but somewhat erratically. Or I
can just use the context menu to "Inspect Element"... but that doesn't
switch on an inspect mode, it's just a one-time action. Is there any
way to get the Inspect button back in my toolbar to toggle an "inspect
mode" like before?

The inspector feature in the DevTools works pretty much the same way as within Firebug. I.e. you can right-click an element within the page and choose Inspect Element (one-time action), or you can switch to the inspect mode by clicking the inspector button in the upper-left corner of the DevTools' toolbar. Then you can hover the elements within the page and when you click an element it gets selected within the source view.

I realize these are very minor concerns, just little interface things. Thanks.

Note that I am not part of the DevTools team, so I'm answering as a user. Documentation for them is available at MDN. And if you have questions about them, you should ask them on IRC or ask on Stack Overflow.

Sebastian

Sebastian Zartner

unread,
Sep 13, 2016, 4:34:02 AM9/13/16
to Firebug
Regarding the toolbar buttons I've created bug 1302361 and bug 1302363 now.

Sebastian

pdev

unread,
Sep 13, 2016, 11:08:11 AM9/13/16
to Firebug


On Tuesday, September 13, 2016 at 12:32:04 AM UTC-7, Sebastian Zartner wrote:
Is this CSS-stylable somewhere?  I'd like to set my preferred-defaults -- for each 'section' of the Tools' interface -- and leave it at that.

They can probably be styled using Stylish, but I never tried that.

Good idea.  I hadn't used it either, but looks like someone already took a stab:

https://userstyles.org/styles/131076/firefox-devtools-dark-theme-pre-ff49

Good starting point ...

Thx.

kylek...@gmail.com

unread,
Feb 16, 2017, 11:05:37 AM2/16/17
to Firebug
Just want to reiterate, firebug 3 font-size seems to be a problem.
Either the buttons are all jammed up, or the content/code/etc are way too small.
It sounds like a big reason for the change to an integrated model was the multi-core support of newer firefox versions - cool.
A usable UI seems pretty critical,seems like it should have a very high priority.

alfonsoml

unread,
Feb 16, 2017, 4:29:01 PM2/16/17
to Firebug

Firebug 3 is dead.
What you are using now it's Firefox DevTools, and those developers don't look at this group so they won't ever read your message or be aware of your problems.

kylepwarren

unread,
Feb 16, 2017, 6:50:41 PM2/16/17
to Firebug
dead? or you just don't like it? Seriously, I want to know. I haven't seen a very detailed explanation of why it changed so much? link please? Is it "firebug 3" like my addons section says or "firebug.next", or did mozilla just buy the name or something? Also I noticed a github with firebug 2.0.19 is updated recently.. what's going on?

Erik Krause

unread,
Feb 17, 2017, 9:01:11 AM2/17/17
to fir...@googlegroups.com
Am 17.02.2017 um 00:50 schrieb kylepwarren:
> dead? or you just don't like it? Seriously, I want to know. I haven't seen
> a very detailed explanation of why it changed so much? link please? Is it
> "firebug 3" like my addons section says or "firebug.next", or did mozilla
> just buy the name or something? Also I noticed a github with firebug 2.0.19
> is updated recently.. what's going on?

Well, this was announced more than a year ago:
https://hacks.mozilla.org/2015/10/firebug-devtools-integration/

However, find the facts here:
https://hacks.mozilla.org/2016/12/firebug-lives-on-in-firefox-devtools/

Here is a migration guide:
https://developer.mozilla.org/en-US/docs/Tools/Migrating_from_Firebug

--
Erik Krause
Reply all
Reply to author
Forward
0 new messages