skins/common/feed.css

   1 /*
   2 Make RSS and Atom feeds at least semi-legible to folk who accidentally
   3 load them in a browser...
   4
   5 Compatibility:
   6 * Mozilla is fine.
   7 * Safari 1.2: the RSS <link> text isn't shown
   8 * Opera 7.5 uses the style sheet instead of its native RSS mode.
   9 * IE/Mac 5.2: none of the :before content works; doesn't get the charset right and displays garbage for non-ASCII.
  10 * IE/Win 6.0: No background color, borders, font size, font weight, or :before content.
  11
  12 */
  13
  14 /* RSS: */ rss, channel, title, link, description, language, generator, lastBuildDate, item, pubDate, author, comments, creator,
  15 /* Atom: */ feed, id, modified, tagline, entry, issued, created, updated, summary, comment {
  16         display: block;
  17 }
  18
  19 rss, feed {
  20         background: white;
  21         color: black;
  22         margin: 1em;
  23         font-family: "Verdana", "Tahoma", "Arial", "Helvetica", sans-serif;
  24         line-height: 1.5em;
  25         font-size: 76%;
  26 }
  27
  28 rss:before {
  29         content: "This RSS feed is meant to be read in a syndicated news reader, and isn't ideal for a web browser.";
  30 }
  31
  32 feed:before {
  33         content: "This Atom feed is meant to be read in a syndicated news reader, and isn't ideal for a web browser.";
  34 }
  35
  36 rss:before, feed:before {
  37         color: red;
  38         text-align: center;
  39         line-height: 2em;
  40 }
  41
  42 channel > title,
  43 item > title,
  44 feed > title,
  45 entry > title {
  46         font-weight: bold;
  47         border-bottom: solid 1px #aaa;
  48         margin-left: -0.5em;
  49 }
  50
  51 channel > title, feed > title {
  52         font-size: larger;
  53 }
  54
  55 item > title, entry > title {
  56         font-size: large;
  57 }
  58
  59 item, entry {
  60         margin-top: 1em;
  61         margin-left: 2em;
  62 }
  63
  64 item > description, entry > summary {
  65         white-space: pre;
  66         overflow: auto;
  67         background: #f8f8ff;
  68 }
  69
  70 pubDate:before {
  71         content: "Date: ";
  72 }
  73
  74 link:before {
  75         content: "Link: ";
  76 }
  77
  78 author:before, creator:before {
  79         content: "Author: ";
  80 }
  81
  82 description:before {
  83         content: "Description: ";
  84 }
  85
  86 id:before {
  87         content: "Id: ";
  88 }
  89
  90 generator:before {
  91         content: "Generator: ";
  92 }
  93
  94 language:before {
  95         content: "Language: ";
  96 }
  97
  98 lastBuildDate:before {
  99         content: "Updated: ";
 100 }
 101
 102 comments:before {
 103         content: "Comments page: ";
 104 }
 105
 106 tagline:before {
 107         content: "Tagline: ";
 108 }
 109
 110 issued:before {
 111         content: "Issued: ";
 112 }
 113
 114 created:before {
 115         content: "Created: ";
 116 }
 117
 118 modified:before {
 119         content: "Modified: ";
 120 }
 121
 122 updated:before {
 123         content: "Updated: ";
 124 }
 125
 126 summary:before {
 127         content: "Summary: ";
 128 }
 129
 130 comment:before {
 131         content: "Comment: ";
 132 }
 133
 134 pubDate:before, link:before, author:before, description:before,
 135 language:before, generator:before, lastBuildDate:before, comments:before,
 136 tagline:before, issued:before, created:before, modified:before,
 137 summary:before, comment:before, creator:before, id:before, updated:before {
 138         color: #224;
 139         font-weight: bold;
 140 }
 141
 142 feed link:after {
 143         content: attr(href);
 144 }