Template:Boxcode: Difference between revisions

From PS3 Developer wiki
Jump to navigation Jump to search
mNo edit summary
m (Top and bottom margins inside <pre> tags removed globally since 2021/09/15)
(15 intermediate revisions by the same user not shown)
Line 1: Line 1:
<div style="width:{{{width|100%}}}; float:{{{float|none}}};">
<div style="width:{{{width|auto}}}; float:{{{float|none}}};">
  <div style="background:#e5e5ff; border:3px double #8080b0; margin:5px; padding:5px; box-shadow: 4px 4px 2px 1px #e0e0e0; overflow:auto;">
  <div style="margin:5px; padding:5px; background:#e5e5ff; border:3px double #8080b0; box-shadow: 4px 4px 2px 1px #e0e0e0; overflow:auto;">
   <div class="nowrap" style="display:inline-block; margin-bottom:5px;">
   {{#if:{{{title|}}} | <div class="nowrap" style="margin-bottom:5px; display:inline-block;">
   <div style="float:left; background:#ffffff; line-height:25px; border:1px solid #8080b0; font-family:Arial; font-weight:bold; font-style:italic; color:#606090; padding-left:5px; padding-right:5px;">{{{title|Code Sample}}}</div><span style="text-align:right; margin-left:5px;">[[image:Edit-copy_purple.svg.png|link=|x25px]]</span>
   <div style="float:left; padding-left:5px; padding-right:5px; line-height:25px; background:#ffffff; border:1px solid #8080b0; font-weight:bold; font-style:italic; color:#606090;">{{{title|Custom Title}}}</div><span style="text-align:right; margin-left:5px;">[[image:Edit-copy_purple.svg.png|link=|x25px]]</span>
   </div>
   </div> | }}
  {{clear}}
   <div style="height:{{{height|auto}}}; border:1px dashed #8080b0;">{{{code|Code Sample}}}</div>
   <div style="border:1px dashed #8080b0; height:{{{height|auto}}}; overflow:auto;">
  <div style="margin-top:-14px; margin-bottom:-14px;">{{{content|content}}}</div>
  </div>
  </div>
  </div>
</div><noinclude>
</div><noinclude>


<br><br>{{clear}}
== Usage ==
== Usage ==
<nowiki>{{Boxcode|content=Code Sample}}</nowiki>
All the parameters in bold are optional, for a good look the "code sample" should start with either a <nowiki><pre> or a <syntaxhighlight></nowiki>
 
<nowiki>{{</nowiki>Boxcode|'''code='''Code Sample<nowiki>}}</nowiki>
<br>...or...<br>
<br>...or...<br>
<nowiki>{{Boxcode|title=Custom Title|content=Code Sample}}</nowiki>
<nowiki>{{</nowiki>Boxcode|'''title='''Custom Title|'''code='''Code Sample<nowiki>}}</nowiki>
<br>...or...<br>
<br>...or...<br>
<nowiki>{{Boxcode|width=50%|title=Custom Title|content=Code Sample}}</nowiki>
<nowiki>{{</nowiki>Boxcode|'''float='''left|'''title='''Custom Title|'''code='''Code Sample<nowiki>}}</nowiki>
<br>...or...<br>
<br>...or...<br>
<nowiki>{{Boxcode|width=50%|float=right|title=Custom Title|content=Code Sample}}</nowiki>
<nowiki>{{</nowiki>Boxcode|'''float='''left|'''width='''50%|'''title='''Custom Title|'''code='''Code Sample<nowiki>}}</nowiki>
<br>...or...<br>
<br>...or...<br>
<nowiki>{{Boxcode|width=500px|height=500px|float=center|title=Custom Title|content=Code Sample}}</nowiki>
<nowiki>{{</nowiki>Boxcode|'''float='''right|'''width='''50%|'''height='''500px|'''title='''Custom Title|'''code='''Code Sample<nowiki>}}</nowiki>


== Examples ==
== Examples ==
{{Boxcode|title=Custom Title|content=<syntaxhighlight lang="xml">
{{Boxcode|code=<syntaxhighlight lang="xml">
<code>
<code>
lines
lines
<!--here-->
<!--here-->
very long lines adds a horizontal scroll bar at bottom of the template to preserve the width of the wiki pages ...............................................................................................................................................................................................................................................................................................o/sup
very long lines adds a horizontal scroll bar at bottom of the template to preserve the width of the wiki pages
................................. ........................... ............................................ ....................................... ....................................................... ..................................... ....................... .............................o/sup
</syntaxhighlight>}}
</syntaxhighlight>}}


{{Boxcode|width=50%|float=left|title=width=50% float=left|content=<syntaxhighlight lang="xml">
{{clear}}
 
{{Boxcode|float=left|title=float=left|code=<syntaxhighlight lang="xml">
<code>
<code>
lines
lines
<!--here-->
<!--here-->
very long lines adds a horizontal scroll bar at bottom of the template to preserve the width of the wiki pages
very long lines adds a horizontal scroll bar
</syntaxhighlight>}}
</syntaxhighlight>}}
{{Boxcode|width=50%|float=right|title=width=50% float=right|content=<syntaxhighlight lang="xml">
{{Boxcode|float=right|title=float=right|code=<syntaxhighlight lang="xml">
<code>
<code>
lines
lines
<!--here-->
<!--here-->
very long lines adds a horizontal scroll bar at bottom of the template to preserve the width of the wiki pages
very long lines adds a horizontal scroll bar
</syntaxhighlight>}}
</syntaxhighlight>}}


