Skip to content

Commit

Permalink
Merge pull request #88 from erikflowers/2.0-wip
Browse files Browse the repository at this point in the history
2.0 wip
  • Loading branch information
erikflowers committed Aug 9, 2015
2 parents 706ae48 + d477a14 commit 750072a
Show file tree
Hide file tree
Showing 240 changed files with 102,299 additions and 1,008 deletions.
54 changes: 19 additions & 35 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,55 +1,39 @@
# Weather Icons
*Version 1.3 - November 30th, 2014*
*Version 2.0 - August 2015*

## A free, open source icon-font of Weather icons
## 215 Weather Themed Icons and CSS

Weather Icons is a font of 189 weather themed icons, ready to be dropped right into [Bootstrap](http://www.getbootstrap.com) or any other project.
Weather Icons is the only icon font and CSS with 215 weather themed icons, ready to be dropped right into [Bootstrap](http://www.getbootstrap.com), or any project that needs high quality weather, maritime, and meteorological based icons!

Inspired by [Font Awesome](http://fontawesome.io/), they work in essentially the same way. They are infinitley scalable and any CSS that can be applied to text can be applied to them. All you need to do to insert an icon is add the base class and the specific icon class to an "i" element:
Get started at [http://weathericons.io](http://weathericons.io)!

``<i class="wi wi-day-lightning"></i>``
![Icon Preview](http://i.imgur.com/XmZW2q3.png)

At this time, there are no other effects/mixins to do advanced icon manipulation yet.
## Basic Usage

![Icon Preview](http://wes.io/WeM5/preview.png)
Place the 5 font files and the main `weather-icons.min.css` file in your project, with the assumption that the fonts are located up `../` from your CSS directory.

####[View demo and full icon reference](http://erikflowers.github.io/weather-icons/)
The icons are displayed by using an `i` element and adding the base class `wi` and then the icon class you want, such as `day-sunny`. This then looks like `<i class="wi wi-day-sunny"></i>`.

## Getting Started
Getting started is easy. First, put the fonts in the directory ABOVE your css directory. By default, the fonts are referencing a ../fonts/ folder that is on the same level as /css. This can be changed via the `@WeatherIconPath` variable in variables.less
To add a modifier, include the class you want after the icon name, which looks like `<i class="wi wi-day-sunny wi-flip-vertical"></i>`. You can flip, rotate, or add a fixed with. See it all at [http://weathericons.io](http://weathericons.io).

Include in your main .less file `weather-icons/weather-icons.less` and that is all you need to do.
## Wind Usage

It is best to download the [repo](http://www.github.com/erikflowers/weather-icons) from Github if you want to keep up to date. Please report any issues or requests to the repository here
To use the wind indicators, you must also use `weather-icons-wind.min.css` along with the default CSS file. To dispay a wind indicator, you must use the base class `wi` and `wi-wind`, and then include the towards/from direction you want, like `from-293-deg`. This ends up looking like . You can use any degree from 0 to 359 in this manner. **Note:** A "from" class has the point of the arrow at the opposite end of the degree. For example, a "from 90 degrees" icon would point to the 270 degree mark, wheras a "towards 270 degrees" would point at the same 270 degree mark.

#### CSS Only Method
If you just want to add a css file to your project with no Less compiling, you just need to reference the `weather-icons.css` included in the css folder. *If you are not familiar with using Bootstrap, or using Bootstrap in the precompiled Less mode, I would recommend you give it a try)*
Included in the set as well are aliases to point to cardinal directions. They work the same as degrees, for example `<i class="wi wi-wind towards-sse"></i>` would be an arrow pointing to the South by Southeast (roughly 158 degrees).

### Bower
`bower install weather-icons`

Be sure to reference css when using the icons:

`<link rel="stylesheet" type="text/css" href="bower_components/weather-icons/css/weather-icons.min.css">`

## New in version 1.3
Umbrella, day-windy, night-alt-cloudy, up-left, down-right, day-sleet, night-sleet, night-alt-sleet, sleet, day-haze.

28 moon phase icons

12 clock icons

13 Beaufort Scale icons

### Collaboration
If you feel so inclined to add icon ideas, icon art, or other fixes/changes to how the package works, feel free to help! I'd also love it if someone wanted to make this a component as well for bower, npm, component, etc. No idea how to do that myself (yet).
## Contributing
If you feel so inclined to add icon ideas, icon art, or other fixes/changes to how the package works, feel free to help!

## Credit
The icon designs are originally by [Lukas Bischoff](http://www.twitter.com/artill). Icon art for v1.1 forward, HTML, Less, and CSS are by [me (Erik)](http://www.helloerik.com).

None of this would be possible without [Bootstrap](http://www.getbootstrap.com), [Font Awesome](http://fontawesome.io/) and [Lukas Bischoff](http://www.twitter.com/artill). I just put it all together into a neat package. Cheatsheet provided by Michael Woywod.
## Licensing

Weather Icons licensed under [SIL OFL 1.1](http://scripts.sil.org/OFL) &mdash; Code licensed under [MIT License](http://opensource.org/licenses/mit-license.html) &mdash; Documentation licensed under [CC BY 3.0](http://creativecommons.org/licenses/by/3.0)
* Weather Icons licensed under [SIL OFL 1.1](http://scripts.sil.org/OFL)
* Code licensed under [MIT License](http://opensource.org/licenses/mit-license.html)
* Documentation licensed under [CC BY 3.0](http://creativecommons.org/licenses/by/3.0)

## Contact
Weather Icons is maintained by me, Erik Flowers. Reach me at [@Erik_UX](http://www.twitter.com/Erik_UX) or at [http://www.helloerik.com](http://www.helloerik.com).
Weather Icons is maintained by Erik Flowers. Reach me at [@Erik_UX](http://www.twitter.com/Erik_UX) or at [http://www.helloerik.com](http://www.helloerik.com).
39 changes: 39 additions & 0 deletions _builder/beaufort.edn
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
{:columns [label code]
:outputs
[{:name "../less/icon-variables/variables-beaufort.less"
:before ""
:join ";\n"
:row [\@ label \: " " \" \\ code \"]
:after ";"}


{:name "../sass/icon-variables/variables-beaufort.scss"
:before ""
:join ";\n"
:row [\$ label \: " " \" \\ code \"]
:after "\n"}


{:name "../less/icon-classes/classes-beaufort.less"
:before ""
:join "\n"
:row [".wi-" label ":before {content: @" label ";}"]
:after ""}


{:name "../sass/icon-classes/classes-beaufort.scss"
:before ""
:join "\n"
:row [".wi-" label ":before {content: $" label ";}"]
:after ""}


{:name "../_docs/jade/icon-list-beaufort.jade"
:before ""
:join "\n"
:row [".icon-wrap" "\n"
" .icon &#x" code \; "\n"
" .icon-name wi-" label "\n"
" .icon_unicode " code \ ""]
:after ""}
]}
165 changes: 165 additions & 0 deletions _builder/csv/bak.csv
Original file line number Diff line number Diff line change
@@ -0,0 +1,165 @@
_reserved_, f049
alien, f075
celsius, f03c
cloud, f041
cloud-down, f03d
cloud-refresh, f03e
cloud-up, f040
cloudy, f013
cloudy-gusts, f011
cloudy-windy, f012
day-cloudy, f002
day-cloudy-gusts, f000
day-cloudy-windy, f001
day-fog, f003
day-hail, f004
day-haze, f0b6
day-lightning, f005
day-rain, f008
day-rain-mix, f006
day-rain-wind, f007
day-showers, f009
day-sleet, f0b2
day-sleet-storm, f068
day-snow, f00a
day-snow-thunderstorm, f06b
day-snow-wind, f065
day-sprinkle, f00b
day-storm-showers, f00e
day-sunny, f00d
day-sunny-overcast, f00c
day-thunderstorm, f010
day-windy, f085
degrees, f042
direction-down, f044
direction-down-left, f043
direction-down-right, f088
direction-left, f048
direction-right, f04d
direction-up, f058
direction-up-left, f087
direction-up-right, f057
dust, f063
fahrenheit, f045
fog, f014
hail, f015
horizon, f047
horizon-alt, f046
hot, f072
hurricane, f073
lightning, f016
lunar-eclipse, f070
meteor, f071
moon-3rd-quarter, f0aa
moon-first-quarter, f09c
moon-full, f0a3
moon-new, f095
moon-waning-crescent-1, f0ab
moon-waning-crescent-2, f0ac
moon-waning-crescent-3, f0ad
moon-waning-crescent-4, f0ae
moon-waning-crescent-5, f0af
moon-waning-crescent-6, f0b0
moon-waning-gibbous-1, f0a4
moon-waning-gibbous-2, f0a5
moon-waning-gibbous-3, f0a6
moon-waning-gibbous-4, f0a7
moon-waning-gibbous-5, f0a8
moon-waning-gibbous-6, f0a9
moon-waxing-cresent-1, f096
moon-waxing-cresent-2, f097
moon-waxing-cresent-3, f098
moon-waxing-cresent-4, f099
moon-waxing-cresent-5, f09a
moon-waxing-cresent-6, f09b
moon-waxing-gibbous-1, f09d
moon-waxing-gibbous-2, f09e
moon-waxing-gibbous-3, f09f
moon-waxing-gibbous-4, f0a0
moon-waxing-gibbous-5, f0a1
moon-waxing-gibbous-6, f0a2
night-alt-cloudy, f086
night-alt-cloudy-gusts, f022
night-alt-cloudy-windy, f023
night-alt-hail, f024
night-alt-lightning, f025
night-alt-rain, f028
night-alt-rain-mix, f026
night-alt-rain-wind, f027
night-alt-showers, f029
night-alt-sleet, f0b4
night-alt-sleet-storm, f06a
night-alt-snow, f02a
night-alt-snow-thunderstorm, f06d
night-alt-snow-wind, f067
night-alt-sprinkle, f02b
night-alt-storm-showers, f02c
night-alt-thunderstorm, f02d
night-clear, f02e
night-cloudy, f031
night-cloudy-gusts, f02f
night-cloudy-windy, f030
night-fog, f04a
night-hail, f032
night-lightning, f033
night-partly-cloudy, f083
night-rain, f036
night-rain-mix, f034
night-rain-wind, f035
night-showers, f037
night-sleet, f0b3
night-sleet-storm, f069
night-snow, f038
night-snow-thunderstorm, f06c
night-snow-wind, f066
night-sprinkle, f039
night-storm-showers, f03a
night-thunderstorm, f03b
rain, f019
rain-mix, f017
rain-wind, f018
refresh, f04c
refresh-alt, f04b
showers, f01a
sleet, f0b5
smog, f074
smoke, f062
snow, f01b
snow-wind, f064
snowflake-cold, f076
solar-eclipse, f06e
sprinkle, f01c
sprinkles, f04e
stars, f077
storm-showers, f01d
strong-wind, f050
sunrise, f051
sunset, f052
thermometer, f055
thermometer-exterior, f053
thermometer-internal, f054
thunderstorm, f01e
time-1, f08a
time-10, f093
time-11, f094
time-12, f089
time-2, f08b
time-3, f08c
time-4, f08d
time-5, f08e
time-6, f08f
time-7, f090
time-8, f091
time-9, f092
tornado, f056
umbrella, f084
wind-default, f0b1
wind-east, f061
wind-north, f060
wind-north-east, f05e
wind-north-west, f05d
wind-south, f05c
wind-south-east, f05b
wind-south-west, f05a
wind-west, f059
windy, f021;
13 changes: 13 additions & 0 deletions _builder/csv/beaufort.csv
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
wind-beaufort-0, f0b7
wind-beaufort-1, f0b8
wind-beaufort-2, f0b9
wind-beaufort-3, f0ba
wind-beaufort-4, f0bb
wind-beaufort-5, f0bc
wind-beaufort-6, f0bd
wind-beaufort-7, f0be
wind-beaufort-8, f0bf
wind-beaufort-9, f0c0
wind-beaufort-10, f0c1
wind-beaufort-11, f0c2
wind-beaufort-12, f0c3
26 changes: 26 additions & 0 deletions _builder/csv/day.csv
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
day-sunny, f00d
day-cloudy, f002
day-cloudy-gusts, f000
day-cloudy-windy, f001
day-fog, f003
day-hail, f004
day-haze, f0b6
day-lightning, f005
day-rain, f008
day-rain-mix, f006
day-rain-wind, f007
day-showers, f009
day-sleet, f0b2
day-sleet-storm, f068
day-snow, f00a
day-snow-thunderstorm, f06b
day-snow-wind, f065
day-sprinkle, f00b
day-storm-showers, f00e
day-sunny-overcast, f00c
day-thunderstorm, f010
day-windy, f085
solar-eclipse, f06e
hot, f072
day-cloudy-high,f07d
day-light-wind,f0c4
8 changes: 8 additions & 0 deletions _builder/csv/direction.csv
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
direction-up, f058
direction-up-right, f057
direction-right, f04d
direction-down-right, f088
direction-down, f044
direction-down-left, f043
direction-left, f048
direction-up-left, f087
23 changes: 23 additions & 0 deletions _builder/csv/misc.csv
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
alien, f075
celsius, f03c
fahrenheit, f045
degrees, f042
thermometer, f055
thermometer-exterior, f053
thermometer-internal, f054
cloud-down, f03d
cloud-up, f040
cloud-refresh, f03e
horizon, f047
horizon-alt, f046
sunrise, f051
sunset, f052
moonrise, f0c9
moonset, f0ca
refresh, f04c
refresh-alt, f04b
umbrella, f084
barometer,f079
humidity,f07a
na,f07b
train,f0cb
26 changes: 26 additions & 0 deletions _builder/csv/moon.csv
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
moon-new, f095
moon-waxing-cresent-1, f096
moon-waxing-cresent-2, f097
moon-waxing-cresent-3, f098
moon-waxing-cresent-4, f099
moon-waxing-cresent-5, f09a
moon-waxing-cresent-6, f09b
moon-waxing-gibbous-1, f09d
moon-waxing-gibbous-2, f09e
moon-waxing-gibbous-3, f09f
moon-waxing-gibbous-4, f0a0
moon-waxing-gibbous-5, f0a1
moon-waxing-gibbous-6, f0a2
moon-full, f0a3
moon-waning-gibbous-1, f0a4
moon-waning-gibbous-2, f0a5
moon-waning-gibbous-3, f0a6
moon-waning-gibbous-4, f0a7
moon-waning-gibbous-5, f0a8
moon-waning-gibbous-6, f0a9
moon-waning-crescent-1, f0ab
moon-waning-crescent-2, f0ac
moon-waning-crescent-3, f0ad
moon-waning-crescent-4, f0ae
moon-waning-crescent-5, f0af
moon-waning-crescent-6, f0b0

0 comments on commit 750072a

Please sign in to comment.