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 a {
  41         color: inherit;
  42         text-decoration: none;
  43 }
  44
  45 .blerg-header a:hover {
  46         text-decoration: underline;
  47 }
  48
  49 .blerg-header h2 {
  50         margin: 0;
  51         font-size: 28px;
  52         text-shadow: black 0px 1px;
  53 }
  54
  55 .blerg-header .onyx-input, .blerg-header .onyx-textarea {
  56         color: white;
  57 }
  58
  59 .blerg-header .onyx-focused > .onyx-input, .blerg-header .onyx-focused > .onyx-textarea {
  60         color: black;
  61 }
  62
  63 .blerg-controls {
  64         float: right;
  65         position: relative;
  66         width: 50%;
  67         margin-top: 8px;
  68         margin-right: 8px;
  69         font-size: large;
  70         text-align: right;
  71         height: 114px;
  72 }
  73
  74 .blerg-controls-toolbar {
  75         position: absolute;
  76         right: 0;
  77         bottom: 0;
  78 }
  79
  80 .blerg-controls-toolbar .onyx-button {
  81         margin-left: 4pt;
  82         font-size: 14pt;
  83 }
  84
  85 .feed-button.new {
  86         background-color: #E4C010;
  87 }
  88
  89 .spew-button {
  90         color: #333;
  91         background-color: #0D0;
  92         font-weight: bold;
  93 }
  94
  95 .spew-button::after {
  96         content: " ▼";
  97 }
  98
  99 .spew-button.active::after {
 100         content: " ▲";
 101 }
 102
 103 h2 {
 104         font-size: 20pt;
 105         margin-bottom: 28pt;
 106 }
 107
 108 h1, h2, h3 {
 109         font-family: "Alte Haas Grotesk Bold", sans-serif;
 110 }
 111
 112 .blerg-main {
 113         padding: 15pt 15pt 20pt 15pt;
 114 }
 115
 116 .blerg-main h2 {
 117         margin: 8pt 0;
 118 }
 119
 120 .blerg-post {
 121         padding: 20pt 20pt 16pt 20pt;
 122 }
 123
 124 .blerg-post h2 {
 125         font-size: 14pt;
 126         margin: 0;
 127 }
 128
 129 .blerg-post .buttons {
 130         text-align: right;
 131 }
 132
 133 .blerg-post .buttons .onyx-button {
 134         margin-left: 4pt;
 135         height: 0.4in;
 136         width: 1in;
 137 }
 138
 139 .blerg-post .onyx-input-decorator {
 140         display: block;
 141         border-color: #999;
 142         margin: 4pt 0;
 143 }
 144
 145 .blerg-post .onyx-textarea {
 146         display: block;
 147         width: 100%;
 148 }
 149
 150 .blerg-post .content {
 151         font-size: 14pt;
 152         font-family: sans-serif;
 153         height: 51pt;
 154 }
 155
 156 .login {
 157         display: inline-block;
 158         width: 200px;
 159 }
 160
 161 .login .onyx-button {
 162         width: 100%;
 163         margin-top: 4pt;
 164 }
 165
 166 .login .enyo-input {
 167         width: 100%;
 168 }
 169
 170 .blerg-user-controls {
 171         font-size: 14pt;
 172         text-align: right;
 173 }
 174
 175 .blerg-user-controls a {
 176         color: inherit;
 177         text-decoration: none;
 178         margin-left: 4pt;
 179 }
 180
 181 .blerg-user-controls a:hover {
 182         text-decoration: underline;
 183 }
 184
 185
 186 .record {
 187         margin: 8pt 0 24pt 0;
 188         font-size: 14pt;
 189 }
 190
 191 .record p {
 192         margin-bottom: 0;
 193 }
 194
 195 .record .info {
 196         color: #8F8F8F;
 197         font-size: small;
 198         font-style: italic;
 199 }
 200
 201 .record .info a {
 202         color: #8F8F8F;
 203 }
 204
 205 .latest h2 {
 206         font-size: 16pt;
 207 }
 208
 209 .latest-tags {
 210         text-align: center;
 211         line-height: 2em;
 212 }
 213
 214 .latest-tags a {
 215         margin: 0 0.75em;
 216 }
 217
 218 .latest-posts {
 219         height: 184pt;
 220         overflow: hidden;
 221 }
 222
 223 .latest-posts .record {
 224         font-size: 12pt;
 225         margin: 8pt 0;
 226 }
 227
 228 .author {
 229         font-weight: bold;
 230 }
 231
 232 .quote {
 233         border-left: 2px solid blue;
 234         padding-left: 6px;
 235         margin-left: 2px;
 236 }
 237
 238 .blerg-dialog {
 239         width: 300px;
 240         padding: 8px;
 241 }
 242
 243 .blerg-dialog h2 {
 244         font-size: 14pt;
 245         margin: 0;
 246 }
 247
 248 .blerg-dialog .onyx-groupbox {
 249         margin: 8px 0;
 250 }
 251
 252 .blerg-dialog .onyx-button {
 253         display: block;
 254         margin: 8px 0 0 0;
 255         width: 100%;
 256 }
 257
 258 .blerg-dialog .onyx-input {
 259         width: 100%;
 260         color: white;
 261 }
 262
 263 .blerg-dialog .onyx-focused > .onyx-input {
 264         color: black;
 265 }
 266
 267 .blerg-error {
 268         color: red;
 269         font-weight: bold;
 270 }