Template:Created with/layout/doc: Difference between revisions

(27 intermediate revisions by 5 users not shown)

Line 1:

  < Template: {{T0|Created with/layout}}{{Heavily used template|3=+}}

__TOC__

{{TemplateBox

|1 =logo

|1label =filename

|1d =icon/logo to be displayed

|1d =icon, logo, symbol or [[#Codepoint display|codepoint]] to be displayed

|1type =wiki file name

|1def =

Line 9:

Line 11:

|2 =iconsize

|2label =size

|2d =size for displaying the icon/logo

|2d =size for displaying the icon/logo/symbol/codepoint [[#Iconsize|*)]]

|2type =

|2type =numeric

|2def =33x22px

|2stat =optional-

Line 28:

Line 30:

|5 =style

|5label =~~parameters~~

|5label =attributes

|5d =CSS style ~~attributes~~, to ~~overwrite~~ the standard ~~attributes~~

|5d =[[#Style declarations|CSS style declarations]], to complement the standard declarations

|5type =

|5stat =optional-

|6 =~~lang~~

|6 =width

|6label =~~langcode~~

|6label =attribute

|6d =~~{{w|List of ISO 639-1 codes|ISO 639}} language~~ code

|6d =the <code>width</code> dimension attribute for modification

|6type =string

|6def =<~~nowiki~~>~~{{int:lang}}~~</~~nowiki~~>

|6def =<code>auto</code>

|6stat =optional-

|~~name~~ = {{~~BASEPAGENAME~~}}{{~~Lua|Module~~:~~Dir~~}}

|7 =lang

|desc = ~~Small~~ box used by several templates:

|7label =langcode

<div style="float:left;padding-right:2em;width:22%">{{nobold|__TOC__}}</div> ~~<small>~~

|7d ={{w|List of ISO 639-1 codes|ISO 639}} language code

|7type =string

|7def =<nowiki>{{int:lang}}</nowiki>

|7stat =optional-

|name = Created with/layout

|desc = One text line {{nobold|in a}} small box{{nobold|, used by several templates:}}

<div style="float:left;padding-right:2em;width:20%">{{nobold|__TOC__}}</div>

{{smalldiv|1=

* {{nobold|{{T0|Created with}}, {{T0|Taken with}}, {{T0|Scanned with}}}}

* {{nobold|In{{T0|Valid SVG}}}}

* {{nobold|{{T0|Created with}}}}

* {{nobold|{{T0|Igen/amp}}}}

* {{nobold|{{T0|~~Translate-s~~}}}}

* {{nobold|{{T0|Igen/emb}}, {{T0|Igen/ptx}}}}

* {{nobold|{{T0|Igen/sni}}}}

* {{nobold|{{T0|Attrib}}}}

* {{nobold|{{T0|Commonist}}}}

* {{nobold|{{T0|Projekt Wappen}}}} </~~small>~~ {{clr}}

* {{nobold|{{T0|Projekt Wappen}}, {{T0|Projet Blasons}}   and {{C|Created with/layout-templates|many others}}}}

}} {{clr}}

|namespace = file

|usergroup = all

Line 59:

Line 72:

|i18n-method =-

}}

Normally it is the ''final output'', after all translations done by the previous templates.

Normally it is the ''final output'', after all translations have been done by the previous templates.

== Iconsize ==

can consist of the two numerical values <code>width</code> and <code>height</code>; or only ''one'' of both:

* <code>width</code>[px]

* x<code>height</code>[px]

* <code>width</code>x<code>height</code>[px]

The dimension unit is always px, whether it is specified or not.

When iconsize is omitted, the used default will be the best value for most cases. When it is specified, a {{M|Logoform|module}} is ivoked to check it.<br>

For performance reasons it is ''highly advised'' not to specify the iconsize - ''whenever'' the default size gives an acceptable appearance.</div>

The <s>specification</s> <code>iconsize=0</code> does not mean "no iconsize" but that it is omitted, and the default sizes should be used.

== Codepoint display ==

Unicode offers numerous codepoint images, emojis and characters, many of them colored, e.g. {{C|Unicode 2600-26FF Miscellaneous Symbols|(U+2600...U+26FF)}} or {{C|Unicode 1F300-1F5FF Miscellaneous Symbols and Pictographs|(U+1F300...U+1F5FF)}}.<br>

When the name of a <code>logo</code> starts with either <code>U+</code> or <code>&#</code>, an invoked module checks whether it is a filename, like U+2680.svg, or a codepoint, like U+2680 (can also be defined with &#x2680; or &#9856; for ⚀).

To display <u>more than one</u> codepoint, specify them either with <code>U+</code> separated with semicolon (e.g. <code>U+2680;U+2681;U+2682</code>), or with <code>#&</code> (e.g. <code>&#x2680;&#x2681;&#x2681;</code>).

<br>Additional <code>span style options</code> can be specified with the parameter <code>ustyle</code>, e.g. <code>ustyle=color:blue</code>.

<br>When a logo name starts with <code>&#;</code>, the following string is used ''as-it-is'' for codepoint displaying. See the examples at the [[Template talk:Created with/layout/doc|talk page]].

== Style declarations ==

Besides the variations with <code>logo</code> and <code>text</code>, a great variety can be got with <code>background</code> colors and mainly with the <code>border</code> styles:

* margin and padding are to alter with care - it is recommended to ''not modify'' them. The four parameters are for top, right, bottom, left.

:* <code>margin</code> e.g. (0 3px) the distance to surrounding items

:* <code>padding</code> e.g. (2px 4px 2px 6px) distance to items within the box; the first and third parameter can alter the height of the box!

* <code>color</code> (#000) the color of the text

* <code>background</code> (by default #F8F9FA, a slightly darker grey to maintain good readability (high contrast with the ''normally black'' text))

* <code>border</code> (1px solid #BAB) the stroke-width, stroke-style, stroke-color; '''it is recommended to modify only that parameter'''.

The '''total width''' of a box is <code>margin-left</code> + <code>border-left-width</code> + <code>padding-left</code> + <code>width</code> + <code>padding-right</code> + <code>border-right-width</code> + <code>margin-right</code>.<br>

Similarly, the '''total height''' of a box equals to <code>margin-top</code> + <code>border-top-width</code> + <code>padding-top</code> + <code>height</code> + <code>padding-bottom</code> + <code>border-bottom-width</code> + <code>margin-bottom</code>.

While ''margin'' and ''padding'' can be defined by name (e.g. <code>margin-left</code>, <code>padding-top</code>) '''or''' with one to four single parameters:

* 1 parameter: all four sides

* 2 parameters: top & bottom, right & left

* 3 parameters: top, right & left, bottom

* 4 parameters: top, right, bottom, left

…the ''borders'' and their properties can be specified only either for all four sides, or explicitly by names, e.g. <code>border:1px solid #BAB; border-right-color:#080</code>.

~~== Style attributes ==~~

~~Besides the variations with~~ <~~code~~>~~logo</code> and <code>text</code>, a great variety can be get~~ with ~~<code>background<~~/~~code> and <code>border~~</~~code~~> ~~colors:~~

[[Category:Created with/layout-templates|*]]

* padding

</includeonly>

* background

* border

commons>Chealer