taiga
/
taiga-front
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Improved card-tooltip styles

stable
Daniel García 2018-09-19 13:48:50 +02:00 committed by Alex Hermida
parent 50e78afb9f
commit fa7ae3ae11
1 changed files with 4 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/modules/components/card/card.scss
View File

@ -209,6 +209,9 @@
.card-completion { .card-completion {
margin: 0 1rem .5rem; margin: 0 1rem .5rem;
position: relative; position: relative;
&:hover .card-tooltip {
display: block;
}
.card-completion-bar { .card-completion-bar {
background: $whitish; background: $whitish;
height: .4rem; height: .4rem;
@ -221,24 +224,18 @@
left: 0; left: 0;
position: absolute; position: absolute;
top: 0; top: 0;
&:hover {
+ .card-tooltip {
opacity: 1;
}
}
} }
.card-tooltip { .card-tooltip {
background: $blackish; background: $blackish;
border-radius: 5px; border-radius: 5px;
color: $white; color: $white;
display: none;
font-size: 14px; font-size: 14px;
left: calc(25% - 50px); left: calc(25% - 50px);
opacity: 0;
padding: .25rem 1rem; padding: .25rem 1rem;
position: absolute; position: absolute;
text-align: center; text-align: center;
top: -2.25rem; top: -2.25rem;
transition: opacity .2s;
width: 100px; width: 100px;
&::after { &::after {
background: $black; background: $black;