Piwigo.org

Nicco · 2007-02-23 21:17:20

Yesssssssss

c est cool de m'aider les gars ... bon j'avoue que je suis un développeur de MOD d'opérette du coup moi je ne vois pas bien tout ces problèmes ;o)
donc merci ...

maintenant je dois faire koi alors ... je me crée un nouveau truc du style BODY#theNewsPage #content,
comme j'ai fais dans le Content.css ????

la franchement merci de m'éclairer car je suis un peu perdu ...

BON sinon vu que je sais que tu lis le post Vdigital ... j'ai 4 nouveaux accros dans ma boite qui se sont lancés dans le PWG
donc ca promet des midi de PhpWebGalley ;o)
en plus j ai réussi à accroché un certain BARBIT ;o) qui est le gros voyage ...je les accroché avec mon MOD Google Map modifié et la direct il a signé HAHAHA

Donc a l occaz si on s organise une rencontre PWG sur Paname ca peut le faire ;o)

( je sais que ces quelques ligne non rien a voir avec le sujet .... 1000 excuses ;o)

A+

Eric · 2007-02-23 23:52:39

Bonsoir à tous et à Nicco et VDigital en particulier.

Comme promis, je me suis mis sur la brèche des CSS du Mod News V5.1. J'en suis arrivé à la définition d'un nouvel ID "Newscontent" propre au Mod. Ceci permettra de pouvoir adapter son affichage en fonction du besoin de chacun. Pour être clair, je vais m'appuyer sur le fichier Install.txt de Nicco pour faire état des modifs à apporter.

