From 202c8487692deac0a9380f3845132b7291285812 Mon Sep 17 00:00:00 2001 From: Brian Grinstead Date: Wed, 10 Jun 2015 12:01:03 -0700 Subject: [PATCH] Bug 1044050 - Update the console sprite sheets to use SVG and new input/output icons;r=past --- browser/themes/linux/jar.mn | 3 +- browser/themes/osx/jar.mn | 3 +- .../shared/devtools/images/webconsole.png | Bin 1943 -> 0 bytes .../shared/devtools/images/webconsole.svg | 101 ++++++++++++++++++ .../shared/devtools/images/webconsole@2x.png | Bin 2633 -> 0 bytes .../shared/devtools/performance.inc.css | 45 ++++---- .../themes/shared/devtools/webconsole.inc.css | 40 ++++--- browser/themes/windows/jar.mn | 3 +- 8 files changed, 145 insertions(+), 50 deletions(-) delete mode 100644 browser/themes/shared/devtools/images/webconsole.png create mode 100644 browser/themes/shared/devtools/images/webconsole.svg delete mode 100644 browser/themes/shared/devtools/images/webconsole@2x.png diff --git a/browser/themes/linux/jar.mn b/browser/themes/linux/jar.mn index 8bed6139aa93..c63405aa652f 100644 --- a/browser/themes/linux/jar.mn +++ b/browser/themes/linux/jar.mn @@ -301,8 +301,7 @@ browser.jar: * skin/classic/browser/devtools/ruleview.css (../shared/devtools/ruleview.css) * skin/classic/browser/devtools/webconsole.css (devtools/webconsole.css) skin/classic/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css) - skin/classic/browser/devtools/webconsole.png (../shared/devtools/images/webconsole.png) - skin/classic/browser/devtools/webconsole@2x.png (../shared/devtools/images/webconsole@2x.png) + skin/classic/browser/devtools/webconsole.svg (../shared/devtools/images/webconsole.svg) skin/classic/browser/devtools/commandline.css (../shared/devtools/commandline.css) skin/classic/browser/devtools/markup-view.css (../shared/devtools/markup-view.css) skin/classic/browser/devtools/editor-error.png (../shared/devtools/images/editor-error.png) diff --git a/browser/themes/osx/jar.mn b/browser/themes/osx/jar.mn index 3b17ceda5850..d040c14343bb 100644 --- a/browser/themes/osx/jar.mn +++ b/browser/themes/osx/jar.mn @@ -419,8 +419,7 @@ browser.jar: skin/classic/browser/devtools/editor-debug-location@2x.png (../shared/devtools/images/editor-debug-location@2x.png) * skin/classic/browser/devtools/webconsole.css (devtools/webconsole.css) skin/classic/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css) - skin/classic/browser/devtools/webconsole.png (../shared/devtools/images/webconsole.png) - skin/classic/browser/devtools/webconsole@2x.png (../shared/devtools/images/webconsole@2x.png) + skin/classic/browser/devtools/webconsole.svg (../shared/devtools/images/webconsole.svg) skin/classic/browser/devtools/breadcrumbs-divider@2x.png (../shared/devtools/images/breadcrumbs-divider@2x.png) skin/classic/browser/devtools/breadcrumbs-scrollbutton.png (../shared/devtools/images/breadcrumbs-scrollbutton.png) skin/classic/browser/devtools/breadcrumbs-scrollbutton@2x.png (../shared/devtools/images/breadcrumbs-scrollbutton@2x.png) diff --git a/browser/themes/shared/devtools/images/webconsole.png b/browser/themes/shared/devtools/images/webconsole.png deleted file mode 100644 index 8aee79015710dbfac7836fb0c0dc4f5ed48e8d65..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1943 zcmV;I2Wa?-P)E zK~z}7#h6`e99I>`f3vgekhm?Yb=GN|Pp6F{A`vx|x>OC_cC8rWheTB2Mo=D#f`Sr< zq@qY5ND+x#1cD-p94fw)BJp$^DY7FR)8dFoD5!v3a3w2MP-399-P#W8;@IB3Gjn*@ zJL}oaCd~u8zS7a|+%t3MoH_shIrm&A9*+-g-n==RNF<03V+>Nf;KLh>-bO1i^D)1n%66jr42YlaW zZf>rs()WFUv%nGH0c*H#jeiR`v+NOATwElV%T-k_E-qqW(+&(-C$Ppp4ooh)1NnTO z+1c5u%6vXw3IC+|k~Lem<5ciKf`E6gj55{o zkuTq-4t#~KWUn=Tx19%goUY`>x==ve1dHOZ;7ge-ii5a`unxQ#sROUxq7L*7wKX!- z)(CK-ZX7O%aKo=I1rg{fC*s!78%_H z+-V&+0Wdh_MIY}0UaL6=62JJ1I2*QBRm#7wVAgH@pgNENUIA!bS>(~Rg_7rc=}Pw3 zb}wWK1fCBux1x&q#7qHTe;I6wUq0MceBSO4aT5T z;tl1Y@d`MTV}l%i^d$yzE^sD-`F3DGUCCYsat8o>f%ZS&v?*L!a}K=eJoRu&))5QJ z>p&oe>&`n5ZwJh^XufV zhP%u0U-&Q6T5p%^>HAEZxC|>F?05J=|8?9 z(amLGC$MOp2#tRz(anhc`aM9Svo4FXE(?&f5vhFy2n=}h)wO{sl>{J&Zj~zP!dC(0 zUxU%7p98*Ma}K=w16NXaxmA_d=X_GD{QD!AFIY!D6yd~|fM)@mds>V9dH-6t#Pf-6 zj@J}IzV9P`0fKT7zYzAsJyFY3!dgQrtRq@$S8II;xN0+6HR!okcU5bBNNequNbGrDRq=fv zrPM9^0j1QWHDC|W*4*4ob8|C5#zq97)ED&k_tW2Bwzu1@weGZ8?x&%nA23q(-Vv>J zXFUAkw>g=+<9=Xra`LwQKm~;Ue`)k~qP0#{z@`Kzt#w*!y)Qhm8y+5Jcz8HmyUj-C zLO9XT&_F{&*{=6BrPLs>!`717JFt1y-n&C7H5d<}QjNr(=iPBX;5ZK1Y!-lX=gvj@ zfiK#oClxvA3rTz&Kq=(|Khj#iY$JED3J-kX=fH8L)b&ytotc>#1Ujpw(V3Zl!p4cgp z$&^X(#7^-*%xVsLAZ873m=4mWla#razj`31ZRvE*JjQMhiqB-o)YSoLZ56rizT$7> zzXxJkNt=rAX~!Pt6?|2PxPWMx_8UUL^6MC~Tr|G7oXgtlj+9}(gLIgIqTG;e+eEf)TXLYe d*gw>A{14mg8HFPC(Z>J)002ovPDHLkV1m%hq2~Yq diff --git a/browser/themes/shared/devtools/images/webconsole.svg b/browser/themes/shared/devtools/images/webconsole.svg new file mode 100644 index 000000000000..6c21e549e904 --- /dev/null +++ b/browser/themes/shared/devtools/images/webconsole.svg @@ -0,0 +1,101 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/browser/themes/shared/devtools/images/webconsole@2x.png b/browser/themes/shared/devtools/images/webconsole@2x.png deleted file mode 100644 index 2d5e97f8815eba2f3772f79ba3d5714033919824..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2633 zcmZ9Oc{tQ-8^?c!v5al9Oz3FFb}W%`8e|`PlPsYuE#}}T9Y(U3%$zZjy<|(4L8z>i zT}C9lhY9bHtV1%5!eB5aZ8Wza@>o0yGLCe-?Q>QXvKV*)n zkHmwy4Kv>qjjR6Ju(IoN7`gc8Hd$v~z~QM(2a6}d#?mx>m`FSy$hR|S9*q)h$JF5nEbnyV{IAYiEn zbUxF56LjSbM5}Alq6!?>(q5DFygYi;v#-8ZVozDUz4Nk}%?06sFuCkzgxPli^ z3rf+Gb9lArt+W&KI=gbdNa!Lp>VDOcD9b7`%TNbEW$qof$J{LJ783tidQ9w=F(g7Z zdaM>lroi1*mntiXd@`^eBhjS_Fi$ z?uD7WV_$E>2$F!bfQx1WH>;OyF8WM<2y&GDAr(yKBPT+GD0h9}jFnHyAKCmc0tlS| zo!ARiNHlN|1TLn)2oi)-Eo#NvwV_GIoN!Web|tw{hto17 zQJob`Go16R?K2T%{UQob?t*LBjnIE52w>`p@A*wJ44C6;xf>hjMz+i>7-{cklXn)2 znK;l)-tfb^M3+G?fH+kQfV3#~R#T z+<&*e4L4kRC}g7Fu_Y7;k%ETlv?`{lz^S>-Wp9FH=Nc9+bpeA9umL6Mn%DV#>2wZo zzPEoaUh>rHdLO;S*$Oh{E7p5+chX7lz#RMaObcCT`ON*}>X_B@nf?*Cl2I%+fO>(t zeeb+EzHmvuEZQWs%X8K_CO?(vm0kGwd#9q-6^uoLCJ|IDCQ`)`v z)F4(|X$0nH#_;g!h=+EGz1{ThGG2#PY@`I)woT{m&l~v&SeRUBF z62~uY{C;pcwdE<3;WxN1DSYcFf+vkCXbU%pro)Po_&hx|y5ILOzkvR#yglb4JIEe? z*X{Jl`F?x$;tCUa0eo@=$>!44yZWsZqvq|n+7kyu{Jp)sg6it(VKf>I_3+FcsiwDb zsax9->mP0R*}#aMsU))bD`*B>Q)Gd^eDf$ay*+%%RqApGF)|PLg41?+RJSDuj`s0b zZ$v;m|>>(+>&CcK3sajA%-eZ~^IeudDo8 zA`=^p`WKW5W<9>g5MSJ!pQkq($+Y>&Q3cslDDu5uTsHm`35zT)Jp(1<(B|;Xi6hwW z5h1&ai+_06oIe|_?Q_6-W7Y5fTkx8fv(>I?#yAN2x1U&VCK==g5gb*6-O9^=WI-(R z;P2g^T-Y=!-i`s%ja$tWhD47JY{^Ocw#k#4d^YmXz%xpZxdMc6iK&O0ktF(3hBec; z)}Hu6-P!tJ2KDz@C#~5XzNL72HRqe& zdBY(?fRG8_{)He$@m-4 z#fbnO&cpYv(Y4dvu7RtnLEhJRpCER#iyrmqL%6YH$V{89hlj_~@^Uqc`PRf<+ggSH zIx>>3YrUS5_bygVuS!sLZi_SoUKmx0EHgBWi0Tq<7p*9DvXo+;ewoeL9^& z=#)#e>FI)1?;8<8y^bBJ)RsFT_GR3SNYs=T5>^n|!u9;X)Ed-SnT!X`N3K{#i0R^sD z>{CL)z3!$VIe}T{){a}FOU$Py6=%NDg&H`U){lJ4J51JM2(kqOHHm{3EkGHAFunQGaY{+3QmK>IJ*Stl^3D@b z0KA2}7%4m3ML)<eoLif`xOlC&?Co#kVn#3JHQkAc_!XSMBFf!GxDlDvb-_AK+wy<6Y*Lr_sx zzCAcwbf}3mZvc@M_7$l7(1!QY+uka6`Sytpdfn`d-FmRrF8V^JL%!Ljhs6&i22mtH zhImd#k?ARYPDe5A%ay~|ZrsE_8vwW7mL$)vTt)fJrc1m$N1&xgf!$V@%|+~BXjG{I eB9eY!KG#`62^co7wG8Bqhycdc$)?r{OZ*Sm^zqUF diff --git a/browser/themes/shared/devtools/performance.inc.css b/browser/themes/shared/devtools/performance.inc.css index 933e92b154b2..3f45e2e5a777 100644 --- a/browser/themes/shared/devtools/performance.inc.css +++ b/browser/themes/shared/devtools/performance.inc.css @@ -639,25 +639,24 @@ menuitem.marker-color-graphs-blue:before, #jit-optimizations-view .opt-icon::before { content: ""; - background-image: url(chrome://browser/skin/devtools/webconsole.png); + background-image: url(chrome://browser/skin/devtools/webconsole.svg); background-repeat: no-repeat; - background-size: 48px 40px; - margin: 5px 6px 0 0; - width: 8px; - height: 8px; - max-height: 8px; + background-size: 72px 60px; + width: 12px; + height: 12px; display: inline-block; + + margin: 5px 6px 0 0; + max-height: 12px; +} +.theme-light #jit-optimizations-view .opt-icon::before { + background-image: url(chrome://browser/skin/devtools/webconsole.svg#light-icons); } #jit-optimizations-view .opt-icon[severity=warning]::before { - background-position: -16px -16px; + background-position: -24px -24px; } -@media (min-resolution: 1.25dppx) { - #jit-optimizations-view .opt-icon::before { - background-image: url(chrome://browser/skin/devtools/webconsole@2x.png); - } -} /** * Configurable Options @@ -671,21 +670,21 @@ menuitem.marker-color-graphs-blue:before, */ menuitem.experimental-option::before { content: ""; - background-image: url(chrome://browser/skin/devtools/webconsole.png); + background-image: url(chrome://browser/skin/devtools/webconsole.svg); background-repeat: no-repeat; - background-size: 48px 40px; - margin: 2px 5px 0 0; - width: 8px; - height: 8px; - max-height: 8px; + background-size: 72px 60px; + width: 12px; + height: 12px; display: inline-block; - background-position: -16px -16px; + + background-position: -24px -24px; + margin: 2px 5px 0 0; + max-height: 12px; } -@media (min-resolution: 1.25dppx) { - menuitem.experimental-option::before { - background-image: url(chrome://browser/skin/devtools/webconsole@2x.png); - } +.theme-light menuitem.experimental-option::before { + background-image: url(chrome://browser/skin/devtools/webconsole.svg#light-icons); } + #performance-options-menupopup:not(.experimental-enabled) .experimental-option, #performance-options-menupopup:not(.experimental-enabled) .experimental-option::before { display: none; diff --git a/browser/themes/shared/devtools/webconsole.inc.css b/browser/themes/shared/devtools/webconsole.inc.css index 5d315bb249b5..16b70853d8bd 100644 --- a/browser/themes/shared/devtools/webconsole.inc.css +++ b/browser/themes/shared/devtools/webconsole.inc.css @@ -44,19 +44,17 @@ a { .message > .icon::before { content: ""; - background-image: url(chrome://browser/skin/devtools/webconsole.png); - background-position: 8px 8px; + background-image: url(chrome://browser/skin/devtools/webconsole.svg); + background-position: 12px 12px; background-repeat: no-repeat; - background-size: 48px 40px; - width: 8px; - height: 8px; + background-size: 72px 60px; + width: 12px; + height: 12px; display: inline-block; } -@media (min-resolution: 1.25dppx) { - .message > .icon::before { - background-image: url(chrome://browser/skin/devtools/webconsole@2x.png); - } +.theme-light .message > .icon::before { + background-image: url(chrome://browser/skin/devtools/webconsole.svg#light-icons); } .message > .message-body-wrapper { @@ -228,7 +226,7 @@ a { } .message[category=network][severity=error] > .icon::before { - background-position: -8px 0; + background-position: -12px 0; } .message[category=network] > .message-body { @@ -285,11 +283,11 @@ a { } .message[category=cssparser][severity=error] > .icon::before { - background-position: -8px -8px; + background-position: -12px -12px; } .message[category=cssparser][severity=warn] > .icon::before { - background-position: -16px -8px; + background-position: -24px -12px; } /* JS styles */ @@ -303,11 +301,11 @@ a { } .message[category=exception][severity=error] > .icon::before { - background-position: -8px -16px; + background-position: -12px -24px; } .message[category=exception][severity=warn] > .icon::before { - background-position: -16px -16px; + background-position: -24px -24px; } /* Web Developer styles */ @@ -322,15 +320,15 @@ a { .message[category=console][severity=error] > .icon::before, .message[category=output][severity=error] > .icon::before { - background-position: -8px -24px; + background-position: -12px -36px; } .message[category=console][severity=warn] > .icon::before { - background-position: -16px -24px; + background-position: -24px -36px; } .message[category=console][severity=info] > .icon::before { - background-position: -24px -24px; + background-position: -36px -36px; } /* Input and output styles */ @@ -340,11 +338,11 @@ a { } .message[category=input] > .icon::before { - background-position: -32px -24px; + background-position: -48px -36px; } .message[category=output] > .icon::before { - background-position: -40px -24px; + background-position: -60px -36px; } /* JSTerm Styles */ @@ -411,11 +409,11 @@ a { } .message[category=security][severity=error] > .icon::before { - background-position: -8px -32px; + background-position: -12px -48px; } .message[category=security][severity=warn] > .icon::before { - background-position: -16px -32px; + background-position: -24px -48px; } .navigation-marker { diff --git a/browser/themes/windows/jar.mn b/browser/themes/windows/jar.mn index 0eda1d7d7088..a543f31c1c1a 100644 --- a/browser/themes/windows/jar.mn +++ b/browser/themes/windows/jar.mn @@ -400,8 +400,7 @@ browser.jar: skin/classic/browser/devtools/editor-debug-location@2x.png (../shared/devtools/images/editor-debug-location@2x.png) * skin/classic/browser/devtools/webconsole.css (devtools/webconsole.css) skin/classic/browser/devtools/webconsole_networkpanel.css (devtools/webconsole_networkpanel.css) - skin/classic/browser/devtools/webconsole.png (../shared/devtools/images/webconsole.png) - skin/classic/browser/devtools/webconsole@2x.png (../shared/devtools/images/webconsole@2x.png) + skin/classic/browser/devtools/webconsole.svg (../shared/devtools/images/webconsole.svg) skin/classic/browser/devtools/breadcrumbs-divider@2x.png (../shared/devtools/images/breadcrumbs-divider@2x.png) skin/classic/browser/devtools/breadcrumbs-scrollbutton.png (../shared/devtools/images/breadcrumbs-scrollbutton.png) skin/classic/browser/devtools/breadcrumbs-scrollbutton@2x.png (../shared/devtools/images/breadcrumbs-scrollbutton@2x.png)