Template:SmallBox: Difference between revisions

From bradwiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(7 intermediate revisions by the same user not shown)
Line 1: Line 1:
<div style="
<div style="
display:{{{display|block}}};  
display:{{{display|block}}};  
float:{{{float|left}}};  
float:{{{float|none}}};
overflow:{{{overflow|hidden}}};
width:{{{width|50%}}};  
width:{{{width|50%}}};  
margin:{{{margin|0 auto}}};  
height:{{{height|auto}}};
padding:{{{padding|5px auto}}};  
margin:{{{margin|5px auto}}};  
padding:{{{padding|4px}}};
clear:{{{clear|both}}};  
background-color:{{{bg-color|#FFF}}};  
background-color:{{{bg-color|#FFF}}};  
font-family:{{{font|Arial}}};  
font-family:{{{font|Arial}}};  
Line 13: Line 16:
border-width:{{{border-width|2px}}};  
border-width:{{{border-width|2px}}};  
border-color:{{{border-color|#8c9091}}};  
border-color:{{{border-color|#8c9091}}};  
border-radius:{{{border-radius|6px}}};">{{{1}}}</div>{{Clear}}<noinclude>
border-radius:{{{border-radius|6px}}};">{{{1}}}
<br><br><br><br><br>
<div style="text-align:{{{txt-align|left}}};
padding:{{{pad|1px}}};
font-size:{{{txt-size|14px}}};">{{{2|}}}</div></div>
<noinclude><br><br><br>
 
----
----
----
 
<br><br>


{{SmallBox|This is a small box using default parameters}}
{{SmallBox|This is a small box using default parameters}}
Line 25: Line 33:
     {{SmallBox|This is a small box using default parameters}}
     {{SmallBox|This is a small box using default parameters}}
</pre>
</pre>
<br>
----
<br>
Parameters and their defaults...
<pre><nowiki>
<pre><nowiki>
     <div class="toccolours" style="
     default parameters:
      display:{{{display|block}}};
    {{SmallBox|display=block  
      float:{{{float|left}}};
    |float=none
      width:{{{width|50%}}};
    |clear=both
      margin:{{{margin|0 0 0 25%}}};
    |width=50%  
      padding:{{{padding|12px 5px 1px 20px}}};
    |margin=5px auto
      background-color:{{{bg-color|#FFF}}};
    |padding=5px auto
      font-family:{{{font|Arial}}};
    |bg-color=#FFF  
      font-size:{{{font-size|18px}}};
    |font=Arial  
      word-wrap:break-word;
    |font-size=18px  
      text-align:{{{text-align|center}}}
    |text-align=center  
      border-style:{{{border-style|groove}}};
    |border-style=groove  
      border-width:{{{border-width|2px}}};
    |border-width=2px  
      border-color:{{{border-color|#8c9091}}};
    |border-color=#8c9091  
      border-radius:{{{border-radius|6px}}}; ">
    |border-radius=6px
      {{{1}}}
    |This is a small box showing all parameters
    </div>
    }}
</nowiki></pre>
</nowiki></pre>




<br>
<br>
----
----
<br>
{{SmallBox|display=block|width=50%|font-title=papyrus|float=left
|border-style=groove|border-width=2px|border-color=#8c9091|border-radius=6px
|padding=12px 5px 1px 20px|color=#f7f7f7|margin=0 0 0 1%|Title of Expand Box}}
<br>
<pre>
    {{SmallBox|display=block|width=50%|font-title=papyrus|float=left
    |border-style=groove|border-width=2px|border-color=#8c9091|border-radius=6px
    |padding=12px 5px 1px 20px|color=#f7f7f7|margin=0 0 0 1%|mh=100%|sz=12px
    |font=Arial|pad=6px 8px 10px 4px|opener=▼|closer=▲|Title of Expand Box|TEXT}}
</pre>
<br><br><br><br>
----
----
<br><br>


{{SmallBox|display=block|width=50%|margin=0 0 0 25%
{{SmallBox|display=block  
|font-title=papyrus|opener=open-sesame|Say the magic word|
|float=none
You discover the chest contained 10 BitCoins (BTC) and 100 Ethereum (ETH).
|clear=both
What would you like to do?
|width=80%  
 
|margin=5px auto
# [https://bitcoin.org '''Exchange BTC for USD''']
|padding=8px
# [https://www.ethereum.org '''Exchange ETH for USD''']
|bg-color=#efa94c
# [https://coinbase.com '''Loot chest, 'natch''']
|font=Arial
|font-size=18px
|text-align=center
|border-style=groove double inset ridge
|border-width=6px
|border-color=#4bedca
|border-radius=6px
|NOTICE: THIS TITLE TEXT IS INSIDE ITS OWN DIV CONTAINER
|txt-align=left
|txt-size=14px
|This paragraph text has a separate div container.  
This container only has two properties:
* txt-align
* txt-size
Which is perfectly sufficient for creating message boxes with a title header.
}}
}}


<br>


<pre>
<pre>
     {{SmallBox|display=block|width=50%|margin=0 0 0 25%
     {{SmallBox|display=block  
     |font-title=papyrus|opener=open-sesame|Say the magic word|
    |float=none
     You discover the chest contained 10 BitCoins (BTC) and 100 Ethereum (ETH).
    |clear=both
     What would you like to do?
    |width=80%  
 
    |margin=5px auto
     # [https://bitcoin.org '''Exchange BTC for USD''']
    |padding=8px
     # [https://www.ethereum.org '''Exchange ETH for USD''']
    |bg-color=#efa94c
     # [https://coinbase.com '''Loot chest, 'natch''']
    |font=Arial
     |font-size=18px
    |text-align=center
    |border-style=groove double inset ridge
    |border-width=6px
    |border-color=#4bedca
     |border-radius=6px
     |NOTICE: THIS TITLE TEXT IS INSIDE ITS OWN DIV CONTAINER
    |txt-align=left
     |txt-size=14px
    |This paragraph text has a separate div container.  
     This container only has two properties:
     * txt-align
    * txt-size
    Which is perfectly sufficient for creating message boxes with a title header.
     }}
     }}
</pre>
</pre>

Latest revision as of 00:21, 8 February 2018

{{{1}}}








This is a small box using default parameters



    {{SmallBox|This is a small box using default parameters}}
    default parameters:
    {{SmallBox|display=block 
    |float=none 
    |clear=both 
    |width=50% 
    |margin=5px auto 
    |padding=5px auto 
    |bg-color=#FFF 
    |font=Arial 
    |font-size=18px 
    |text-align=center 
    |border-style=groove 
    |border-width=2px 
    |border-color=#8c9091 
    |border-radius=6px
    |This is a small box showing all parameters
    }}







NOTICE: THIS TITLE TEXT IS INSIDE ITS OWN DIV CONTAINER
This paragraph text has a separate div container.

This container only has two properties:

  • txt-align
  • txt-size

Which is perfectly sufficient for creating message boxes with a title header.


    {{SmallBox|display=block 
    |float=none 
    |clear=both 
    |width=80% 
    |margin=5px auto 
    |padding=8px
    |bg-color=#efa94c
    |font=Arial 
    |font-size=18px 
    |text-align=center 
    |border-style=groove double inset ridge 
    |border-width=6px 
    |border-color=#4bedca
    |border-radius=6px
    |NOTICE: THIS TITLE TEXT IS INSIDE ITS OWN DIV CONTAINER
    |txt-align=left
    |txt-size=14px
    |This paragraph text has a separate div container. 
    This container only has two properties:
    * txt-align
    * txt-size
    Which is perfectly sufficient for creating message boxes with a title header.
    }}