johnmuhl / switch

a stupid layout switcher for mootools

switch / demo.html
raw normal view history
8ac57b9a » johnmuhl 2008-06-29 add demo 1 <!doctype html>
2 <title>switch demo</title>
3 <style>
4 h1 {
5 color: black;
6 }
7 h1:after {
8 content: " -- you'll probably never see this.";
9 }
10 .xx-small h1 {
11 color: aqua;
12 }
13 .xx-small h1:after {
14 content: " -- xx-small";
15 }
16 .x-small h1 {
17 color: blue;
18 }
19 .x-small h1:after {
20 content: " -- x-small";
21 }
22 .small h1 {
23 color: fuchsia;
24 }
25 .small h1:after {
26 content: " -- small";
27 }
28 .medium h1 {
29 color: lime;
30 }
31 .medium h1:after {
32 content: " -- medium";
33 }
34 .large h1 {
35 color: purple;
36 }
37 .large h1:after {
38 content: " -- large";
39 }
40 .x-large h1 {
41 color: red;
42 }
43 .x-large h1:after {
44 content: " -- x-large";
45 }
46 .xx-large h1 {
47 color: teal;
48 }
49 .xx-large h1:after {
50 content: " -- xx-large";
51 }
eb367348 » johnmuhl 2008-06-29 update demo to include the ... 52 .xxx-large h1 {
53 color: maroon;
54 }
55 .xxx-large h1:after {
56 content: " -- xxx-large";
57 }
8ac57b9a » johnmuhl 2008-06-29 add demo 58 </style>
59 <script src="mootools.js"></script>
60 <script src="switch.js"></script>
e009238b » johnmuhl 2008-06-29 apply demo changes from master 61 <body class="indestructible"><h1>Switch!</h1></body>