[SPIP Zone] r3989 - in /_plugins_/_contenu_editorial_/Forms: inc/forms.php ligne.gif spip_forms.css

Author: baptiste.goupil@gmail.com
Date: Fri Jul 14 02:09:59 2006
New Revision: 3989

Log:
Du style pour les formulaires, avec un peu d'amélioration de l'ergonomie. Pas de soucis de droits pour l'image : elle a été créée pour le plugin.

Added:
    _plugins_/_contenu_editorial_/Forms/ligne.gif (with props)
Modified:
    _plugins_/_contenu_editorial_/Forms/inc/forms.php
    _plugins_/_contenu_editorial_/Forms/spip_forms.css

Modified: _plugins_/_contenu_editorial_/Forms/inc/forms.php

--- _plugins_/_contenu_editorial_/Forms/inc/forms.php (original)
+++ _plugins_/_contenu_editorial_/Forms/inc/forms.php Fri Jul 14 02:09:59 2006
@@ -6,7 +6,7 @@
  * Auteur :
  * Antoine Pitrou
  * adaptation en 182e puis plugin par cedric.morin@yterium.com
- * © 2005,2006 - Distribue sous licence GNU/GPL
+ * 2005,2006 - Distribue sous licence GNU/GPL
  *
  */

@@ -151,7 +151,7 @@
     // Ne generer un nouveau cookie que s'il n'existe pas deja
     if (!$cookie = addslashes($GLOBALS['cookie_form'])){
       if (!$cookie = $_COOKIE[$nom_cookie]) {
- $cookie_utilise=false; // pas de cookie a l'horizon donc pas de reponse presumée
+ $cookie_utilise=false; // pas de cookie a l'horizon donc pas de reponse presum�
         //include_spip("inc/session");
         //$cookie = creer_uniqid();
       }
@@ -327,7 +327,8 @@
      if ($flag_champ)
     {
       if ($obligatoire)
- $r .= "<span class='spip_form_label_obligatoire'>"
+ ($msg = $erreur[$code]) ? $champ_erreur=" obligatoire_oublie" : $champ_erreur="";
+ $r .= "<span class='spip_form_label_obligatoire$champ_erreur'>"
               . _T('forms:info_obligatoire_02')
               . "</span>";
       $r .= " :";
@@ -337,26 +338,33 @@
     $class1 = $obligatoire ? "forml" : "formo";
     $class2 = $obligatoire ? "fondl" : "fondo";
   
+// On attribue des classes speciales aux champs mal remplis
+ if($msg = $erreur[$code]) {
+ $class1.=" champ_obli_oubli";
+ $class2.=" champ_obli_oubli";
+ }
+
+
     $span = "<span class='spip_form_label_details'>";
   
     switch ($type) {
     case 'email':
       $value = $erreur ? entites_html($GLOBALS[$code]) : "";
       $r .= $span . _T("forms:champ_email_details")."</span>";
- $r .= "<input type='text' name='$code' id='$id_champ' value=\"$value\" class='$class1' size='40'$attributs />";
+ $r .= "<input type='text' name='$code' id='$id_champ' value=\"$value\" class='$class1' onfocus=\"this.className='$class1-focus'\" onblur=\"this.className='$class1'\" size='40'$attributs />";
       break;
     case 'url':
       $value = $erreur ? entites_html($GLOBALS[$code]) : "";
       $r .= $span . _T("forms:champ_url_details")."</span>";
- $r .= "<input type='text' name='$code' id='$id_champ' value=\"$value\" class='$class1' size='40'$attributs />";
+ $r .= "<input type='text' name='$code' id='$id_champ' value=\"$value\" class='$class1' onfocus=\"this.className='$class1-focus'\" onblur=\"this.className='$class1'\" size='40'$attributs />";
       break;
     case 'ligne':
       $value = $erreur ? entites_html($GLOBALS[$code]) : "";
- $r .= "<input type='text' name='$code' id='$id_champ' value=\"$value\" class='$class1' size='40'$attributs />";
+ $r .= "<input type='text' name='$code' id='$id_champ' value=\"$value\" class='$class1' onfocus=\"this.className='$class1-focus'\" onblur=\"this.className='$class1'\" size='40'$attributs />";
       break;
     case 'texte':
       $value = $erreur ? entites_html($GLOBALS[$code]) : "";
- $r .= "<textarea name='$code' id='$id_champ' class='$class1' rows='4' cols='40'$attributs>";
+ $r .= "<textarea name='$code' id='$id_champ' class='$class1' onfocus=\"this.className='$class1-focus'\" onblur=\"this.className='$class1'\"rows='4' cols='40'$attributs>";
       $r .= $value;
       $r .= "</textarea>";
       break;
@@ -367,11 +375,11 @@
     case 'multiple':
       $value = ($erreur && is_array($GLOBALS[$code]))
         ? array_flip($GLOBALS[$code]) : array();
- $r .= Forms_afficher_champ_multiple($code, $id_champ, $type_ext, $value, "class='$class2'$attributs");
+ $r .= Forms_afficher_champ_multiple($code, $id_champ, $type_ext, $value, "class='$class2' onfocus=\"this.className='$class1-focus'\" onblur=\"this.className='$class1'\"$attributs");
       break;
     case 'fichier':
       // Pas de valeur par defaut pour les champs "fichier"
- $r .= "<input type='file' name='$code' id='$id_champ' class='$class2' size='25'$attributs>";
+ $r .= "<input type='file' name='$code' id='$id_champ' class='$class2' onfocus=\"this.className='$class2-focus'\" onblur=\"this.className='$class2'\" size='25'$attributs>";
       break;
     case 'mot':
       // Distinction unique / multiple selon le parametrage du groupe de mots
@@ -393,16 +401,17 @@
       if ($multiple) {
         $value = ($erreur && is_array($GLOBALS[$code]))
           ? array_flip($GLOBALS[$code]) : array();
- $r .= Forms_afficher_champ_multiple($code, $id_champ, $liste, $value, "class='$class2'$attributs");
+ $r .= Forms_afficher_champ_multiple($code, $id_champ, $liste, $value, "class='$class2 onfocus=\"this.className='$class2-focus'\" onblur=\"this.className='$class2'\"'$attributs");
       }
       else {
         $value = $erreur ? $GLOBALS[$code] : "";
- $r .= Forms_afficher_champ_select($code, $id_champ, $liste, $value, "class='$class2'$attributs");
+ $r .= Forms_afficher_champ_select($code, $id_champ, $liste, $value, "class='$class2' onfocus=\"this.className='$class2-focus'\" onblur=\"this.className='$class2'\"$attributs");
       }
       break;
     }
+//On garde le message. si la css par defaut est utilisee il est masque et l'erreur est signalee avec les couleurs, sinon c'est l'inverse (pour que le formulaire reste accessible sans la css par defaut)
     if ($msg = $erreur[$code]) {
- $r = "<p class='spip_form_erreur'>"._T("forms:form_erreur")." ".$msg."</p>" . $r;
+ $r .= "<p class='spip_form_erreur'>"._T("forms:form_erreur")." ".$msg."</p>";
     }
     $r .= "</div>";
     return $r;

Added: _plugins_/_contenu_editorial_/Forms/ligne.gif

Binary file - no diff available.

Propchange: _plugins_/_contenu_editorial_/Forms/ligne.gif
------------------------------------------------------------------------------
    svn:mime-type = application/octet-stream

Modified: _plugins_/_contenu_editorial_/Forms/spip_forms.css

--- _plugins_/_contenu_editorial_/Forms/spip_forms.css (original)
+++ _plugins_/_contenu_editorial_/Forms/spip_forms.css Fri Jul 14 02:09:59 2006
@@ -1,11 +1,17 @@
-
+div.spip_forms form label {
+ float:none;
+}
+div.spip_forms h2 {
+ margin:.2em;
+ color:#543E29;
+}
.spip_forms, .spip_sondage {
   color: black;
   margin: 0px;
   margin-bottom: 16px;
- padding: 4px;
+ padding: 6px;
   border: 1px solid #a0a0a0;
- background-color: #f6f6f6;
+ background: #F8F7F6;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size:small;
   font-weight: normal;
@@ -14,12 +20,19 @@
   margin-bottom:1em;
}
.spip_form_label {
- display:block;
+ font-weight: bold;
+}
+.spip_form_label label {
   text-align:left;
   font-weight: bold;
}
.spip_form_label_obligatoire{
   font-weight: normal;
+ font-style:italic;
+ font-size:.9em;
+}
+.obligatoire_oublie {
+ color:red;
}
.spip_form_label_details{
   display:block;
@@ -27,12 +40,21 @@
   text-align:left;
}

-.spip_form_choix_unique{
- /* display:block; *//* decommenter pour avoir des bouton radio verticaux*/
+.spip_form_choix_multiple {
+ display:block;
}

-.spip_form_choix_multiple{
- /* display:block; *//* decommenter pour avoir des bouton radio verticaux*/
+.spip_form_choix_unique input {
+ width:auto;
+}
+
+.spip_form_choix_unique label {
+ margin:0 0 5px 0;
+}
+
+.spip_form_choix_multiple input {
+ width:auto;
+ margin:0 5px 0 0;
}

.spip_sondage {
@@ -40,36 +62,48 @@
}

.spip_form_erreur {
- float:right;
- font-weight: bold;
- color: red;
- background-color:#cccccc;
- margin: 1px;
- padding: 1px;
- padding-left: 10px;
- padding-right: 10px;
+ display:none;
}
.spip_form_ok {
   font-weight: bold;
- /* border: 1px solid #808080;*/
- background-color:#ffdd11;
- margin: 0px;
- padding: 0px;
- padding-left:5px;
- padding-bottom:2px;
- padding-top:15px;
+ background:#262626;
+ color:#F1F1F1;
+ margin: 1em 0 0 0;
+ padding: .6em;
+}
+.spip_form_ok a {
+ color:#FFF9E2;
+}
+.spip_form_ok a:hover {
+ color:#DEB55E;
}
.spip_form_ok_confirmation{
   display:block;
}
-
+.spip_sondage strong {
+ display:block;
+ clear:both;
+}
+.spip_sondage .ligne_nom {
+ width:19%;
+ text-align:right;
+ padding-right:1%;
+}
+.spip_sondage .ligne_nom:after {
+ content:" :";
+}
+.spip_sondage ligne.chiffres {
+ color:#525252;
+}
.spip_sondage .ligne_barre {
- height: 8px;
- background: #B0A0FF;
+ height: 16px;
+ background: url(ligne.gif) repeat-x;
   border: 1px solid black;
+ width:80%;
}
.spip_sondage .sondage_table {
   display: table;
+ width:100%;
}
.spip_sondage .sondage_ligne {
   display: table-row;
@@ -81,31 +115,59 @@
   white-space: nowrap;
}
.forml, .formo, .fondl, .fondo {
- font-family: Verdana, Arial, Helvetica, sans-serif;
- font-size: 90%;
-}
-.forml, .formo {
- margin: 4px;
- margin-bottom: 1px;
- padding: 1px;
- width:90% ;
+ width:95%;
}
.forml, .fondl {
- border: dashed 1px #909090;
- background-color: #ffdd88;
+ border-bottom:solid 1px #C9AB97;
+ border-right:solid 1px #C9AB97;
+ border-top:1px solid #81593E;
+ border-left:1px solid #81593E;
+ background: #FFFDE7;
+ padding:.3em;
+ font-size:.9em;
}
.formo, .fondo {
   border: dashed 1px #C0C0C0;
   background-color: white;
}
-
+.champ_obli_oubli {
+ border:2px solid red;
+}

[... 45 lines stripped ...]