Modèle:TheBigBox : Différence entre versions

De EncyclopAtys
 
(13 révisions intermédiaires par 2 utilisateurs non affichées)
Ligne 6 : Ligne 6 :
 
|RU= Template:TheBigBox
 
|RU= Template:TheBigBox
 
|H=ok
 
|H=ok
−
}}</noinclude><div style="vertical-align:top;color:#{{ColorAtys|group={{{palette}}}|type=fg}};padding:0; margin: 0em;overflow:auto;
+
}}</noinclude><div style="vertical-align:top;color:#{{ColorAtys|group={{{palette}}}|type=fg}};padding:0; margin: 0;overflow:auto;
 
{{ #switch: {{{type|}}}
 
{{ #switch: {{{type|}}}
−
| U=top:0; width:100%;background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .2em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}}; border-radius:.5em;clear:both;text-align:center;
+
| U=top:0; width:100%;background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .2em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}}; border-radius:.5em;clear:both;text-align:{{{align|center}}};
−
| u=top:0; width:100%;background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:medium double rgba(0, 0, 0, .2); border-radius:.5em;clear:both;text-align:center;
+
| F=float:right; width:100%;background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .2em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}}; border-radius:.5em;clear:both;text-align:{{{align|center}}};
−
| usav=top:0; width:100%;background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:thin outset #{{ColorAtys|group={{{palette}}}|type=dark}}; border-radius:.5em;clear:both;
+
| R=float:right; width:33%; margin-left: .1em; margin-right: 0;  margin: 0; background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .1em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}};border-radius:.5em;text-align:{{{align|left}}};
−
| R=float:right; width:33%; margin-left: .1em; margin-right: 0;  margin: 0; background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .1em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}};border-radius:.5em;
+
| R50=float:right; width:49%; margin-left: .1em; margin-right: 0;  margin: 0; background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .1em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}};border-radius:.5em;text-align:{{{align|left}}};
−
| r=margin-left:34%;    background:#{{ColorAtys|group={{{palette}}}|type=bg}};border-radius:.5em;box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:none;
+
| r=margin-left:34%;    background:#{{ColorAtys|group={{{palette}}}|type=bg}};border-radius:.5em;box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:none;text-align:{{{align|left}}};
−
| L=float:left;width:33%;  margin-right: .1em;    background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .1em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}};border-radius:.5em;
+
| L=float:left;width:33%;  margin-right: .1em;    background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .1em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}};border-radius:.5em;text-align:{{{align|left}}};
−
| l=margin-right:34%;    ;background:#{{ColorAtys|group={{{palette}}}|type=bg}};border-radius:.5em;box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:none;
+
| L50=float:left;width:49%;  margin-right: .1em;    background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .1em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}};border-radius:.5em;text-align:{{{align|left}}};
−
| C=margin:auto;width:30%;background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .1em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}}; border-radius:.5em;clear:both;text-align:center;
+
| l=margin-right:34%;    ;background:#{{ColorAtys|group={{{palette}}}|type=bg}};border-radius:.5em;box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:none;text-align:{{{align|left}}};
−
| c=margin:auto;width:30%;background:#{{ColorAtys|group={{{palette}}}|type=bg}};border-radius:.5em;box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:none;
+
| C=margin:auto;width:30%;background:#{{ColorAtys|group={{{palette}}}|type=light}};box-shadow: .1em .2em .4em rgba(0, 0, 0, .5);border:medium outset #{{ColorAtys|group={{{palette}}}|type=dark}}; border-radius:.5em;clear:both;text-align:{{{align|center}}};
−
| #defaultSav=top:0; width:100%;background:#{{ColorAtys|group={{{palette}}}|type=bg}};border-radius:.5em;box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:none;clear:both;
+
| c=margin:auto;width:30%;background:#{{ColorAtys|group={{{palette}}}|type=bg}};border-radius:.5em;box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:none;;text-align:{{{align|center}}};
−
| #default=top:0; width:100%;background:#{{ColorAtys|group={{{palette}}}|type=bg}};box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:medium double rgba(0, 0, 0, .2); border-radius:.5em;clear:both;text-align:center;
+
| #default=top:0; width:100%;background:#{{ColorAtys|group={{{palette}}}|type=bg}};box-shadow: .1em .1em .2em rgba(0, 0, 0, .8);border:medium double rgba(0, 0, 0, .2); border-radius:.5em;clear:both;text-align:{{{align|center}}};
 
}}
 
}}
 
">
 
">
Ligne 24 : Ligne 24 :
  
 
<div class="cadre"  
 
