Merge pull request #49 from Dan-Ste/feature/footer-icons

Footer icons

.gitignore

@@ -16,6 +16,7 @@
 npm-debug.log*
 yarn-error.log
 testem.log
+jsconfig.json
 
 # ember-try
 .node_modules.ember-try/

addon/styles/_es-footer.scss

@@ -122,11 +122,11 @@
   flex: 1 0 11em;
 }
 
-.footer .footer-contributions .logo-heroku {
+.footer .footer-contributions .heroku-logo {
   max-height: 35px;
 }
 
-.footer .footer-contributions .logo-fastly {
+.footer .footer-contributions .fastly-logo {
   max-height: 45px;
 }
 

addon/templates/components/es-footer.hbs

@@ -1,5 +1,6 @@
 <div class="footer responsive">
   <div class="container">
+
     <div class="footer-info">
       Copyright {{currentYear}}
       <a href="http://tilde.io">Tilde Inc.</a>
@@ -19,68 +20,13 @@
       <p class="footer-tagline">Ember.js is free, open source and always will be.</p>
       <div class="footer-social">
         <a href="http://twitter.com/emberjs" title="Twitter">
-          <svg
-            xmlns:dc="http://purl.org/dc/elements/1.1/"
-            xmlns:cc="http://creativecommons.org/ns#"
-            xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-            xmlns:svg="http://www.w3.org/2000/svg"
-            xmlns="http://www.w3.org/2000/svg"
-            version="1.1"
-            id="svg4169"
-            viewBox="0 0 1000 1000">
-            <defs
-              id="defs4171" />
-            <metadata
-              id="metadata4174">
-              <rdf:RDF>
-                <cc:Work
-                  rdf:about="">
-                  <dc:format>image/svg+xml</dc:format>
-                  <dc:type
-                    rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
-                  <dc:title></dc:title>
-                </cc:Work>
-              </rdf:RDF>
-            </metadata>
-            <g
-              id="layer1">
-              <path
-                id="path4717"
-                d="m 939.5,227.94118 q -37,54 -90,93 0,8 0,23 0,73 -21,145 -21,72 -64,139 -43,67 -103,117 -60,50 -144,82 -84,32 -181,30 -151,0 -276,-81 19,2 43,2 126,0 224,-77 -59,-1 -105,-36 -46,-35 -64,-89 19,3 34,3 24,0 48,-6 -63,-13 -104,-62 -41,-49 -41,-115 l 0,-2 q 38,21 82,23 -37,-25 -59,-64 -22,-39 -22,-86 0,-49 25,-91 68,83 164,133 96,50 208,55 -5,-21 -5,-41 0,-75 53,-127 53,-52 127,-53 79,0 132,57 61,-12 115,-44 -21,64 -80,100 52,-6 104,-28 z" />
-            </g>
-          </svg>
+          {{svg-jar "twitter-logo"}}
         </a>
         <a href="https://github.com/emberjs/ember.js" title="GitHub">
-          <svg
-            xmlns:dc="http://purl.org/dc/elements/1.1/"
-            xmlns:cc="http://creativecommons.org/ns#"
-            xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-            xmlns:svg="http://www.w3.org/2000/svg"
-            xmlns="http://www.w3.org/2000/svg"
-            version="1.1"
-            id="svg4169"
-            viewBox="0 0 1000 1000">
-            <defs
-              id="defs4171" />
-            <metadata
-              id="metadata4174">
-              <rdf:RDF>
-                <cc:Work
-                  rdf:about="">
-                  <dc:format>image/svg+xml</dc:format>
-                  <dc:type
-                    rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
-                  <dc:title></dc:title>
-                </cc:Work>
-              </rdf:RDF>
-            </metadata>
-            <g
-              id="layer1">
-              <path
-                id="path4717"
-                d="m 392,643 q 0,22 -7,45 -7,23 -24,43 -17,20 -40,19 -23,-1 -41,-19 -18,-18 -24,-43 -6,-25 -7,-45 -1,-20 7,-46 8,-26 24,-43 16,-17 41,-19 25,-2 40,19 15,21 24,43 9,22 7,46 z m 357,0 q 0,22 -7,45 -7,23 -24,43 -17,20 -40,19 -23,-1 -41,-19 -18,-18 -24,-43 -6,-25 -7,-45 -1,-20 7,-46 8,-26 24,-43 16,-17 41,-19 25,-2 40,19 15,21 24,43 9,22 7,46 z m 90,0 q 0,-67 -39,-114 -39,-47 -104,-47 -23,0 -109,12 -40,6 -88,6 -48,0 -87,-6 -85,-12 -109,-12 -66,0 -104,47 -38,47 -39,114 0,49 18,85 18,36 45,58 27,22 68,33 41,11 78,17 37,6 83,4 l 94,0 q 46,0 83,-4 37,-4 78,-17 41,-13 69,-33 28,-20 45,-58 17,-38 18,-85 z m 125,-99 q 0,116 -34,185 -22,43 -59,74 -37,31 -79,48 -42,17 -95,27 -53,10 -96,12 -43,2 -93,3 -43,0 -79,-2 -36,-2 -82,-7 -46,-5 -85,-17 Q 223,855 185,838 147,821 118,793 89,765 70,729 35,660 35,544 35,412 111,323 96,278 96,228 q 0,-64 28,-121 61,0 106,22 45,22 106,69 82,-20 172,-20 83,0 157,18 58,-46 104,-67 46,-21 105,-22 29,57 29,121 0,49 -15,94 76,89 76,222 z" />
-            </g>
-          </svg>
+          {{svg-jar "github-logo"}}
+        </a>
+        <a href="https://ember-community-slackin.herokuapp.com/" title="Slack">
+          {{svg-jar "slack-logo"}}
         </a>
       </div>
     </div>
@@ -89,13 +35,13 @@
       <div class="contributor">
         <p>Hosted by:</p>
         <a href="https://www.heroku.com/emberjs">
-          <svg class="logo-heroku" alt="heroku logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 72.5 80.5"><defs><style>.cls-1{fill:#999;}</style></defs><g id="black"><path class="cls-1" d="M65.05.25H7.45a7.2,7.2,0,0,0-7.2,7.2v65.6a7.2,7.2,0,0,0,7.2,7.2h57.6a7.2,7.2,0,0,0,7.2-7.2V7.45A7.2,7.2,0,0,0,65.05.25Zm-46.8,68v-16l9,8Zm28,0V44.36c0-1.87-.94-4.11-5-4.11-8.13,0-17.26,4.09-17.35,4.13l-5.65,2.56V12.25h8V35a50.63,50.63,0,0,1,15-2.71c4.94,0,7.9,1.94,9.52,3.57a12.48,12.48,0,0,1,3.48,8.43v24Zm2-43h-8a31.1,31.1,0,0,0,6-13h8A23.44,23.44,0,0,1,48.25,25.25Z"/></g></svg>
+          {{svg-jar "heroku-logo" class="heroku-logo"}}
         </a>
       </div>
       <div class="contributor">
         <p>CDN provided by:</p>
         <a href="https://www.fastly.com">
-          <svg class="logo-fastly" alt="fastly logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1626 640"><defs><style>.cls-1{fill:#999;}</style></defs><polygon class="cls-1" points="1105.2 71.3 1105.2 492.4 1231.6 492.4 1231.6 428.1 1189.8 428.1 1189.8 7.2 1105.1 7.2 1105.2 71.3"/><path class="cls-1" d="M6.9,428.1h43V224.9H6.9V169l43-7.1V105.3c0-68.5,14.9-98.2,102.3-98.2,18.9,0,41.2,2.8,60.8,6.3L201.4,82.3c-13.3-2.1-19.8-2.5-28.2-2.5-30.8,0-38.6,3.1-38.6,33.1V162h63.9v62.9H134.6V428h42.5v64.3H6.9Z"/><path class="cls-1" d="M1062.1,407.7c-13.2,2.8-24.8,2.5-33.2,2.7-34.8.9-31.8-10.6-31.8-43.5v-142h66.3V162H997V7.2H912.3V384.5c0,74.1,18.3,107.9,98,107.9,18.9,0,44.8-4.9,64.4-9Z"/><path class="cls-1" d="M1588.2,428.4a32,32,0,1,1-32.1,32,31.95,31.95,0,0,1,32.1-32m0,58.9a26.75,26.75,0,1,0,0-53.5,26.75,26.75,0,0,0,0,53.5m5.9-11.2-6.5-9.5h-4.5v9.5h-7.2V444.7H1589c7.8,0,12.6,3.9,12.6,10.9,0,5.1-2.6,8.6-6.6,9.8l7.8,10.8h-8.7Zm-10.9-15.8h5.7c3.3,0,5.5-1.3,5.5-4.7s-2.2-4.6-5.3-4.6h-5.9v9.3Z"/><path class="cls-1" d="M806.6,224.8V213.5c-25.6-4.7-51.1-4.7-64.9-4.7-39.4,0-44.2,20.9-44.2,32.2,0,16,5.5,24.7,48.2,34,62.4,14,125.1,28.6,125.1,106,0,73.4-37.8,111.3-117.3,111.3-53.2,0-104.8-11.4-144.2-21.4V407.7h64.1v11.2c27.6,5.3,56.5,4.8,71.6,4.8,42,0,48.8-22.6,48.8-34.6,0-16.7-12.1-24.7-51.5-32.7-74.2-12.7-133.2-38-133.2-113.5,0-71.4,47.7-99.4,127.3-99.4,53.9,0,94.8,8.4,134.2,18.4v62.8h-64Z"/><path class="cls-1" d="M416.9,280.4l-6.4-6.4-32.7,28.5a15.53,15.53,0,0,0-5.3-.9,16.4,16.4,0,1,0,16,16.4,19.32,19.32,0,0,0-.7-4.9Z"/><path class="cls-1" d="M546.6,407.7l-.1-263.6H461.8v24.7A173.6,173.6,0,0,0,404.2,147h.5V117.8H415V96.3H329.7v21.5H340V147h.6A174.1,174.1,0,1,0,462,467.4l15.3,24.9h89.5V407.6H546.6Zm-169.1-.1v-10H367.4v9.9a89.59,89.59,0,0,1-84.2-84.7h10.1V312.7h-10a89.55,89.55,0,0,1,84.1-84v10h10.1v-10a89.67,89.67,0,0,1,84.4,81.5v2.9H451.7v10.1h10.2V326A89.6,89.6,0,0,1,377.5,407.6Z"/><path class="cls-1" d="M1446,162h174.7v62.9h-41.8L1471.8,488.5c-30.7,74-81.1,143.7-157.9,143.7-18.9,0-44-2.1-61.5-6.3l7.7-76.9a218.08,218.08,0,0,0,33.5,3.5c35.6,0,75.8-22.1,88.4-60.5L1273.4,224.9h-41.8V162h174.8v62.9h-41.7l61.5,151.3h0l61.5-151.3H1446Z"/></svg>
+          {{svg-jar "fastly-logo" class="fastly-logo"}}
         </a>
       </div>
     </div>

ember-cli-build.js

@@ -9,6 +9,11 @@ module.exports = function(defaults) {
       'importBootstrapFont': false,
       'importBootstrapCSS': false
     },
+    svgJar: {
+      sourceDirs: [
+        'tests/dummy/public/assets/images/icons'
+      ]
+    }
   });
 
   /*

package.json

@@ -26,6 +26,7 @@
     "ember-cli-babel": "^6.6.0",
     "ember-cli-htmlbars": "^2.0.1",
     "ember-cli-sass": "^7.1.4",
+    "ember-svg-jar": "^1.1.1",
     "ember-truth-helpers": "^2.0.0"
   },
   "devDependencies": {

tests/integration/components/es-footer-test.js

@@ -14,7 +14,7 @@ test('it renders', function(assert) {
   const footerStyle = window.getComputedStyle(footer, null);
   const footerBgColor = footerStyle.getPropertyValue('background-color');
 
-  assert.equal(footerSocialLinks.length, 2, 'social links are loading');
+  assert.equal(footerSocialLinks.length, 3, 'social links are loading');
   assert.equal(footerContribtuionsLinks.length, 2, 'contributors links are loading');
   assert.equal(footerBgColor, 'rgb(242, 236, 233)', 'background color is rendering');
 });