www/css/blerg.css

   1 /* Blerg is (C) 2011 The Dominion of Awesome, and is distributed under a
   2  * BSD-style license.  Please see the COPYING file for details.
   3  */
   4 @font-face {
   5         font-family: "Alte Haas Grotesk Bold";
   6         src: url("/fonts/AlteHaasGroteskBold.ttf");
   7 }
   8
   9 body {
  10         margin: 0;
  11         font-family: sans-serif;
  12         background-color: white;
  13 }
  14
  15 a.ref {
  16         color: #404040;
  17 }
  18
  19 a > img {
  20         border: 0;
  21 }
  22
  23 .blerg-header {
  24         background-color: #1E1E1E;
  25         color: white;
  26         padding: 8px 8px 16px 8px;
  27 }
  28
  29 .blerg-header .logo {
  30         float: left;
  31         margin-right: 10px;
  32 }
  33
  34 .blerg-header h1 {
  35         margin: 4px 0 0 0;
  36         font-size: 65px;
  37         text-shadow: black 0px 2px;
  38 }
  39
  40 .blerg-header h1 a {
  41         text-decoration: none;
  42 }
  43
  44 .blerg-header h1 a:hover {
  45         text-decoration: underline;
  46 }
  47
  48 .blerg-header a {
  49         color: inherit;
  50 }
  51
  52 .blerg-header h2 {
  53         margin: 0;
  54         font-size: 28px;
  55         text-shadow: black 0px 1px;
  56 }
  57
  58 .blerg-header .onyx-input, .blerg-header .onyx-textarea {
  59         color: white;
  60 }
  61
  62 .blerg-header .onyx-focused > .onyx-input, .blerg-header .onyx-focused > .onyx-textarea {
  63         color: black;
  64 }
  65
  66 .blerg-controls {
  67         float: right;
  68         position: relative;
  69         width: 50%;
  70         margin-top: 8px;
  71         margin-right: 8px;
  72         font-size: large;
  73         text-align: right;
  74         height: 114px;
  75 }
  76
  77 .blerg-controls-toolbar {
  78         position: absolute;
  79         right: 0;
  80         bottom: 0;
  81 }
  82
  83 .blerg-controls-toolbar .onyx-button {
  84         margin-left: 4pt;
  85         font-size: 14pt;
  86 }
  87
  88 .feed-button.new {
  89         background-color: #E4C010;
  90 }
  91
  92 .spew-button {
  93         color: #333;
  94         background-color: #0D0;
  95         font-weight: bold;
  96 }
  97
  98 .spew-button::after {
  99         content: " ▼";
 100 }
 101
 102 .spew-button.active::after {
 103         content: " ▲";
 104 }
 105
 106 h2 {
 107         font-size: 20pt;
 108         margin-bottom: 28pt;
 109 }
 110
 111 h1, h2, h3 {
 112         font-family: "Alte Haas Grotesk Bold", sans-serif;
 113 }
 114
 115 .blerg-main {
 116         padding: 15pt 15pt 20pt 15pt;
 117 }
 118
 119 .blerg-main h2 {
 120         margin: 8pt 0;
 121 }
 122
 123 .blerg-post {
 124         padding: 20pt 20pt 16pt 20pt;
 125 }
 126
 127 .blerg-post h2 {
 128         font-size: 14pt;
 129         margin: 0;
 130 }
 131
 132 .blerg-post .buttons {
 133         text-align: right;
 134 }
 135
 136 .blerg-post .buttons .onyx-button {
 137         margin-left: 4pt;
 138         height: 0.4in;
 139         width: 1in;
 140 }
 141
 142 .blerg-post .onyx-input-decorator {
 143         display: block;
 144         border-color: #999;
 145         margin: 4pt 0;
 146 }
 147
 148 .blerg-post .onyx-textarea {
 149         display: block;
 150         width: 100%;
 151 }
 152
 153 .blerg-post .content {
 154         font-size: 14pt;
 155         font-family: sans-serif;
 156         height: 51pt;
 157 }
 158
 159 .login {
 160         display: inline-block;
 161         width: 200px;
 162 }
 163
 164 .login .onyx-button {
 165         width: 100%;
 166         margin-top: 4pt;
 167 }
 168
 169 .login .enyo-input {
 170         width: 100%;
 171 }
 172
 173 .blerg-user-controls {
 174         font-size: 14pt;
 175         text-align: right;
 176 }
 177
 178 .blerg-user-controls a {
 179         color: inherit;
 180         text-decoration: none;
 181         margin-left: 4pt;
 182 }
 183
 184 .blerg-user-controls a:hover {
 185         text-decoration: underline;
 186 }
 187
 188
 189 .record {
 190         margin: 8pt 0 24pt 0;
 191         font-size: 14pt;
 192 }
 193
 194 .record p {
 195         margin-bottom: 0;
 196 }
 197
 198 .record .info {
 199         color: #8F8F8F;
 200         font-size: small;
 201         font-style: italic;
 202 }
 203
 204 .record .info a {
 205         color: #8F8F8F;
 206 }
 207
 208 .record h1 {
 209         font-size: 18pt;
 210         margin: 1em 0;
 211 }
 212
 213 .record h2 {
 214         font-size: 16pt;
 215         margin: 1em 0;
 216 }
 217
 218 .record h3 {
 219         font-size: 14pt;
 220         margin: 1em 0;
 221 }
 222
 223 .record h4 {
 224         font-size: 14pt;
 225         font-weight: normal;
 226         margin: 1em 0;
 227 }
 228
 229 .record h5 {
 230         font-size: 14pt;
 231         font-weight: normal;
 232         font-style: italic;
 233         margin: 1em 0;
 234 }
 235
 236 .latest h2 {
 237         font-size: 16pt;
 238 }
 239
 240 .latest-tags {
 241         text-align: center;
 242         line-height: 2em;
 243 }
 244
 245 .latest-tags a {
 246         margin: 0 0.75em;
 247 }
 248
 249 .latest-posts {
 250         height: 184pt;
 251         overflow: hidden;
 252 }
 253
 254 .latest-posts .record {
 255         font-size: 12pt;
 256         margin: 8pt 0;
 257 }
 258
 259 .author {
 260         font-weight: bold;
 261 }
 262
 263 .quote {
 264         border-left: 2px solid blue;
 265         padding-left: 6px;
 266         margin-left: 2px;
 267 }
 268
 269 .blerg-dialog {
 270         width: 300px;
 271         padding: 8px;
 272 }
 273
 274 .blerg-dialog h2 {
 275         font-size: 14pt;
 276         margin: 0;
 277 }
 278
 279 .blerg-dialog .onyx-groupbox {
 280         margin: 8px 0;
 281 }
 282
 283 .blerg-dialog .onyx-button {
 284         display: block;
 285         margin: 8px 0 0 0;
 286         width: 100%;
 287 }
 288
 289 .blerg-dialog .onyx-input {
 290         width: 100%;
 291         color: white;
 292 }
 293
 294 .blerg-dialog .onyx-focused > .onyx-input {
 295         color: black;
 296 }
 297
 298 .blerg-error {
 299         color: red;
 300         font-weight: bold;
 301 }
 302
 303 table.help td {
 304         padding: 2pt 8pt;
 305 }