Template:TitleBox: Difference between revisions

From ReliaWiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(19 intermediate revisions by 2 users not shown)
Line 2: Line 2:
<div style="position:relative; float:left; width:99%; margin:5px; border:1px solid #C8D4E0; background-color:#e5edf5; border-radius:7px;">
<div style="position:relative; float:left; width:99%; margin:5px; border:1px solid #C8D4E0; background-color:#e5edf5; border-radius:7px;">
<!--BOX TITLE -->
<!--BOX TITLE -->
<div style="position:relative; display:table; width:100%; ">
<div style="position:relative; display:table; width:100%; background-color:#ffffff; border-top-right-radius:8px;">
<div style="position:relative; float:left; height: 64px;width: 64px; background:{{{bgcolor}}};background: linear-gradient(to right bottom,{{{gradientcolors}}}); border-bottom-left-radius:7px; border-top-left-radius:7px;"></div>
<div style="position:relative; top:-1px; left:-1px; float:left; border-left:1px solid #ffffff; border-top:1px solid #ffffff;">[[image:{{{image}}}|35px|link=]]</div>
<font style="font-size:16px; font-weight:bold; margin:5px 0px 5px 15px;">{{{title}}}</font>
<font style="display:table; font-size:16px; font-weight:bold; margin-top:7px; padding-left:15px;">{{{title}}}</font>
<div style="height:1px; background:#C8D4E0;margin-bottom:10px;"></div>
{{{links}}}</div>
</div>
</div>
<!--- WRAPPER FOR BOX OF LINKS--->
<div style="position:relative; display:table; width:100%; padding:10px 0px 10px 0px;">{{{links|}}}</div>
</div><noinclude>{{Template:TitleBox/documentation}}[[Category:Templates]]</noinclude>

Latest revision as of 22:39, 16 December 2015

[[image:{{{image}}}|35px|link=]]

{{{title}}}


Template Documentation

This template creates a <div> box with a non-fixed height and width. It is specifically used to create the navigational grid on the main page of ReliaWiki.com.

Below is an example of a box that could be created from this template. In this case, the box spans the entire width of the screen. With additional coding on your part, you can customize the width or position of the box on your page (see Example 2 below for an example on how this can be done).


Red triangle.png

Reliability Growth and Repairable System Analysis

Usage

This template has the following parameters:

  • image = The filename of the graphic that represents the analysis/software. The size must be 35px.
  • title = The title of the box.
  • links = The navigational links you want inserted into the box. Please use the Template:TitleBoxLink template to populate this parameter. The TitleBoxLink template has two parameters:
  • link = The name of the wiki page to link to.
  • text = The anchor text for the link.


To use the TitleBox template, copy and paste the following code to your page, and then define the parameters. To add or remove links from the box, duplicate or remove the {{TitleBoxLink|link= |text= }} rows as needed.

{{TitleBox
|image=
|title=
|links=
{{TitleBoxLink|link= |text= }}
{{TitleBoxLink|link= |text= }}
}}

Example 1

The following code shows an example of the parameters you might use for a Weibull++ box. (See the Notes section at the end of this doc for a list of suggested values for the image parameter.)

{{TitleBox
|image=blue_triangle.png
|title=Life Data Analysis
|links=
{{TitleBoxLink|link=Life Data Analysis Reference Book|text=Reference Book}}
{{TitleBoxLink|link=Weibull++_Examples|text=Weibull++ Software Examples}}
}}

The output of the above code is as follows:

Blue triangle.png

Life Data Analysis

Example 2

The following example demonstrates how you might control the width of a box. In this case, you would create a <div> wrapper that specifies the width.

<!--Div Wrapper-->
<div style="position:relative; float:left; width:49%; margin:5px;">
 
<!--Start of Template-->
{{TitleBox
|image=doe_triangle.png
|title=Experiment Design and Analysis (DOE)
|links=
{{TitleBoxLink|link=Experiment_Design_and_Analysis_Reference|text=Reference Book}}
{{TitleBoxLink|link=DOE_Reference_Examples|text=DOE++ Software Examples}}
}}

</div>


The output of the above code is as follows:

Doe triangle.png

Experiment Design and Analysis (DOE)

Notes

The following list shows the suggested filenames for the image parameter.

Software/Analysis Image
Weibull++ blue_triangle.png
ALTA yellow_triangle.png
DOE++ doe_triangle.png
BlockSim green_triangle.png
RGA red_triangle.png
RCM rcm_triangle.png
XFMEA fmea_triangle.png
API api_triangle.png