feature symfony#20161 add toolbar & profiler SVG style classes (havvg)

fabpot · fabpot · commit e8553a818eab · 2016-12-02T13:16:34.000+01:00
This PR was submitted for the 2.8 branch but it was merged into the 3.3-dev branch instead (closes symfony#20161). Discussion ---------- add toolbar & profiler SVG style classes | Q | A | | --- | --- | | Bug fix? | no | | New feature? | Technically, yes - but actually not | | BC breaks? | no | | Deprecations? | no | | Tests pass? | yes | | License | MIT | This allows the usage of SVG not only containing `path` elements. I opted for a generic solution using the two classes to apply to any SVG, one would like to use within the toolbar (`sf-toolbar-path`) and/or profiler (`sf-profiler-path`). Commits ------- 155a1fc add toolbar & profiler SVG style classes
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/profiler.css.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/profiler.css.twig
@@ -482,7 +482,8 @@ tr.status-warning td {
     margin-top: -4px;
     vertical-align: middle;
 }
-#header h1 svg path {
+#header h1 svg path,
+#header h1 svg .sf-svg-path {
     fill: #FFF;
 }
 #header .search {
@@ -669,7 +670,8 @@ tr.status-warning td {
     height: 24px;
     max-width: 24px;
 }
-#menu-profiler li a .label .icon svg path {
+#menu-profiler li a .label .icon svg path,
+#menu-profiler li a .label .icon svg .sf-svg-path {
     fill: #DDD;
 }
 #menu-profiler li a .label strong {
@@ -696,7 +698,9 @@ tr.status-warning td {
     color: #FFF;
 }
 #menu-profiler li.selected a .icon svg path,
-#menu-profiler li a:hover .icon svg path {
+#menu-profiler li.selected a .icon svg .sf-svg-path,
+#menu-profiler li a:hover .icon svg path,
+#menu-profiler li a:hover .icon svg .sf-svg-path {
     fill: #FFF;
 }
 
diff --git a/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/toolbar.css.twig b/src/Symfony/Bundle/WebProfilerBundle/Resources/views/Profiler/toolbar.css.twig
@@ -259,11 +259,15 @@
     color: #FFF;
 }
 .sf-toolbar-status-green svg path,
+.sf-toolbar-status-green svg .sf-svg-path,
 .sf-toolbar-status-red svg path,
-.sf-toolbar-status-yellow svg path {
+.sf-toolbar-status-red svg .sf-svg-path,
+.sf-toolbar-status-yellow svg path,
+.sf-toolbar-status-yellow svg .sf-svg-path {
     fill: #FFF;
 }
-.sf-toolbar-block-config svg path {
+.sf-toolbar-block-config svg path,
+.sf-toolbar-block-config svg .sf-svg-path {
     fill: #FFF;
 }
 

Original file line number	Diff line number	Diff line change
`@@ -482,7 +482,8 @@ tr.status-warning td {`
`482`	`482`	`margin-top: -4px;`
`483`	`483`	`vertical-align: middle;`
`484`	`484`	`}`
`485`		`-#header h1 svg path {`
	`485`	`+#header h1 svg path,`
	`486`	`+#header h1 svg .sf-svg-path {`
`486`	`487`	`fill: #FFF;`
`487`	`488`	`}`
`488`	`489`	`#header .search {`
`@@ -669,7 +670,8 @@ tr.status-warning td {`
`669`	`670`	`height: 24px;`
`670`	`671`	`max-width: 24px;`
`671`	`672`	`}`
`672`		`-#menu-profiler li a .label .icon svg path {`
	`673`	`+#menu-profiler li a .label .icon svg path,`
	`674`	`+#menu-profiler li a .label .icon svg .sf-svg-path {`
`673`	`675`	`fill: #DDD;`
`674`	`676`	`}`
`675`	`677`	`#menu-profiler li a .label strong {`
`@@ -696,7 +698,9 @@ tr.status-warning td {`
`696`	`698`	`color: #FFF;`
`697`	`699`	`}`
`698`	`700`	`#menu-profiler li.selected a .icon svg path,`
`699`		`-#menu-profiler li a:hover .icon svg path {`
	`701`	`+#menu-profiler li.selected a .icon svg .sf-svg-path,`
	`702`	`+#menu-profiler li a:hover .icon svg path,`
	`703`	`+#menu-profiler li a:hover .icon svg .sf-svg-path {`
`700`	`704`	`fill: #FFF;`
`701`	`705`	`}`
`702`	`706`
Original file line number	Diff line number	Diff line change
`@@ -259,11 +259,15 @@`
`259`	`259`	`color: #FFF;`
`260`	`260`	`}`
`261`	`261`	`.sf-toolbar-status-green svg path,`
	`262`	`+.sf-toolbar-status-green svg .sf-svg-path,`
`262`	`263`	`.sf-toolbar-status-red svg path,`
`263`		`-.sf-toolbar-status-yellow svg path {`
	`264`	`+.sf-toolbar-status-red svg .sf-svg-path,`
	`265`	`+.sf-toolbar-status-yellow svg path,`
	`266`	`+.sf-toolbar-status-yellow svg .sf-svg-path {`
`264`	`267`	`fill: #FFF;`
`265`	`268`	`}`
`266`		`-.sf-toolbar-block-config svg path {`
	`269`	`+.sf-toolbar-block-config svg path,`
	`270`	`+.sf-toolbar-block-config svg .sf-svg-path {`
`267`	`271`	`fill: #FFF;`
`268`	`272`	`}`
`269`	`273`