Export to GitHub

fbug - issue #5438

Allow jumping from web font usage in Style side panel to its definition


Posted on May 3, 2012 by Happy Giraffe

What should be implemented/improved? When a web font (WOFF) is used inside a page it could help to see where it comes from. Therefore we should consider to create an option to jump from the web font usage inside a 'font' or 'font-family' property to the @font-face rule where it's defined.

Test case: 1. Open Firebug on http://getfirebug.com 2. Switch to the HTML panel and there to the Style side panel 3. Inspect the slogan "Web Development Evolved." (<h2>) => The Style side panel will list a CSS rule "h1, h2, h3, h4" 4. Right-click on "TitilliumMaps" and choose "Inspect Definition" (not existing yet)

=> Firebug should switch to the CSS panel and highlight the following rule:

@font-face { font-family: "TitilliumMaps"; src: local("☺"), url("../fonts/TitilliumMaps26L002.woff") format("woff"), url("../fonts/TitilliumMaps26L002.ttf") format("truetype"); }

Sebastian

Comment #1

Posted on May 3, 2012 by Happy Giraffe

Did that for the Style side panel in https://github.com/firebug/firebug/commit/7c8e5305bb877577181257d33d038d3251b69dd1. Translated in https://github.com/firebug/firebug/commit/5a3f2fd3567b0c76c959f5de5dae44e247ebcca7.

Moved the part for the CSS panel to issue 5439.

Sebastian

Comment #2

Posted on May 11, 2012 by Massive Wombat

This issue (one of 25) has been fixed in Firebug 1.10a8 http://getfirebug.com/releases/firebug/1.10/firebug-1.10.0a8.xpi

Please try it and let us know whether it works for you.

Thanks! Honza

Comment #3

Posted on May 30, 2012 by Helpful Wombat

FBTest added in https://github.com/firebug/firebug/commit/e3aec7668a8ca6e83b8c554faa432e7a583d85af.

Sebastian

Comment #4

Posted on May 30, 2012 by Helpful Wombat

(No comment was entered for this change.)

Comment #5

Posted on Jul 9, 2013 by Helpful Wombat

Added description for this at https://getfirebug.com/wiki/index.php/Style_Side_Panel#Context_Menu.

Sebastian

Status: Fixed

Labels:
Type-Enhancement css 1.10-a7 Test-case-available FBTest-available doc-available fixed-1.10-a8