icons yay
This commit is contained in:
parent
727145b1b3
commit
87ce455ab2
7 changed files with 69 additions and 18 deletions
|
@ -53,6 +53,7 @@ if($reqPath === '/contact') {
|
|||
[
|
||||
'id' => 'email',
|
||||
'name' => 'E-mail',
|
||||
'icon' => 'fmi fmi-email',
|
||||
'display' => 'me@flash.moe',
|
||||
'link' => 'mailto:me+contact@flash.moe',
|
||||
],
|
||||
|
@ -66,36 +67,42 @@ if($reqPath === '/contact') {
|
|||
[
|
||||
'id' => 'flashii',
|
||||
'name' => 'Flashii',
|
||||
'icon' => 'fmi fmi-flashii',
|
||||
'display' => 'flash',
|
||||
'link' => '//flashii.net/profile.php?u=1',
|
||||
],
|
||||
[
|
||||
'id' => 'twitter',
|
||||
'name' => 'Twitter',
|
||||
'icon' => 'fmi fmi-twitter',
|
||||
'display' => '@smugwave',
|
||||
'link' => '//twitter.com/smugwave',
|
||||
],
|
||||
[
|
||||
'id' => 'youtube',
|
||||
'name' => 'YouTube',
|
||||
'icon' => 'fmi fmi-youtube',
|
||||
'display' => 'flashwave',
|
||||
'link' => '//youtube.com/c/flashwave',
|
||||
],
|
||||
[
|
||||
'id' => 'github',
|
||||
'name' => 'Github',
|
||||
'icon' => 'fmi fmi-github',
|
||||
'display' => 'flashwave',
|
||||
'link' => '//github.com/flashwave',
|
||||
],
|
||||
[
|
||||
'id' => 'twitch',
|
||||
'name' => 'Twitch.tv',
|
||||
'icon' => 'fmi fmi-twitch',
|
||||
'display' => 'flashwave0',
|
||||
'link' => '//twitch.tv/flashwave0',
|
||||
],
|
||||
[
|
||||
'id' => 'lastfm',
|
||||
'name' => 'Last.fm',
|
||||
'icon' => 'fmi fmi-lastfm',
|
||||
'display' => 'flashwave_',
|
||||
'link' => '//last.fm/user/flashwave_',
|
||||
],
|
||||
|
@ -109,27 +116,32 @@ if($reqPath === '/contact') {
|
|||
[
|
||||
'id' => 'steam',
|
||||
'name' => 'Steam',
|
||||
'icon' => 'fmi fmi-steam',
|
||||
'display' => 'flashwave_',
|
||||
'link' => '//steamcommunity.com/id/flashwave_',
|
||||
],
|
||||
[
|
||||
'id' => 'nin-sw',
|
||||
'name' => 'Nintendo Switch',
|
||||
'icon' => 'fmi fmi-switch',
|
||||
'display' => 'SW-7446-8163-4902',
|
||||
],
|
||||
[
|
||||
'id' => 'nin-3ds',
|
||||
'name' => 'Nintendo 3DS',
|
||||
'icon' => 'fmi fmi-n3ds',
|
||||
'display' => '4013-0352-0648',
|
||||
],
|
||||
[
|
||||
'id' => 'nin-wiiu',
|
||||
'name' => 'Wii U / NNID',
|
||||
'icon' => 'fmi fmi-wiiu',
|
||||
'display' => 'flashwave0',
|
||||
],
|
||||
[
|
||||
'id' => 'osu',
|
||||
'name' => 'osu!',
|
||||
'icon' => 'fmi fmi-osu',
|
||||
'display' => 'flash',
|
||||
'link' => '//osu.ppy.sh/u/flash',
|
||||
],
|
||||
|
@ -143,12 +155,14 @@ if($reqPath === '/contact') {
|
|||
[
|
||||
'id' => 'paypal',
|
||||
'name' => 'Paypal Donation',
|
||||
'icon' => 'fmi fmi-paypal',
|
||||
'display' => 'flashwave',
|
||||
'link' => '//paypal.me/flashwave',
|
||||
],
|
||||
[
|
||||
'id' => 'patreon',
|
||||
'name' => 'Patreon',
|
||||
'icon' => 'fmi fmi-patreon',
|
||||
'display' => 'flashwave',
|
||||
'link' => '//patreon.com/flashwave',
|
||||
],
|
||||
|
@ -176,7 +190,7 @@ if($reqPath === '/contact') {
|
|||
<?php else: ?>
|
||||
<div class="social-background" onclick="fm.selectTextInElement(this.parentNode.querySelector('.social-handle')); fm.copySelectedText();"></div>
|
||||
<?php endif; ?>
|
||||
<div class="social-icon"></div>
|
||||
<div class="social-icon <?=$social['icon'];?>"></div>
|
||||
<div class="social-content">
|
||||
<div class="social-name"><?=$social['name'];?></div>
|
||||
<div class="social-handle"><?=$social['display'];?></div>
|
||||
|
|
|
@ -72,24 +72,28 @@ if($reqPath === '/') {
|
|||
[
|
||||
'id' => 'email',
|
||||
'name' => 'E-mail',
|
||||
'icon' => 'fmi fmi-email',
|
||||
'display' => 'me@flash.moe',
|
||||
'link' => 'mailto:me+contact@flash.moe',
|
||||
],
|
||||
[
|
||||
'id' => 'flashii',
|
||||
'name' => 'Flashii',
|
||||
'icon' => 'fmi fmi-flashii',
|
||||
'display' => 'flash',
|
||||
'link' => '//flashii.net/profile.php?u=1',
|
||||
],
|
||||
[
|
||||
'id' => 'twitter',
|
||||
'name' => 'Twitter',
|
||||
'icon' => 'fmi fmi-twitter',
|
||||
'display' => '@smugwave',
|
||||
'link' => '//twitter.com/smugwave',
|
||||
],
|
||||
[
|
||||
'id' => 'github',
|
||||
'name' => 'Github',
|
||||
'icon' => 'fmi fmi-github',
|
||||
'display' => 'flashwave',
|
||||
'link' => '//github.com/flashwave',
|
||||
],
|
||||
|
@ -179,7 +183,7 @@ foreach($projInfo as $proj):
|
|||
<?php else: ?>
|
||||
<div class="social-background" onclick="fm.selectTextInElement(this.parentNode.querySelector('.social-handle')); fm.copySelectedText();"></div>
|
||||
<?php endif; ?>
|
||||
<div class="social-icon"></div>
|
||||
<div class="social-icon <?=$social['icon'];?>"></div>
|
||||
<div class="social-content">
|
||||
<div class="social-name"><?=$social['name'];?></div>
|
||||
<div class="social-handle"><?=$social['display'];?></div>
|
||||
|
|
|
@ -262,7 +262,6 @@ body {
|
|||
.social-icon {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
background-size: 25px 25px;
|
||||
margin: 3px 4px 2px 8px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
@ -280,33 +279,19 @@ body {
|
|||
font-family: 'Electrolize', Verdana, 'Dejavu Sans', Arial, Helvetica, sans-serif;
|
||||
user-select: text;
|
||||
}
|
||||
.social-twitter .social-icon { background-image: url('//flash.moe/assets/icons/twitter.png'); }
|
||||
.social-twitter .social-background { background-color: #1da1f2; }
|
||||
.social-youtube .social-icon { background-image: url('//flash.moe/assets/icons/youtube.png'); }
|
||||
.social-youtube .social-background { background-color: #ff0000; }
|
||||
.social-flashii .social-icon { background-image: url('//flash.moe/assets/icons/flashii.png'); }
|
||||
.social-flashii .social-background { background-color: #8559a5; }
|
||||
.social-github .social-icon { background-image: url('//flash.moe/assets/icons/github.png'); }
|
||||
.social-github .social-background { background-color: #222222; }
|
||||
.social-twitch .social-icon { background-image: url('//flash.moe/assets/icons/twitch.png'); }
|
||||
.social-twitch .social-background { background-color: #6441a4; }
|
||||
.social-steam .social-icon { background-image: url('//flash.moe/assets/icons/steam.png'); }
|
||||
.social-steam .social-background { background-color: #2c2e35; }
|
||||
.social-osu .social-icon { background-image: url('//flash.moe/assets/icons/steam.png'); }
|
||||
.social-osu .social-background { background-color: #ff66aa; }
|
||||
.social-email .social-icon { background-image: url('//flash.moe/assets/icons/email.png'); }
|
||||
.social-email .social-background { background-color: #4a3650; }
|
||||
.social-lastfm .social-icon { background-image: url('//flash.moe/assets/icons/lastfm.png'); }
|
||||
.social-lastfm .social-background { background-color: #ba0000; }
|
||||
.social-nin-sw .social-icon { background-image: url('//flash.moe/assets/icons/ninswitch.png'); }
|
||||
.social-nin-sw .social-background { background-color: #e60012; }
|
||||
.social-nin-3ds .social-icon { background-image: url('//flash.moe/assets/icons/ninswitch.png'); }
|
||||
.social-nin-3ds .social-background { background-color: #ce171f; }
|
||||
.social-nin-wiiu .social-icon { background-image: url('//flash.moe/assets/icons/ninswitch.png'); }
|
||||
.social-nin-wiiu .social-background { background-color: #00acca; }
|
||||
.social-paypal .social-icon { background-image: url('//flash.moe/assets/icons/paypal.png'); }
|
||||
.social-paypal .social-background { background-color: #009cde; }
|
||||
.social-patreon .social-icon { background-image: url('//flash.moe/assets/icons/paypal.png'); }
|
||||
.social-patreon .social-background { background-color: #f86754; }
|
||||
|
||||
.index-featured {
|
||||
|
@ -674,3 +659,29 @@ body {
|
|||
line-height: 1.4em;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
/** SPRITE SHIT START **/
|
||||
.fmi {
|
||||
background-image: url('sprite.png');
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
background-size: 350px 25px;
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
|
||||
.fmi { background-image: url('sprite@2x.png'); background-size: 350px 25px; }
|
||||
}
|
||||
.fmi.fmi-email { background-position: 350px 0px; }
|
||||
.fmi.fmi-flashii { background-position: 325px 0px; }
|
||||
.fmi.fmi-github { background-position: 300px 0px; }
|
||||
.fmi.fmi-lastfm { background-position: 275px 0px; }
|
||||
.fmi.fmi-n3ds { background-position: 250px 0px; }
|
||||
.fmi.fmi-osu { background-position: 225px 0px; }
|
||||
.fmi.fmi-patreon { background-position: 200px 0px; }
|
||||
.fmi.fmi-paypal { background-position: 175px 0px; }
|
||||
.fmi.fmi-steam { background-position: 150px 0px; }
|
||||
.fmi.fmi-switch { background-position: 125px 0px; }
|
||||
.fmi.fmi-twitch { background-position: 100px 0px; }
|
||||
.fmi.fmi-twitter { background-position: 75px 0px; }
|
||||
.fmi.fmi-wiiu { background-position: 50px 0px; }
|
||||
.fmi.fmi-youtube { background-position: 25px 0px; }
|
||||
/** SPRITE SHIT END **/
|
||||
|
|
23
public/assets/sprite.css
Normal file
23
public/assets/sprite.css
Normal file
|
@ -0,0 +1,23 @@
|
|||
.fmi {
|
||||
background-image: url('sprite.png');
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
background-size: 350px 25px;
|
||||
}
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
|
||||
.fmi { background-image: url('sprite@2x.png'); background-size: 350px 25px; }
|
||||
}
|
||||
.fmi.fmi-email { background-position: 350px 0px; }
|
||||
.fmi.fmi-flashii { background-position: 325px 0px; }
|
||||
.fmi.fmi-github { background-position: 300px 0px; }
|
||||
.fmi.fmi-lastfm { background-position: 275px 0px; }
|
||||
.fmi.fmi-n3ds { background-position: 250px 0px; }
|
||||
.fmi.fmi-osu { background-position: 225px 0px; }
|
||||
.fmi.fmi-patreon { background-position: 200px 0px; }
|
||||
.fmi.fmi-paypal { background-position: 175px 0px; }
|
||||
.fmi.fmi-steam { background-position: 150px 0px; }
|
||||
.fmi.fmi-switch { background-position: 125px 0px; }
|
||||
.fmi.fmi-twitch { background-position: 100px 0px; }
|
||||
.fmi.fmi-twitter { background-position: 75px 0px; }
|
||||
.fmi.fmi-wiiu { background-position: 50px 0px; }
|
||||
.fmi.fmi-youtube { background-position: 25px 0px; }
|
BIN
public/assets/sprite.png
Normal file
BIN
public/assets/sprite.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 11 KiB |
BIN
public/assets/sprite@2x.png
Normal file
BIN
public/assets/sprite@2x.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 19 KiB |
|
@ -1,7 +1,6 @@
|
|||
<?php
|
||||
// TODO FOR LAUNCH
|
||||
// - Make a new list of headers, make sure they're small in file size
|
||||
// - Make icons
|
||||
|
||||
// TODO deferred
|
||||
// - Make related page
|
||||
|
|
Loading…
Reference in a new issue