[FEATURE] Support light/dark mode

[jirafeau_mojo42.git] / media / courgette / style.css.php

diff --git a/media/courgette/style.css.php b/media/courgette/style.css.php
index 1ae3a458e7168fa4b0c877018b76c646fd59e529..183364c23a69a200444f4e3e9a46f387f60e301b 100644 (file)
--- a/media/courgette/style.css.php
+++ b/media/courgette/style.css.php
@@ -2,7 +2,7 @@
 /*
  *  Jyraphe, your web file repository
  *  Copyright (C) 2013
 /*
  *  Jyraphe, your web file repository
  *  Copyright (C) 2013

- *  Jerome Jutteau <j.jutteau@gmail.com>
+ *  Jerome Jutteau <jerome@jutteau.fr>

  *  Jimmy Beauvois <jimmy.beauvois@gmail.com>
  *
  *  This program is free software: you can redistribute it and/or modify
  *  Jimmy Beauvois <jimmy.beauvois@gmail.com>
  *
  *  This program is free software: you can redistribute it and/or modify


@@ -16,7 +16,7 @@
  *  GNU Affero General Public License for more details.
  *
  *  You should have received a copy of the GNU Affero General Public License
  *  GNU Affero General Public License for more details.
  *
  *  You should have received a copy of the GNU Affero General Public License

- *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ *  along with this program.  If not, see <https://www.gnu.org/licenses/>.

  */
 
 /*
  */
 
 /*


@@ -24,21 +24,22 @@
  * The content is dynamically generated for easier handling.
  */
 
  * The content is dynamically generated for easier handling.
  */
 

