examples/app/feed-viewer/feed-viewer.html

   1 <html>
   2 <head>
   3     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   4     <title id="page-title">MVC Feed Viewer</title>
   5
   6     <link rel="stylesheet" type="text/css" href="../../../resources/css/ext-all.css">
   7     <script type="text/javascript" src="../../../builds/ext-core.js"></script>
   8     <script type="text/javascript" src="classes.js"></script>
   9     <script type="text/javascript" src="app.js"></script>
  10
  11     <style type="text/css" media="screen">
  12         /**
  13          * Icons
  14          */
  15
  16         .summary {
  17              background-image: url(images/details.gif) !important;
  18         }
  19
  20         .reading {
  21              background-image: url(images/article.gif) !important;
  22         }
  23
  24         .post-go {
  25             background-image: url(images/post_go.gif) !important;
  26         }
  27
  28         .tab-new {
  29             background-image: url(images/tab_new.gif) !important;
  30         }
  31
  32         .feed-add {
  33             background-image: url(images/rss_add.gif) !important;
  34         }
  35
  36         .feed-remove {
  37             background-image: url(images/rss_delete.gif) !important;
  38         }
  39
  40         .feed-load {
  41             background-image: url(images/rss_load.gif) !important;
  42         }
  43
  44         .details {
  45             background-image: url(images/details.gif) !important;
  46         }
  47
  48         .open-all {
  49             background-image: url(images/tabs.gif) !important;
  50         }
  51
  52         .feed {
  53             width: 16px;
  54             height: 16px;
  55             background-image: url(images/rss.gif) !important;
  56         }
  57
  58         /**
  59          * Other styles
  60          */
  61         .feed-picker-url {
  62             float: left;
  63             width: 425px;
  64         }
  65         .feed-picker-title {
  66         /*    float: left;*/
  67             color: #777;
  68             font-size: 10px;
  69         }
  70
  71         .feed-list {
  72             padding: 0 3px 0 3px;
  73         }
  74
  75         .feed-list-item {
  76             margin-top: 3px;
  77             padding-left: 20px;
  78             font-size: 11px;
  79             line-height: 20px;
  80             cursor: pointer;
  81             background: url(images/rss.gif) no-repeat 0 2px;
  82             border: 1px solid #fff;
  83         }
  84
  85         .feed-list .x-item-selected {
  86             font-weight: bold;
  87             color: #15428B;
  88             background-color: #DFE8F6;
  89             border: 1px dotted #A3BAE9;
  90         }
  91
  92         .feed-list-item-hover {
  93             background-color: #eee;
  94         }
  95
  96         .topic {
  97             padding: 2px 0 0 20px;
  98             background:transparent url(images/post.gif) no-repeat;
  99         }
 100
 101         .topic b {
 102             font-family: tahoma, verdana;
 103             display: block;
 104             color: #333;
 105         }
 106
 107         .author: {
 108             color: #333
 109         }
 110
 111         .post-date {
 112             font-weight:bold;
 113             color:#333;
 114         }
 115
 116         .feed-grid .x-grid-rowbody {
 117             margin: 5px 20px 10px 25px !important;
 118             color: #555;
 119             font-size: 11px;
 120         }
 121
 122         /* Preview classes */
 123
 124         .preview .x-panel-body {
 125             background:#fff;
 126             color:#222;
 127             font:normal 12px tahoma,verdana,arial,sans-serif;
 128         }
 129
 130         .preview .x-panel-body p {
 131             line-height:18px;
 132             margin:8px 0;
 133         }
 134
 135         .preview .x-panel-body ul {
 136             margin-left:18px;
 137         }
 138
 139         .preview .x-panel-body ul li {
 140             display:list-item;
 141             list-style-image:none !important;
 142             list-style-position:outside !important;
 143             list-style-type:disc !important;
 144             margin-left:18px;
 145         }
 146
 147         .preview .x-panel-body pre, #preview .x-panel-body code {
 148             background:#f1f1f1;
 149             display:block;
 150         }
 151
 152         .preview .x-panel-body h4.post-author {
 153             font-weight:normal;
 154             color:#555;
 155             font-size:11px;
 156         }
 157         .preview .x-panel-body span.post-date {
 158             font-weight:normal;
 159             color:#555;
 160             float:right;
 161             font-size:11px;
 162         }
 163         .preview .x-panel-body div.post-data {
 164             background:#f1f2f4;
 165             padding:5px;
 166             border-bottom:1px solid #dadadb;
 167         }
 168         .preview .x-panel-body div.post-body {
 169             padding:10px;
 170         }
 171
 172         .x-tab-bar-body {
 173             border-width: 1px 1px 0 1px !important;
 174         }
 175     </style>
 176 </head>
 177 <body>
 178
 179 </body>
 180 </html>