mirror of
https://github.com/nostalgic-css/NES.css.git
synced 2025-08-28 08:19:55 +02:00
Merge branch 'develop' into add-psone-controller-icon
This commit is contained in:
@@ -16,5 +16,7 @@ stories.add('avatars', () => {
|
|||||||
const isRounded = boolean('is-rounded', false) ? 'is-rounded' : '';
|
const isRounded = boolean('is-rounded', false) ? 'is-rounded' : '';
|
||||||
const selectedClasses = [isRounded, options].join(' ');
|
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;">`;
|
||||||
});
|
});
|
||||||
|
32
index.html
32
index.html
@@ -163,27 +163,27 @@
|
|||||||
<section class="nes-container with-title">
|
<section class="nes-container with-title">
|
||||||
<h2 class="title">Avatars</h2>
|
<h2 class="title">Avatars</h2>
|
||||||
<div id="avatars">
|
<div id="avatars">
|
||||||
<img src="https://www.gravatar.com/avatar" class="nes-avatar is-small">
|
<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" class="nes-avatar">
|
<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" class="nes-avatar is-medium">
|
<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" class="nes-avatar is-large">
|
<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" class="nes-avatar is-small is-rounded">
|
<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" class="nes-avatar is-rounded">
|
<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" class="nes-avatar is-medium is-rounded">
|
<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" class="nes-avatar is-large is-rounded">
|
<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>
|
</div>
|
||||||
<button type="button" class="nes-btn is-error show-code" id="show-avatars-code"><></button>
|
<button type="button" class="nes-btn is-error show-code" id="show-avatars-code"><></button>
|
||||||
<span class="nes-balloon from-right copied" id="copied-avatars">Copied!</span>
|
<span class="nes-balloon from-right copied" id="copied-avatars">Copied!</span>
|
||||||
</section>
|
</section>
|
||||||
<section class="nes-container code" id="code-avatars">
|
<section class="nes-container code" id="code-avatars">
|
||||||
<pre class="sample-code"><code class="html"><img src="https://www.gravatar.com/avatar" class="nes-avatar is-small">
|
<pre class="sample-code"><code class="html"><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" class="nes-avatar">
|
<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" class="nes-avatar is-medium">
|
<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" class="nes-avatar is-large">
|
<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" class="nes-avatar is-rounded">
|
<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" class="nes-avatar is-small is-rounded">
|
<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" class="nes-avatar is-medium is-rounded">
|
<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" class="nes-avatar is-large is-rounded"></code></pre>
|
<img src="https://www.gravatar.com/avatar?s=15" class="nes-avatar is-large is-rounded" alt="Gravatar Image Example" style="image-rendering: pixelated;"></code></pre>
|
||||||
<button type="button" class="nes-btn show-code copy" onClick="copyToClipboard('avatars')">Copy</button>
|
<button type="button" class="nes-btn show-code copy" onClick="copyToClipboard('avatars')">Copy</button>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user