<div class="cadre"  
−
style="text-align:left; position:relative; left:0; top:0;  border:thin outset #{{ColorAtys|group={{{palette}}}|type=dark}}; hei_ght:2em; border-radius:.5em .5em .0em .0em;margin:.0em;text-overflow: ellipsis;
+
style="text-align:left; position:relative; left:0; top:0;  border:thin outset #{{ColorAtys|group={{{palette}}}|type=dark}}; height:2em; border-radius:.5em .5em .0em .0em;margin:0;text-overflow: ellipsis;
 
background: #{{ColorAtys|type=bg|group={{{palette}}}}};
 
background: #{{ColorAtys|type=bg|group={{{palette}}}}};
 
background: linear-gradient(to right, #{{ColorAtys|type=dark|group={{{palette}}}}}, #{{ColorAtys|type=bg|group={{{palette}}}}} 5%, #{{ColorAtys|type=light|group={{{palette}}}}}  50%, #{{ColorAtys|type=|group={{{palette}}}}}, #{{ColorAtys|type=dark|group={{{palette}}}}});
 
background: linear-gradient(to right, #{{ColorAtys|type=dark|group={{{palette}}}}}, #{{ColorAtys|type=bg|group={{{palette}}}}} 5%, #{{ColorAtys|type=light|group={{{palette}}}}}  50%, #{{ColorAtys|type=|group={{{palette}}}}}, #{{ColorAtys|type=dark|group={{{palette}}}}});
Ligne 30 : Ligne 30 :
 
border-bottom: thin outset #{{ColorAtys|type=dark|group={{{palette}}}}};
 
border-bottom: thin outset #{{ColorAtys|type=dark|group={{{palette}}}}};
 
color: #{{ColorAtys|type=fg|group={{{palette}}}}};">
 
color: #{{ColorAtys|type=fg|group={{{palette}}}}};">
−
   <!--div style="position:absolute; left:.5em; top:-.5em; top:0em;"-->[[File:{{{image|logo_40px.png}}}|40px|top|left|link=]]<!--/div-->
+
   <!--div style="position:absolute; left:.5em; top:-.5em; top:0em;"-->[[File:{{{image|logo_40px.png}}}|32px|top|left|link=]]<!--/div-->
 
   <!--div style="position:absolute; left:4em; top:.2em;font-size:1.2em; font-weight:bold; text-align:left; color:#{{ColorAtys|group={{{palette}}}|type=dark}}; padding:.0em;text-overflow: ellipsis;"-->
 
   <!--div style="position:absolute; left:4em; top:.2em;font-size:1.2em; font-weight:bold; text-align:left; color:#{{ColorAtys|group={{{palette}}}|type=dark}}; padding:.0em;text-overflow: ellipsis;"-->
 
{{3DText|text=<big><strong>{{{title}}}</strong></big> }}<!--/div-->
 
{{3DText|text=<big><strong>{{{title}}}</strong></big> }}<!--/div-->
Ligne 36 : Ligne 36 :
 
}}
 
}}
 
{{#if:{{{content|}}}|
 
{{#if:{{{content|}}}|
−
<div style="margin:.0em; padding:.5em;clear: both;">{{{content}}}</div>
+
<div style="margin:0; padding:.5em;clear: left;">{{{content}}}</div>
 
|
 
|
 
----
 
----
−
}}
+
}}</div><noinclude>{{{{FULLPAGENAME}}/Documentation}}[[Category:Templates]]</noinclude>
−
</div>
 
−
<noinclude>{{{{FULLPAGENAME}}/Documentation}}[[Category:Templates]]</noinclude>
 

Version actuelle datée du 29 décembre 2021 à 14:50

de:Template:TheBigBox en:Template:TheBigBox es:Template:TheBigBox fr:Template:TheBigBox ru:Template:TheBigBox
WarningRyzom.png

Utilisation du Template/Modèle TheBigBox

"TheBigBox" est un modèle à utiliser pour créer facilement des zones, pour tout type de mise en forme de pages, sans utiliser de tableau et utilisant partout la même charte graphique.
Ceci est le type " U " de "TheBigBox". Ne pas préciser la palette (la laisser vide) donne la palette par défaut.
WarningRyzom.png

Syntaxe

{{TheBigBox|type=type|title=title|image=image|palette=palette|content=content|align=text-align}}
Ceci est le type par " default " de "TheBigBox", sans la ligne type.
Paramètres
  • type: type de boite pour la section détaillé plus bas.
  • title: la barre de titre. Si vide, alors pas de barre.
  • image: icone pour le titre.
  • palette: choisir une couleur dans color of Atys
  • content: contenu de la section. Attention : quelques bugs lors de l'analyse des commandes wikis.
  • align: alignement général du texte dans la boîte. Les valeurs sont left, center, right, justify. Si vide, alors l'alignement prend la valeur attribuée par défaut à la boite. À noté que le texte de cette boîte a été aligné manuellement en HTML <div align="left">...</div>. La raison est due essentiellement à un bug sur les listes à puces.

