Template:Item tooltip/styles.css: Difference between revisions

From MalveraWiki
Kuba445 (talk | contribs)
moderator
1,786 edits
Created page with ".item-tooltip-wrapper { position: relative; display: inline-block; cursor: help; } .item-tooltip-trigger { color: #6cf; text-decoration: underline dotted; } .item-tooltip-box { display: none; position: absolute; top: 120%; left: 50%; transform: translateX(-50%); width: 260px; background: linear-gradient(#0a0f1a, #0d1424); border: 1px solid #2b395a; border-radius: 6px; padding: 10px; color: #d8e6ff; font-size: 13px; box-shadow: 0 0 12..."
 
Kuba445 (talk | contribs)
moderator
1,786 edits
No edit summary
 
(One intermediate revision by the same user not shown)
Line 1: Line 1:
.item-tooltip-wrapper {
<templatestyles src="Item tooltip/styles.css" />
  position: relative;
  display: inline-block;
  cursor: help;
}


.item-tooltip-trigger {
<div class="item-tooltip-wrapper">
   color: #6cf;
   <span class="item-tooltip-trigger">{{{name|Item}}}</span>
  text-decoration: underline dotted;
}


.item-tooltip-box {
  <div class="item-tooltip-box">
  display: none;
    <div class="item-tooltip-title">{{{name|Item}}}</div>
  position: absolute;
  top: 120%;
  left: 50%;
  transform: translateX(-50%);
  width: 260px;
  background: linear-gradient(#0a0f1a, #0d1424);
  border: 1px solid #2b395a;
  border-radius: 6px;
  padding: 10px;
  color: #d8e6ff;
  font-size: 13px;
  box-shadow: 0 0 12px rgba(0,0,0,0.6);
  z-index: 1000;
}


.item-tooltip-title {
    <div class="item-tooltip-section">
  display: block;
      <div class="item-tooltip-section-title">Attack</div>
  text-align: center;
      <div class="item-tooltip-row"><span>Amount</span><span>{{{atk_amt|+0}}}</span></div>
  font-weight: bold;
      <div class="item-tooltip-row"><span>Chance</span><span>{{{atk_chance|-}}}</span></div>
  color: #9fe3ff;
      <div class="item-tooltip-row"><span>Enchant</span><span>{{{atk_enchant|0%}}}</span></div>
  margin-bottom: 6px;
    </div>
  font-size: 15px;
}


.item-tooltip-section {
    <div class="item-tooltip-section">
  margin-top: 6px;
      <div class="item-tooltip-section-title">Defense</div>
  padding-top: 4px;
      <div class="item-tooltip-row"><span>Amount</span><span>{{{def_amt|+0}}}</span></div>
  border-top: 1px solid #24324f;
      <div class="item-tooltip-row"><span>Chance</span><span>{{{def_chance|-}}}</span></div>
}
      <div class="item-tooltip-row"><span>Enchant</span><span>{{{def_enchant|0%}}}</span></div>
    </div>


.item-tooltip-section-title {
    <div class="item-tooltip-section">
  text-align: center;
      <div class="item-tooltip-section-title">Attack Interval</div>
  color: #7fffd4;
      <div class="item-tooltip-row"><span>Amount</span><span>{{{spd_amt|0%}}}</span></div>
  font-weight: bold;
      <div class="item-tooltip-row"><span>Chance</span><span>{{{spd_chance|-}}}</span></div>
  margin-bottom: 4px;
      <div class="item-tooltip-row"><span>Enchant</span><span>{{{spd_enchant|0%}}}</span></div>
}
    </div>


.item-tooltip-row {
   </div>
  display: flex;
</div>
  justify-content: space-between;
  padding: 1px 4px;
}
 
.item-tooltip-wrapper:hover .item-tooltip-box {
   display: block;
}

Latest revision as of 18:35, 2 February 2026

<templatestyles src="Item tooltip/styles.css" /> 

 Item
Item
Attack
Amount+0
Chance-
Enchant0%
Defense
Amount+0
Chance-
Enchant0%
Attack Interval
Amount0%
Chance-
Enchant0%
Retrieved from "https://wiki.malvera.online/index.php?title=Template:Item_tooltip/styles.css&oldid=3297"