Use the same look for all xnet pages
authorx2003bruneau <x2003bruneau@839d8a87-29fc-0310-9880-83ba4fa771e5>
Tue, 25 Jul 2006 12:24:16 +0000 (12:24 +0000)
committerx2003bruneau <x2003bruneau@839d8a87-29fc-0310-9880-83ba4fa771e5>
Tue, 25 Jul 2006 12:24:16 +0000 (12:24 +0000)
& some other look improvements

git-svn-id: svn+ssh://murphy/home/svn/platal/trunk@643 839d8a87-29fc-0310-9880-83ba4fa771e5

htdocs.net/css/xnet.css
htdocs.net/images/asso.png [moved from htdocs.net/images/asso2.png with 100% similarity]
htdocs.net/images/doc/toolbar.jpg [deleted file]
htdocs.net/images/logo.png [deleted file]
htdocs.net/images/manuel.png [deleted file]
htdocs/images/icons/lightbulb.gif [new file with mode: 0644]
modules/xnet.php
templates/xnet/manuel-admin.tpl
templates/xnet/manuel-auth.tpl
templates/xnet/manuel-public.tpl
templates/xnet/skin.tpl

index 788047c..c559a09 100644 (file)
@@ -92,8 +92,7 @@ table#layout {
 
 td#credits {
     text-align: center;
-    font-size: 90%;
-    font-weight: bold;
+    font-size: 75%;
 }
 
 td#perso div {
diff --git a/htdocs.net/images/doc/toolbar.jpg b/htdocs.net/images/doc/toolbar.jpg
deleted file mode 100644 (file)
index de1416a..0000000
Binary files a/htdocs.net/images/doc/toolbar.jpg and /dev/null differ
diff --git a/htdocs.net/images/logo.png b/htdocs.net/images/logo.png
deleted file mode 100644 (file)
index dd28f1e..0000000
Binary files a/htdocs.net/images/logo.png and /dev/null differ
diff --git a/htdocs.net/images/manuel.png b/htdocs.net/images/manuel.png
deleted file mode 100644 (file)
index 5ef607a..0000000
Binary files a/htdocs.net/images/manuel.png and /dev/null differ
diff --git a/htdocs/images/icons/lightbulb.gif b/htdocs/images/icons/lightbulb.gif
new file mode 100644 (file)
index 0000000..981106e
Binary files /dev/null and b/htdocs/images/icons/lightbulb.gif differ
index e3ec083..3f54e2b 100644 (file)
@@ -179,6 +179,7 @@ class XnetModule extends PLModule
                   WHERE  FIND_IN_SET("Institutions", cat)
                ORDER BY  diminutif');
         $page->assign('inst', $res);
+        $page->useMenu();
     }
 
     function handler_groups2(&$page)
index 55defa0..ac0686b 100644 (file)
@@ -57,12 +57,12 @@ indiqu
   </tr>
   <tr class="impair">
     <td>
-      <a href="manuel/admin#alias">La création d'un alias</a><br>
+      <a href="manuel/admin#alias">La création d'un alias</a>
     </td>
   </tr>
 </table>
 
-<h3><a name="annuaire">L'annuaire et les inscriptions</a></h3>
+<h3><a id="annuaire">L'annuaire et les inscriptions</a></h3>
 
 <p>
 La
