erikflowers_weather-icons/_docs/jade/index.jade

doctype
html
  head
    title Weather Icons - 215 font icons inspired by Font Awesome and designed for Bootstrap
    // favicons
    link(rel='apple-touch-icon', sizes='57x57', href='/apple-touch-icon-57x57.png')
    link(rel='apple-touch-icon', sizes='60x60', href='/apple-touch-icon-60x60.png')
    link(rel='icon', type='image/png', href='/favicon-16x16.png', sizes='16x16')
    link(rel='icon', type='image/png', href='/favicon-32x32.png', sizes='32x32')
    meta(name='msapplication-TileColor', content='#da532c')
    //favicons

    meta(name='viewport', content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no')

    link(rel='stylesheet', href='css/styles.css')
    link(rel='stylesheet', href='css/weather-icons.css')
    link(rel='stylesheet', href='css/weather-icons-wind.css')

    script(src='//use.typekit.net/hse2lqc.js')
    script.
      try{Typekit.load();}catch(e){}
    script(src='js/bootstrap.min.js')
    script.
      (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
      (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
      m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
      })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
      ga('create', 'UA-547519-12', 'erikflowers.github.io');
      ga('send', 'pageview');

  body

    header
      .container
        .row-fluid
          .col-sm-12
            .icon
              .icon-box
                .wi.wi-day-cloudy
            h1 Weather Icons
            h2 215 Weather Themed Icons and CSS
            a.download-now(href="https://github.com/erikflowers/weather-icons/archive/master.zip") Download Now 
              i.wi.wi-sunset
    section.social
      .container
        .row
          .col-sm-12
            .social-wrapper
              ul
                li
                  iframe.github-btn(src='https://ghbtns.com/github-btn.html?user=erikflowers&repo=weather-icons&type=watch&count=true', allowtransparency='true', frameborder='0', scrolling='0', width='100px', height='20px')
                li
                  iframe.github-btn(src='https://ghbtns.com/github-btn.html?user=erikflowers&repo=weather-icons&type=fork&count=true', allowtransparency='true', frameborder='0', scrolling='0', width='90px', height='20px')
                li
                  a.twitter-share-button(href='https://twitter.com/share', data-lang='en', data-text='Weather Icons - 215 weather themed font icons!', data-via='Erik_UX', data-count='none') Tweet
                li
                  a.twitter-follow-button(href='https://twitter.com/Erik_UX', data-show-count='false', data-lang='en') Follow @Erik_UX
                  script.
                    !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");


    section.content.container.intro
      .row
        .col-sm-12
          .intro-icons
            i.wi.wi-day-lightning
            i.wi.wi-night-thunderstorm
            i.wi.wi-day-snow
            i.wi.wi-sprinkle
            i.wi.wi-day-sunny
            i.wi.wi-cloudy
            i.wi.wi-night-rain-mix
            i.wi.wi-sunset
            i.wi.wi-sunrise
            i.wi.wi-day-cloudy-windy
            i.wi.wi-night-rain
            i.wi.wi-night-alt-snow
          p.headline Weather Icons is the only icon font and CSS with 215 weather themed icons, ready to be dropped right into  
            a(href="http://getbootstrap.com") Bootstrap,
            |  or any project that needs high quality weather, maritime, and meteorological based icons!


          .features
            .row
              .col-sm-4
                h3
                  i.wi.wi-day-sunny
                  | The Freedom of CSS
                p Anthing you can do to text, you can do to the icons. Scale, rotate, flip, change color, add shadows... and more! 
                  i.wi.wi-night-thunderstorm.wi-flip-vertical.purple
                  i.wi.wi-night-thunderstorm.wi-flip-horizontal.purple
                  i.wi.wi-night-thunderstorm.wi-rotate-90.purple
                  i.wi.wi-night-thunderstorm.wi-rotate-180.purple
                  i.wi.wi-night-thunderstorm.wi-rotate-270.purple

              .col-sm-4
                h3
                  i.wi.wi-lightning
                  | Use In Graphic Apps
                p Weather Icons come with OTF and TTF files, so you can use this page to copy icons and paste them right into your favorite design apps like Photoshop, Illustrator, Sketch!
              .col-sm-4
                h3
                  i.wi.wi-night-rain
                  | Flip, Scale, Transform
                p Easily modify the icon look with built-in classes that make it easy.
            .row
              .col-sm-4
                h3
                  i.wi.wi-earthquake
                  | Popular Weather API Classes
                p Build in API compatibility with Yahoo Weather, OpenWeatherMaps, Forecast.io, and World Meteorological Organization.
                  a(href="api-list.html") View the list of API mappings here.
              .col-sm-4
                h3
                  i.wi.wi-thunderstorm
                  | Specialty Icons
                p Included are 28 moon phases, 12 hours of clock, the Beaufort wind force scale, maritime wind warnings,
              .col-sm-4
                h3
                  i.wi.wi-volcano.from-270-deg
                  | Less and Sass Support
                p Use Less or Sass preprocessors to integrate the Weather Icons right into your existing builds.
            .row.new-icons
              .col-sm-12
                h3 25 New 2.0 Icons!
                .row
                  .col-sm-3
                    ul
                      li
                        i.wi.wi-day-cloudy-high
                        | day-cloudy-high
                      li
                        i.wi.wi-day-light-wind
                        | day-light-wind
                      li
                        i.wi.wi-day-sleet
                        | day-sleet
                      li
                        i.wi.wi-day-haze
                        | day-haze
                      li
                        i.wi.wi-night-cloudy-high
                        | night-cloud-high
                      li
                        i.wi.wi-night-alt-partly-cloudy
                        | night-alt-partly-cloudy
                      li
                        i.wi.wi-sleet
                        | sleet
                  .col-sm-3
                    ul
                      li
                        i.wi.wi-moonrise
                        | moonrise
                      li
                        i.wi.wi-moonset
                        | moonset
                      li
                        i.wi.wi-night-sleet
                        | night-sleet
                      li
                        i.wi.wi-night-alt-sleet
                        | night-alt-sleet
                      li
                        i.wi.wi-raindrop
                        | raindrop
                      li
                        i.wi.wi-barometer
                        | barometer
                      li
                        i.wi.wi-humidity
                        | humidity
                  .col-sm-3
                    ul
                      li
                        i.wi.wi-na
                        | na (no report)
                      li
                        i.wi.wi-flood
                        | flood
                      li
                        i.wi.wi-sandstorm
                        | sandstorm
                      li
                        i.wi.wi-tsunami
                        | tsunami
                      li
                        i.wi.wi-earthquake
                        | earthquake
                      li
                        i.wi.wi-fire
                        | fire
                  .col-sm-3
                    ul
                      li
                        i.wi.wi-volcano
                        | volcano
                      li
                        i.wi.wi-train
                        | train
                      li
                        i.wi.wi-small-craft-advisory
                        | small-craft-advisory
                      li
                        i.wi.wi-gale-warning
                        | gale-warning
                      li
                        i.wi.wi-storm-warning
                        | storm-warning
                      li
                        i.wi.wi-hurricane-warning
                        | hurricane-warning


          .meta
            a.github-button(href="http://github.com/erikflowers/weather-icons") View the project on GitHub 
              i.fa.fa-github
            p Please make requests or report any issues to the 
              a(href="https://github.com/erikflowers/weather-icons/issues") main repository on GitHub.

      .row
        include icon-list

      .row-
        .col-sm-12
          .section-title Utility Classes
          .instructions
            p Use these special, built-in utility classes to flip, rotate, or assign a fixed width to any icon.
          .row
            .col-sm-4
              h3 Flip
              p
                code wi-flip-horizontal
              p
                code wi-flip-vertical
            .col-sm-4
              h3 Rotate
              p
                code wi-rotate-90
              p
                code wi-rotate-180
              p
                code wi-rotate-270
            .col-sm-4
              h3 Fixed Width
              p
                code wi-fw



    footer
        .container
          .row
            .col-sm-6
              p The Weather Icons project created and maintained by 
                a(href="http://www.twitter.com/Erik_UX") Erik Flowers
                |. v1.0 artwork by 
                a(href="http://www.twitter.com/artill") Lukas Bischoff
                |. v1.1 - 2.0 artwork by 
                a(href="http://www.twitter.com/Erik_UX") Erik Flowers
              p LESS/HTML implementation inspired and heavily influenced by 
                a(href="http://fortawesome.github.io/Font-Awesome/") Font Awesome.
            .col-sm-6
              p Weather Icons licensed under 
                a(href="http://scripts.sil.org/OFL") SIL OFL 1.1, 
                |  Code licensed under 
                a(href="http://opensource.org/licenses/mit-license.html") MIT License, 
                |  Documentation licensed under 
                a(href="http://creativecommons.org/licenses/by/3.0/") CC BY 3.0
          .row
            .col-sm-12
              i.wi.wi-day-lightning
              i.wi.wi-night-thunderstorm
              i.wi.wi-day-snow
              i.wi.wi-sprinkle
              i.wi.wi-day-sunny
              i.wi.wi-cloudy
              i.wi.wi-night-rain-mix
              i.wi.wi-sunset
              i.wi.wi-sunrise
              i.wi.wi-day-cloudy-windy
              i.wi.wi-night-rain
              i.wi.wi-night-alt-snow