Commit 20e56e9

Stephen Peasley <s@stephenpeasley.com>
2015-04-04 18:53:23
Use SVG sprite
1 parent 91a8e9f
Changed files (5)
app/assets/images/feather.svg
@@ -1,1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" width="82.516px" height="266.693px" viewBox="0 0 82.516 266.693" enable-background="new 0 0 82.516 266.693" xml:space="preserve"><g><path d="M33.115 261.74c-0.158-0.806-15.738-75.844-7.023-128.607l3.906 0.431c-8.646 52.4 6.8 132.3 6.9 133.1L33.115 261.7 L33.115 261.74z"/></g><path d="M82.506 52.315C82.17 6.1 65.476-5.724 48 2.364c-0.589 2.923-1.593 6.596-3.17 11.219l-0.027-0.55 c0 0-1.114-3.625-1.972-7.711C27.238 15.9 12.2 41.2 8.9 71.034C0.812 141.791-11.148 199.1 22.2 203.7 c3.646 0.5 6.7 0 6.7 0c9.487-0.842 25.445-0.214 38.289-42.974c2.206-13.826 4.61-30.526 4.11-34.192h-0.018c-1-6.5 2-7 2.5-12.5 s0.5-15.5 3-30s6.5-14 4.5-23C80.554 57.8 81.3 55 82.5 52.315z"/><g><g><path d="M29.497 220.616c0 0-1.179 2.75-5.505 2.224c0 0 3.5 1.4 6.33-1.668L29.497 220.616z"/></g><g><path d="M28.738 219.737c0 0-1.962 3.24-7.292 1.817c0 0 4.2 2.3 8.229-0.976L28.738 219.737z"/></g><g><path d="M27.943 218.501c0 0-3.031 3.717-9.461 0.994c0 0 4.8 3.7 10.5 0.229L27.943 218.501z"/></g><g><path d="M27.163 216.813c0 0-4.454 4.125-12.035-0.42c0 0 5.4 5.5 13.1 2.132L27.163 216.813z"/></g><g><path d="M26.483 214.56c0 0-6.311 4.386-15.012-2.647c0 0 5.8 7.8 16.1 4.98L26.483 214.56z"/></g><g><path d="M26.028 211.616c0 0-8.681 4.386-18.352-5.963c0 0 5.9 10.8 19.2 9.07L26.028 211.616z"/></g><g><path d="M25.976 207.845c0 0-11.654 3.968-21.952-10.708c0 0 5.5 14.6 22.5 14.76L25.976 207.845z"/></g><g><path d="M26.575 203.109c0 0-15.308 2.921-25.63-17.29c0 0 4.4 19.2 25.6 22.47v-5.18H26.575z"/></g></g><path d="M27.49 203.368c0 0 21.6 2.5 31.792-19.5c0 0-9.753 24.198-31.271 24.421L27.49 203.368z"/><g><g><path d="M30.582 225.85c0 0 4.4 3.2 9.979-1.137c0 0-4.058 4.841-10.349 2.624L30.582 225.85z"/></g><g><path d="M30.587 223.619c0 0 5.8 3.7 12.344-2.285c0 0-4.637 6.39-12.675 4.174L30.587 223.619z"/></g><g><path d="M30.4 220.836c0 0 7.6 4 15.191-3.926c0 0-5.225 8.37-15.439 6.311L30.4 220.836z"/></g><g><path d="M29.924 217.383c0 0 9.8 4.4 18.603-6.22c0 0-5.785 10.894-18.704 9.214L29.924 217.383z"/></g><g><path d="M29.03 213.119c0 0 12.6 4.6 22.653-9.378c0 0-6.265 14.088-22.52 13.12L29.03 213.119z"/></g><g><path d="M27.542 207.878c0 0 16.1 4.7 27.43-13.668c0 0-6.582 18.112-26.937 18.323L27.542 207.878z"/></g></g><path d="M30.69 227.048c0 0 2.2 4.3 8.3 3.148c0 0-5.127 2.141-9.147-2.135L30.69 227.048z"/></svg>
\ No newline at end of file
app/assets/images/sprite.svg
@@ -0,0 +1,63 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 14.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 43363)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="feather" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="82.515px" height="266.693px" viewBox="0 0 82.515 266.693" style="enable-background:new 0 0 82.515 266.693;"
+	 xml:space="preserve">
+<g>
+	<path d="M33.115,261.74c-0.158-0.806-15.738-75.844-7.023-128.607l3.906,0.43c-8.646,52.359,6.77,132.328,6.928,133.131
+		L33.115,261.74L33.115,261.74z"/>
+</g>
+<path d="M82.506,52.314C82.169,6.108,65.462-5.734,47.971,2.374c-0.593,2.912-1.6,6.565-3.174,11.16v-0.5
+	c0,0-1.115-3.625-1.972-7.713C27.238,15.903,12.24,41.192,8.851,71.033C0.812,141.791-11.148,199.073,22.19,203.7
+	c3.645,0.506,6.667,0,6.667,0c9.487-0.842,25.445-0.214,38.289-42.974c2.248-13.861,4.699-30.531,4.136-34.192c-1-6.5,2-7,2.5-12.5
+	s0.5-15.5,3-30s6.5-14,4.5-23C80.555,57.76,81.285,54.951,82.506,52.314z"/>
+<g>
+	<g>
+		<path d="M29.497,220.616c0,0-1.179,2.75-5.505,2.224c0,0,3.529,1.371,6.33-1.668L29.497,220.616z"/>
+	</g>
+	<g>
+		<path d="M28.738,219.737c0,0-1.962,3.24-7.292,1.817c0,0,4.183,2.341,8.229-0.975L28.738,219.737z"/>
+	</g>
+	<g>
+		<path d="M27.943,218.501c0,0-3.031,3.717-9.461,0.994c0,0,4.831,3.671,10.486,0.228L27.943,218.501z"/>
+	</g>
+	<g>
+		<path d="M27.163,216.813c0,0-4.454,4.125-12.035-0.42c0,0,5.408,5.452,13.104,2.132L27.163,216.813z"/>
+	</g>
+	<g>
+		<path d="M26.483,214.56c0,0-6.31,4.386-15.012-2.647c0,0,5.819,7.787,16.05,4.98L26.483,214.56z"/>
+	</g>
+	<g>
+		<path d="M26.028,211.616c0,0-8.681,4.386-18.351-5.963c0,0,5.922,10.786,19.241,9.07L26.028,211.616z"/>
+	</g>
+	<g>
+		<path d="M25.976,207.845c0,0-11.654,3.968-21.952-10.708c0,0,5.523,14.564,22.521,14.76L25.976,207.845z"/>
+	</g>
+	<g>
+		<path d="M26.575,203.109c0,0-15.308,2.921-25.63-17.29c0,0,4.357,19.23,25.63,22.47V203.109z"/>
+	</g>
+</g>
+<path d="M27.49,203.368c0,0,21.625,2.5,31.792-19.5c0,0-9.753,24.198-31.271,24.421L27.49,203.368z"/>
+<g>
+	<g>
+		<path d="M30.582,225.85c0,0,4.442,3.239,9.978-1.136c0,0-4.057,4.84-10.348,2.624L30.582,225.85z"/>
+	</g>
+	<g>
+		<path d="M30.587,223.619c0,0,5.821,3.652,12.343-2.285c0,0-4.636,6.389-12.674,4.174L30.587,223.619z"/>
+	</g>
+	<g>
+		<path d="M30.4,220.836c0,0,7.578,4.047,15.192-3.926c0,0-5.225,8.37-15.44,6.31L30.4,220.836z"/>
+	</g>
+	<g>
+		<path d="M29.924,217.383c0,0,9.802,4.386,18.602-6.22c0,0-5.785,10.893-18.704,9.214L29.924,217.383z"/>
+	</g>
+	<g>
+		<path d="M29.03,213.119c0,0,12.605,4.614,22.653-9.378c0,0-6.264,14.088-22.519,13.12L29.03,213.119z"/>
+	</g>
+	<g>
+		<path d="M27.542,207.878c0,0,16.121,4.655,27.429-13.668c0,0-6.582,18.112-26.936,18.323L27.542,207.878z"/>
+	</g>
+</g>
+<path d="M30.69,227.048c0,0,2.161,4.327,8.256,3.148c0,0-5.127,2.141-9.147-2.135L30.69,227.048z"/>
+</svg>
app/assets/stylesheets/global.scss
@@ -24,7 +24,7 @@ header {
   padding: 0.5em 0;
 
   h1 {
-    font-family: 'Playfair Display', sans-serif;
+    font-family: 'Playfair Display', serif;
   }
 
   .svg-container {
@@ -40,8 +40,8 @@ header {
 
 
 nav h1 {
-  font-family: 'PT Sans Narrow', sans-serif;
-  text-transform: uppercase;
+  font-family: 'Playfair Display', serif;
+  text-transform: none;
   white-space: nowrap;
 }
 
app/views/layouts/application.html.erb
@@ -22,7 +22,7 @@
                 <!-- Title Area -->
                 <li class="name">
                   <svg viewBox="0 0 82.515 266.693">
-                    <use xlink:href="<%= asset_path "feather.svg#main" %>"></use>
+                    <use xlink:href="<%= asset_path "sprite.svg#feather" %>"></use>
                   </svg>
                   <h1><%= link_to "Supply Crow", dashboard_path %></h1>
                 </li>
app/views/layouts/public.html.erb
@@ -13,7 +13,7 @@
     <header>
       <div class="row">
         <div class="small-12 columns text-center">
-          <h1>Supply <span class="svg-container"><%= image_tag "feather.svg", alt: "Crow feather", class: "feather" %></span>Crow</h1>
+          <h1>Supply <span class="svg-container"><%= image_tag "sprite.svg#feather", alt: "Crow feather", class: "feather" %></span>Crow</h1>
         </div>
       </div>
     </header>