jappixmini/jappix/css/mobile.css

   1 /*
   2
   3 Jappix - An open social platform
   4 This is the Jappix Mobile CSS stylesheet
   5
   6 -------------------------------------------------
   7
   8 License: AGPL
   9 Author: Vanaryon
  10 Last revision: 05/10/11
  11
  12 */
  13
  14 /* BEGIN GENERAL STYLE */
  15
  16 * {
  17         margin: 0;
  18         padding: 0;
  19 }
  20
  21 body {
  22         font: normal 14.4px Helvetica, Verdana, sans-serif;
  23         background-color: #dcdcdc;
  24         margin: 0 auto;
  25         text-align: center;
  26         min-width: 200px;
  27         min-height: 260px;
  28 }
  29
  30 a {
  31         color: black;
  32 }
  33
  34 /* END GENERAL STYLE */
  35
  36 /* BEGIN HEADER STYLE */
  37
  38 .header {
  39         background-color: #2d2d2d;
  40         border-bottom: 1px solid #6d6d6d;
  41         color: #405964;
  42         padding: 6px 0;
  43         height: 30px;
  44 }
  45
  46 .header div {
  47         background-position: 0 0;
  48         width: 83px;
  49         height: 30px;
  50 }
  51
  52 /* END HEADER STYLE */
  53
  54 /* BEGIN HOME STYLE */
  55
  56 #home .header div {
  57         margin: 0 auto;
  58 }
  59
  60 #home .notification {
  61         padding: 2px;
  62         margin-top: -1px;
  63 }
  64
  65 #noscript {
  66         background: #86a2ff;
  67         border-bottom: 1px solid #5890d6;
  68         color: #1e4b82;
  69 }
  70
  71 #error {
  72         background: #ff8686;
  73         border-bottom: 1px solid #d65858;
  74         color: #821e1e;
  75         display: none;
  76 }
  77
  78 #info {
  79         background: #f3eba7;
  80         border-bottom: 1px solid #d9d085;
  81         color: #5e5616;
  82         display: none;
  83 }
  84
  85 #home .login {
  86         padding: 8px 0;
  87         margin: 30px 0 30px 0;
  88 }
  89
  90 #home .login input {
  91         margin-top: 5px;
  92         padding: 2px;
  93 }
  94
  95 #home .login input.xid,
  96 #home .login input.password {
  97         display: block;
  98         margin: 4px auto;
  99         font-size: 0.85em;
 100         padding: 4px;
 101         background-color: white;
 102         border: 1px solid #636363;
 103         width: 150px;
 104         padding-left: 24px;
 105 }
 106
 107 #home .login input.xid {
 108         background-position: 4px -30px;
 109 }
 110
 111 #home .login input.password {
 112         background-position: 4px -53px;
 113 }
 114
 115 #home .login label {
 116         margin-bottom: 12px;
 117         display: block;
 118 }
 119
 120 #home .login label input {
 121         margin-right: 4px;
 122 }
 123
 124 #home a {
 125         font-size: 0.8em;
 126 }
 127
 128 /* END HOME STYLE */
 129
 130 /* BEGIN TALK STYLE */
 131
 132 #talk .header div,
 133 #chat .header div {
 134         float: left;
 135         margin-left: 7px;
 136 }
 137
 138 #talk .header button,
 139 #chat .header button {
 140         float: right;
 141         margin-right: 7px;
 142         padding: 2px;
 143 }
 144
 145 #talk a.one-buddy {
 146         display: none;
 147         background-color: #87a5ab;
 148         border-bottom: 1px solid #5b8088;
 149         text-shadow: 1px 1px 1px #5b8088;
 150         text-decoration: none;
 151         color: white;
 152         outline-style: none;
 153         padding: 10px 0;
 154 }
 155
 156 #talk a.one-buddy:hover {
 157         cursor: pointer;
 158 }
 159
 160 #talk a.available,
 161 #talk a.chat {
 162         background-color: #83b187;
 163         border-bottom: 1px solid #4d8252;
 164         text-shadow: 1px 1px 1px #4d8252;
 165 }
 166
 167 #talk a.available:hover,
 168 #talk a.chat:hover,
 169 #talk a.available:focus,
 170 #talk a.chat:focus {
 171         background-color: #89c68e;
 172 }
 173
 174 #talk a.available:active,
 175 #talk a.chat:active {
 176         background-color: #90d496;
 177 }
 178
 179 #talk a.away {
 180         background-color: #e0be7b;
 181         border-bottom: 1px solid #ae8941;
 182         text-shadow: 1px 1px 1px #ae8941;
 183 }
 184
 185 #talk a.away:hover,
 186 #talk a.away:focus {
 187         background-color: #eac784;
 188 }
 189
 190 #talk a.away:active {
 191         background-color: #f3d294;
 192 }
 193
 194 #talk a.xa,
 195 #talk a.dnd {
 196         background-color: #db8989;
 197         border-bottom: 1px solid #a24343;
 198         text-shadow: 1px 1px 1px #a24343;
 199 }
 200
 201 #talk a.xa:hover,
 202 #talk a.dnd:hover,
 203 #talk a.xa:focus,
 204 #talk a.dnd:focus {
 205         background-color: #e89797;
 206 }
 207
 208 #talk a.xa:active,
 209 #talk a.dnd:active {
 210         background-color: #ef9f9f;
 211 }
 212
 213 /* END TALK STYLE */
 214
 215 /* BEGIN CHAT STYLE */
 216
 217 #chat {
 218         display: none;
 219 }
 220
 221 #chat .one-chat,
 222 #chat .one-chat p,
 223 #chat .one-chat div,
 224 #chat .one-chat input {
 225         position: absolute;
 226         bottom: 0;
 227         right: 0;
 228 }
 229
 230 #chat .one-chat {
 231         top: 43px;
 232         left: 0;
 233 }
 234
 235 #chat .one-chat p {
 236         background-color: #87a5ab;
 237         border-bottom: 1px solid #5b8088;
 238         text-shadow: 1px 1px 1px #5b8088;
 239         color: white;
 240         top: 0;
 241         left: 0;
 242         height: 18px;
 243         padding: 2px 0;
 244         font-size: 0.9em;
 245 }
 246
 247 #chat .one-chat div {
 248         border-bottom: 1px solid #cbcbcb;
 249         top: 23px;
 250         left: 0;
 251         bottom: 25px;
 252         overflow: auto;
 253         text-align: left;
 254 }
 255
 256 #chat .one-chat span {
 257         display: block;
 258         font-size: 0.85em;
 259         margin: 4px 6px;
 260         word-wrap: break-word;
 261 }
 262
 263 #chat .one-chat b {
 264         margin-right: 3px;
 265 }
 266
 267 #chat .one-chat b.me {
 268         color: #123a5c;
 269 }
 270
 271 #chat .one-chat b.him {
 272         color: #801e1e;
 273 }
 274
 275 #chat .one-chat input {
 276         background-color: white;
 277         bottom: 0;
 278         height: 25px;
 279         width: 100%;
 280         border: none;
 281 }
 282
 283 #chat .one-chat input.submit {
 284         right: 0;
 285         width: 35px;
 286 }
 287
 288 /* END CHAT STYLE */