tests/manual/icon.html

	icon.html revision c270014f773974dbe11b6e0ff39990e5896caf1b
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff<!DOCTYPE html>
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence<html>
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence    <head>
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff        <!-- reset the default browser styles -->
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff        <style>
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff            .yui3-button-icon {
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff                background-repeat: no-repeat;
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff                display: inline-block;
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff                height: 20px;
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence                vertical-align: middle;
d3498432822fb487e58f8f72bb5f880dd8307d7dMichael Sawyer                width: 20px;
d3498432822fb487e58f8f72bb5f880dd8307d7dMichael Sawyer                background-image: url("icon-sprite-dark-and-light-24.png");
d3498432822fb487e58f8f72bb5f880dd8307d7dMichael Sawyer            }
d3498432822fb487e58f8f72bb5f880dd8307d7dMichael Sawyer
d3498432822fb487e58f8f72bb5f880dd8307d7dMichael Sawyer            .yui3-button-icon-bold {
d3498432822fb487e58f8f72bb5f880dd8307d7dMichael Sawyer              background-position: 1px -1px;
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence            }
95be83b467e2384d414693982318a5c06cccf1d7Andreas Gustafsson
f9354808d122036e66e9f007a4bb12d4aa936aaeAndreas Gustafsson            .yui3-button-icon-italic {
f9354808d122036e66e9f007a4bb12d4aa936aaeAndreas Gustafsson              background-position: 1px -37px;
f9354808d122036e66e9f007a4bb12d4aa936aaeAndreas Gustafsson            }
f9354808d122036e66e9f007a4bb12d4aa936aaeAndreas Gustafsson
b1d234eb75e2804e09d89178a76df39c321db51bBrian Wellington            .yui3-button-icon-underline {
b1d234eb75e2804e09d89178a76df39c321db51bBrian Wellington              background-position: 1px -73px;
58007c5fde59b756174280d26916eb27f593e6ccBob Halley            }
58007c5fde59b756174280d26916eb27f593e6ccBob Halley        </style>
58007c5fde59b756174280d26916eb27f593e6ccBob Halley
58007c5fde59b756174280d26916eb27f593e6ccBob Halley        <script src='/build/yui/yui-min.js'></script>
58007c5fde59b756174280d26916eb27f593e6ccBob Halley
58007c5fde59b756174280d26916eb27f593e6ccBob Halley        <script>
58007c5fde59b756174280d26916eb27f593e6ccBob Halley
58007c5fde59b756174280d26916eb27f593e6ccBob Halley            YUI({
58007c5fde59b756174280d26916eb27f593e6ccBob Halley                base: '/build/',
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff                debug: true,
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff                combo: false,
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff                filter: 'raw'
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff            }).use('cssbutton', 'cssfonts', function(Y){
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff            });
a55d0a9080c8ef4117d2fc27f63220a56afb2434Andreas Gustafsson        </script>
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff    </head>
353dcaf1cc77d122d9b4b750bbbfc4c96b4b292bAndreas Gustafsson
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence    <body>
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff        <h1>Button Example: Icons</h1>
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff
58007c5fde59b756174280d26916eb27f593e6ccBob Halley        <button class="yui3-button">
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff            <span class="yui3-button-icon yui3-button-icon-bold"></span>
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff        </button>
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff        <button class="yui3-button">
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff            <span class="yui3-button-icon yui3-button-icon-bold"></span>
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff            Bold
a55d0a9080c8ef4117d2fc27f63220a56afb2434Andreas Gustafsson        </button>
7e4d75a5daeaaf8a7f559f9bd7fbf540184e235cMark Andrews
353dcaf1cc77d122d9b4b750bbbfc4c96b4b292bAndreas Gustafsson        <br /><br />
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence        <button class="yui3-button">
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence            <span class="yui3-button-icon yui3-button-icon-italic"></span>
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence        </button>
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence        <button class="yui3-button">
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff            <span class="yui3-button-icon yui3-button-icon-italic"></span>
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence            Italic
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff        </button>
58007c5fde59b756174280d26916eb27f593e6ccBob Halley
582952026017aee8b5fb8ada625165c579f7807bDavid Lawrence        <br /><br />
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff        <button class="yui3-button">
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff            <span class="yui3-button-icon yui3-button-icon-underline"></span>
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff        </button>
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff        <button class="yui3-button">
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff            <span class="yui3-button-icon yui3-button-icon-underline"></span>
5a0ffa97751ef1ff29d1bf9d7f332eeb9f8edc21Michael Graff            Underline
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence        </button>
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence
615f17d0171dd807c6803b25a255a8ea2051fbd4David Lawrence    </body>
58007c5fde59b756174280d26916eb27f593e6ccBob Halley</html>