examples/index.html

   1 <html>
   2 <head>
   3     <title>Ext JS 3.3 Examples</title>
   4
   5     <style type="text/css">
   6
   7     #all-demos {
   8
   9     }
  10     #all-demos dd {
  11         cursor:pointer;
  12         float:left;
  13         height:100px;
  14         margin:5px 5px 5px 10px;
  15         width:300px;
  16         zoom:1;
  17     }
  18     #all-demos dd img {
  19         border: 1px solid #ddd;
  20         float:left;
  21         height:90px;
  22         margin:5px 0 0 5px;
  23         width:120px;
  24     }
  25
  26     #all-demos dd div {
  27         float:left;
  28         margin-left:10px;
  29         width:160px;
  30     }
  31
  32     #all-demos dd h4 {
  33         color:#555;
  34         font-size:11px;
  35         font-weight:bold;
  36     }
  37     #all-demos dd p {
  38         color:#777;
  39     }
  40     #all-demos dd.over {
  41         background: #F5FDE3 url(shared/extjs/images/sample-over.gif) no-repeat;
  42     }
  43     #loading-mask{
  44         background-color:white;
  45         height:100%;
  46         position:absolute;
  47         left:0;
  48         top:0;
  49         width:100%;
  50         z-index:20000;
  51     }
  52     #loading{
  53         height:auto;
  54         position:absolute;
  55         left:45%;
  56         top:40%;
  57         padding:2px;
  58         z-index:20001;
  59     }
  60     #loading a {
  61         color:#225588;
  62     }
  63     #loading .loading-indicator{
  64         background:white;
  65         color:#444;
  66         font:bold 13px Helvetica, Arial, sans-serif;
  67         height:auto;
  68         margin:0;
  69         padding:10px;
  70     }
  71     #loading-msg {
  72         font-size: 10px;
  73         font-weight: normal;
  74     }
  75
  76     #all-demos .x-panel-body {
  77         background-color:#fff;
  78         border:1px solid;
  79         border-color:#fafafa #fafafa #fafafa #fafafa;
  80     }
  81     #sample-ct {
  82         border:1px solid;
  83         border-color:#dadada #ebebeb #ebebeb #dadada;
  84         padding:2px;
  85     }
  86
  87     #all-demos h2 {
  88         border-bottom: 2px solid #99bbe8;
  89         cursor:pointer;
  90         padding-top:6px;
  91     }
  92     #all-demos h2 div {
  93         background:transparent url(../resources/images/default/grid/group-expand-sprite.gif) no-repeat 3px -47px;
  94         color:#3764a0;
  95         font:bold 11px Helvetica, Arial, sans-serif;
  96         padding:4px 4px 4px 17px;
  97     }
  98     #all-demos .collapsed h2 div {
  99         background-position: 3px 3px;
 100     }
 101     #all-demos .collapsed dl {
 102         display:none;
 103     }
 104     .x-window {
 105         text-align:left;
 106     }
 107     #all-demos dd h4 span.new-sample{
 108         color: red;
 109     }
 110
 111     #all-demos dd h4 span.updated-sample{
 112         color: blue;
 113     }
 114     </style>
 115 </head>
 116 <body>
 117 <div id="loading-mask" style=""></div>
 118 <div id="loading">
 119     <div class="loading-indicator"><img src="shared/extjs/images/extanim32.gif" width="32" height="32" style="margin-right:8px;float:left;vertical-align:top;"/>Ext JS 3.3 - <a href="http://www.sencha.com">sencha.com</a><br /><span id="loading-msg">Loading styles and images...</span></div>
 120 </div>
 121
 122 <div id="viewport">
 123
 124 <div id="hd">
 125     <a href="/" id="logo"><img src="../welcome/images/logo-sencha-sm.png" alt="Sencha" width="120" height="50" /></a>
 126
 127 </div>
 128
 129 <div id="bd">
 130     <h1 id="pagetitle">Ext JS 3.3 Samples <a href="../docs/">View Documentation</a></h1>
 131     <div class="left-column">
 132         <div id="sample-spacer" style="height:800px;"></div>
 133
 134         <link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css" />
 135         <link rel="stylesheet" type="text/css" href="shared/extjs/css/extjs.css" />
 136
 137         <script type="text/javascript">document.getElementById('loading-msg').innerHTML = 'Loading Core API...';</script>
 138         <script type="text/javascript" src="../adapter/ext/ext-base.js"></script>
 139         <script type="text/javascript">document.getElementById('loading-msg').innerHTML = 'Loading UI Components...';</script>
 140         <script type="text/javascript" src="../ext-all-debug.js"></script>
 141         <script type="text/javascript">document.getElementById('loading-msg').innerHTML = 'Initializing...';</script>
 142
 143         <!-- App.js contains Ext.App, a simple, re-usable Application component -->
 144         <script type="text/javascript" src="shared/extjs/App.js"></script>
 145         <script type="text/javascript" src="shared/extjs/site.js"></script>
 146         <script type="text/javascript" src="data.js"></script>
 147         <script type="text/javascript" src="init.js"></script>
 148
 149         <div id="all-demos">
 150         </div>
 151     </div>
 152
 153     <div class="right-column">
 154         <div class="side-box"><div class="side-box-inner">
 155             <ul id="sample-menu" class="features"></ul>
 156         </div></div>
 157     </div>
 158
 159     <div style="clear:both"></div>
 160 </div><!-- end bd -->
 161
 162 <div id="ft">
 163     <div class="copy">&copy; 2006-2010 Sencha Inc.</div>
 164 </div>
 165
 166 </div><!-- end viewport -->
 167
 168
 169 </body>
 170 </html>