From a2aab3576eac95f7fd33a3c7865b68fce8300e52 Mon Sep 17 00:00:00 2001
From: Igor Guastalla de Lima <igor.lima@sabium.com.br>
Date: Fri, 8 Feb 2019 12:44:35 -0200
Subject: [PATCH 1/3] feat(index.html): changed img from gravatar to 8bit
 avatar. add alt.

---
 index.html | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index 1b5ead2..5e2947b 100644
--- a/index.html
+++ b/index.html
@@ -99,14 +99,14 @@
     <section class="nes-container with-title">
       <h2 class="title">Avatars</h2>
       <div>
-        <img src="https://www.gravatar.com/avatar" class="nes-avatar is-small">
-        <img src="https://www.gravatar.com/avatar" class="nes-avatar">
-        <img src="https://www.gravatar.com/avatar" class="nes-avatar is-medium">
-        <img src="https://www.gravatar.com/avatar" class="nes-avatar is-large">
-        <img src="https://www.gravatar.com/avatar" class="nes-avatar is-small is-rounded">
-        <img src="https://www.gravatar.com/avatar" class="nes-avatar is-rounded">
-        <img src="https://www.gravatar.com/avatar" class="nes-avatar is-medium is-rounded">
-        <img src="https://www.gravatar.com/avatar" class="nes-avatar is-large is-rounded">
+        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-small" alt="8bit Avatar Example">
+        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar" alt="8bit Avatar Example">
+        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-medium" alt="8bit Avatar Example">
+        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-large" alt="8bit Avatar Example">
+        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-small is-rounded" alt="8bit Avatar Example">
+        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-rounded" alt="8bit Avatar Example">
+        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-medium is-rounded" alt="8bit Avatar Example">
+        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-large is-rounded" alt="8bit Avatar Example">
       </div>
     </section>
 

From 56c7fef55a3c32339cf9f4f162d7515de8e7cd81 Mon Sep 17 00:00:00 2001
From: Igor Guastalla de Lima <limaguastallaigor@gmail.com>
Date: Fri, 8 Feb 2019 17:10:47 -0200
Subject: [PATCH 2/3] feat(index.html): changed image and add image-rendering
 pixelated.

---
 index.html | 34 +++++++++++++++++-----------------
 1 file changed, 17 insertions(+), 17 deletions(-)

diff --git a/index.html b/index.html
index 410ba15..4705170 100644
--- a/index.html
+++ b/index.html
@@ -14,7 +14,7 @@
     <title>NES.css - NES-style CSS Framework</title>
 
     <link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
-    <link href="./css/nes.min.css" rel="stylesheet" />
+    <link href="https://unpkg.com/nes.css/css/nes.min.css" rel="stylesheet" />
     <link href="./demo/style.css" rel="stylesheet" />
     <script async src="./demo/lib/highlight.js"></script>
     <link async href="./demo/lib/highlight-theme.css" rel="stylesheet" />
@@ -163,27 +163,27 @@
     <section class="nes-container with-title">
       <h2 class="title">Avatars</h2>
       <div id="avatars">
-        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-small" alt="8bit Avatar Example">
-        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar" alt="8bit Avatar Example">
-        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-medium" alt="8bit Avatar Example">
-        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-large" alt="8bit Avatar Example">
-        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-small is-rounded" alt="8bit Avatar Example">
-        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-rounded" alt="8bit Avatar Example">
-        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-medium is-rounded" alt="8bit Avatar Example">
-        <img src="https://ik.imagekit.io/6xhf1gnexgdgk/avatar_Hku4rzo4N.png" class="nes-avatar is-large is-rounded" alt="8bit Avatar Example">
+        <img src="https://www.gravatar.com/avatar?s=15" class="nes-avatar is-small" alt="Gravatar Image Example" style="image-rendering: pixelated;">
+        <img src="https://www.gravatar.com/avatar?s=15" class="nes-avatar" alt="Gravatar Image Example" style="image-rendering: pixelated;">
+        <img src="https://www.gravatar.com/avatar?s=15" class="nes-avatar is-medium" alt="Gravatar Image Example" style="image-rendering: pixelated;">
+        <img src="https://www.gravatar.com/avatar?s=15" class="nes-avatar is-large" alt="Gravatar Image Example" style="image-rendering: pixelated;">
+        <img src="https://www.gravatar.com/avatar?s=15" class="nes-avatar is-small is-rounded" alt="Gravatar Image Example" style="image-rendering: pixelated;">
+        <img src="https://www.gravatar.com/avatar?s=15" class="nes-avatar is-rounded" alt="Gravatar Image Example" style="image-rendering: pixelated;">
+        <img src="https://www.gravatar.com/avatar?s=15" class="nes-avatar is-medium is-rounded" alt="Gravatar Image Example" style="image-rendering: pixelated;">
+        <img src="https://www.gravatar.com/avatar?s=15" class="nes-avatar is-large is-rounded" alt="Gravatar Image Example" style="image-rendering: pixelated;">
       </div>
       <button type="button" class="nes-btn is-error show-code" id="show-avatars-code">&lt;&gt;</button>
       <span class="nes-balloon from-right copied" id="copied-avatars">Copied!</span>
     </section>
     <section class="nes-container code" id="code-avatars">
