Git Product home page Git Product logo

gameicons-font's Introduction

gameicons-font

An icon font for game-icons/icons. Unfortunately their GitHub repo is a bit outdated, so instead this pulls from the live site, using the black on transparent SVGs.

Usage

  • get the .css file
  • add an icon: <i class="game-icon game-icon-anchor">

Want to build it yourself?

  • npm install
  • npm run build:font

Want to deploy it?

  • npm run deploy

Want to adjust the site?

The site is made using Mithril.js. Development is easy:

  • npm install
  • npm run dev

A live server will spin up, watching the test/ directory. Any changes made will refresh the browser.

gameicons-font's People

Contributors

dependabot[bot] avatar seiyria avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

gameicons-font's Issues

Update

Hey there!

Thanks for your amazing work! <3 rpg-awesome is cool but lack many icons I needed.

When will you update again for the new icons?

Thanks!

Adding own icons

Hi,

first off, thank you very much for this package, it's come really handy for prototyping a web game.

Is there an option to download the newest game-icons from the website, and merge them with a folder of custom icons? I would like to expand the font for my own game, with my own icons, while still using the regular game-icons.

I feel like I remember you mentioning something like that as a fork somewhere, and that you've already forked and done something like that yourself, but I wasn't successful in finding it.

Thanks!

weird chrome behavior

In chrome, windows 7, this font seems to add a TON of spacing above the icon, like 300-400px. It doesn't happen if I switch the font to something like arial, just as a test. Even the example page looks super wonky with it, with the elements stretching invisibly all the way up to the filter/color inputs.

However, the OTHER version of this, the fork for the idle game, doesn't have this behavior, it seems. I don't have the first clue about how to fix this (or even open the files), and I'm hoping it's a matter of you just re-saving what you have. If you need any extra information about it, screenshots, dev tools stuff, please let me know. Thanks for the cool project- I just wish I could use it!

Stability of numbered glyphs

I just noticed for icons of the same name but from different authors are named here as [icon name], [icon name]-2 (example clover (by Sbed), clover-2 (by Lorc)). I was wondering if there was a mechanism in place to ensure that updates does not change which icon is assigned to which glyph in the fonts here, or if addition of a new icon with the same name can cause the old icon to be named [icon name]-2.

Glyphs missing from the source site?

Hey there. I was wondering if you maintain a list of glyphs that haven't yet been converted from the source, and whether you had any tips for adding items and creating pull requests. (specifically there are some dice glyphs that I'd like to be able to use, but the completist in me enjoys the idea of helping this project to get to 100%)

The codepoint is wrong, and cause all icons display blank

I found the css's content value is different between the file dist/game-icons.css , test/css/game-icons.css and the demo web https://seiyria.com/gameicons-font/css/game-icons.css , which cause self-host web will not display icon.

image

Npm package

Hi! I was wondering if there are plans to publish this as a npm package.

GameIcons updates quite frequently, so it would be nice to just update a dependency instead of relying on this repo to be manually updated. Also, it could be achieved very easily with a CI tool. So, why not!? ๐Ÿ˜„.

Can't get it to work

I included the following link in my HTML file.
<link href="css/game-icons.css" rel="stylesheet">

And included the icon tag with the proper class:
<i class="game-icon game-icon-anchor">

just like in the readme - and I see nothing.

Use ligatures?

This font is awesome! It works for CSS-based use cases, but I was hoping to use it in a graphics program like Figma or Photoshop. Right now this is really hard to do. (You have to copy the unicode string directly from the CSS files, convert it to an actual glyph which renders as just a black box, then paste this glyph into your text somewhere.)

Ideally it would work how the Material Icons (docs explanation) font does with ligatures, where you can just type bloody-sword in the font and it will become the "bloody-sword" icon automatically. This makes it really easy to use everywhere.

If the font build process could support this it would be amazing!


Side benefit: this would make CSS use easy still too, because you can just add a single class like:

<i class="gameicons">bloody-sword</i>

Missing SVG font?

Hi, I noticed that in the "dist" folder the CSS is including the SVG version of the font, but the file is missing. Is it intentional, maybe because you are not supporting the svg version of the font? Thanks.

Icons not coming out lilke they should

I think you guys got some of the icon numbers and images wrong because they show up different on my webiste. ROFL and I need that power button one and it turns out to be angel wings and such.. ugh

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.