Mais avant, il me faut signaler que cette modif n'est valable que si l'on place le bloc News *après* la barre principale des catégories (celle avec les icones d'accès au calendrier). De plus, je suis confronté à un soucis entre deux install de pwg sur deux sites différents... Mais j'en parlerai plus en détail à la fin de ce message.

Donc, selon le fichier install.txt du Mod News V5.1 :

* A partir de la ligne 715 => Pour le fichier template/NOM-DU-TEMPLATE/index.tpl, remplacer

Code:

# 
#-----[ FIND ]------------------------------------------ 
#

{MENUBAR}

Par

Code:

# 
#-----[ FIND ]------------------------------------------ 
#

  <!-- BEGIN calendar -->
  <h2>{calendar.TITLE}</h2>
  <!-- END calendar -->

  </div> <!-- titrePage -->

A la suite, remplacer :

Code:

# 
#-----[ AFTER, ADD ]------------------------------------------ 
#

<!-- BEGIN news -->
  <div id="content">
   <h2><a href="{news.U_NEWS}" title="{lang:hint_news}">{lang:title_news}</a></h2>
      <table class="tablecompact">
        <!-- BEGIN a_news -->
        <tr class="newsThrow">
          <td class="newsTitle">
            {news.a_news.TITLE}
          </td>
          <td class="newsInfo">
            <span class="newsAuthor">{news.a_news.NEWS_AUTHOR}</span> - <span class="newsDate">{news.a_news.NEWS_DATE}</span>
          </td>
        </tr>
        <tr >
          <td class="newsContent" colspan="2">
           <!-- BEGIN no_news_translation -->
           <div class="newsNoTranslation">({lang:no_news_translation})</div>
           <!-- END no_news_translation -->
           {news.a_news.CONTENT}
           <!-- BEGIN read_more -->
           <a class="newsReadMoreLink" href="{news.a_news.read_more.URL}" title="{lang:read_more}">({lang:read_more})</a>
           <!-- END read_more -->
          </td>
        </tr>
        <!-- END a_news -->
      </table>
  </div> <!-- content -->
<!-- END news -->

Par

Code:

# 
#-----[ AFTER, ADD ]------------------------------------------ 
#

<!-- BEGIN news -->
  <div id="newscontent">
   <h2><a href="{news.U_NEWS}" title="{lang:hint_news}">{lang:title_news}</a></h2>
      <table class="tablecompact" summary="">
        <!-- BEGIN a_news -->
        <tr class="newsThrow">
          <td class="newsTitle">
            {news.a_news.TITLE}
          </td>
          <td class="newsInfo">
            <span class="newsAuthor">{news.a_news.NEWS_AUTHOR}</span> - <span class="newsDate">{news.a_news.NEWS_DATE}</span>
          </td>
        </tr>
        <tr >
          <td class="newsContent" colspan="2">
           <!-- BEGIN no_news_translation -->
           <div class="newsNoTranslation">({lang:no_news_translation})</div>
           <!-- END no_news_translation -->
           {news.a_news.CONTENT}
           <!-- BEGIN read_more -->
           <a class="newsReadMoreLink" href="{news.a_news.read_more.URL}" title="{lang:read_more}">({lang:read_more})</a>
           <!-- END read_more -->
          </td>
        </tr>
        <!-- END a_news -->
      </table>
  </div> <!-- content -->
<!-- END news -->

N.B. : J'ai choisi cette insertion du bloc de News dans la page d'index car elle se rapproche le plus de la version originale. Au besoin, on peut aussi le placer en fin de page (après les minatures). Mais en aucun cas tout de suite après {MENUBAR} comme précisé dans l'install originale.

Nicco : Si tu tiens absolument à avoir le bloc News au dessus de tout, il faudra que je me penche un peu plus longuement sur le sujet.

* Ensuite, à partir de la ligne 801 => pour le fichier template/yoga/theme/clear/theme.css, remplacer :

Code:

/* BEGIN News MOD */
.tablecompact
{  
  border-collapse:collapse;
}

.table2
{  
  background-color:#EEEEEE;
}


.newsThrow
{  
  height:20px;
  border-collapse:collapse;
}

.newsTitle
{
  color:#006A8F;
  font-weight:bold;
  text-align:left;
  padding-left:5px;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
  border-collapse:collapse;
}

.newsInfo
{
  text-align:right;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3; 
  border-collapse:collapse;
}

.newsAuthor
{
  font-size:12px;
  text-align:right;
  color:#696969;
  font-weight:bold;
}

.newsDate
{
  font-size:10px;
  text-align:right;
  padding: 5px;
}

.newsLanguage
{
  font-weight:bold;
  color:#696969;
}


.newsContent
{
  text-align:left;
  padding: 10px;
  background-color:#EEEEEE;
}

.newsNoTranslation
{
  font-style:italic;
  color:#EEEEEE;
}

.newsMenu
{
  text-align:center;
  color:#EEEEEE;
}

.translationMenu
{
  padding-right:5px;
  padding-bottom:5px;
  text-align:right;
  color:#696969;
}

.newsMenu a, .translationMenu a
{
  color:#696969;
}

.newsReadMoreLink
{
  font-weight:bold;
}

/* Quote & Code blocks */
.code {
  font-family: Courier, 'Courier New', sans-serif; font-size: 11px; color: #006600;
  background-color: #FAFAFA; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}

.quote {
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #444444; line-height: 125%;
  background-color: #d3d3d3; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}


/* The content of the posts (body of text) */
.postbody { font-size : 12px;}
a.postlink:link  { text-decoration: none; color : #006699 }
a.postlink:visited { text-decoration: none; color : #5493B4; }
a.postlink:hover { text-decoration: underline; color : #DD6900}

/* General text */
.genmed { font-size : 11px; }
.genmed { color : #E0E0E0; }
a.genmed { color: #006699; text-decoration: none; }
a.genmed:hover { color: #DD6900; text-decoration: underline; }
/* END News MOD */

Par :

Code:

/* BEGIN News MOD */
#newscontent
{
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 0.5em;
  border: 1px solid #000000;
}

.tablecompact
{  
  border-collapse:collapse;
}

.table2
{  
  background-color:#EEEEEE;
}


.newsThrow
{  
  height:20px;
  border-collapse:collapse;
}

.newsTitle
{
  color:#006A8F;
  font-weight:bold;
  text-align:left;
  padding-left:5px;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
  border-collapse:collapse;
}

.newsInfo
{
  text-align:right;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3; 
  border-collapse:collapse;
}

.newsAuthor
{
  font-size:12px;
  text-align:right;
  color:#696969;
  font-weight:bold;
}

.newsDate
{
  font-size:10px;
  text-align:right;
  padding: 5px;
}

.newsLanguage
{
  font-weight:bold;
  color:#696969;
}


.newsContent
{
  text-align:left;
  padding: 10px;
  background-color:#EEEEEE;
}

.newsNoTranslation
{
  font-style:italic;
  color:#EEEEEE;
}

.newsMenu
{
  text-align:center;
  color:#EEEEEE;
}

.translationMenu
{
  padding-right:5px;
  padding-bottom:5px;
  text-align:right;
  color:#696969;
}

.newsMenu a, .translationMenu a
{
  color:#696969;
}

.newsReadMoreLink
{
  font-weight:bold;
}

/* Quote & Code blocks */
.code {
  font-family: Courier, 'Courier New', sans-serif; font-size: 11px; color: #006600;
  background-color: #FAFAFA; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}

.quote {
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #444444; line-height: 125%;
  background-color: #d3d3d3; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}


/* The content of the posts (body of text) */
.postbody { font-size : 12px;}
a.postlink:link  { text-decoration: none; color : #006699 }
a.postlink:visited { text-decoration: none; color : #5493B4; }
a.postlink:hover { text-decoration: underline; color : #DD6900}

/* General text */
.genmed { font-size : 11px; }
.genmed { color : #E0E0E0; }
a.genmed { color: #006699; text-decoration: none; }
a.genmed:hover { color: #DD6900; text-decoration: underline; }
/* END News MOD */

* Et, enfin, à partir de la ligne 948 => pour le fichier template/yoga/theme/dark/theme.css, remplacer :

Code:

/**
 * BEGIN News MOD
 */
 .tablecompact
{  
  border-collapse:collapse;
}

.newsThrow
{  
  height:20px;
  border-collapse:collapse;
}

.newsTitle
{
  color:#FFFFFF;
  font-weight:bold;
  text-align:left;
  padding-left:5px;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
  border-collapse:collapse;
}

.newsInfo
{
  text-align:right;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3; 
  border-collapse:collapse;
}

.newsAuthor
{
  font-size:12px;
  text-align:right;
  font-weight:bold;
}

.newsDate
{
  font-size:10px;
  text-align:right;
  padding: 5px;
}

.newsLanguage
{
  font-weight:bold;
  color:#fff48e;
}

.newsContent
{
  text-align:left;
  padding: 10px;
}

.newsNoTranslation
{
  font-style:italic;
  color:#EEEEEE;
}

.newsMenu
{
  text-align:center;
  color:#EEEEEE;
}

.translationMenu
{
  padding-right:5px;
  padding-bottom:5px;
  text-align:right;
  color:#696969;
}

.newsMenu a, .translationMenu a
{
  color:#696969;
}

.newsReadMoreLink
{
  font-weight:bold;
}

/* Quote & Code blocks */
.code {
  font-family: Courier, 'Courier New', sans-serif; font-size: 11px; color: #006600;
  background-color: #FAFAFA; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}

.quote {
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #444444; line-height: 125%;
  background-color: #d3d3d3; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}


/* The content of the posts (body of text) */
.postbody { font-size : 12px;}
a.postlink:link  { text-decoration: none; color : #FFFFFF }
a.postlink:visited { text-decoration: none; color : #fff48e; }
a.postlink:hover { text-decoration: underline; color : #fff48e}

/* General text */
.genmed { font-size : 11px; }
.genmed { color : #E0E0E0; }
a.genmed { color: #006699; text-decoration: none; }
a.genmed:hover { color: #DD6900; text-decoration: underline; }
/* END News MOD */

Par :

Code:

/* BEGIN News MOD */
#newscontent
{
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 0.5em;
  border: 1px solid #000000;
}

 .tablecompact
{  
  border-collapse:collapse;
}

.newsThrow
{  
  height:20px;
  border-collapse:collapse;
}

.newsTitle
{
  color:#FFFFFF;
  font-weight:bold;
  text-align:left;
  padding-left:5px;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
  border-collapse:collapse;
}

.newsInfo
{
  text-align:right;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3; 
  border-collapse:collapse;
}

.newsAuthor
{
  font-size:12px;
  text-align:right;
  font-weight:bold;
}

.newsDate
{
  font-size:10px;
  text-align:right;
  padding: 5px;
}

.newsLanguage
{
  font-weight:bold;
  color:#fff48e;
}

.newsContent
{
  text-align:left;
  padding: 10px;
}

.newsNoTranslation
{
  font-style:italic;
  color:#EEEEEE;
}

.newsMenu
{
  text-align:center;
  color:#EEEEEE;
}

.translationMenu
{
  padding-right:5px;
  padding-bottom:5px;
  text-align:right;
  color:#696969;
}

.newsMenu a, .translationMenu a
{
  color:#696969;
}

.newsReadMoreLink
{
  font-weight:bold;
}

/* Quote & Code blocks */
.code {
  font-family: Courier, 'Courier New', sans-serif; font-size: 11px; color: #006600;
  background-color: #FAFAFA; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}

.quote {
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #444444; line-height: 125%;
  background-color: #d3d3d3; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}


/* The content of the posts (body of text) */
.postbody { font-size : 12px;}
a.postlink:link  { text-decoration: none; color : #FFFFFF }
a.postlink:visited { text-decoration: none; color : #fff48e; }
a.postlink:hover { text-decoration: underline; color : #fff48e}

/* General text */
.genmed { font-size : 11px; }
.genmed { color : #E0E0E0; }
a.genmed { color: #006699; text-decoration: none; }
a.genmed:hover { color: #DD6900; text-decoration: underline; }
/* END News MOD */

Explications : Les fichiers themes.css supporteront alors la clause #newscontent qui gèrera l'affichage du <div id="newscontent"> dans le fichier index.tpl. Le rendant ainsi indépendant du <div id="content"> natif de PWG.
Comme je l'ai dit au début de ce post, cette solution n'est concluante que si l'on insere le bloc News entre le <div id="content"> </div>du fichier index.tpl. Si on le place après {MENUBAR} comme prévu initialement, çà merdouille... Pour que ce soit valable à cette place, il faut réécrire le bloc

Code:

{
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 0.5em;
  border: 1px solid #000000;
}

de manière à ce qu'il reprenne tous les arguments de <div id="content">. Affaire à suivre donc.

Voilà pour cette partie, je clos ce post déjà très long pour revenir de suite avec mon soucis évoqué au début...

[Edit]
Une petite suggestion : Pour "coller" au mieux aux recommandations du W3C, je suggère d'ajouter summary="" aux balises <TABLE>
[/Edit]

Dernière modification par Eric (2007-02-24 01:10:14)

Eric · 2007-02-24 00:08:03

J'en viens au problème que je rencontre sur le sujet :

J'ai 2 galeries PWG distinctes. Du point de vue fonctionnel, les deux galerie sont parfaitement identiques. J'ai installé le Mod News 5.1 sur la première (lien dans ma signature) sans aucun pb.

Je fais la même opération sur la seconde galerie et j'obtiens un résultat différent ! A savoir l'affichage des News en vrac. Une capture d'écran valant mieux qu'un long discours, voila ce que j'ai sur la première galerie, suivi par le résultat de la seconde :

J'ai passé les deux répertoires PWG à travers Winmerge et tous les fichiers sont identiques (du moins pour la partie fonctionnelle), notamment les fichiers CSS. Car je pense que le pb dois venir de là. Enfin, maintenant, je n'en suis plus très sure... :-/

Donc pas moyen de corriger l'affichage des News sur le second site afin que le bloc prenne toute la largeur du bloc de catégories. Une idée, quelqu'un ?

[Edit]
Je confirme : J'ai refait un DL des deux sites en local (sous easyphp) et j'ai réinstallé le Mod News 5.1 sur le second site. Winmerge m'indique que les deux distributions de PWG sont parfaitement identiques (moins le dossier galleries !).

Et pourtant, l'affichage des News est toujours aussi merdique sur le second site... C'est à devenir dingue !
[/Edit]

Dernière modification par Eric (2007-02-24 00:46:19)

VDigital · 2007-02-24 00:46:35

Eric, tu m'envoies par mail l'autre adresse, et je te ferai la comparaison si possible ce we.
8-)

Eric · 2007-02-24 00:58:41

Merci Vincent mais quand j'ai remarqué le pb en local, je n'ai pas fait la mise ne ligne du second site :-/

Je vais voir ce que je peux faire...

Eric · 2007-02-24 01:31:17

Nicco, en cherchant à résoudre mon pb, je me suis rendu compte d'un truc :

Si on oublie le bbcode, ces lignes ne sont plus nécessaires dans les fichiers theme.css :

Code:

/* Quote & Code blocks */
.code {
  font-family: Courier, 'Courier New', sans-serif; font-size: 11px; color: #006600;
  background-color: #FAFAFA; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}

.quote {
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #444444; line-height: 125%;
  background-color: #d3d3d3; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}

Elles concernent l'affichage des bbcodes *quote* et *code*.

Il est vraiment trop tard pour chercher une aiguille dans une meule de foin. En plus, je trouve des coquilles qui n'ont rien à voir !

Aller, au dodo. Demain est un autre jour...

Nicco · 2007-02-24 03:56:59

Bon la je rentre de soirée ... donc pas très frais ... pour regarder du code !!!

mais a propos de tes differences ... une idée comme ca ;o)
la longueur de tes lignes dans les news ne serait elle pas differente et du coup tu as des news qui occupent tout l espace car surle site 1 tu arrives en limite d affichage

mais sur le site 2 c est trop court et donc ca donne pas le meme effet visuel ! ?

tu peu essayer de reduire leslignes textes des news du site 1 ( ou tu n en affiches qu une qui est tres courte )
et a l inverse tu allonges celles du site 2

a demain la faut que je dorme ;o)

a+

Eric · 2007-02-24 11:51:06

Raaahhaaa ! Nicco ! T'es un chef !

J'ai connu, autrefois, un mec au lycée qui était un surdoué en maths et en physique... uniquement quand il était saoul ! Je ne veux pas insinuer que c'était ton cas cette nuit mais tu as raison : le bloc s'adapte à la taille de son contenu.

Et moi qui ai passé ma nuit à éplucher les CSS... Bon, maintenant, il ne reste plus qu'à trouver comment figer la taille de ce cadre une bonne fois pour toute.

Merci Nicco !

Eric · 2007-02-24 14:59:52

Bon... J'ai compris le système, je crois. J'ai réussi à figer la largeur des News quelque soit le contenu. Voici ce que propose concernant les CSS du Mod (je reprend tout ce que j'ai déjà écrit précédemment) :

NB : J'ai ajouté des commentaires dans le code pour les explications sommaires des modifs apportées.

* Toujours d'après le fichier install.txt de Nicco, pour le fichier template/NOM-DU-TEMPLATE/index.tpl, remplacer

Code:

# 
#-----[ FIND ]------------------------------------------ 
#

{MENUBAR}

Par

Code:

# 
#-----[ FIND ]------------------------------------------ 
#

  <!-- BEGIN calendar -->
  <h2>{calendar.TITLE}</h2>
  <!-- END calendar -->

  </div> <!-- titrePage -->

A la suite, remplacer

Code:

# 
#-----[ AFTER, ADD ]------------------------------------------ 
#

<!-- BEGIN news -->
  <div id="content">
   <h2><a href="{news.U_NEWS}" title="{lang:hint_news}">{lang:title_news}</a></h2>
      <table class="tablecompact">
        <!-- BEGIN a_news -->
        <tr class="newsThrow">
          <td class="newsTitle">
            {news.a_news.TITLE}
          </td>
          <td class="newsInfo">
            <span class="newsAuthor">{news.a_news.NEWS_AUTHOR}</span> - <span class="newsDate">{news.a_news.NEWS_DATE}</span>
          </td>
        </tr>
        <tr >
          <td class="newsContent" colspan="2">
           <!-- BEGIN no_news_translation -->
           <div class="newsNoTranslation">({lang:no_news_translation})</div>
           <!-- END no_news_translation -->
           {news.a_news.CONTENT}
           <!-- BEGIN read_more -->
           <a class="newsReadMoreLink" href="{news.a_news.read_more.URL}" title="{lang:read_more}">({lang:read_more})</a>
           <!-- END read_more -->
          </td>
        </tr>
        <!-- END a_news -->
      </table>
  </div> <!-- content -->
<!-- END news -->

Par

Code:

# 
#-----[ AFTER, ADD ]------------------------------------------ 
#

<!-- BEGIN news -->
  <div id="newscontent"> <!-- Ceci est le DIV propre au Mod News -->
   <h2><a href="{news.U_NEWS}" title="{lang:hint_news}">{lang:title_news}</a></h2>
      <table class="tablecompact" summary="">
        <!-- BEGIN a_news -->
        <tr class="newsThrow">
          <td class="newsTitle">
            {news.a_news.TITLE}
          </td>
          <td class="newsInfo">
            <span class="newsAuthor">{news.a_news.NEWS_AUTHOR}</span> - <span class="newsDate">{news.a_news.NEWS_DATE}</span>
          </td>
        </tr>
        <tr >
          <td class="newsContent" colspan="2">
           <!-- BEGIN no_news_translation -->
           <div class="newsNoTranslation">({lang:no_news_translation})</div>
           <!-- END no_news_translation -->
           {news.a_news.CONTENT}
           <!-- BEGIN read_more -->
           <a class="newsReadMoreLink" href="{news.a_news.read_more.URL}" title="{lang:read_more}">({lang:read_more})</a>
           <!-- END read_more -->
          </td>
        </tr>
        <!-- END a_news -->
      </table>
  </div> <!-- content -->
<!-- END news -->

Jusque là, rien ne change par rapport à ce que j'ai proposé avant. Cà change à partir de maintenant.

* A partir de la ligne 801 => pour le fichier template/yoga/theme/clear/theme.css, remplacer :

Code:

/* BEGIN News MOD */
.tablecompact
{  
  border-collapse:collapse;
}

.newsThrow
{  
  height:20px;
  border-collapse:collapse;
}

.newsTitle
{
  color:#006A8F;
  font-weight:bold;
  text-align:left;
  padding-left:5px;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
  border-collapse:collapse;
}

.newsInfo
{
  text-align:right;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3; 
  border-collapse:collapse;
}

.newsAuthor
{
  font-size:12px;
  text-align:right;
  color:#696969;
  font-weight:bold;
}

.newsDate
{
  font-size:10px;
  text-align:right;
  padding: 5px;
}

.newsLanguage
{
  font-weight:bold;
  color:#696969;
}


.newsContent
{
  text-align:left;
  padding: 10px;
  background-color:#EEEEEE;
}

.newsNoTranslation
{
  font-style:italic;
  color:#EEEEEE;
}

.newsMenu
{
  text-align:center;
  color:#EEEEEE;
}

.translationMenu
{
  padding-right:5px;
  padding-bottom:5px;
  text-align:right;
  color:#696969;
}

.newsMenu a, .translationMenu a
{
  color:#696969;
}

.newsReadMoreLink
{
  font-weight:bold;
}

/* Quote & Code blocks */
.code {
  font-family: Courier, 'Courier New', sans-serif; font-size: 11px; color: #006600;
  background-color: #FAFAFA; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}

.quote {
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #444444; line-height: 125%;
  background-color: #d3d3d3; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}


/* The content of the posts (body of text) */
.postbody { font-size : 12px;}
a.postlink:link  { text-decoration: none; color : #006699 }
a.postlink:visited { text-decoration: none; color : #5493B4; }
a.postlink:hover { text-decoration: underline; color : #DD6900}

/* General text */
.genmed { font-size : 11px; }
.genmed { color : #E0E0E0; }
a.genmed { color: #006699; text-decoration: none; }
a.genmed:hover { color: #DD6900; text-decoration: underline; }
/* END News MOD */

Par

Code:

/* BEGIN News MOD */
#newscontent   /* Définition du DIV principal du Mod News */
{
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 0.5em;
  border: 1px solid #000000;
}

 .tablecompact
{  
  border-collapse:collapse;
  width: 99.99%;  /* étend l'affichage des news quelque soit le contenu */
}

.newsThrow
{  
  height:20px;
  border-collapse:collapse;
}

.newsTitle
{
  color:#006A8F;
  font-weight:bold;
  text-align:left;
  padding-left:5px;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
  border-collapse:collapse;
}

.newsInfo
{
  text-align:right;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3; 
  border-collapse:collapse;
}

.newsAuthor
{
  font-size:12px;
  text-align:right;
  font-weight:bold;
  color:#696969;
}


.newsDate
{
  font-size:10px;
  text-align:right;
  padding: 5px;
}

.newsLanguage
{
  font-weight:bold;
  color:#696969;
}

.newsContent
{
  text-align:left;
  padding: 10px;
  background-color:#EEEEEE;
}

.newsNoTranslation
{
  font-style:italic;
  color:#EEEEEE;
}

.newsMenu
{
  text-align:center;
  color:#EEEEEE;
}

.translationMenu
{
  padding-right:5px;
  padding-bottom:5px;
  text-align:right;
  color:#696969;
}

.newsMenu a, .translationMenu a
{
  color:#696969;
}

.newsReadMoreLink
{
  font-weight:bold;
}

/* The content of the posts (body of text) */
.postbody { font-size : 12px;}
a.postlink:link  { text-decoration: none; color : #006699 }
a.postlink:visited { text-decoration: none; color : #5493B4; }
a.postlink:hover { text-decoration: underline; color : #DD6900}

/* General text */
.genmed { font-size : 11px; }
.genmed { color : #E0E0E0; }
a.genmed { color: #006699; text-decoration: none; }
a.genmed:hover { color: #DD6900; text-decoration: underline; }
/* END News MOD */

* A partir de la ligne 948 => pour le fichier template/yoga/theme/dark/theme.css, remplacer :

Code:

/* BEGIN News MOD */
 .tablecompact
{  
  border-collapse:collapse;
}

.newsThrow
{  
  height:20px;
  border-collapse:collapse;
}

.newsTitle
{
  color:#FFFFFF;
  font-weight:bold;
  text-align:left;
  padding-left:5px;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
  border-collapse:collapse;
}

.newsInfo
{
  text-align:right;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3; 
  border-collapse:collapse;
}

.newsAuthor
{
  font-size:12px;
  text-align:right;
  font-weight:bold;
}

.newsDate
{
  font-size:10px;
  text-align:right;
  padding: 5px;
}

.newsLanguage
{
  font-weight:bold;
  color:#fff48e;
}

.newsContent
{
  text-align:left;
  padding: 10px;
}

.newsNoTranslation
{
  font-style:italic;
  color:#EEEEEE;
}

.newsMenu
{
  text-align:center;
  color:#EEEEEE;
}

.translationMenu
{
  padding-right:5px;
  padding-bottom:5px;
  text-align:right;
  color:#696969;
}

.newsMenu a, .translationMenu a
{
  color:#696969;
}

.newsReadMoreLink
{
  font-weight:bold;
}

/* Quote & Code blocks */
.code {
  font-family: Courier, 'Courier New', sans-serif; font-size: 11px; color: #006600;
  background-color: #FAFAFA; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}

.quote {
  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #444444; line-height: 125%;
  background-color: #d3d3d3; border: #797979; border-style: solid;
  border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}


/* The content of the posts (body of text) */
.postbody { font-size : 12px;}
a.postlink:link  { text-decoration: none; color : #FFFFFF }
a.postlink:visited { text-decoration: none; color : #fff48e; }
a.postlink:hover { text-decoration: underline; color : #fff48e}

/* General text */
.genmed { font-size : 11px; }
.genmed { color : #E0E0E0; }
a.genmed { color: #006699; text-decoration: none; }
a.genmed:hover { color: #DD6900; text-decoration: underline; }
/* END News MOD */

Par

Code:

/* BEGIN News MOD */
#newscontent   /* Définition du DIV principal du Mod News */
{
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 0.5em;
  border: 1px solid #000000;
}

 .tablecompact
{  
  border-collapse:collapse;
  width: 99.99%;   /* étend l'affichage des news quelque soit le contenu */
}

.newsThrow
{  
  height:20px;
  border-collapse:collapse;
}

.newsTitle
{
  color:#FFFFFF;
  font-weight:bold;
  text-align:left;
  padding-left:5px;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
  border-collapse:collapse;
}

.newsInfo
{
  text-align:right;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3; 
  border-collapse:collapse;
}

.newsAuthor
{
  font-size:12px;
  text-align:right;
  font-weight:bold;
}

.newsDate
{
  font-size:10px;
  text-align:right;
  padding: 5px;
}

.newsLanguage
{
  font-weight:bold;
  color:#fff48e;
}

.newsContent
{
  text-align:left;
  padding: 10px;
}


.newsNoTranslation
{
  font-style:italic;
  color:#EEEEEE;
}

.newsMenu
{
    text-align:center;
  color:#EEEEEE;
}

.translationMenu
{
  padding-right:5px;
  padding-bottom:5px;
  text-align:right;
  color:#696969;
}

.newsMenu a, .translationMenu a
{
  color:#696969;
}

.newsReadMoreLink
{
  font-weight:bold;
}

/* The content of the posts (body of text) */
.postbody { font-size : 12px;}
a.postlink:link  { text-decoration: none; color : #FFFFFF }
a.postlink:visited { text-decoration: none; color : #fff48e; }
a.postlink:hover { text-decoration: underline; color : #fff48e}

/* General text */
.genmed { font-size : 11px; }
.genmed { color : #E0E0E0; }
a.genmed { color: #006699; text-decoration: none; }
a.genmed:hover { color: #DD6900; text-decoration: underline; }
/* END News MOD */

A ce stade, Nicco, ton ajout de

Code:

BODY#theNewsPage #content,

dans le content.css ne sert pas à grand chose car il n'y a aucune balise BODY identifiée comme #theNewsPage active dans les templates standards. Mais avant de le supprimer de la procédure d'install du Mod, je voudrais voir si çà ne peut pas servir à résoudre le problème de la position des News dans index.tpl.

En effet, ma modif ci-dessus est assez moche lorsque l'on place le cadre des News juste après {MENUBAR} dans le fichier index.tpl. Je m'y penche de suite et je te tiens au courant.

En attendant, que penses-tu de ma proposition ?

[Edit] Correction des fautes d'orthographe :-/ [/Edit]

[Edit 2] Correction d'une erreur dans les themes.css => Une scorie d'un version précédente du Mod News (.table2) à virer. [/Edit 2]

Dernière modification par Eric (2007-02-24 16:08:44)

Nicco · 2007-02-24 20:02:02

Salut les gars !!!

bon je suis un peu plus frais maintenant ... dure journée ;o)

mais la je repars donc je ne vais pas pouvoir regarder les modifs ce soir mais franchement Eric c est bien cool de m'aider sur les css car je comprend pas toujours bien

bon a+

et je regarderai le forum en rentrant cette nuit ;o)
je serai surement suffisament alcooliser pour debugger un peu HAHAHA

bye

Eric · 2007-02-25 15:03:34

Salut Nicco.

J'espère que la soirée s'est bien passée ;-)

Sans être un Dieu en CSS, je me débrouille. Mais là, j'avoue qu'il me faudrait un coup de main du Team pour comprendre la structure employée sur PWG. Notamment en ce qui concerne l'ID "#content" utilisé dans l'index.tpl.

Je ne parviens pas à récupérer tous les paramètres de cet ID afin de les duppliquer pour l'ID "#newscontent" que j'ai créé pour le Mod. Le but étant toujours de permettre l'insertion du bloc News à peu près n'importe où dans index.tpl.

Avec le code CSS que j'ai posté hier, on peut l'insérer après

Code:

</div> <!-- titrePage -->

Ce qui le place graphiquement en tête des miniatures, juste en dessous de la barre "Accueil" et des icônes de calendrier.

Ou juste avant

Code:

</div> <!-- content -->

Ce qui le place en fin de page, après les miniatures (pas grand intérêt pour moi, personnellement, mais bon... Pour d'autres peut-être ?).

Par contre impossible de le coller juste après

Code:

{MENUBAR}

Et c'est çà qui me gène un peu...

Nicco, pour les "explications de texte", dis moi ce que tu ne piges pas exactement et j'essaierai de t'éclairer.

Eric · 2007-03-04 15:09:44

Salut Nicco.

Je n'ai pas encore réussi (eu le temps) de creuser le problème de l'insertion des news après le {MENUBAR}... Par contre, je me suis dit que tu pourrais commiter une V5.2 du MOD avec les modifs de CSS que j'ai présenté ici.

Après tout, c'est toi qui a fait le plus gros du boulot, il est normal que cela te revienne. Et on pourrait ainsi partir sur une base CSS saine pour attaquer la version plugin pour la 1.7 de pwg.

Qu'en penses-tu ?

Nicco · 2007-03-04 15:12:56

tout a fait ok mister Eric ...

par contre j ai une vie un peu mouvementée ! du coup je sors et je n'ai plus assez de temps la nuit pour faire des modifs dans les MODs ... ;o)

mais je vais faire ca dans la semaine OK pour toi ?

a+ et encore merci

Eric · 2007-03-04 15:23:49

Ok, pas de soucis pour moi.

Ne t'inquiètes pas, je te comprend. C'était juste pour savoir si le CSS est complètement OK pour toi ainsi que la restriction quant à l'insertion des news. Tu pourrais considérer cela comme une régression et tu n'aurais pas tord.

A+

Nicco · 2007-03-04 22:32:40

ooooooooulala bien au contraire je suis heureux de me faire des potes sur les css ... car je suis un bairrrr ;o)

sans deconner c est justement avec des personnes comme toi que j ai eu envie de participer a PWG
alors que je suis qu'un debutant donc pas de soucis et tout les aides sont les bienvenues

bye bye

et bonne nuit j ai du sommeil en retard !!!!

Piwigo.org

Annonce

#16 2007-02-23 21:17:20

Re: MOD News 5.1

#17 2007-02-23 23:52:39

Re: MOD News 5.1

Code:

Code:

Code:

Code:

Code:

Code:

Code:

Code:

Code:

#18 2007-02-24 00:08:03

Re: MOD News 5.1

#19 2007-02-24 00:46:35

Re: MOD News 5.1

#20 2007-02-24 00:58:41

Re: MOD News 5.1

#21 2007-02-24 01:31:17

Re: MOD News 5.1

Code:

#22 2007-02-24 03:56:59

Re: MOD News 5.1

#23 2007-02-24 11:51:06

Re: MOD News 5.1

#24 2007-02-24 14:59:52

Re: MOD News 5.1

Code:

Code:

Code:

Code:

Code:

Code:

Code:

Code:

Code:

#25 2007-02-24 20:02:02

Re: MOD News 5.1

#26 2007-02-25 15:03:34

Re: MOD News 5.1

Code:

Code:

Code:

#27 2007-03-04 15:09:44

Re: MOD News 5.1

#28 2007-03-04 15:12:56

Re: MOD News 5.1

#29 2007-03-04 15:23:49

Re: MOD News 5.1

#30 2007-03-04 22:32:40

Re: MOD News 5.1

Pied de page des forums