Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.
No edit summary
mNo edit summary
 
(4 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{#css:
{{User:Cassiel_Seraphim/Template:debug|foo|bar||4|{{ship|bhaalgorn}}}}
 
.tooltip { outline:none; position: relative }
.tooltip:hover span { display: inline-block; }
 
.tooltip span {
  z-index: 10;
  position: absolute;
  display: none;
  padding: 8px;
  width: 300px;
  line-height: 1em;
  color: black;
  background: #aaaaaa;
  border: 1px solid #222222;
  border-radius: 8px;
  text-decoration: none;
  box-shadow: 2px 2px 4px #000000;
  white-spacing:
}
 
.tooltip.right span { left: 100%; margin-left: 1em; margin-top: -.5em; }
.tooltip.left  span { right: 100%; margin-right: 1em; margin-top: -.5em; }
.tooltip.up    span { bottom: 0; margin-bottom: 1.5em; }
.tooltip.down  span { top: 0; margin-top: 1.5em; }
 
}}
 
'''Normal''' tooptip: {{tooltip|Example|Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eu hendrerit nisi. Nulla ornare, dolor eu pulvinar faucibus, magna purus tempor orci, sed malesuada urna ligula sit amet mauris.}}
 
 
Let's see what the <font color="wheat"><span class="tooltip up">tooltip up<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eu hendrerit nisi. Nulla ornare, dolor eu pulvinar faucibus, magna purus tempor orci, sed malesuada urna ligula sit amet mauris.</span></span></font> does compared to <font color="lime"><span class="tooltip right">tooltip right<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eu hendrerit nisi. Nulla ornare, dolor eu pulvinar faucibus, magna purus tempor orci, sed malesuada urna ligula sit amet mauris.</span></span></font> as well as how <font color="crimson"><span class="tooltip left">tooltip left<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eu hendrerit nisi. Nulla ornare, dolor eu pulvinar faucibus, magna purus tempor orci, sed malesuada urna ligula sit amet mauris.</span></span></font> differ from <font color="magenta"><span class="tooltip down">tooltip down<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eu hendrerit nisi. Nulla ornare, dolor eu pulvinar faucibus, magna purus tempor orci, sed malesuada urna ligula sit amet mauris.</span></span></font> when put in the end. Does this <font color="cyan"><span class="tooltip">normal tooltip<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eu hendrerit nisi. Nulla ornare, dolor eu pulvinar faucibus, magna purus tempor orci, sed malesuada urna ligula sit amet mauris.</span></span></font> change?
 
Now how about an image like this? <span class="tooltip up">{{icon|web|32}}<span style="font-size:90%">{{icon|web|20}} -60% speed reduction at 30 km.</span></span> or a larger one like <span class="tooltip down">{{icon|amarr|64}}<span>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus eu hendrerit nisi. Nulla ornare, dolor eu pulvinar faucibus, magna purus tempor orci, sed malesuada urna ligula sit amet mauris.</span></span>

Latest revision as of 18:32, 20 October 2020

Debugging Magic words
Template [1] Result
FULLPAGENAME User:Cassiel Seraphim/Sandbox8
PAGENAME Cassiel Seraphim/Sandbox8
BASEPAGENAME Cassiel Seraphim
SUBPAGENAME Sandbox8
SUBJECTPAGENAME User:Cassiel Seraphim/Sandbox8
ARTICLEPAGENAME User:Cassiel Seraphim/Sandbox8
TALKPAGENAME User talk:Cassiel Seraphim/Sandbox8
NAMESPACE User
ARTICLESPACE User
TALKSPACE User talk
Debugging Parser
Var Value
{{{1}}} foo
{{{2}}} bar
{{{3}}} N/A
{{{4}}} 4
{{{5}}} Bhaalgorn
Bhaalgorn
Pirate Faction Battleships Armageddon Class
High Amount of High Slots
High Amount of Low Slots
7 (0/4) 5 7
18,400 MW 588 tf
101 m/sec
845 m³
{{{6}}} N/A
{{{7}}} N/A
{{{8}}} N/A
{{{9}}} N/A
{{{10}}} N/A
  1. ^ Any -NAME template will show spaces as " " while similarly named -NAMEE templates will show spaces as "_". PAGENAME for the main page will show "Main Page" whereas PAGENAMEE shows "Main_Page".