media/courgette/style.css.php

   1 <?php
   2 /*
   3  *  Jyraphe, your web file repository
   4  *  Copyright (C) 2013
   5  *  Jerome Jutteau <jerome@jutteau.fr>
   6  *  Jimmy Beauvois <jimmy.beauvois@gmail.com>
   7  *
   8  *  This program is free software: you can redistribute it and/or modify
   9  *  it under the terms of the GNU Affero General Public License as
  10  *  published by the Free Software Foundation, either version 3 of the
  11  *  License, or (at your option) any later version.
  12  *
  13  *  This program is distributed in the hope that it will be useful,
  14  *  but WITHOUT ANY WARRANTY; without even the implied warranty of
  15  *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  16  *  GNU Affero General Public License for more details.
  17  *
  18  *  You should have received a copy of the GNU Affero General Public License
  19  *  along with this program.  If not, see <https://www.gnu.org/licenses/>.
  20  */
  21
  22 /*
  23  * This stylesheet is the default stylesheet for Jyraphe.
  24  * The content is dynamically generated for easier handling.
  25  */
  26
  27 header('Content-type: text/css');
  28
  29 ?>
  30
  31 /* ==========================================================================
  32    Summary
  33
  34    1 = Basic Style
  35    2 = Copyright
  36    3 = Options
  37    4 = Upload
  38    5 = Terms of service
  39    6 = Install
  40    7 = Admin
  41    8 = Download page
  42
  43    ========================================================================== */
  44
  45 /* ==========================================================================
  46    1 = Basic Style
  47    ========================================================================== */
  48
  49 body {
  50   background: #efebe9;
  51   font-family: Arial, sans-serif;
  52   margin: 0;
  53   line-height: 1.5;
  54 }
  55
  56 #content {
  57   padding: 2em;
  58 }
  59
  60 h1 a {
  61   display: block;
  62   background: url(logo-jirafeau.svg) no-repeat;
  63   background-size: 100% 100%;
  64   text-indent: -9999px;
  65   width: 194px;
  66   height: 185px;
  67   margin: 1em auto;
  68   position: relative;
  69   left: 0.4em;
  70 }
  71
  72 h2 {
  73   text-align: center;
  74   color: #795548;
  75 }
  76
  77 fieldset {
  78   border: 0;
  79   padding: 1.5em;
  80   margin: 0 auto;
  81   border-radius: 8px;
  82   width: 20em;
  83   border: 7px dashed #bcaaa4;
  84   min-height: 15em;
  85   min-width: 30em;
  86   position: relative;
  87 }
  88
  89 legend {
  90   padding: 0.5em 1em;
  91   background: #efebe9;
  92   color: #663D1C;
  93   font-size: 1.2em;
  94   display: block;
  95   min-width: 8em;
  96   text-align: center;
  97 }
  98
  99 table a {
 100   color: #000;
 101 }
 102
 103 table a:hover,
 104 table a:focus {
 105   text-decoration: none;
 106 }
 107
 108 input[type="submit"] {
 109   background: #0D9CB2;
 110   border: 0;
 111   padding: 0.4em 2.2em;
 112   font-size: 1.1em;
 113   color: #FFF;
 114   border-bottom: 5px solid #085B69;
 115   cursor: pointer;
 116   margin: 10px;
 117 }
 118
 119 select,
 120 input[type="text"],
 121 input[type="password"] {
 122   border: 1;
 123   padding: 5px 5px;
 124   font-size: 1em;
 125 }
 126
 127 select { width: 100%; }
 128
 129 input[type="submit"]:hover,
 130 input[type="submit"]:focus {
 131   border: 0;
 132   position: relative;
 133   background: #085B69;
 134   border-bottom: 5px solid #0D9CB2;
 135   margin-bottom: 10px;
 136 }
 137
 138 .inner {
 139   margin-top: 3em;
 140 }
 141
 142 #upload fieldset {
 143   background: url(upload.svg) no-repeat center;
 144   -webkit-transition: all 0.5s ease;
 145      -moz-transition: all 0.5s ease;
 146       -ms-transition: all 0.5s ease;
 147        -o-transition: all 0.5s ease;
 148           transition: all 0.5s ease;
 149 }
 150
 151 #upload fieldset:hover {
 152   border-color: #663D1C;
 153 }
 154
 155 #upload > form {
 156   text-align: center;
 157 }
 158
 159 #upload p {
 160   margin: 0;
 161 }
 162
 163 #file_select {
 164   position: relative;
 165   width: 100%;
 166   height: 16em;
 167   cursor: pointer;
 168   opacity: 0;
 169 }
 170   #upload.file-selected #file_select {
 171     opacity: 1;
 172     height: 2em;
 173   }
 174   #upload.file-selected fieldset {
 175     background-image: none;
 176   }
 177
 178
 179 /* ==========================================================================
 180    2 = Copyright
 181    ========================================================================== */
 182
 183 #copyright {
 184   text-align: center;
 185   font-size: 0.8em;
 186   color: #795548;
 187   margin: 3em auto;
 188 }
 189
 190 #copyright a {
 191   color: #795548;
 192   text-decoration: none;
 193 }
 194
 195 #copyright a:hover,
 196 #copyright a:focus {
 197   text-decoration: underline;
 198 }
 199
 200 /* ==========================================================================
 201    3 = Options
 202    ========================================================================== */
 203
 204 #options {
 205   position: relative;
 206   z-index: 10;
 207   width: 100%;
 208   height: 90%;
 209 }
 210
 211 #options tr { height: 2.7em; }
 212
 213 #option_table tr:first-child {
 214   width: 100%;
 215   height: 100%;
 216 }
 217
 218 #option_table td:first-child {
 219 }
 220
 221 #options input[type="submit"] {
 222   position: relative;
 223   margin: 1em auto;
 224 }
 225
 226 /* ==========================================================================
 227    4 = Upload
 228    ========================================================================== */
 229
 230 #upload_finished,
 231 #uploading,
 232 .message,
 233 .info,
 234 .error {
 235   text-align: center;
 236   color: #795548;
 237   padding-left: 3em;
 238 }
 239
 240 #upload_finished > p:nth-child(1) {
 241   color: #0D9CB2;
 242   font-weight: bold;
 243 }
 244
 245 #upload_finished div p:nth-child(1) {
 246   font-weight: bold;
 247 }
 248
 249 #upload_finished a {
 250   text-decoration: none;
 251   color: #795548;
 252 }
 253
 254 #uploading a {
 255   font-weight: bold;
 256   text-decoration: none;
 257   color: #795548;
 258 }
 259
 260 #uploaded_percentage {
 261   font-size: 2em;
 262   font-weight: bold;
 263 }
 264
 265 #upload_finished a:hover,
 266 #uploading a:hover,
 267 #upload_finished a:focus,
 268 #uploading a:focus {
 269   text-decoration: underline;
 270 }
 271
 272 .message,
 273 .error {
 274   color: #d55548;
 275   font-style: italic;
 276   font-weight: bold;
 277 }
 278
 279 #upload_link_email {
 280   margin-left: 10px;
 281 }
 282
 283 #upload_image_email {
 284   padding-left: 20px;
 285   padding-bottom: 15px;
 286   background: url(email.png) no-repeat;
 287 }
 288
 289 /* ==========================================================================
 290    5 = Terms of service
 291    ========================================================================== */
 292
 293 textarea[readonly="readonly"] {
 294   border: 0;
 295   color: #795548;
 296   font-family: Arial, sans-serif;
 297   background: none;
 298   margin: auto;
 299   display: block;
 300 }
 301
 302 textarea[readonly="readonly"] + p,
 303 textarea[readonly="readonly"] + p + p {
 304   text-align: center;
 305   color: #795548;
 306 }
 307
 308 textarea[readonly="readonly"] + p a,
 309 textarea[readonly="readonly"] + p + p a {
 310   font-weight: bold;
 311   text-decoration: none;
 312   color: #795548;
 313 }
 314
 315 textarea[readonly="readonly"] + p a:hover,
 316 textarea[readonly="readonly"] + p + p a:hover,
 317 textarea[readonly="readonly"] + p a:focus,
 318 textarea[readonly="readonly"] + p + p a:focus {
 319   text-decoration: underline;
 320 }
 321
 322 /* ==========================================================================
 323    6 = Install
 324    ========================================================================== */
 325
 326 #install fieldset,
 327 #install + fieldset {
 328   width: auto;
 329   max-width: 50em;
 330   border: 7px dashed #bcaaa4;
 331 }
 332
 333 #install table,
 334 #install + fieldset table {
 335   width: 100%;
 336   border-collapse: collapse;
 337 }
 338
 339 #install td,
 340 #install + fieldset td {
 341   padding: 0.5em 1em;
 342   border-bottom: 0;
 343 }
 344
 345 #install td:empty {
 346   width: 13.1em;
 347 }
 348
 349 #install table form:nth-child(odd),
 350 #install + fieldset tr:nth-child(odd) {
 351   background: #bcaaa4;
 352 }
 353
 354 #install fieldset > form {
 355   margin-top: 2em;
 356   text-align: center;
 357 }
 358
 359 #install form {
 360   display: table;
 361   width: 100%;
 362 }
 363
 364 #install td:last-child { text-align: left; }
 365
 366 #install .info { width: 19em; }
 367
 368 #install input[type="submit"] {
 369   min-width: 10.5em;
 370 }
 371
 372 #install + fieldset table {
 373   font-size: 0.9em;
 374 }
 375
 376 #install + fieldset td:first-child input[type="submit"] {
 377   background: none;
 378   padding: 0;
 379   color: #000;
 380   font-weight: bold;
 381   border-bottom: 0;
 382 }
 383
 384 #install + fieldset td:first-child input[type="submit"]:hover,
 385 #install + fieldset td:first-child input[type="submit"]:focus {
 386   text-decoration: underline;
 387 }
 388
 389 /* ==========================================================================
 390    7 = Admin
 391    ========================================================================== */
 392
 393 #admin fieldset,
 394 #admin + fieldset {
 395   width: auto;
 396   max-width: 60em;
 397   border: 7px dashed #bcaaa4;
 398 }
 399
 400 #admin table,
 401 #admin + fieldset table {
 402   width: 100%;
 403   border-collapse: collapse;
 404   border-bottom: 2px solid #FFF;
 405 }
 406
 407 #admin td,
 408 #admin + fieldset td {
 409   padding: 0.5em 1em;
 410   border: 2px solid #FFF;
 411   border-bottom: 0;
 412 }
 413
 414 #admin td:empty {
 415   width: 13.1em;
 416 }
 417
 418 #admin table form:nth-child(odd),
 419 #admin + fieldset tr:nth-child(odd) {
 420   background: #bcaaa4;
 421 }
 422
 423 #admin fieldset > form {
 424   margin-top: 2em;
 425   text-align: center;
 426 }
 427
 428 #admin form {
 429   display: table;
 430   width: 100%;
 431 }
 432
 433 #admin td:last-child { text-align: left; }
 434
 435 #admin .info { width: 19em; }
 436
 437 #admin input[type="submit"] {
 438   min-width: 10.5em;
 439 }
 440
 441 #admin + fieldset table {
 442   font-size: 0.9em;
 443 }
 444
 445 #admin + fieldset td:first-child input[type="submit"] {
 446   background: none;
 447   padding: 0;
 448   color: #000;
 449   font-weight: bold;
 450   border-bottom: 0;
 451 }
 452
 453 #admin + fieldset td:first-child input[type="submit"]:hover,
 454 #admin + fieldset td:first-child input[type="submit"]:focus {
 455   text-decoration: underline;
 456 }
 457
 458 /* ==========================================================================
 459    8 = Download page
 460    ========================================================================== */
 461
 462 #self_destruct {
 463   font-weight: bold;
 464   color: red;
 465   background-image: url('pixel_bomb.png');
 466   background-size: 40px 40px;
 467   background-repeat: no-repeat;
 468   padding-left: 40px;
 469   padding-top: 10px;
 470   padding-bottom: 10px;
 471 }