Par défaut, les boîtes de Type U et C ont leur texte centré, car ce mode offre plus d'adaptabilité aux tailles d'écrans, évite les problèmes de césures et donc de grands espaces entre les mots. Néanmoins, dans certain cas, l'esthétique poussera à choisir un autre alignement. Les autre boîtes ont le texte aligné par défaut à gauche.

Ceci est le type " U " de "TheBigBox", sans titre.
R2 scenario admin.png

Les valeurs pour "type"

Types pour les boîtes occupant toute la largeur de la boîte les contenant:

  • U= Pleine largeur, relief épais, fond coloré, texte centré par défaut.
  • u ou default= Pleine largeur, relief fin, fond pastel, texte centré par défaut.

Types pour les petites boîtes flottantes dans la boîte les contenant:

  • À gauche
    • L= 1/3 de la largeur, flotte à gauche de la page, relief épais, fond coloré, texte aligné à gauche par défaut.
    • l(L minuscule)= 2/3 de la largeur, flotte à gauche de la page, léger relief, fond pastel, texte aligné à gauche par défaut.
  • Au centre
    • C= 1/3 de la largeur, centré dans la page, relief épais, fond coloré, texte aligné à gauche par défaut.
    • c= 1/3 de la largeur, centré dans la page, relief fin, fond pastel, texte aligné à gauche par défaut.
  • À droite
    • R= 1/3 de la largeur, flotte à droite of the page, relief épais, fond coloré, texte aligné à gauche par défaut.
    • r= 2/3 de la largeur, flotte à droite de la page, léger relief, fond pastel, texte aligné à gauche par défaut.
Ceci est le type " par défaut " de "TheBigBox".
Logo 40px.png

← Type U mais sans "image" , donc logo de ryzom

Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
R2 scenario admin.png

Les type U et u (ou par defaut) sont très utiles sans contenu pour réaligner les boîtes flottantes comme ci-dessous.

R2 scenario admin.png

Type c (en minuscule)

Les 3 échantillons suivants s'adaptent aussi dans toutes les petites boîtes flottantes.
R2 scenario admin.png

Type C (en majuscule)

{{TheBigBox |title= Un titre|image=R2_scenario_admin.png}}

ᐁdonneᐁ

R2 scenario admin.png

Un titre

{{TheBigBox |type=U}}
ᐁdonneᐁ

{{TheBigBox}}
ᐁdonneᐁ

Fyros emblem.png

Type L, palette fyros

Pour créer des doubles colonnes par page (il n'est pas prévu de triple colonnes) avec la petite colonne à gauche (par exemple pour y mettre des menus), il faut toujours commencer par celle de gauche.


Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Fyros emblem.png

Type r, palette fyros

La colonne de droite vient ensuite, sans le moindre espace ni ligne vide à la suite de la précédente colonne.


Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Fyros emblem.png

Type r

On peut enchaîner plusieurs colonnes à droite, toujours sans espace ni ligne vide entre les modèles.


Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Matis emblem.png

Type R, palette matis

Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Matis emblem.png

Type l (L minuscule), palette matis

Pour inverser la présentation, on commence par la colonne de droite →

Puis on enchaîne sur celle(s) de gauche, toujours sans espace ni ligne vide entre les modèles.


Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Matis emblem.png

Type l (L minuscule)

Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Rangers emblem.png

Pas de type (donc par défaut), palette ranger

On peut aussi imbriquer des blocs à l'intérieur d'autre, mais attention, les résdultat ne sont pas toujours ni prévisibles ni élégants.


Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.

Rangers emblem.png

Type l (L minuscule)

Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Tryker emblem.png

Pas de type (donc par défaut), palette ranger

Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Tryker emblem.png

Type R

Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Zor emblem.png

Pas de type (donc par défaut), palette zorai

Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Zor emblem.png

Type R

Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Zor emblem.png

Pas de type (donc par défaut)

Sed ut tum ad senem senex de senectute, sic hoc libro ad amicum amicissimus scripsi de amicitia. Tum est Cato locutus, quo erat nemo fere senior temporibus illis, nemo prudentior; nunc Laelius et sapiens (sic enim est habitus) et amicitiae gloria excellens de amicitia loquetur. Tu velim a me animum parumper avertas, Laelium loqui ipsum putes. C. Fannius et Q. Mucius ad socerum veniunt post mortem Africani; ab his sermo oritur, respondet Laelius, cuius tota disputatio est de amicitia, quam legens te ipse cognosces.
Récupérée de « https://fr.wiki.ryzom.com/w/index.php?title=Modèle:TheBigBox&oldid=71981 »