Pokémon Central Wiki

Differenze tra le versioni di "Aiuto:Manuale di stile/Avanzato"

Aiuto:Manuale di stile/Avanzato (visualizza wikitesto)

Versione delle 22:13, 10 set 2018

5 875 byte aggiunti ,  22:13, 10 set 2018
→‎Tabelle responsive
Bisogna poi sistemare le larghezze per far andare a capo le cose. Si possono usare le solite <code>width-__-__</code>, ma esistono anche le <code>min-width</code> che spingono a capo i <code>flex-items</code> se questi diventano troppo piccoli, e funzionano bene se accompagnate da <code>flex-main-stretch</code>.
 
Ultima cosa da tenere a mente sta nel fatto che le intestazioni andranno nascoste, dato che il layout non combacia se la riga diventa una card (basta un banale <code>class="hidden-md"</code>). Di conseguenza, le informazioni non ovvie dovranno essere specificate in ogni singola riga: è sufficiente unutilizzare uno <code>span</code> con la classe <code>class="visible-md"</code>.
 
Ecco un esempio pratico:
| class="width-md-100" | <span class="visible-md small-text" style="padding-right: 0.3em;">Generazione:</span>{{#invoke: Box | box | Prima | Prima generazione | kanto | thick}}
| 10% di probabilità di scottare il bersaglio
|}
 
In alcuni casi può essere preferibile rendere queste etichette sempre visibili, per esempio quando la tabella ha tante colonne, oppure quando ci sono righe con <code>colspan</code> diverso da 1 che non sono ben identificabili. In tal caso si può usare, al posto dello <code>span</code>, <code><nowiki><div class="inline-block-md"></nowiki></code>. Ecco un esempio (con breakpoint <code>sm</code>):
 
<nowiki>
{| class="std-table" style="{{#invoke: css | horizGrad | type = grazia}} padding: 0.3em;"
|- class="hidden-sm"
! Evento !! colspan="3" | Variazione in base all'affetto corrente
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | Aumento di [[livello]]
| style="padding: 0.5em;" | <div class="inline-block-sm">'''0-99''':&nbsp;</div>+5
| style="padding: 0.5em;" | <div class="inline-block-sm">'''100-199''':&nbsp;</div>+3
| style="padding: 0.5em;" | <div class="inline-block-sm">'''200-255''':&nbsp;</div>+2
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | Uso di [[pozioni]] o [[strumenti per curare problemi di stato]]
| style="padding: 0.5em;" | <div class="inline-block-sm">'''0-99''':&nbsp;</div>+5
| style="padding: 0.5em;" | <div class="inline-block-sm">'''100-199''':&nbsp;</div>+3
| style="padding: 0.5em;" | <div class="inline-block-sm">'''200-255''':&nbsp;</div>+2
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | Lotta contro un [[Capopalestra]], un [[Superquattro]] o il [[Campione]]
| style="padding: 0.5em;" colspan="2" | <div class="inline-block-sm">'''0-199''':&nbsp;</div>+3
| style="padding: 0.5em;" | <div class="inline-block-sm">'''200-255''':&nbsp;</div>+2
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | Uso di [[MT]] o [[MN]]
| style="padding: 0.5em;" colspan="2" | <div class="inline-block-sm">'''0-199''':&nbsp;</div>+1
| style="padding: 0.5em;" | <div class="inline-block-sm">'''200-255''':&nbsp;</div>&mdash;
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | [[K.O.]]
| style="padding: 0.5em;" colspan="3" | <div class="inline-block-sm">'''0-255''':&nbsp;</div>-1
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | Deposito nel [[Sistema Memoria Pokémon|PC]]
| style="padding: 0.5em;" colspan="2" | <div class="inline-block-sm">'''0-199''':&nbsp;</div>-3
| style="padding: 0.5em;" | <div class="inline-block-sm">'''200-255''':&nbsp;</div>-5
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | [[Scambio]]
| style="padding: 0.5em;" colspan="3" | <div class="inline-block-sm">'''0-255''':&nbsp;</div>Reset a 90
|}
</nowiki>
 
{| class="std-table" style="{{#invoke: css | horizGrad | type = grazia}} padding: 0.3em;"
|- class="hidden-sm"
! Evento !! colspan="3" | Variazione in base all'affetto corrente
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | Aumento di [[livello]]
| style="padding: 0.5em;" | <div class="inline-block-sm">'''0-99''':&nbsp;</div>+5
| style="padding: 0.5em;" | <div class="inline-block-sm">'''100-199''':&nbsp;</div>+3
| style="padding: 0.5em;" | <div class="inline-block-sm">'''200-255''':&nbsp;</div>+2
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | Uso di [[pozioni]] o [[strumenti per curare problemi di stato]]
| style="padding: 0.5em;" | <div class="inline-block-sm">'''0-99''':&nbsp;</div>+5
| style="padding: 0.5em;" | <div class="inline-block-sm">'''100-199''':&nbsp;</div>+3
| style="padding: 0.5em;" | <div class="inline-block-sm">'''200-255''':&nbsp;</div>+2
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | Lotta contro un [[Capopalestra]], un [[Superquattro]] o il [[Campione]]
| style="padding: 0.5em;" colspan="2" | <div class="inline-block-sm">'''0-199''':&nbsp;</div>+3
| style="padding: 0.5em;" | <div class="inline-block-sm">'''200-255''':&nbsp;</div>+2
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | Uso di [[MT]] o [[MN]]
| style="padding: 0.5em;" colspan="2" | <div class="inline-block-sm">'''0-199''':&nbsp;</div>+1
| style="padding: 0.5em;" | <div class="inline-block-sm">'''200-255''':&nbsp;</div>&mdash;
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | [[K.O.]]
| style="padding: 0.5em;" colspan="3" | <div class="inline-block-sm">'''0-255''':&nbsp;</div>-1
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | Deposito nel [[Sistema Memoria Pokémon|PC]]
| style="padding: 0.5em;" colspan="2" | <div class="inline-block-sm">'''0-199''':&nbsp;</div>-3
| style="padding: 0.5em;" | <div class="inline-block-sm">'''200-255''':&nbsp;</div>-5
|- class="flex-sm flex-row flex-wrap flex-main-space-around roundy" style="margin-top: 0.5rem;"
| class="width-sm-100" style="padding: 0.5em;" | [[Scambio]]
| style="padding: 0.5em;" colspan="3" | <div class="inline-block-sm">'''0-255''':&nbsp;</div>Reset a 90
|}
Lucas992X
Amministratori
46 258

contributi

Estratto da "https://wiki.pokemoncentral.it/Speciale:DiffMobile/667852"