Template:Fieldset: Difference between revisions

From Step Mods | Change The Game
No edit summary
No edit summary
Line 3: Line 3:
<div style="display: table; border:1px solid #B1B1B1; border-radius:4px; padding:0 4px 2px;">
<div style="display: table; border:1px solid #B1B1B1; border-radius:4px; padding:0 4px 2px;">
<div style="padding-left:10px; line-height: 0.1px; visibility:hidden;">{{{1}}}<br /></div>
<div style="padding-left:10px; line-height: 0.1px; visibility:hidden;">{{{1}}}<br /></div>
{{#ifeq:{{{bullet}}} | yes | <ul style="padding-top:2px; list-style-type:none; margin-left:-1px; margin-bottom:0px;">{{#arraymap:{{{inside|}}}|;|@@@|<li><span style="background-color:#181818; padding:0px 3.5px 0px 3.5px; border:2.75px solid #fff; border-radius:10px; font-size:5px; color:white; vertical-align:middle;"></span>&nbsp;@@@</li>}}</ul> | {{#ifeq:{{{checkmark}}} | yes | <ul style="padding-top:2px; list-style-type:none; margin-left:-1px; margin-bottom:0px;">{{#arraymap:{{{inside|}}}|;|@@@|<li><span style="font-size:17px; vertical-align:top;">&#9745;</span>&nbsp;<span style="vertical-align:middle;">@@@</span></li>}}</ul>|<div style="padding-top:5px;">{{{inside|}}}</div>}}
{{#ifeq:{{{bullet}}} | yes | <ul style="padding-top:2px; list-style-type:none; margin-left:-1px; margin-bottom:0px;">{{#arraymap:{{{inside|}}}|;|@@@|<li><span style="background-color:#181818; padding:0px 3.5px 0px 3.5px; border:2.75px solid #fff; border-radius:10px; font-size:5px; color:white; vertical-align:middle;"></span>&nbsp;@@@</li>|}}</ul> | {{#ifeq:{{{checkmark}}} | yes | <ul style="padding-top:2px; list-style-type:none; margin-left:-1px; margin-bottom:0px;">{{#arraymap:{{{inside|}}}|;|@@@|<li><span style="font-size:17px; vertical-align:top;">&#9745;</span>&nbsp;<span style="vertical-align:middle;">@@@</span></li>|}}</ul>|<div style="padding-top:5px;">{{{inside|}}}</div>}}
</div>
</div>
</div></includeonly><noinclude>__NOTOC__
</div></includeonly><noinclude>__NOTOC__

Revision as of 13:10, May 3, 2015


Purpose & Usage

This is a template implementation of the html fieldset-legend combo, with rounded corners.

  • parameter title will be bold and aligned to the right. Only one value may be used.
  • parameter inside is inside the box.
  • parameter bullet if set to yes will make inside an unordered list (bullet points) with separate list items separated by semicolons ; (commas were avoided, as sometimes it may be desired for it a bullet point to contain a comma, whereas likelihood of a semicolon is not much)
  • parameter checkmark if set to yes will make inside an unordered list (checkmarks) with separate list items separated by semicolons ; (commas were avoided, as sometimes it may be desired for it a bullet point to contain a comma, whereas likelihood of a semicolon is not much)
  • parameter color changes the default yellow color to your desired color.


Examples

Code:

{{Fieldset|title=Page|You should really love this text.}}

Result:

Page
You should really love this text.
{{#ifeq:{{{bullet}}} | yes |
    |

    Code:

    {{Fieldset|title=Page|bullet=yes|inside=Option1; Option2; Option3; Option4}}

    Result:

    Page
    {{{1}}}
    {{#ifeq:yes | yes |
    •  Option1
    •  Option2
    •  Option3
    •  Option4
    |
    Option1; Option2; Option3; Option4

    Code:

    {{Fieldset|title=Page|inside=Option1; Option2; Option3; Option4|checkmark=yes}}

    Result:

    Page
    {{{1}}}
    {{#ifeq:{{{bullet}}} | yes |
    •  Option1
    •  Option2
    •  Option3
    •  Option4
    |
    •  Option1
    •  Option2
    •  Option3
    •  Option4

    Code:

    {{Fieldset|title=Page|inside={{Fieldset|title=Step|inside=Option1; Option2; Option3; Option4|bullet=yes}}|color=A6A6A6}}

    Result:

    Page
    {{{1}}}
    {{#ifeq:{{{bullet}}} | yes |
    •  <div style="display:table
    •  "> <div style="display:inline-block
    •  color:#E6E65C
    •  background-color:#35383B
    •  position:relative
    •  top:10px
    •  left:10px
    •  ">Step
    <div style="display: table
  •  border:1px solid #B1B1B1
  •  border-radius:4px
  •  padding:0 4px 2px
  •  "> <div style="padding-left:10px
  •  line-height: 0.1px
  •  visibility:hidden
  •  ">{{{1}}}
  • {{#ifeq:yes | yes | <ul style="padding-top:2px

  •  list-style-type:none
  •  margin-left:-1px
  •  margin-bottom:0px
  •  ">
  • <span style="background-color:#181818
  •  padding:0px 3.5px 0px 3.5px
  •  border:2.75px solid #fff
  •  border-radius:10px
  •  font-size:5px
  •  color:white
  •  vertical-align:middle
  •  ">&nbsp
  •  Option1
  • <span style="background-color:#181818
  •  padding:0px 3.5px 0px 3.5px
  •  border:2.75px solid #fff
  •  border-radius:10px
  •  font-size:5px
  •  color:white
  •  vertical-align:middle
  •  ">&nbsp
  •  Option2
  • <span style="background-color:#181818
  •  padding:0px 3.5px 0px 3.5px
  •  border:2.75px solid #fff
  •  border-radius:10px
  •  font-size:5px
  •  color:white
  •  vertical-align:middle
  •  ">&nbsp
  •  Option3
  • <span style="background-color:#181818
  •  padding:0px 3.5px 0px 3.5px
  •  border:2.75px solid #fff
  •  border-radius:10px
  •  font-size:5px
  •  color:white
  •  vertical-align:middle
  •  ">&nbsp
  •  Option4
  • | <div style="padding-top:5px

  •  ">Option1
  •  Option2
  •  Option3
  •  Option4
  • |

    Step
    {{{1}}}
    {{#ifeq:yes | yes |
    •  Option1
    •  Option2
    •  Option3
    •  Option4
    |
    Option1; Option2; Option3; Option4

    See Also

    None