--- /dev/null
+<html>
+<head>
+<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
+<title>Ext JS Themes Example</title>
+
+ <!-- Standard includes -->
+ <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
+ <link rel="stylesheet" type="text/css" href="../../resources/css/xtheme-blue.css" />
+ <script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
+ <script type="text/javascript" src="../../ext-all-debug.js"></script>
+
+ <!-- Theme includes -->
+ <link rel="stylesheet" type="text/css" title="blue" href="../../resources/css/xtheme-blue.css" />
+ <link rel="stylesheet" type="text/css" title="gray" href="../../resources/css/xtheme-gray.css" />
+ <link rel="stylesheet" type="text/css" title="access" href="../../resources/css/xtheme-access.css" />
+ <link rel="stylesheet" type="text/css" title="yourtheme" href="../../resources/css/yourtheme.css" />
+ <!--
+ By default, yourtheme.css is an exact copy of x-themeblue.css.
+ Customize your theme by editing yourtheme.css and customize your
+ own images in the images/yourtheme/ directory.
+ -->
+
+ <script type="text/javascript" src="themes.js"></script>
+ <script type="text/javascript" src="styleswitcher.js"></script>
+
+ <style type="text/css">
+ body {
+ font-family: 'Helvetica Neue',tahoma,helvetica,sans-serif;
+ font-size: 12px;
+ }
+
+ h1 a:link, h1 a:visited {
+ color: #046BCA;
+ }
+
+ h1 a:hover, h1 a:focus, h1 a:active {
+ color: #1C417C;
+ }
+
+ div#header {
+ height: 65px;
+ width: 1090px;
+ padding: 25px 0 10px 0;
+ margin: 0 50px;
+ }
+ div#header h1 {
+ font-family: MyriadPro-Semibold, 'Myriad Pro Semibold', 'Myriad Pro', 'Trebuchet MS', Tahoma, arial, sans-serif;
+ font-size: 250%;
+ }
+ .x-viewport body {
+ overflow: auto;
+ }
+ form#styleswitcher {
+ background-color: #f3f3f3;
+ background-color: rgba(243,243,243,.333);
+ border: 1px solid #ddd;
+ border-color: rgba(221,221,221,.333);
+ border-radius: 8px;
+ -moz-border-radius: 8px;
+ -ms-border-radius: 8px;
+ -o-border-radius: 8px;
+ -webkit-border-radius: 8px;
+
+ float: right;
+ padding: 8px 10px;
+
+ width: auto;
+ }
+ form#styleswitcher select {
+ font-size: 16px;
+ line-height: 16px;
+ }
+ div#header h1 span {
+ color: inherit;
+ font-family: 'Helvetica Neue',tahoma,helvetica,verdana, sans-serif;
+ font-size: 12px;
+ font-weight: normal;
+ line-height: 16px;
+ padding-left: 25px;
+ }
+ </style>
+</head>
+
+<body>
+ <div id="header">
+ <form id="styleswitcher">
+ <label for="styleswitcher_select">Choose Theme: </label>
+ <select name="styleswitcher_select" id="styleswitcher_select">
+ <option value="blue" selected="true">Blue Theme</option>
+ <option value="gray">Gray Theme</option>
+ <option value="access">Accessibility Theme</option>
+ <option value="yourtheme">Your Theme</option>
+ </select>
+ </form>
+ <h1>Ext JS Themes <span>View and test every Ext component against bundled <a href="http://www.extjs.com/products/js/themes.php">Ext Themes</a>, or, your own custom themes.</span></h1>
+ </div>
+</body>
+</html>
\ No newline at end of file