{{Boxcode|width=700px|float=left|title=width=700px float=left|content=<syntaxhighlight lang="xml">
{{clear}}
 
{{Boxcode|float=left|width=50%|title=float=left, width=50%|code=<syntaxhighlight lang="xml">
<code>
<code>
lines
lines
<!--here-->
<!--here-->
very long lines adds a horizontal scroll bar
very long lines adds a horizontal scroll bar at bottom of the template to preserve the width of the wiki pages
</syntaxhighlight>}}
</syntaxhighlight>}}
{{Boxcode|width=auto|float=right|title=width=auto float=right|content=<syntaxhighlight lang="xml">
{{Boxcode|float=right|width=50%|title=float=right, width=50%|code=<syntaxhighlight lang="xml">
<code>
<code>
lines
lines
<!--here-->
<!--here-->
very long lines adds a horizontal scroll bar
very long lines adds a horizontal scroll bar at bottom of the template to preserve the width of the wiki pages
</syntaxhighlight>}}
</syntaxhighlight>}}
{{Boxcode|width=auto|float=right|title=width=auto float=right|content=<syntaxhighlight lang="xml">
 
{{clear}}
 
{{Boxcode|float=left|width=700px|title=float=left, width=700px|code=<syntaxhighlight lang="xml">
<code>
<code>
lines
lines
Line 62: Line 68:
very long lines adds a horizontal scroll bar
very long lines adds a horizontal scroll bar
</syntaxhighlight>}}
</syntaxhighlight>}}
{{Boxcode|width=350px|height=200px|float=right|title=width=350px height=200px float=right|content=<syntaxhighlight lang="xml">
{{Boxcode|float=right|width=350px|height=200px|title=float=right, width=350px, height=200px|code=<syntaxhighlight lang="xml">
<code>
<code>
lines
lines
Line 75: Line 81:
<!--here-->
<!--here-->
very long lines adds a horizontal scroll bar
very long lines adds a horizontal scroll bar
###############################################
</syntaxhighlight>}}
</syntaxhighlight>}}
{{Boxcode|width=auto|height=auto|float=left|title=width=auto height=auto float=left|content=<syntaxhighlight lang="xml">
 
{{clear}}
 
{{Boxcode|float=left|title=float=left (with a title longer than the code)|code=<syntaxhighlight lang="xml">
<code>
<code>
lines
lines
<!--here-->
<!--here-->
</syntaxhighlight>}}
</syntaxhighlight>}}
{{Boxcode|width=150px|height=auto|float=left|title=width=150px height=auto float=left|content=<syntaxhighlight lang="xml">
{{Boxcode|float=left|width=150px|title=float=left, width=150px (with a title longer than the code but restricted in width)|code=<syntaxhighlight lang="xml">
<code>
<code>
lines
lines

Revision as of 18:18, 15 September 2021

Code Sample

Usage

All the parameters in bold are optional, for a good look the "code sample" should start with either a <pre> or a <syntaxhighlight>

{{Boxcode|code=Code Sample}}
...or...
{{Boxcode|title=Custom Title|code=Code Sample}}
...or...
{{Boxcode|float=left|title=Custom Title|code=Code Sample}}
...or...
{{Boxcode|float=left|width=50%|title=Custom Title|code=Code Sample}}
...or...
{{Boxcode|float=right|width=50%|height=500px|title=Custom Title|code=Code Sample}}

Examples

<code>
lines
<!--here-->
very long lines adds a horizontal scroll bar at bottom of the template to preserve the width of the wiki pages
................................. ........................... ............................................ ....................................... ....................................................... ..................................... ....................... .............................o/sup
float=left
Edit-copy purple.svg.png
<code>
lines
<!--here-->
very long lines adds a horizontal scroll bar
float=right
Edit-copy purple.svg.png
<code>
lines
<!--here-->
very long lines adds a horizontal scroll bar
float=left, width=50%
Edit-copy purple.svg.png
<code>
lines
<!--here-->
very long lines adds a horizontal scroll bar at bottom of the template to preserve the width of the wiki pages
float=right, width=50%
Edit-copy purple.svg.png
<code>
lines
<!--here-->
very long lines adds a horizontal scroll bar at bottom of the template to preserve the width of the wiki pages
float=left, width=700px
Edit-copy purple.svg.png
<code>
lines
<!--here-->
very long lines adds a horizontal scroll bar
float=right, width=350px, height=200px
Edit-copy purple.svg.png
<code>
lines
<!--here-->
very long lines adds a horizontal scroll bar
<code>
lines
<!--here-->
very long lines adds a horizontal scroll bar
<code>
lines
<!--here-->
very long lines adds a horizontal scroll bar
float=left (with a title longer than the code)
Edit-copy purple.svg.png
<code>
lines
<!--here-->
float=left, width=150px (with a title longer than the code but restricted in width)
Edit-copy purple.svg.png
<code>
lines
<!--here-->