@@ -77,14 +77,16 @@ le site (en mode connect
 celui-ci :
 </p>
 
-<div class="screenshot"><img src="images/doc/mail_inscription.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/mail_inscription.jpg" alt="Demande d'inscription" />
+</div>
 
 <p>
 Le
 mail t'indique la démarche à suivre pour valider ou non cette inscription.
 L'inscription est ensuite automatique&nbsp;: les listes de diffusion, ainsi que
 l'annuaire, sont auto-complétés par le site Polytechnique.net, et la personne
-demandant l'inscription est avertie par mail de la suite donnée à sa requête. <br>
+demandant l'inscription est avertie par mail de la suite donnée à sa requête. <br />
 
 Tu
 peux également gérer les désinscriptions, ou éditer les profils des membres
@@ -95,7 +97,7 @@ responsables du groupe.
 
 <div class="backtotop"><a href="manuel/admin">Retour au menu</a></div>
 
-<h3><a name="evenement">La création d'un événement</a></h3>
+<h3><a id="evenement">La création d'un événement</a></h3>
 
 <p>
 L'interface
@@ -109,7 +111,9 @@ groupe, ou 
 de cet événement via les sites polytechniciens est plus ou moins large
 </p>
 
-<div class="screenshot"><img src="images/doc/evnt_creation.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/evnt_creation.jpg" alt="Création d'événement" />
+</div>
 
 <p>
 La page de création d'événements te permet également de décrire précisément les
@@ -118,11 +122,13 @@ certains des "moments" n'int
 qu'ils souhaitent s'inscrire seulement à certains d'entre eux.
 </p>
 
-<div class="screenshot"><img src="images/doc/evnt_moments.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/evnt_moments.jpg" alt="Description des moments" />
+</div>
 
 <div class="backtotop"><a href="manuel/admin">Retour au menu</a></div>
 
-<h3><a name="envoi">L'envoi de mail</a></h3>
+<h3><a id="envoi">L'envoi de mail</a></h3>
 
 <p>
 Depuis
@@ -141,11 +147,13 @@ les destinataires et conduit 
 l'utiliser autant que possible.
 </p>
 
-<div class="screenshot"><img src="images/doc/mail.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/mail.jpg" alt="Envoyer un mail au groupe" />
+</div>
 
 <div class="backtotop"><a href="manuel/admin">Retour au menu</a></div>
 
-<h3><a name="liste">La création d'une liste de diffusion</a></h3>
+<h3><a id="liste">La création d'une liste de diffusion</a></h3>
 
 <p>
 Un
@@ -158,16 +166,16 @@ listes sp
 <br />
 Chaque
 liste peut être soumise à modération&nbsp;:
+</p>
 <ul>
- <li><u>Pour l'inscription&nbsp;</u>: par exemple tous les membres d'un groupe ne
-     peuvent pas être inscrits sur la liste du bureau.</li>
- <li><u>Pour la
-     modération&nbsp;</u>: si une liste est à large diffusion, il peut être
+ <li><strong>Pour l'inscription&nbsp;</strong>: par exemple tous les membres
+     d'un groupe ne peuvent pas être inscrits sur la liste du bureau.</li>
+ <li><strong>Pour la
+     modération&nbsp;</strong>: si une liste est à large diffusion, il peut être
      commode qu'un administrateur valide les mails avant leur envoi à tous les
      membres de la liste. Cela évite un encombrement inutile des messageries,
      qui, à terme, brouille la communication.</li>
 </ul>
-</p>
 
 <p>
 La
@@ -179,11 +187,13 @@ regrouper plusieurs listes de diffusion au sein d'une liste englobante, choisis
 aussi d'utiliser un alias, dont la gestion est plus souple. 
 </p>
 
-<div class="screenshot"><img src="images/doc/liste.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/liste.jpg" alt="Créer une liste de diffusion" />
+</div>
 
 <div class="backtotop"><a href="manuel/admin">Retour au menu</a></div>
 
-<h3><a name="alias">La création d'un alias</a></h3>
+<h3><a id="alias">La création d'un alias</a></h3>
 
 <p>
 Cette
@@ -193,6 +203,8 @@ que les listes de diffusion classique (mod
 diffusion notamment). 
 </p>
 
-<div class="screenshot"><img src="images/doc/alias.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/alias.jpg" alt="Création d'un alias" />
+</div>
 
 <div class="backtotop"><a href="manuel/admin">Retour au menu</a></div>
index d3616e6..ac4cead 100644 (file)
@@ -76,14 +76,16 @@ sein de ton groupe.
   </tr>
 </table>
 
-<h3><a name="accueil">Accueil</a></h3>
+<h3><a id="accueil">Accueil</a></h3>
 
 <p>
 Pour
 bénéficier de tous ces services, tu dois auparavant t'authentifier.
 </p>
 
-<div class="screenshot"><img src="images/doc/identification.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/identification.jpg" alt="Formulaire d'authentification" />
+</div>
 
 <p>
 Pour
@@ -94,11 +96,13 @@ porte-cl
 accès directement aux pages des groupes auxquels tu es inscrit, depuis la page d'accueil.
 </p>
 
-<div class="screenshot"><img src="images/doc/index_auth.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/index_auth.jpg" alt="Accueil authentifié" />
+</div>
 
 <div class="backtotop"><a href="manuel/auth">Retour au menu</a></div>
 
-<h3><a name="tongroupe">La page de ton groupe</a></h3>
+<h3><a id="tongroupe">La page de ton groupe</a></h3>
 
 <p>
 La
@@ -108,19 +112,21 @@ dans le menu de droite.
 </p>
 
 <div class="screenshot">
-  <img src="images/doc/x-internet.jpg" />
-  <img src="images/doc/fns_membres.jpg" />
+  <img src="images/doc/x-internet.jpg" alt="La page groupe pour les membres" />
+  <img src="images/doc/fns_membres.jpg" alt="Fonctionnalités des membres" />
 </div>
 
 <div class="backtotop"><a href="manuel/auth">Retour au menu</a></div>
 
-<h3><a name="annuaire">L'annuaire</a></h3>
+<h3><a id="annuaire">L'annuaire</a></h3>
 
 <p>
 Il liste les membres du groupe, par ordre alphabétique ou par promotions.
 </p>
 
-<div class="screenshot"><img src="images/doc/annuaire.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/annuaire.jpg" alt="L'annuaire du groupe" />
+</div>
 
 <p>
 Les
@@ -130,23 +136,23 @@ droite sont destin
 
 <div class="backtotop"><a href="manuel/auth">Retour au menu</a></div>
 
-<h3><a name="listes">Les listes de diffusion</a></h3>
+<h3><a id="listes">Les listes de diffusion</a></h3>
 
 <div class="backtotop"><a href="manuel/auth">Retour au menu</a></div>
 
-<h3><a name="agenda">L'agenda privé du groupe</a></h3>
+<h3><a id="agenda">L'agenda privé du groupe</a></h3>
 
 <div class="backtotop"><a href="manuel/auth">Retour au menu</a></div>
 
-<h3><a name="carnet">Le carnet</a></h3>
+<h3><a id="carnet">Le carnet</a></h3>
 
 <div class="backtotop"><a href="manuel/auth">Retour au menu</a></div>
 
-<h3><a name="evenements">Les événements</a></h3>
+<h3><a id="evenements">Les événements</a></h3>
 
 <div class="backtotop"><a href="manuel/auth">Retour au menu</a></div>
 
-<h3><a name="telepaiement">Le télépaiement</a></h3>
+<h3><a id="telepaiement">Le télépaiement</a></h3>
 
 <p>
 Le
index 03ba53f..bebbb58 100644 (file)
@@ -76,7 +76,7 @@ objectif la pr
 </table>
 
 
-<h3><a name="accueil">Accueil</a></h3>
+<h3><a id="accueil">Accueil</a></h3>
 
 <a href="http://www.polytechnique.net/">Voir l'accueil du site</a>
 
@@ -89,20 +89,22 @@ associations, en cliquant sur <em>plan du site</em>.
 
 <div class="backtotop"><a href="manuel/public">Retour au menu</a></div>
 
-<h3><a name="general">Les présentations générales</a></h3>
+<h3><a id="general">Les présentations générales</a></h3>
 
-<div class="screenshot"><img src="images/doc/groupeX.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/groupeX.jpg" alt="Choix du groupe" />
+</div>
 
 <p>
 Chacune des 4 catégories dispose d'une page descriptive. L'adresse de cette page varie
 suivant la catégorie représentée :
+</p>
 <ul>
   <li><a href="http://www.polytechnique.net/groups/GroupesX">pour les Groupes X</a></li>
   <li><a href="http://www.polytechnique.net/groups/Binets">pour les Binets</a></li>
   <li><a href="http://www.polytechnique.net/groups/Institutions">pour les Institutions</a></li>
   <li><a href="http://www.polytechnique.net/groups/Promotions">Pour les promotions</a></li>
 </ul>
-</p>
 
 <p>
 Les groupes X et les binets représentés sur le site sont nombreux, c'est pourquoi
@@ -110,19 +112,21 @@ ils sont regroup
 Professionnels) qui permettent un repérage plus facile sur le site.
 </p>
 
