More actions
m →Code snippets: Add snippet |
Add flex box code. |
||
| (32 intermediate revisions by the same user not shown) | |||
| Line 27: | Line 27: | ||
* [[wikipedia:Help:Signatures]] | * [[wikipedia:Help:Signatures]] | ||
* [[mediawikiwiki:Help:Signatures]] | * [[mediawikiwiki:Help:Signatures]] | ||
=== Skill templates dependency tree === | |||
* {{T|GetSkillLink}} [[Image:Tick.png|link=]] | |||
** {{T|Skill}} [[Image:Tick.png|link=]] | |||
*** {{T|GetSkillAlpha}} [[Image:Tick.png|link=]] | |||
*** {{T|GetSkillMult}} [[Image:Tick.png|link=]] | |||
*** {{T|GetSkillPrice}} [[Image:Tick.png|link=]] | |||
== Citizen skin == | |||
* [[MediaWiki:Citizen-footer-desc]] | |||
* [[MediaWiki:Citizen-footer-tagline]] | |||
Design-tokens notes: | |||
<div style="display : flex; flex-wrap: wrap; gap: 1.5em;"> | |||
<div style="background-color: var(--background-color-warning-subtle);"> | |||
--background-color-warning-subtle | |||
Mainly to emphasize table headers | |||
</div> | |||
<div style="background-color: var(--background-color-base); max-width: 15em;"> | |||
--background-color-base | |||
Use to return to base color when parent element has another color. | |||
</div> | |||
<div style="background-color: var(--background-color-neutral);"> | |||
--background-color-neutral | |||
</div> | |||
<div style="background-color: var(--background-color-destructive-subtle);"> | |||
--background-color-destructive-subtle | |||
</div> | |||
<div style="background-color: var(--background-color-error);"> | |||
--background-color-error | |||
</div> | |||
</div> | |||
<div style="display : flex; flex-wrap: wrap; gap: 1.5em;"> | |||
<div style="color: var(--color-error);"> | |||
--color-error | |||
</div> | |||
<div style="color: var(--color-warning);"> | |||
--color-warning | |||
</div> | |||
<div style="color: var(--color-content-added);"> | |||
--color-content-added | |||
</div> | |||
<div style="background-color: var(--background-color-neutral);color: var(--color-inverted-fixed);"> | |||
--color-inverted-fixed | |||
</div> | |||
<div style="color: var(--color-base);"> | |||
--color-base | |||
</div> | |||
</div> | |||
<div style="display : flex; flex-wrap: wrap; gap: 1.5em;"> | |||
<div style="font-size: var(--font-size-small);"> | |||
--font-size-small | |||
</div> | |||
<div style="font-size: var(--font-size-medium);"> | |||
--font-size-medium | |||
</div> | |||
<div style="color: var(--font-size-large);"> | |||
--font-size-large | |||
</div> | |||
</div> | |||
[[User:Bates Larsson|Bates]]' message about design-tokens [[https://discord.com/channels/301496390066896896/706641916460007434/1371844304263315558 Discord]] | |||
Elmara Olth-Semah link to codex [https://discord.com/channels/301496390066896896/706641916460007434/1372274609335832687 Discord] (design-tokens). Direct [https://doc.wikimedia.org/codex/latest/design-tokens/color.html codex] | |||
== Flex box == | |||
<pre> | |||
<div style="display : flex; flex-wrap: wrap; gap: 1.5em;"> | |||
<div> </div> | |||
<div> </div> | |||
</div> | |||
</pre> | |||
== Wiki mark-up == | |||
=== Linking === | |||
See also: [[mediawikiwiki:Help:Links]] | |||
Links are case sensitive, with the exception of the first character. | |||
==== Space or underscore ==== | |||
The wiki software automatically changes spaces to underscores (_), in the resulting html link, in internal and inter wiki links. So <nowiki>[[Relic_and_data_sites]]</nowiki> ([[Relic_and_data_sites]]) and <nowiki>[[Relic and data sites]]</nowiki> ([[Relic and data sites]]) are equivalent. Eliminating the need to change the underscore version into a piped link for nice readability, providing a "cleaner" source. The use of spaces is preferred. | |||
==== Link end trick ==== | |||
{{Note box|'''Link end "trick"''' (Word-ending links) | |||
Putting text directly connecting to the closing ]] results in that text being added to the displayed text.<br> | |||
<code><nowiki>[[Venture]]s</nowiki></code> results in [[Venture]]s while the link still goes to Venture.<br> | |||
<code><nowiki>[[Venture]]abunchofletters</nowiki></code> results in [[Venture]]abunchofletters while the link still goes to Venture. | |||
For more details see: [[mediawikiwiki:Help:Links]] | |||
|italics= no}} | |||
==== Piped link ==== | |||
A piped link is an internal or [[#interwiki link|interwiki]] link where the link target and link label are both specified. Piped links should be used sparingly, if a wiki redirect is available it should be used instead. | |||
==== Internal link ==== | |||
Internal (and intrawiki) links check the existence of the target page. If the page doesn't exist, is misspelled or the case is incorrect the link turns [[red link|red]]. | |||
'''Syntax:''' <code><nowiki>[[<namespace>:<page name>#<anchor>|<label>]]</nowiki></code> | |||
:; Namespace : The namespace of the page, separated from the Page name by a colon(:). Default is the main namespace. Options: User, Template, etc. Namespace is NOT case sensitive. | |||
:; Page name : The name of the page<ref name="main">In the main namespace called article</ref>. Page name is case sensitive with the exception of the first letter. | |||
:; Anchor : To an ID somewhere inside a page. Anchor must be preceded by a #. Headings have an automatic ID identical to the header name. ID can be added manually by using {{T|Anchor}} or adding an <code>ID=</code> manually. ID's must be unique. Anchor's are case sensitive. | |||
:; Label : The text that appears visible. Only needed when different from the linking(target) part. the label is preceded by the pipe(|) symbol | |||
'''Usage:''' | |||
:; Page name only : Using the page name only links to a page<ref name="main" /> in the main namespace with display identical to page name:<br> | |||
<code><nowiki>[[Venture]]</nowiki></code> results in [[Venture]]<br> | |||
As the first letter is not case sensitive <code><nowiki>[[venture]]</nowiki></code> also results in a valid link [[venture]] | |||
:; Namespace and Page name : To go to a page outside the main namespace the namespace needs to be added to the link | |||
<code><nowiki>[[User:Evon R'al]]</nowiki></code> gives [[User:Evon R'al]]<br> | |||
<code><nowiki>[[UniWiki:Manual of Style]]</nowiki></code> gives [[UniWiki:Manual of Style]] | |||
:; Page name and Anchor : Using a Page name and an Anchor gets to a specific location within a page. | |||
:: Using an Anchor only, leads to a specific location within the page. | |||
<code><nowiki>[[combat site#Expeditions]]</nowiki></code> gives [[combat site#Expeditions]]<br> | |||
The existence of the page is still checked, but the existence of the anchor is not.<br> | |||
Note: If a non existing anchor is used the link goes to the top of the page.<br> | |||
<code><nowiki>[[combat site#no exist]]</nowiki></code> gives [[combat site#no exist]], leading to the top of the combat site page | |||
<code><nowiki>[[#Signatures]]</nowiki></code> gives [[#Signatures]] leading to the Signatures heading on this page. | |||
:; Page name and label | |||
<code><nowiki>[[Venture|Venture]]</nowiki></code> results in [[Venture|Venture]]. More then double the amount of typing for the same result as when using a page name only link and more cluttered reading in the source.<br> | |||
But when doing this: <code>Example of a <nowiki>[[Venture|mining]]</nowiki> frigate</code>, we get "Example of a [[Venture|mining]] frigate" leading to the Venture article. | |||
The use of label is particularly useful when namespaces or anchors are used. To increase readability.<br> | |||
<code><nowiki>[[User:Evon R'al|Evon R'al]]</nowiki>'s user page</code> gives [[User:Evon R'al|Evon R'al]]'s user page<br> | |||
<code>A link to <nowiki>[[combat site#Expeditions|Expeditions]]</nowiki></code> gives "A link to [[combat site#Expeditions|Expeditions]]". | |||
{{Note|While not particularly useful the link end trick will work.}} | |||
{{Note box|'''Pipe trick''': | |||
The pipe trick uses the pipe character ("{{!}}") to save typing the label of a piped link for several kinds of wiki links. This can avoid potentially making an error while typing the label.<br> | |||
The basic rule when the pipe trick is used is that an (initial) namespace prefix, a final part beginning with a comma, or a final parenthesis is suppressed in the rendering of the link.<br> | |||
The expansion of the text happens when saving. The expansion is also visible when previewing the edit making it possible to check if it gives the desired result. | |||
Example's: | |||
Typing <code><nowiki>[[User:Evon R'al|]]</nowiki></code> will produce <nowiki>[[User:Evon R'al|Evon R'al]]</nowiki>.<br> | |||
<code><nowiki>[[Guardian's Gala (2020)|]]</nowiki></code> gives <nowiki>[[Guardian's Gala (2020)|Guardian's Gala]]</nowiki> | |||
For more details see [[wikipedia:Help:Pipe trick]] and [[metawikipedia:Help:Piped link]] | |||
|italics= no}} | |||
===== Special cases ===== | |||
; File namespace | |||
<code><nowiki>[[File:Helpicon.png]]</nowiki></code> gives [[File:Helpicon.png]] the file embedded at the location of the link.<br> | |||
To get a link to the file page the namespace needs to be preceded by a colon (:)<br> | |||
<code><nowiki>[[:File:Helpicon.png]]</nowiki></code> gives [[:File:Helpicon.png]] a link to the file page.<br> | |||
<code><nowiki>[[:File:Evon R'al.jpg]]</nowiki></code> gives [[:File:Evon R'al.jpg]]<br> | |||
A label can be used like <code><nowiki>[[:File:Evon R'al.jpg|Evon R'al]]</nowiki></code> to change the presentation: The file page of [[:File:Evon R'al.jpg|Evon R'al]]'s portrait.<br> | |||
For parameters to influence size and/or placement of a file see [[Mediawikiwiki:Help:Images]] | |||
; Media namespace : Is a virtual namespace which gives a direct link to a file. | |||
<code><nowiki>[[Media:Evon R'al.jpg]]</nowiki></code> gives [[Media:Evon R'al.jpg]] (follow the link to see the difference)<br> | |||
A label can be used: <code><nowiki>[[Media:Evon R'al.jpg|portrait]]</nowiki></code> to get Evon R'al's [[Media:Evon R'al.jpg|portrait]]. | |||
; Category namespace | |||
<code><nowiki>[[Category:Pilots]]</nowiki></code> gives a link to the Category category and the Pilots category in a separate box at the bottom of the page.<br> | |||
To get a link to the Pilots category page in the text use <code><nowiki>[[:Category:Pilots]]</nowiki></code> which gives [[:Category:Pilots]] | |||
* [https://wiki.eveuniversity.org/api.php?action=query&meta=siteinfo&siprop=namespaces&format=xml List of namespaces (In raw XML)] | |||
==== Interwiki link ==== | |||
Interwiki links are internal-style links to other websites using an "interwiki prefix". For a list of valid interwiki prefixes see [[Special:interwiki]]. | |||
Interwiki links are made by using the interwiki prefix as the first parameter in an internal link. | |||
A interwiki link to MediaWiki's help page about links looks like <code><nowiki>[[Mediawikiwiki:Help:Links]]</nowiki></code> which gives [[Mediawikiwiki:Help:Links]] | |||
The [[#link end trick|link end trick]] and the pipe trick, described at internal links, work for interwiki links just as-well. And use of a label to change the presentation of a link also works. | |||
==== External link ==== | |||
External links are rendered different from internal and interwiki links. On the UNI Wiki the links have a marker at the end. The exact marker depends on if the link is HTTP of HTTPS. | |||
The most basic form for an external link is to just put in the raw link, like <code><nowiki>https://wiki.eveuniversity.org/index.php?title=User:Evon_R%27al</nowiki></code> which produces https://wiki.eveuniversity.org/index.php?title=User:Evon_R%27al. While it works as a link it does not look particularly nice. | |||
More control over the link can be reached by using single square braces.<br> | |||
'''Syntax:''' <code>[URL label]</code> | |||
; URL : the full URL of the link | |||
; label : the text visible in the page (optional) | |||
The wiki parser uses the first space it encounters as the divider between the URL and the label. | |||
* Without using a label <code><nowiki>[https://wiki.eveuniversity.org/index.php?title=User:Evon_R%27al]</nowiki></code> produces [https://wiki.eveuniversity.org/index.php?title=User:Evon_R%27al]. The wiki parser automatically adds a number as the label. | |||
* Using a label <code><nowiki>[https://wiki.eveuniversity.org/index.php?title=User:Evon_R%27al Evon R'al's user page]</nowiki></code> produces [https://wiki.eveuniversity.org/index.php?title=User:Evon_R%27al Evon R'al's user page]. | |||
* Finally the external link rendering can be suppressed by using the CSS class {{Co|wheat|plainlinks}} making the link look like an internal one. <code><nowiki><span class="plainlinks">[https://wiki.eveuniversity.org/index.php?title=User:Evon_R%27al Evon R'al's user page]</span></nowiki></code> produces <span class="plainlinks">[https://wiki.eveuniversity.org/index.php?title=User:Evon_R%27al Evon R'al's user page]</span> | |||
=== Formula presentation === | |||
UniWiki uses the extension <s>[[:Mediawikiwiki:Extension:SimpleMathJax|SimpleMathJax]]</s> [[:Mediawikiwiki:Extension:Math|Math]] for the presentation of formulas. The formula to be presented needs to be encased with the tags <nowiki><math></nowiki> and <nowiki></math></nowiki>. <math>\tex</math> or <math>\LaTeX</math> markup can be used. Errors will be marked as <math>\sqrt</math> | |||
To display a formula the following markup can be used: | |||
{| class="wikitable" style="text-align: center;" | |||
|- | |||
! Source !! MathJax presentation || Notes | |||
|- | |||
| X^n || <math> X^n </math> || exponentiation ?<br> superscript | |||
|- | |||
| a \times b || <math> a \times b </math> || multiplication | |||
|- | |||
| a / b || <math>a / b</math> || division | |||
|- | |||
| \frac {a} {b} ||<math> \frac {a} {b} </math> || division/fraction | |||
|- | |||
| \displaystyle \frac{a}{b} || <math> \displaystyle \frac {a} {b} </math> || division/fraction | |||
|- | |||
| \sqrt {X} || <math>\displaystyle \sqrt {X} </math> || square root | |||
|- | |||
| \sqrt [n] {X} || <math> \sqrt [n] {X} </math> || root | |||
|- | |||
| a + b || <math> a + b </math> || addition | |||
|- | |||
| a - b || <math> a - b </math> || abstraction | |||
|- | |||
| V_{max} ||<math> V_{max} </math> || subscript | |||
|- | |||
| \text{text} ||<math> \text{text} </math> || roman text | |||
|- | |||
| text || <math> text </math> || italic text | |||
|- | |||
| \color{blue} b ||<math> \color{blue} b </math> || color | |||
|- | |||
| \color{blue} \text{Blue} || <math> \color{blue} \text{Blue} </math> || | |||
|- | |||
| { \color{blue} b } X || <math> { \color{blue} b } X </math> || partial color | |||
|- | |||
| \sin || <math> \sin </math> || | |||
|- | |||
| \cos || <math> \cos </math> || | |||
|- | |||
| \tan || <math> \tan </math> || | |||
|- | |||
| \ln || <math> \ln </math> || natural logarithm | |||
|- | |||
| \log || <math> \log </math> || logarithm | |||
|- | |||
| \infty || <math> \infty </math> || Infinity | |||
|- | |||
| \pi || <math> \pi </math> || pi | |||
|- | |||
| \displaystyle \left( \frac {a} {b} \right) || <math> \displaystyle \left( \frac {a} {b} \right) </math> || | |||
|- | |||
| \left( \frac {a} {b} \right) || <math> \left( \frac {a} {b} \right) </math> || Works with (, [, < and { (needs to be escaped \{ ) | |||
|- | |||
| ( \frac {a} {b} ) || <math> ( \frac {a} {b} ) </math> || See ( hight difference with previous | |||
|- | |||
| a \n b \\ c || <math> a \\ b \\ c </math> || newline within a <nowiki><math></nowiki> block | |||
|- | |||
| \ begin{align}<br> | |||
a & = b \times c \\<br> | |||
b \times c & = a<br> | |||
\end{align} | |||
| <math> \begin{align} | |||
a & = b \times c \\ | |||
b \times c & = a | |||
\end{align} </math> || Align on & | |||
|} | |||
See also: | |||
* [[UniWiki:Manual of Style/Mathematics]] | |||
* [https://docs.mathjax.org/en/latest/index.html MathJax] | |||
* [https://docs.mathjax.org/en/latest/input/tex/index.html MathJax Tex and LaTeX support] | |||
* [[:Wikipedia:Help:Displaying a formula]] | |||
* [[:Wikipedia:Wikipedia:Manual of Style/Mathematics]] | |||
* [[:Wikipedia:MathML]] | |||
* [[UniWiki:Editing commands visual guide#Math]] | |||
== CSS == | |||
See also: | |||
* [https://www.w3schools.com/css W3 schools tutorial] | |||
* [https://www.w3schools.com/cssref W3 schools reference] | |||
* [https://developer.mozilla.org/en-US/docs/Web/CSS mdn web docs reference] | |||
* [[:Wikipedia:Wikipedia:TemplateStyles|Wikipedia projects page TemplateStyles]] | |||
=== CSS location === | |||
; External style sheet : A separate file with CSS definitions. Loaded into the page with a HTML link in the head section of the page. | |||
; Internal style sheet : On the page in the style element of the head section | |||
; Inline CSS : By using the style attribute of an HTML element. | |||
For external and Internal style sheets the order in which they are called in a page is relevant, the last one "wins". | |||
=== Cascading order === | |||
What style will be used when there is more than one style specified for an HTML element? | |||
* Browser default | |||
** Internal and external style sheet. In the order they are entered on the page. | |||
*** Inline CSS | |||
When an individual CSS property is used more than once the last occurrence "wins". | |||
== HTML and CSS entities == | |||
{| | |||
|- | |||
! !! HTML || CSS !! Description | |||
|- | |||
| ► || &#9658; || \25BA || black right-pointing pointer | |||
|- | |||
| ◄ || &#9668; || \25C4 || black left-pointing pointer | |||
|- | |||
| ○ || &#9675; || \25CB || white circle | |||
|- | |||
| ◎ || &#9678; || \25CE || bullseye | |||
|- | |||
| ● || &#9679; || \25CF || black circle | |||
|} | |||
See also: | |||
* [https://www.w3schools.com/html/html_entities.asp W3 schools tutorial] | |||
* [https://www.htmlsymbols.xyz/ HTML Symbols - Unicode symbols, entities and codes] | |||
== Code snippets == | == Code snippets == | ||
=== Small | === Small stuff === | ||
No more mineable asteroids in missons: | No more mineable asteroids in missons: | ||
{{Code|<nowiki>Various mission site locations have had mineable asteroids replaced with cosmetic asteroids. (30/03/2020) | {{Code|<nowiki>Various mission site locations have had mineable asteroids replaced with cosmetic asteroids. (30/03/2020) | ||
| Line 40: | Line 356: | ||
|<nowiki>{{hatnote|This article details the Level ?, <Faction> version of this mission. For other variants, see [[<Mission>|<Mission> (disambiguation)]].}} | |<nowiki>{{hatnote|This article details the Level ?, <Faction> version of this mission. For other variants, see [[<Mission>|<Mission> (disambiguation)]].}} | ||
</nowiki>}} | </nowiki>}} | ||
==== Text color in EVE chat ==== | |||
Red {{Co|#ff0000|ff0000}} | |||
Green 1 {{Co|#a3fc80|a3fc80}}<br> | |||
Green 2 {{Co|#48ff00|48ff00}} | |||
Blue {{Co|#80d8fc|80d8fc}} | |||
=== MessageBox with logo === | === MessageBox with logo === | ||
| Line 109: | Line 433: | ||
|- | |- | ||
|Minmatar||Hydrogen | |Minmatar||Hydrogen | ||
|} | |||
Wiki markup table with class="sortable" and special markings | |||
<nowiki>class= data-sort-type="number"?? | data-sort-value="24" | unsortable | sortbottom </nowiki> | |||
{| class="wikitable sortable" | |||
|- | |||
! Text !! Number 1 !! Number 2 !! Number 3 !! class="unsortable" | Number 4 | |||
|- | |||
| Een || 1 || +1 || data-sort-value="3" | 1 || 1 | |||
|- | |||
| Twee || 2 || +2 || data-sort-value="1" | 2 || 2 | |||
|- | |||
| Tien || 10 || +10 || data-sort-value="2" | 10 || 10 | |||
|- | |||
| Min tien || -10 ||-10 || data-sort-value="5" | -10 || -10 | |||
|- class="sortbottom" | |||
| Vijf || 5 || 5 || 5 || 5 | |||
|} | |} | ||
| Line 151: | Line 493: | ||
</nowiki> | </nowiki> | ||
</pre> | </pre> | ||
Results in: | |||
<div class="mw-collapsible" style="border: 2px solid white; padding: 0.5em;"> | <div class="mw-collapsible" style="border: 2px solid white; padding: 0.5em;"> | ||
Content of outer div. | Content of outer div. | ||