-      <pre class="sample-code"><code class="html">&lt;img src=&quot;https://www.gravatar.com/avatar&quot; class=&quot;nes-avatar is-small&quot; alt=&quot;8bit Avatar Example&quot;&gt;
-&lt;img src=&quot;https://www.gravatar.com/avatar&quot; class=&quot;nes-avatar&quot; alt=&quot;8bit Avatar Example&quot;&gt;
-&lt;img src=&quot;https://www.gravatar.com/avatar&quot; class=&quot;nes-avatar is-medium&quot; alt=&quot;8bit Avatar Example&quot;&gt;
-&lt;img src=&quot;https://www.gravatar.com/avatar&quot; class=&quot;nes-avatar is-large&quot; alt=&quot;8bit Avatar Example&quot;&gt;
-&lt;img src=&quot;https://www.gravatar.com/avatar&quot; class=&quot;nes-avatar is-rounded&quot; alt=&quot;8bit Avatar Example&quot;&gt;
-&lt;img src=&quot;https://www.gravatar.com/avatar&quot; class=&quot;nes-avatar is-small is-rounded&quot; alt=&quot;8bit Avatar Example&quot;&gt;
-&lt;img src=&quot;https://www.gravatar.com/avatar&quot; class=&quot;nes-avatar is-medium is-rounded&quot; alt=&quot;8bit Avatar Example&quot;&gt;
-&lt;img src=&quot;https://www.gravatar.com/avatar&quot; class=&quot;nes-avatar is-large is-rounded&quot; alt=&quot;8bit Avatar Example&quot;&gt;</code></pre>
+      <pre class="sample-code"><code class="html">&lt;img src=&quot;https://www.gravatar.com/avatar?s=15&quot; class=&quot;nes-avatar is-small&quot; alt=&quot;Gravatar Image Example&quot; style=&quot;image-rendering: pixelated;&quot;&gt;
+&lt;img src=&quot;https://www.gravatar.com/avatar?s=15&quot; class=&quot;nes-avatar&quot; alt=&quot;Gravatar Image Example&quot; style=&quot;image-rendering: pixelated;&quot;&gt;
+&lt;img src=&quot;https://www.gravatar.com/avatar?s=15&quot; class=&quot;nes-avatar is-medium&quot; alt=&quot;Gravatar Image Example&quot; style=&quot;image-rendering: pixelated;&quot;&gt;
+&lt;img src=&quot;https://www.gravatar.com/avatar?s=15&quot; class=&quot;nes-avatar is-large&quot; alt=&quot;Gravatar Image Example&quot; style=&quot;image-rendering: pixelated;&quot;&gt;
+&lt;img src=&quot;https://www.gravatar.com/avatar?s=15&quot; class=&quot;nes-avatar is-rounded&quot; alt=&quot;Gravatar Image Example&quot; style=&quot;image-rendering: pixelated;&quot;&gt;
+&lt;img src=&quot;https://www.gravatar.com/avatar?s=15&quot; class=&quot;nes-avatar is-small is-rounded&quot; alt=&quot;Gravatar Image Example&quot; style=&quot;image-rendering: pixelated;&quot;&gt;
+&lt;img src=&quot;https://www.gravatar.com/avatar?s=15&quot; class=&quot;nes-avatar is-medium is-rounded&quot; alt=&quot;Gravatar Image Example&quot; style=&quot;image-rendering: pixelated;&quot;&gt;
+&lt;img src=&quot;https://www.gravatar.com/avatar?s=15&quot; class=&quot;nes-avatar is-large is-rounded&quot; alt=&quot;Gravatar Image Example&quot; style=&quot;image-rendering: pixelated;&quot;&gt;</code></pre>
       <button type="button" class="nes-btn show-code copy" onClick="copyToClipboard('avatars')">Copy</button>
     </section>
 

From f9172e5ee82bb337562203c61908918325d2b077 Mon Sep 17 00:00:00 2001
From: Igor Guastalla de Lima <limaguastallaigor@gmail.com>
Date: Fri, 8 Feb 2019 22:32:57 -0200
Subject: [PATCH 3/3] feat(avatars): update storybooks avatars return <img>
 tag.

---
 docs/avatars.stories.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/docs/avatars.stories.js b/docs/avatars.stories.js
index c1a213d..35f79cf 100644
--- a/docs/avatars.stories.js
+++ b/docs/avatars.stories.js
@@ -16,5 +16,7 @@ stories.add('avatars', () => {
   const isRounded = boolean('is-rounded', false) ? 'is-rounded' : '';
   const selectedClasses = [isRounded, options].join(' ');
 
-  return `<img src="http://www.gravatar.com/avatar" class="nes-avatar ${selectedClasses}">`;
+  return `<img src="http://www.gravatar.com/avatar?s=15" class="nes-avatar ${selectedClasses}"
+    alt="Gravatar Image Example"
+    style="image-rendering: pixelated;">`;
 });