-<div class="screenshot"><img src="images/doc/gpx_liste.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/gpx_liste.jpg" alt="Liste de groupes" />
+</div>
 
 <div class="backtotop"><a href="manuel/public">Retour au menu</a></div>
 
-<h3><a name="dedie">Les pages dédiées</a></h3>
+<h3><a id="dedie">Les pages dédiées</a></h3>
 
 <p>
 Après avoir sélectionné l'association
 polytechnicienne de ton choix, tu arrives sur la page qui lui est dédiée.
 <a href="http://www.polytechnique.net/X-Israel/"> L'exemple d'X-Israël</a>
 La page de chaque association comporte ainsi :
-
-<ul style='margin-top:0cm' type=disc>
+</p>
+<ul style='margin-top:0cm'>
  <li style='text-align:justify'>Un menu (à droite), nécessaire à la navigation vers le reste du site</li>
  <li style='text-align:justify'>Des liens, pour revenir vers les autres associations de la même
  catégorie, ou vers les autres catégories (en haut, au milieu)</li>
@@ -130,11 +134,10 @@ La page de chaque association comporte ainsi :
  <li style='text-align:justify'> Des informations utiles pour savoir davantage (à droite). Ce menu
  te permet également de demander ton inscription au groupe si celui-ci t'intéresse.</li>
 </ul>