-$dark = '#8B4513';
-
-header("Content-type: text/css");
+header('Content-type: text/css');

 
 ?>
 
 /* ==========================================================================
 
 ?>
 
 /* ==========================================================================

-   Sommaire
+   Summary

 
    1 = Basic Style
    2 = Copyright
    3 = Options
    4 = Upload
    5 = Terms of service
 
    1 = Basic Style
    2 = Copyright
    3 = Options
    4 = Upload
    5 = Terms of service

-   
+   6 = Install
+   7 = Admin
+   8 = Download page
+

    ========================================================================== */
 
 /* ==========================================================================
    ========================================================================== */
 
 /* ==========================================================================


@@ -52,6 +53,10 @@ body {
   line-height: 1.5;
 }
 
   line-height: 1.5;
 }
 

+#content {
+  padding: 2em;
+}
+

 h1 a {
   display: block;
   background: url(logo-jirafeau.svg) no-repeat;
 h1 a {
   display: block;
   background: url(logo-jirafeau.svg) no-repeat;


@@ -73,10 +78,11 @@ fieldset {
   border: 0;
   padding: 1.5em;
   margin: 0 auto;
   border: 0;
   padding: 1.5em;
   margin: 0 auto;

-  border-radius: 2px;
+  border-radius: 8px;

   width: 20em;
   border: 7px dashed #bcaaa4;
   min-height: 15em;
   width: 20em;
   border: 7px dashed #bcaaa4;
   min-height: 15em;

+  min-width: 30em;

   position: relative;
 }
 
   position: relative;
 }
 


@@ -86,10 +92,19 @@ legend {
   color: #663D1C;
   font-size: 1.2em;
   display: block;
   color: #663D1C;
   font-size: 1.2em;
   display: block;

-  width: 100%;
+  min-width: 8em;

   text-align: center;
 }
 
   text-align: center;
 }
 

+table a {
+  color: #000;
+}
+
+table a:hover,
+table a:focus {
+  text-decoration: none;
+}
+

 input[type="submit"] {
   background: #0D9CB2;
   border: 0;
 input[type="submit"] {
   background: #0D9CB2;
   border: 0;


@@ -98,70 +113,28 @@ input[type="submit"] {
   color: #FFF;
   border-bottom: 5px solid #085B69;
   cursor: pointer;
   color: #FFF;
   border-bottom: 5px solid #085B69;
   cursor: pointer;

-}
-
-input[type="submit"]:hover,
-input[type="submit"]:focus {
-  border: 0;
-  position: relative;
-  top: 5px;
-  margin-bottom: 5px;
+  margin: 10px;

 }
 
 select,
 input[type="text"],
 input[type="password"] {
 }
 
 select,
 input[type="text"],
 input[type="password"] {

-  border: 0;
-  padding: 0.5em 1em;
+  border: 1;
+  padding: 5px 5px;

   font-size: 1em;
   font-size: 1em;

-  width: 100%;

 }
 
 }
 

-label {
-  font-weight: bold;
-  color: #663D1C;
-}
-
-#upload_password { width: 80%; }
-
-.next input[type="submit"] {
-  position: relative;
-  margin-top: 0.5em;
-  padding: 0.4em 2.65em;
-}
-
-input[value="Déconnexion"] {
-  background: none;
-  color: #663D1C;
-  border: 0;
-  display: block;
-  margin: auto;
-  padding-left: 4em;
-  font-size: 1em;
-  font-style:italic;
-}
-
-input[value="Déconnexion"]:hover,
-input[value="Déconnexion"]:focus {
-  top: 0;
-  margin-bottom: 0;
-  text-decoration: underline;
-}
-
-form[action="index.php"] .label {
-  width: 7em;
-}
+select { width: 100%; }

 
 

-form[action="index.php"] fieldset {
+input[type="submit"]:hover,
+input[type="submit"]:focus {

   border: 0;
   border: 0;

-  background: #d7ccc8;
-  min-height: 5em;
+  position: relative;
+  background: #085B69;
+  border-bottom: 5px solid #0D9CB2;
+  margin-bottom: 15px;

 }
 
 }
 

-select { width: 127%; }
-
-
-

 .inner {
   margin-top: 3em;
 }
 .inner {
   margin-top: 3em;
 }


@@ -179,16 +152,28 @@ select { width: 127%; }
   border-color: #663D1C;
 }
 
   border-color: #663D1C;
 }
 

+#upload > form {
+  text-align: center;
+}
+
+#upload p {
+  margin: 0;
+}
+

 #file_select {
 #file_select {

-  position: absolute;
-  top: 0;
-  left: 0;
+  position: relative;

   width: 100%;
   width: 100%;

-  height: 100%;
+  height: 16em;

   cursor: pointer;
   opacity: 0;
 }
   cursor: pointer;
   opacity: 0;
 }

-
+  #upload.file-selected #file_select {
+    opacity: 1;
+    height: 2em;
+  }
+  #upload.file-selected fieldset {
+    background-image: none;
+  }

 
 
 /* ==========================================================================
 
 
 /* ==========================================================================


@@ -199,7 +184,7 @@ select { width: 127%; }
   text-align: center;
   font-size: 0.8em;
   color: #795548;
   text-align: center;
   font-size: 0.8em;
   color: #795548;

-  padding-left: 3em;
+  margin: 3em auto;

 }
 
 #copyright a {
 }
 
 #copyright a {


@@ -219,24 +204,23 @@ select { width: 127%; }
 #options {
   position: relative;
   z-index: 10;
 #options {
   position: relative;
   z-index: 10;

-  background: #efebe9;
+  width: 100%;
+  height: 90%;

 }
 
 #options tr { height: 2.7em; }
 
 }
 
 #options tr { height: 2.7em; }
 

-#option_table tr:first-child td:first-child {
-  width: 12em;
-  font-weight: bold;
-  color: #663D1C;
+#option_table tr:first-child {
+  width: 100%;
+  height: 100%;

 }
 
 }
 

-#option_table tr td:first-child {
-  
+#option_table td:first-child {

 }
 
 #options input[type="submit"] {
   position: relative;
 }
 
 #options input[type="submit"] {
   position: relative;

-  left: 11.2em;
+  margin: 1em auto;

 }
 
 /* ==========================================================================
 }
 
 /* ==========================================================================


@@ -246,22 +230,31 @@ select { width: 127%; }
 #upload_finished,
 #uploading,
 .message,
 #upload_finished,
 #uploading,
 .message,

+.info,

 .error {
   text-align: center;
   color: #795548;
   padding-left: 3em;
 }
 
 .error {
   text-align: center;
   color: #795548;
   padding-left: 3em;
 }
 

-#upload_finished a,
-#uploading a,
-#submit a {
+#upload_finished > p:nth-child(1) {
+  color: #0D9CB2;
+  font-weight: bold;
+}
+
+#upload_finished div p:nth-child(1) {

   font-weight: bold;
   font-weight: bold;

+}
+
+#upload_finished a {

   text-decoration: none;
   color: #795548;
 }
 
   text-decoration: none;
   color: #795548;
 }
 

-#submit a:before {
-  content: "› ";
+#uploading a {
+  font-weight: bold;
+  text-decoration: none;
+  color: #795548;

 }
 
 #uploaded_percentage {
 }
 
 #uploaded_percentage {


@@ -272,36 +265,31 @@ select { width: 127%; }
 #upload_finished a:hover,
 #uploading a:hover,
 #upload_finished a:focus,
 #upload_finished a:hover,
 #uploading a:hover,
 #upload_finished a:focus,

-#uploading a:focus,
-#submit a:hover,
-#submit a:focus {
+#uploading a:focus {

   text-decoration: underline;
 }
 
 .message,
 .error {
   text-decoration: underline;
 }
 
 .message,
 .error {

+  color: #d55548;

   font-style: italic;
   font-style: italic;

-}
-
-#submit tr:first-child td:first-child {

   font-weight: bold;
   font-weight: bold;

-  color: #795548;

 }
 
 }
 

-#submit tr + tr td {
-  padding-top: 1em;
+#upload_link_email {
+  margin-left: 10px;

 }
 
 }
 

-#submit td {
-  color: #795548;
+#upload_image_email {
+  padding-left: 20px;
+  padding-bottom: 15px;
+  background: url(email.png) no-repeat;

 }
 
 /* ==========================================================================
    5 = Terms of service
    ========================================================================== */
 
 }
 
 /* ==========================================================================
    5 = Terms of service
    ========================================================================== */
 

