Initial implementation of Action Skill

This commit is contained in:
Aldi Doanta 2018-05-25 00:55:12 +08:00
parent b7d8ebbd98
commit 43c78075a7
2 changed files with 30 additions and 2 deletions

View file

@ -186,6 +186,12 @@ body.choicePage .wrapper {
height: 53px;
}
.skill-action {
display: inline-block;
position: relative;
cursor: pointer;
}
.points {
visibility: hidden;
position: absolute;
@ -243,7 +249,9 @@ legend {
display: none;
}
.tree .description {
.tree .description,
.skill-action .description
{
display: none;
position: absolute;
top: 0;
@ -264,6 +272,11 @@ legend {
right: 110%;
}
.skill-action .description {
top: 10%;
left: 105%;
}
.tier[data-level='4'] .description {
top: auto;
bottom: -59px;
@ -279,7 +292,8 @@ legend {
bottom: 0;
}
.tree .description h2 {
.tree .description h2,
.skill-action .description h2 {
padding: 0.15em 0;
margin-bottom: 0.15em;
font-size: 125%;
@ -362,6 +376,14 @@ legend {
display: none;
}
.skill-action:hover .description {
display: block;
}
.skill-action:hover .description:hover {
display: none;
}
.green legend {
color: #41974D;
}

View file

@ -17,6 +17,12 @@
<h3>Level <span class="charLevel">5</span> Mechromancer</h3>
</div>
<img unselectable="on" class="portrait" src="mechromancerPortrait.png">
<div>
<div class="skill-action"><img src="icons/mechromancer-actionskill.png" />
<div class="description"><h2>Summon Deathtrap</h2>Action Skill. Summon Deathtrap to fight for you. Cooldown: 60 seconds</div>
<div class="points"></div>
</div>
</div>
<div class="treeCollection">
<div class="treewrapper green">
<div class="bglayer gray"></div>