-</p>
 
 <div class="backtotop"><a href="manuel/public">Retour au menu</a></div>
 
-<h3><a name="inscription">L'inscription à un groupe X</a></h3>
+<h3><a id="inscription">L'inscription à un groupe X</a></h3>
 
 <p>
 Pour t'inscrire à un groupe, clique sur le lien correspondant, depuis la page du
@@ -143,33 +146,13 @@ administrateurs du groupe. Tu seras averti par retour de mail, de la suite
 donnée à ta demande.
 </p>
 
-<div class="screenshot"><img src="images/doc/inscription.jpg" /></div>
-
-<div class="backtotop"><a href="manuel/public">Retour au menu</a></div>
-
-<h3><a name="boite">La boîte à outils</a></h3>
-
-<p>
-Polytechnique.net
-offre la possibilité de faire une recherche avancée, non seulement sur le site
-lui-même, mais sur tous les sites polytechniciens. Pour en profiter, il te
-suffit de cliquer le mot clé de ta recherche dans la boîte à outils présente
-sur toutes les pages.
-</p>
-
-<div class="screenshot"><img src="images/doc/toolbar.jpg" /></div>
-
-<p>
-En cliquant sur la loupe à droite, tu pourras faire une recherche via le moteur
-d'<a href="http://www.exalead.fr" target="new">Exalead</a>. 
-Le petit carnet à droite te permet de revenir à tout instant à la page des événements. L'ampoule
-te dirige vers le mode d'emploi de Polytechnique.net, destiné à faciliter
-l'usage du site.
-</p>
+<div class="screenshot">
+  <img src="images/doc/inscription.jpg" alt="Inscription à un groupe" />
+</div>
 
 <div class="backtotop"><a href="manuel/public">Retour au menu</a></div>
 
-<h3><a name="evenements">Les événements</a></h3>
+<h3><a id="evenements">Les événements</a></h3>
 
 <p>
 La
@@ -179,15 +162,17 @@ groupes X. Elle est accessible depuis l'ic
 groupe
 </p>
 
-<div clas="backtotop"><a href="manuel/public">Retour au menu</a></div>
+<div class="backtotop"><a href="manuel/public">Retour au menu</a></div>
 
-<h3><a name="plan">Le plan du site</a></h3>
+<h3><a id="plan">Le plan du site</a></h3>
 
 <p>
 <a href="http://www.polytechnique.net/plan">Lien vers le plan</a>
 </p>
 
-<div class="screenshot"><img src="images/doc/plan.jpg" /></div>
+<div class="screenshot">
+  <img src="images/doc/plan.jpg" alt="Plan du site" />
+</div>
 
 <p>
 Cette
index b8d11d0..8c28914 100644 (file)
@@ -58,7 +58,6 @@
     {include file=skin/common.bandeau.tpl}
 
     <table id="layout" cellspacing="0" cellpadding="0">
-      {if $xnet_type}
       <tr>
         <td colspan="2">
         <table cellspacing="0" cellpadding="0" id="top">
               <a href=""><img src="images/asso-montants.png" alt="Logo Assos" /></a>
             </td>
             <td style="width: 106px">
+              {if $xnet_type}
               <img src="images/logo_{$xnet_type}.png" alt="Logo {$xnet_type}" width="106" height="96" />
