src/main/resources/static/css/sone.css

   1 /* Sone Main CSS File */
   2
   3 /* first, override some fproxy rules. */
   4 #sone .post .reply div,#sone .post .time,#sone .post .delete,#sone .post .show-reply-form, input[type=text], textarea {
   5         font: inherit;
   6 }
   7
   8 input[type=text], textarea {
   9         font-size: 90%;
  10         margin: 0.5ex;
  11         margin-left: 0;
  12         border: solid 1px #ccc;
  13         padding: 0.5ex;
  14         height: 1.5em;
  15         width: 50em;
  16         outline: none;
  17 }
  18
  19 textarea {
  20         height: 4em;
  21 }
  22
  23 #sone form {
  24         margin: 0px;
  25 }
  26
  27 /* now for the real stuff. */
  28
  29 #sone {
  30         width: 55em;
  31         margin: auto;
  32 }
  33
  34 #sone .hidden {
  35         display: none;
  36 }
  37
  38 #sone a, #sone a:link, #sone a:visited {
  39         color: rgb(28, 131, 191);
  40         font-size: inherit;
  41         text-decoration: none;
  42 }
  43
  44 #sone a:active, #sone a:hover {
  45         color: rgb(255, 172, 0);
  46 }
  47
  48 #sone #profile {
  49         height: 80px;
  50         margin-bottom: 1ex;
  51 }
  52
  53 #sone .profile-link {
  54         font-weight: bold;
  55         color: rgb(28, 131, 191);
  56 }
  57
  58 #sone #profile.online .picture {
  59         position: absolute;
  60         background-image: url("../images/sone.png");
  61         width: 80px;
  62         height: 80px;
  63 }
  64
  65 #sone #profile.offline .picture {
  66         position: absolute;
  67         background-image: url("../images/sone-offline.png");
  68         width: 80px;
  69         height: 80px;
  70 }
  71
  72 #sone #profile.offline .edit-profile-link, #sone #profile.offline .profile-link {
  73         display: none;
  74 }
  75
  76 #sone #profile .edit-profile-link {
  77         font-size: 85%;
  78 }
  79
  80 #sone #home-sone {
  81         margin-top: 1ex;
  82         margin-left: 80px;
  83         padding-left: 1ex;
  84 }
  85
  86 #sone #update-status label {
  87         display: none;
  88 }
  89
  90 #sone #update-status input[type=text] {
  91         width: 45em;
  92 }
  93
  94 #sone #update-status textarea {
  95         width: 45em;
  96 }
  97
  98 #sone #update-status button {
  99         float: right;
 100 }
 101
 102 #sone .nice-name {
 103         font-weight: bold;
 104 }
 105
 106 #sone #main {
 107         padding: 1em;
 108 }
 109
 110 #sone .post {
 111         padding: 1ex 0px;
 112         border-bottom: solid 1px #ccc;
 113 }
 114
 115 #sone .post:last-child {
 116         padding: 1ex 0px;
 117         border-bottom: none;
 118 }
 119
 120 #sone .post .author {
 121         display: inline;
 122         font-weight: bold;
 123 }
 124
 125 #sone .post .text {
 126         display: inline;
 127         white-space: pre-wrap;
 128 }
 129
 130 #sone .post .status-line {
 131         clear: both;
 132         margin-top: 0.5ex;
 133         font-size: 85%;
 134 }
 135
 136 #sone .post .time {
 137         display: inline;
 138         color: #666;
 139 }
 140
 141 #sone .post .delete {
 142         display: inline;
 143 }
 144
 145 #sone .post .delete button {
 146         font: inherit;
 147         border: 0px;
 148         background: none;
 149         padding: 0px;
 150         color: rgb(28, 131, 191);
 151 }
 152
 153 #sone .post .delete button:hover {
 154         font: inherit;
 155         border: 0px;
 156         background: none;
 157         padding: 0px;
 158         color: rgb(255, 172, 0);
 159         cursor: pointer;
 160 }
 161
 162 #sone .post .delete:before {
 163         content: ' ‧ ';
 164 }
 165
 166 #sone .post .replies {
 167         clear: both;
 168         padding-top: 0.2ex;
 169 }
 170
 171 #sone .post .reply {
 172         clear: both;
 173         background-color: #f0f0ff;
 174         font-size: 85%;
 175         margin: 1ex 0px;
 176         padding: 1ex;
 177 }
 178
 179 #sone .post .reply .time {
 180         float: none;
 181         display: inline;
 182         color: #666;
 183         font-size: inherit;
 184 }
 185
 186 #sone .post .show-reply-form {
 187         display: inline;
 188 }
 189
 190 #sone .post .show-reply-form span {
 191         color: rgb(28, 131, 191);
 192         cursor: pointer;
 193         font: inherit;
 194 }
 195
 196 #sone .post .show-reply-form span:hover {
 197         color: rgb(255, 172, 0);
 198 }
 199
 200 #sone .post .show-reply-form:before {
 201         content: ' ‧ ';
 202 }
 203
 204 #sone .post .reply .status-line .delete {
 205         float: none;
 206         display: inline;
 207 }
 208
 209 #sone .post .reply .status-line .delete:before {
 210         content: ' · ';
 211 }
 212
 213 #sone .post .create-reply {
 214         clear: both;
 215         background-color: #f0f0ff;
 216         padding: 0.5ex;
 217 }
 218
 219 #sone .post .create-reply input[type=text] {
 220         margin-left: 0.5ex;
 221         width: 50em;
 222 }
 223
 224 #sone .post .create-reply textarea {
 225         margin-left: 0.5ex;
 226         width: 50em;
 227         height: 4em;
 228 }
 229
 230 #sone .post .create-reply button {
 231         float: right;
 232 }
 233
 234 #sone .sone {
 235         clear: both;
 236         background-color: #f0f0ff;
 237         border: 1px solid #ccc;
 238         margin-bottom: 0.5ex;
 239         padding: 0.5ex;
 240 }
 241
 242 #sone .sone .id {
 243         display: none;
 244 }
 245
 246 #sone .sone .profile-link {
 247         display: block;
 248 }
 249
 250 #sone .sone .short-request-uri {
 251         clear: both;
 252         float: right;
 253 }
 254
 255 #sone .sone .unknown-marker, #sone .sone .download-marker, #sone .sone .insert-marker, #sone .sone .idle-marker, #sone .sone .modified-marker {
 256         display: none;
 257 }
 258
 259 #sone .sone.unknown .unknown-marker, #sone .sone.idle .idle-marker, #sone .sone.downloading .download-marker, #sone .sone.inserting .insert-marker, #sone .sone.modified .modified-marker {
 260         display: inline;
 261         float: right;
 262         border: solid 1px #ccc;
 263         border-right: none;
 264         border-top: none;
 265         padding: 0 0.5ex;
 266         position: relative;
 267         right: -0.5ex;
 268         top: -0.5ex
 269 }
 270
 271 #sone .sone .last-update {
 272         float: right;
 273         display: inline;
 274 }
 275
 276 #sone .sone .modified-marker, #sone .sone .unknown-marker {
 277         color: red;
 278         font-weight: bold;
 279 }
 280
 281 #sone .sone form {
 282         display: inline;
 283         border: solid 1px #ccc;
 284         border-left: none;
 285         border-bottom: none;
 286         padding: 0 0.5ex;
 287         position: relative;
 288         left: -0.5ex;
 289         bottom: -0.5ex
 290 }
 291
 292 #sone .sone form.block button, #sone .sone form.unblock button, #sone .sone form.follow button, #sone .sone form.unfollow button {
 293         display: inline;
 294         color: rgb(28, 131, 191);
 295         background: none;
 296         border: none;
 297         font: inherit;
 298         padding: 0px;
 299 }
 300
 301 #sone .sone form.block button:hover, #sone .sone form.unblock button:hover, #sone .sone form.follow button:hover, #sone .sone form.unfollow button:hover {
 302         display: inline;
 303         color: rgb(255, 172, 0);
 304 }
 305
 306 #sone .sone .spacer {
 307         display: inline;
 308 }
 309
 310 #sone #create-sone {
 311
 312 }
 313
 314 #sone #tail .import-key, #sone #import-key .import-key {
 315         margin-top: 1em;
 316         border-top: solid 1px #ccc;
 317         padding-top: 1em;
 318         text-align: center;
 319         font-size: 75%;
 320         color: #888;
 321 }
 322
 323 #sone #import-key .import-key {
 324         border-top: none;
 325 }
 326
 327 #sone #add-sone textarea, #sone #create-sone textarea, #sone #load-sone textarea {
 328         height: 1.5em;
 329 }
 330
 331 #sone #add-sone button {
 332         position: absolute;
 333 }
 334
 335 #sone h1 {
 336         font-family: inherit;
 337         font-size: 200%;
 338         font-weight: bold;
 339 }
 340
 341 #sone .error label {
 342         color: red;
 343         font-weight: bold;
 344 }
 345
 346 #sone input.default {
 347         color: #888;
 348 }
 349
 350 #sone input[type=text].key {
 351         width: 130ex;;
 352         font-size: 75%;
 353 }