-
-

 textarea[readonly="readonly"] {
   border: 0;
   color: #795548;
 textarea[readonly="readonly"] {
   border: 0;
   color: #795548;


@@ -329,4 +317,155 @@ textarea[readonly="readonly"] + p + p a:hover,
 textarea[readonly="readonly"] + p a:focus,
 textarea[readonly="readonly"] + p + p a:focus {
   text-decoration: underline;
 textarea[readonly="readonly"] + p a:focus,
 textarea[readonly="readonly"] + p + p a:focus {
   text-decoration: underline;

-}
\ No newline at end of file
+}
+
+/* ==========================================================================
+   6 = Install
+   ========================================================================== */
+
+#install fieldset,
+#install + fieldset {
+  width: auto;
+  max-width: 50em;
+  border: 7px dashed #bcaaa4;
+}
+
+#install table,
+#install + fieldset table {
+  width: 100%;
+  border-collapse: collapse;
+}
+
+#install td,
+#install + fieldset td {
+  padding: 0.5em 1em;
+  border-bottom: 0;
+}
+
+#install td:empty {
+  width: 13.1em;
+}
+
+#install table form:nth-child(odd),
+#install + fieldset tr:nth-child(odd) {
+  background: #bcaaa4;
+}
+
+#install fieldset > form {
+  margin-top: 2em;
+  text-align: center;
+}
+
+#install form {
+  display: table;
+  width: 100%;
+}
+
+#install td:last-child { text-align: left; }
+
+#install .info { width: 19em; }
+
+#install input[type="submit"] {
+  min-width: 10.5em;
+}
+
+#install + fieldset table {
+  font-size: 0.9em;
+}
+
+#install + fieldset td:first-child input[type="submit"] {
+  background: none;
+  padding: 0;
+  color: #000;
+  font-weight: bold;
+  border-bottom: 0;
+}
+
+#install + fieldset td:first-child input[type="submit"]:hover,
+#install + fieldset td:first-child input[type="submit"]:focus {
+  text-decoration: underline;
+}
+
+/* ==========================================================================
+   7 = Admin
+   ========================================================================== */
+
+#admin fieldset,
+#admin + fieldset {
+  width: auto;
+  max-width: 60em;
+  border: 7px dashed #bcaaa4;
+}
+
+#admin table,
+#admin + fieldset table {
+  width: 100%;
+  border-collapse: collapse;
+  border-bottom: 2px solid #FFF;
+}
+
+#admin td,
+#admin + fieldset td {
+  padding: 0.5em 1em;
+  border: 2px solid #FFF;
+  border-bottom: 0;
+}
+
+#admin td:empty {
+  width: 13.1em;
+}
+
+#admin table form:nth-child(odd),
+#admin + fieldset tr:nth-child(odd) {
+  background: #bcaaa4;
+}
+
+#admin fieldset > form {
+  margin-top: 2em;
+  text-align: center;
+}
+
+#admin form {
+  display: table;
+  width: 100%;
+}
+
+#admin td:last-child { text-align: left; }
+
+#admin .info { width: 19em; }
+
+#admin input[type="submit"] {
+  min-width: 10.5em;
+}
+
+#admin + fieldset table {
+  font-size: 0.9em;
+}
+
+#admin + fieldset td:first-child input[type="submit"] {
+  background: none;
+  padding: 0;
+  color: #000;
+  font-weight: bold;
+  border-bottom: 0;
+}
+
+#admin + fieldset td:first-child input[type="submit"]:hover,
+#admin + fieldset td:first-child input[type="submit"]:focus {
+  text-decoration: underline;
+}
+
+/* ==========================================================================
+   8 = Download page
+   ========================================================================== */
+
+#self_destruct {
+  font-weight: bold;
+  color: red;
+  background-image: url('pixel_bomb.png');
+  background-size: 40px 40px;
+  background-repeat: no-repeat;
+  padding-left: 40px;
+  padding-top: 10px;
+  padding-bottom: 10px;
+}