⚡️ New Brands
- Added CSS for SoundCloud & Spectrum. - Added SVG icons for SoundCloud & Spectrum. - Added example buttons to index.html. - Fixed typo on README.md.
This commit is contained in:
Seth Cottle
parent
899971780b
commit
5b9ff2057d
5 changed files with 32 additions and 1 deletions
|
|
@ -11,7 +11,7 @@ LittleLink has more than 18 company button styles you can use and we'll be throw
|
|||
|
||||
|
||||
|
||||
Using [Skeleton](http://getskeleton.com/) let us build something that loads quickly & doesn't have any of the unnecessary bloat you would get from using a large framework for requires simplicity. LittleLink scored a 99/100 in performance when tested with Lighthouse.
|
||||
Using [Skeleton](http://getskeleton.com/) let us build something that loads quickly & doesn't have any of the unnecessary bloat you would get from using a large framework for a page that requires nothing more than simplicity. LittleLink scored a 99/100 in performance when tested with Lighthouse.
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -173,6 +173,22 @@ button:hover,
|
|||
.button.button-snapchat:focus {
|
||||
filter: brightness(90%) }
|
||||
|
||||
/* SoundCloud */
|
||||
.button.button-soundcloud {
|
||||
color: #FFFFFF;
|
||||
background-color: #ff5500 }
|
||||
.button.button-soundcloud:hover,
|
||||
.button.button-soundcloud:focus {
|
||||
filter: brightness(90%) }
|
||||
|
||||
/* Spectrum */
|
||||
.button.button-spectrum {
|
||||
color: #FFFFFF;
|
||||
background-color: #7b16ff }
|
||||
.button.button-spectrum:hover,
|
||||
.button.button-spectrum:focus {
|
||||
filter: brightness(90%) }
|
||||
|
||||
/* Spotify */
|
||||
.button.button-spotify {
|
||||
color: #FFFFFF;
|
||||
|
|
|
|||
2
icons/soundcloud.svg
Normal file
2
icons/soundcloud.svg
Normal file
|
|
@ -0,0 +1,2 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" focusable="false" data-prefix="littlelink" data-icon="soundcloud" class="svg-inline soundcloud" role="img" viewBox="0 0 640 512">
|
||||
<path fill="#FFFFFF" d="M111.4 256.3l5.8 65-5.8 68.3c-.3 2.5-2.2 4.4-4.4 4.4s-4.2-1.9-4.2-4.4l-5.6-68.3 5.6-65c0-2.2 1.9-4.2 4.2-4.2 2.2 0 4.1 2 4.4 4.2zm21.4-45.6c-2.8 0-4.7 2.2-5 5l-5 105.6 5 68.3c.3 2.8 2.2 5 5 5 2.5 0 4.7-2.2 4.7-5l5.8-68.3-5.8-105.6c0-2.8-2.2-5-4.7-5zm25.5-24.1c-3.1 0-5.3 2.2-5.6 5.3l-4.4 130 4.4 67.8c.3 3.1 2.5 5.3 5.6 5.3 2.8 0 5.3-2.2 5.3-5.3l5.3-67.8-5.3-130c0-3.1-2.5-5.3-5.3-5.3zM7.2 283.2c-1.4 0-2.2 1.1-2.5 2.5L0 321.3l4.7 35c.3 1.4 1.1 2.5 2.5 2.5s2.2-1.1 2.5-2.5l5.6-35-5.6-35.6c-.3-1.4-1.1-2.5-2.5-2.5zm23.6-21.9c-1.4 0-2.5 1.1-2.5 2.5l-6.4 57.5 6.4 56.1c0 1.7 1.1 2.8 2.5 2.8s2.5-1.1 2.8-2.5l7.2-56.4-7.2-57.5c-.3-1.4-1.4-2.5-2.8-2.5zm25.3-11.4c-1.7 0-3.1 1.4-3.3 3.3L47 321.3l5.8 65.8c.3 1.7 1.7 3.1 3.3 3.1 1.7 0 3.1-1.4 3.1-3.1l6.9-65.8-6.9-68.1c0-1.9-1.4-3.3-3.1-3.3zm25.3-2.2c-1.9 0-3.6 1.4-3.6 3.6l-5.8 70 5.8 67.8c0 2.2 1.7 3.6 3.6 3.6s3.6-1.4 3.9-3.6l6.4-67.8-6.4-70c-.3-2.2-2-3.6-3.9-3.6zm241.4-110.9c-1.1-.8-2.8-1.4-4.2-1.4-2.2 0-4.2.8-5.6 1.9-1.9 1.7-3.1 4.2-3.3 6.7v.8l-3.3 176.7 1.7 32.5 1.7 31.7c.3 4.7 4.2 8.6 8.9 8.6s8.6-3.9 8.6-8.6l3.9-64.2-3.9-177.5c-.4-3-2-5.8-4.5-7.2zm-26.7 15.3c-1.4-.8-2.8-1.4-4.4-1.4s-3.1.6-4.4 1.4c-2.2 1.4-3.6 3.9-3.6 6.7l-.3 1.7-2.8 160.8s0 .3 3.1 65.6v.3c0 1.7.6 3.3 1.7 4.7 1.7 1.9 3.9 3.1 6.4 3.1 2.2 0 4.2-1.1 5.6-2.5 1.7-1.4 2.5-3.3 2.5-5.6l.3-6.7 3.1-58.6-3.3-162.8c-.3-2.8-1.7-5.3-3.9-6.7zm-111.4 22.5c-3.1 0-5.8 2.8-5.8 6.1l-4.4 140.6 4.4 67.2c.3 3.3 2.8 5.8 5.8 5.8 3.3 0 5.8-2.5 6.1-5.8l5-67.2-5-140.6c-.2-3.3-2.7-6.1-6.1-6.1zm376.7 62.8c-10.8 0-21.1 2.2-30.6 6.1-6.4-70.8-65.8-126.4-138.3-126.4-17.8 0-35 3.3-50.3 9.4-6.1 2.2-7.8 4.4-7.8 9.2v249.7c0 5 3.9 8.6 8.6 9.2h218.3c43.3 0 78.6-35 78.6-78.3.1-43.6-35.2-78.9-78.5-78.9zm-296.7-60.3c-4.2 0-7.5 3.3-7.8 7.8l-3.3 136.7 3.3 65.6c.3 4.2 3.6 7.5 7.8 7.5 4.2 0 7.5-3.3 7.5-7.5l3.9-65.6-3.9-136.7c-.3-4.5-3.3-7.8-7.5-7.8zm-53.6-7.8c-3.3 0-6.4 3.1-6.4 6.7l-3.9 145.3 3.9 66.9c.3 3.6 3.1 6.4 6.4 6.4 3.6 0 6.4-2.8 6.7-6.4l4.4-66.9-4.4-145.3c-.3-3.6-3.1-6.7-6.7-6.7zm26.7 3.4c-3.9 0-6.9 3.1-6.9 6.9L227 321.3l3.9 66.4c.3 3.9 3.1 6.9 6.9 6.9s6.9-3.1 6.9-6.9l4.2-66.4-4.2-141.7c0-3.9-3-6.9-6.9-6.9z"/></svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
5
icons/spectrum.svg
Normal file
5
icons/spectrum.svg
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
<svg width="32" height="32" viewBox="0 0 32 32" fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="logo">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M6 14.5C6 15.3284 6.67157 16 7.5 16H9C12.866 16 16 19.134 16 23V24.5C16 25.3284 16.6716 26 17.5 26H24.5C25.3284 26 26 25.3284 26 24.5V23C26 13.6111 18.3889 6 9 6H7.5C6.67157 6 6 6.67157 6 7.5V14.5Z" fill="#FFFFFF"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 390 B |
|
|
@ -92,6 +92,14 @@
|
|||
<a class="button button-pinterest" href="#"><img class="icon" src="icons/pinterest.svg">Pinterest</a>
|
||||
<br>
|
||||
|
||||
<!-- SoundCloud -->
|
||||
<a class="button button-soundcloud" href="#"><img class="icon" src="icons/soundcloud.svg">SoundCloud</a>
|
||||
<br>
|
||||
|
||||
<!-- Spectrum -->
|
||||
<a class="button button-spectrum" href="#"><img class="icon" src="icons/spectrum.svg">Spectrum</a>
|
||||
<br>
|
||||
|
||||
<!-- Figma -->
|
||||
<a class="button button-figma" href="#"><img class="icon" src="icons/figma.svg">Figma</a>
|
||||
<br>
|
||||
|
|
|
|||
Loading…
Reference in a new issue