User:Evon R'al/Sandbox template: Difference between revisions

← Older edit Newer edit →

VisualWikitext

Revision as of 15:56, 8 May 2022

Template documentation (for the above template, sometimes hidden or invisible)

Visit User:Evon R'al/Sandbox template/doc to edit this text! (How does this work?) (Refresh this text - why?)

@@ Line 5: / Line 5: @@
 }}
-|2=  <div class='uniwiki-ship-tooltip'>
+|2=  <div class='uniwiki-ship-tooltip sbtt'>
-  <table cellspacing='0' style='width:100%;'>
+  <table cellspacing='0'>
    <tr>
-    <td class='left' style='padding: 0 5px 0 0; width: 80px; position: relative;'>{{#if:{{{tech|}}}
+    <td class="sbtt-image">{div class="sbtt-image>[[Image:{{{shipimg|no-image.png}}}|80x80px|link=]]</div{{#if:{{{tech|}}}
-  |<div class='techcornersmall'>[[Image:CornerT{{{tech|2}}}s.png|link=]]</div>}}[[Image:{{{shipimg|no-image.png}}}|80x80px|link=]]</td>
+  |<div class="sbtt-techcornersmall">[[Image:CornerT{{{tech|2}}}s.png|link=]]</div>}}</td>
     <td>
-     <div class='uniwiki-ship-tooltip-header'>
+     <div class="sbtt-header">
-      <div class='tooltip-header-shipname'>{{{shipname|}}}</div>
+      <div class="ship-name">{{{shipname|}}}</div>
-      <div class='tooltip-header-category'><span style='color: orange; margin-right: 5px;'>{{{grouping|Unique Ships}}}</span><span>{{{hulltype|Unknown Class}}}</span></div>
+      <div class="ship-category"><span class="ship-group">{{{grouping|Unique Ships}}}</span><span class="ship-hull">{{{hulltype|Unknown Class}}}</span></div>
      </div>
-     <div class='uniwiki-ship-tooltip-middle' style='padding-bottom: 5px; display:{{#if:{{{highlights1|}}}|block|none}}'>
+     <div class="sbtt-highlights" style='display:{{#if:{{{highlights1|}}}|block|none}}'>
-      <div class='tt-hl'>[[Image:Icon_highlights.png|10x10px]]{{{highlights1|}}}</div>
+      <div>[[Image:Icon_highlights.png|10x10px]]{{{highlights1|}}}</div>
       <div class='tt-hl' style='display:{{#if:{{{highlights2|}}}|block|none}}'>[[Image:Icon_highlights.png|10x10px]]{{{highlights2|}}}</div>
       <div class='tt-hl' style='display:{{#if:{{{highlights3|}}}|block|none}}'>[[Image:Icon_highlights.png|10x10px]]{{{highlights3|}}}</div>
      </div>
-     <div class='uniwiki-ship-tooltip-bottom'>
+     <div class="sbtt-attributes">
-      <div class='tt-att'>[[Image:icon_hi_slot.png|15x15px]]{{{highs|0}}}<div style='display:inline;'>({{{launchers|0}}}/{{{turrets|0}}})</div></div>
+      <div>[[Image:icon_hi_slot.png|15x15px]]{{{highs|0}}}<div style='display:inline;'>({{{launchers|0}}}/{{{turrets|0}}})</div></div>
-      <div class='tt-att'>[[Image:icon_mid_slot.png|15x15px]]{{{mediums|0}}}</div>
+      <div>[[Image:icon_mid_slot.png|15x15px]]{{{mediums|0}}}</div>
-      <div class='tt-att'>[[Image:icon_low_slot.png|15x15px]]{{{lows|0}}}</div>
+      <div>[[Image:icon_low_slot.png|15x15px]]{{{lows|0}}}</div>
-      <div class='tt-att'>[[Image:icon_powergrid.png|15x15px]]{{{powergrid|0 MW}}}</div>
+      <div>[[Image:icon_powergrid.png|15x15px]]{{{powergrid|0 MW}}}</div>
-      <div class='tt-att'>[[Image:icon_cpu.png|15x15px]]{{{cpu|0 tf}}}</div>
+      <div>[[Image:icon_cpu.png|15x15px]]{{{cpu|0 tf}}}</div>
-      <div class='tt-att'>[[Image:Icon_velocity.png|15x15px]]{{{maxvelocity|0 m/s}}}</div>
+      <div>[[Image:Icon_velocity.png|15x15px]]{{{maxvelocity|0 m/s}}}</div>
-      <div class='tt-att'>[[Image:Icon_capacity.png|15x15px]]{{{cargohold|0 m&#179;}}}</div>
+      <div>[[Image:Icon_capacity.png|15x15px]]{{{cargohold|0 m&#179;}}}</div>
      </div>
     </td>
@@ Line 104: / Line 104: @@
    margin-top: 0px;
 }
+/* rewrite CSS */
+/* sbtt - ShipBoxTooltip */
+.sbtt {
+  /* This is a container class
+     to limit the accompanying classes
+     to only work within an element with this class */
+ }
+div .sbtt {
+  width: 270px;
+  background: black;
+ }
+.sbtt table {
+  width: 100%;
+ }
+/* Ship image */
+.sbtt td.sbtt-image {
+  position: relative;
+  padding-right: 5px;
+  vertical-align: top;
+ }
+.sbtt div.sbtt-image {
+  position: relative;
+  top: 2px;
+ }
+.sbtt .sbtt-techcornersmall {
+  position: absolute;
+  top: 0px;
+  left: 1px;
+  width: 16px;
+  height: 16px;
+ }
+/* Header */
+.sbtt .sbtt-header {
+  margin-bottom: 5px;
+  border-bottom: 1px solid #272727;
+  padding-bottom: 5px;
+  text-align: center;
+ }
+.sbtt .sbtt-header .ship-name {
+  display: block;
+  height: 20px;
+  white-space: nowrap;
+  color: white;
+  font: small-caps 16px trebuchet MS;
+ }
+.sbtt .sbtt-header .ship-category {
+  font-size: 11px;
+  line-height: 10px;
+ }
+.sbtt .sbtt-header .ship-group {
+  white-space: nowrap;
+  color: orange;
+ }
+.sbtt .sbtt-header .ship-hull {
+  white-space: nowrap;
+ }
+/* Highlights */
+.sbtt div.sbtt-highlights {
+  padding-bottom: 5px;
+ }
+.sbtt .sbtt-highlights div {
+  display: block;
+  color: khaki;
+  font-size: 10px;
+  height: 10px;
+  line-height: 12px;
+ }
+/* Attributes */
+.sbtt div.sbtt-attributes {
+  float: left;
+  width: 170px;
+ }
+.sbtt .sbtt-attributes div {
+  display: inline-block;
+  float:left;
+  margin-right: 3px;
+  padding-right: 3px;
+  height: 13px;
+  white-space: nowrap;
+  color: #9E8F75;
+  font-size: 10px;
+  line-height: 15px;
+ }
 }}</onlyinclude></includeonly><noinclude>
 {{documentation}}
 </noinclude>

{div class="sbtt-image></div	Redeemer Black OpsArmageddon Class High Amount of High Slots High Amount of Low Slots 8 (0/6) 4 7 17,000 MW 505 tf 117 m/sec 800 m³
From draft