+              {else}
+              <img src="images/logo_institutions.png" alt="Logo {$xnet_type}" width="106" height="96" />
+              {/if}
             </td>
             <td style="width: 44px">
               <img src="images/fin_logo.jpg" alt="Fin logo" width="44" height="96" />
             <td style="width: auto;">
               <img src="images/bandeau.jpg" alt="bandeau" height="96" width="100%" />
             </td>
+            {if $xnet_type}
             <td style="width: 280px">
               <img src="images/texte_{$xnet_type}.jpg" alt="{$xnet_type}" width="280" height="96" />
             </td>
             {if $asso}
             <td class="logo">
               {if $asso.site}
-                <a href="{$asso.site}"><img src='{$platal->ns}logo' alt="LOGO" height="96" /></a>
+                <a href="{$asso.site}"><img src='{$platal->ns}logo' alt="LOGO" height="80" /></a>
               {else}
-                <img src='{$platal->ns}logo' alt="LOGO" height="96"/>
+                <img src='{$platal->ns}logo' alt="LOGO" height="80"/>
               {/if}
             </td>
             {/if}
+            {else}
+            <td class="logo">
+              <img src="images/asso.png" alt="Le serveur des activés associative des X" />
+              <a href="http://www.polytechnique.org">
+                <img src="images/logo-xorg.png" alt="Polytechnique.org" height="80" />
+              </a>
+            </td>
+            {/if}
           </tr>
         </table>
         </td>
       </tr>
-      {else}
-      <tr id="top">
-        <td>
-          <img src="images/logo.png" alt="LOGO Assos" />
-        </td>
-        <td style="text-align: right">
-          <a href="https://www.polytechnique.org/"><img src="images/logo-xorg.png" alt="LOGO X.Org" /></a>
-          <img src="images/asso2.png" alt="titre_du_site" />
-        </td>
-      </tr>
-      <tr><td colspan="2"><img src="images/barre.png" alt="----------" width="765" /></td></tr>
-      {/if}
 
       {if $menu}
       <tr>
         <td colspan="2">
           <table class="links" summary="liens" cellspacing="0" cellpadding="0">
             <tr>
-              <td> <a href="plan">PLAN DU SITE</a> </td>
-              <td> <a href="groups/groupesx">groupes X</a> </td>
-              <td> <a href="groups/binets">binets</a> </td>
-              <td> <a href="groups/promotions">promotions</a> </td>
-              <td> <a href="groups/institutions">institutions</a> </td>
+              <td class="left">   <a href="groups/groupesx">Groupes X</a> </td>
+              <td class="left"> <a href="groups/binets">Binets</a> </td>
+              <td class="center"> <a href="groups/promotions">Promotions</a> </td>
+              <td class="center"> <a href="groups/institutions">Institutions</a> </td>
+              <td class="right">  <a href="plan">Tous</a> </td>
             </tr>
           </table>
         </td>
       <tr><td colspan="2"><img src="images/barre.png" alt="----------" width="765" /></td></tr>
 
       <tr>
-        <td colspan="2" id="perso">
-          {list_all_my_groups}
-          {if !$smarty.session.auth}
-          <div>Me connecter :</div>
-          <a class='gp' href="{$smarty.session.loginX}">polytechnicien</a>
-          {/if}
-
-          <a href="manuel" title="Manuel d'aide en ligne" style="float: right"><img src="images/manuel.png" alt="manuel" /></a>
+        <td colspan="2">
+        <table style="width: 100%">
+          <tr>
+            <td id="perso">
+              {list_all_my_groups}
+              {if !$smarty.session.auth}
+              <div>Me connecter :</div>
+              <a class='gp' href="{$smarty.session.loginX}">polytechnicien</a>
+              {/if}
+            </td>
+            <td class="right" style="vertical-align: middle">
+              <a href="manuel" title="Manuel d'aide en ligne">
+                Manuel de l'utilisateur
+                {icon name=lightbulb title="Documentation"}
+              </a>
+            </td>
+          </tr>
+        </table>
         </td>
       </tr>
 
 
       <tr>
         <td colspan="2" id="credits">
-          <a href="plan">liste des associations</a> -
+          <a href="plan">plan du site</a> -
           <a href="services">services proposés</a> -
           <a href="about">à propos de ce site</a> -
           {mailto address="contact@polytechnique.org" text="nous contacter" encode="javascript"}