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