Template:Section columns: Difference between revisions
Jump to navigation
Jump to search
m (fix braces) |
m (fix aria labels) |
||
| Line 1: | Line 1: | ||
<includeonly><div style="display: flex; max-width: 200ch; flex-wrap: wrap; gap: 1em 2em; clear: both;"> | <includeonly><div style="display: flex; max-width: 200ch; flex-wrap: wrap; gap: 1em 2em; clear: both;"> | ||
<div role="region" aria-labelledby="{{anchorencode:{{{heading 1}}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | <div role="region" aria-labelledby="{{anchorencode:{{#replace:{{{heading 1}}}|=}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | ||
{{{heading 1}}} | {{{heading 1}}} | ||
{{{section 1}}} | {{{section 1}}} | ||
</div> | </div> | ||
<div role="region" aria-labelledby="{{anchorencode:{{{heading 2}}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | <div role="region" aria-labelledby="{{anchorencode:{{#replace:{{{heading 2}}}|=}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | ||
{{{heading 2}}} | {{{heading 2}}} | ||
{{{section 2}}} | {{{section 2}}} | ||
</div> | </div> | ||
{{#if:{{{heading 3|}}}{{{section 3|}}}| | {{#if:{{{heading 3|}}}{{{section 3|}}}| | ||
<div role="region" aria-labelledby="{{anchorencode:{{{heading 3}}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | <div role="region" aria-labelledby="{{anchorencode:{{#replace:{{{heading 3}}}|=}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | ||
{{{heading 3}}} | {{{heading 3}}} | ||
{{{section 3}}} | {{{section 3}}} | ||
</div> | </div> | ||
}}{{#if:{{{heading 4|}}}{{{section 4|}}}| | }}{{#if:{{{heading 4|}}}{{{section 4|}}}| | ||
<div role="region" aria-labelledby="{{anchorencode:{{{heading 4}}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | <div role="region" aria-labelledby="{{anchorencode:{{#replace:{{{heading 4}}}|=}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | ||
{{{heading 4}}} | {{{heading 4}}} | ||
{{{section 4}}} | {{{section 4}}} | ||
</div> | </div> | ||
}}{{#if:{{{heading 5|}}}{{{section 5|}}}| | }}{{#if:{{{heading 5|}}}{{{section 5|}}}| | ||
<div role="region" aria-labelledby="{{anchorencode:{{{heading 5}}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | <div role="region" aria-labelledby="{{anchorencode:{{#replace:{{{heading 5}}}|=}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | ||
{{{heading 5}}} | {{{heading 5}}} | ||
{{{section 5}}} | {{{section 5}}} | ||
</div> | </div> | ||
}}{{#if:{{{heading 6|}}}{{{section 6|}}}| | }}{{#if:{{{heading 6|}}}{{{section 6|}}}| | ||
<div role="region" aria-labelledby="{{anchorencode:{{{heading 6}}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | <div role="region" aria-labelledby="{{anchorencode:{{#replace:{{{heading 6}}}|=}}}}" style="width: 40%; min-width: 50ch; flex: 1 0 auto;"> | ||
{{{heading 6}}} | {{{heading 6}}} | ||
{{{section 6}}} | {{{section 6}}} | ||
Revision as of 06:25, 27 January 2024
[edit] [] Documentation
Responsive layout for small subsections. Displays subsections side-by-side in two columns in large viewports (e.g. desktop). Displays subsections in a single vertical column in small viewports (e.g. mobile).
Usage
{{section columns
| heading 1 = ...
| section 1 = ...
| heading 2 = ...
| section 2 = ...
}}
Additional heading 3, section 3, heading 4, section 4, heading 5, section 5, heading 6, and section 6 parameters are optional.
Example
{{section columns
| heading 1 =
=== Paragon City ===
| section 1 =
* Atlas Park
* Kings Row
* Steel Canyon
* Skyway City
* Independence Port
* Talos Island
* Brickstown
* Founders Falls
* Peregrine Island
| heading 2 =
=== Shadow Shard ===
| section 2 =
* Firebase Zulu
* Cascade Archipelago
* The Chantry
* The Storm Palace
| heading 3 =
=== Praetoria ===
| section 3 =
* Nova Praetoria
* Imperial City
* Neutropolis
| heading 4 =
=== Rogue Isles ===
| section 4 =
* Mercy Island
* Port Oakes
* Cap Au Diable
* Sharkhead Isle
* St. Martial
* Grandville
}}
Paragon City
- Atlas Park
- Kings Row
- Steel Canyon
- Skyway City
- Independence Port
- Talos Island
- Brickstown
- Founders Falls
- Peregrine Island
Shadow Shard
- Firebase Zulu
- Cascade Archipelago
- The Chantry
- The Storm Palace
Praetoria
- Nova Praetoria
- Imperial City
- Neutropolis
Rogue Isles
- Mercy Island
- Port Oakes
- Cap Au Diable
- Sharkhead Isle
- St. Martial
- Grandville