thesabbir / simple-line-icons

Simple and Minimal Line Icons
https://thesabbir.github.io/simple-line-icons
MIT License
1.86k stars 846 forks source link

have preview page of the icons #7

Closed sinsunsan closed 9 years ago

sinsunsan commented 9 years ago

when I go to http://graphicburger.com/wp-content/uploads/2013/10/Simple-Line-Icons-Webfont-600.png I am not able to make the relation between the icon and it's name would be very useful to have a preview with name similar that http://fortawesome.github.io/Font-Awesome/icons/ Or how do you do to choose you icons ?

thesabbir commented 9 years ago

Will be documented soon :) On Feb 9, 2015 4:17 PM, "Sébastien LUCAS" notifications@github.com wrote:

when I go to http://graphicburger.com/wp-content/uploads/2013/10/Simple-Line-Icons-Webfont-600.png I am not able to make the relation between the icon and it's name would be very useful to have a preview with name similar that http://fortawesome.github.io/Font-Awesome/icons/ Or how do you do to choose you icons ?

— Reply to this email directly or view it on GitHub https://github.com/thesabbir/simple-line-icons/issues/7.

bbraga commented 9 years ago

This is not supposed to be pretty or DRY, it was just to scratch an itch.

<?php
    $css = './web/components/simple-line-icons/css/simple-line-icons.css';
?>
<html>
<head>
    <link rel="stylesheet" href="<?php echo $css; ?>">
</head>
<body>
<?php
$pattern = '/\.(icon-(?:\w+(?:-)?)+):before\s+{\s*content:\s*"(.+)";\s+}/';
$css_file = file_get_contents($css);
preg_match_all($pattern, $css_file, $icons, PREG_SET_ORDER);
foreach($icons as $icon){
    echo '<i style="font-size: 30px;" class="'.$icon[1].'"></i> ==> '.$icon[1].'<br>';
}?>
</body>
</html>
$ php icons.php > icons.html

load icons.html on your browser, and visualize

used some code from: https://github.com/FortAwesome/Font-Awesome/issues/240

thesabbir commented 9 years ago

@bbraga thanks for the scratch an itch.

A preview with icon & class name is available now. http://thesabbir.github.io/simple-line-icons

thesabbir commented 9 years ago

@sinsunsan more suggestion is welcome :)