Move inline svg styles to CSS because of Content Security Policy

carols10cents · carols10cents · commit b0d8c486216e · 2017-08-11T22:49:21.000-04:00
diff --git a/app/styles/app.scss b/app/styles/app.scss
@@ -342,3 +342,11 @@ h1 {
         padding: 5px;
     }
 }
+
+.arrow-in-list svg {
+    background: #fff;
+}
+
+a.arrow svg {
+    background: #EEECDD;
+}
diff --git a/app/templates/components/category-list.hbs b/app/templates/components/category-list.hbs
@@ -3,7 +3,9 @@
         <li>
             {{#link-to 'category' category.slug class='name'}}
                 <span>{{ category.category }} ({{ format-num category.crates_cnt }})</span>
-                {{svg-jar "right-arrow"}}
+                <div class='arrow-in-list'>
+                    {{svg-jar "right-arrow"}}
+                </div>
             {{/link-to}}
         </li>
     {{/each}}
diff --git a/app/templates/components/crate-list.hbs b/app/templates/components/crate-list.hbs
@@ -3,7 +3,9 @@
         <li>
             {{#link-to 'crate' crate.id class='name'}}
                 <span>{{ crate.name }} ({{ crate.max_version }})</span>
-                {{svg-jar "right-arrow"}}
+                <div class='arrow-in-list'>
+                    {{svg-jar "right-arrow"}}
+                </div>
             {{/link-to}}
         </li>
     {{/each}}
diff --git a/app/templates/components/keyword-list.hbs b/app/templates/components/keyword-list.hbs
@@ -3,7 +3,9 @@
         <li>
             {{#link-to 'keyword' keyword class='name'}}
                 <span>{{ keyword.id }} ({{ format-num keyword.crates_cnt }})</span>
-                {{svg-jar "right-arrow"}}
+                <div class='arrow-in-list'>
+                    {{svg-jar "right-arrow"}}
+                </div>
             {{/link-to}}
         </li>
     {{/each}}
diff --git a/app/templates/crate/versions.hbs b/app/templates/crate/versions.hbs
@@ -22,7 +22,7 @@
                 {{/if}}
             </div>
             {{#link-to 'crate.version' version.num class='arrow'}}
-                {{svg-jar "right-arrow" style="background-color: #EEECDD"}}
+                {{svg-jar "right-arrow"}}
             {{/link-to}}
         </div>
     {{/each}}
diff --git a/public/assets/right-arrow.svg b/public/assets/right-arrow.svg
@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="background: #FFFFFF;">
+<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
     <polygon fill="#1A9C5D" points="10 15 10 12 5 12 5 8 10 8 10 5 15 10"></polygon>
 </svg>

Original file line number	Diff line number	Diff line change
`@@ -342,3 +342,11 @@ h1 {`
`342`	`342`	`padding: 5px;`
`343`	`343`	`}`
`344`	`344`	`}`
	`345`	`+`
	`346`	`+.arrow-in-list svg {`
	`347`	`+ background: #fff;`
	`348`	`+}`
	`349`	`+`
	`350`	`+a.arrow svg {`
	`351`	`+ background: #EEECDD;`
	`352`	`+}`