examples/index.html

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