.jet-elements {
select {
appearance: none;
width: 100%;
}
}
.jet-elements-icon {
display: inline-block;
line-height: 1;
text-align: center;
svg {
display: block;
width: 1em;
height: 1em;
fill: currentColor;
}
}
.jet-elements {
.jet-elements-edit-template-link {
position: absolute;
bottom: 5px;
right: 5px;
display: inline-block;
padding: 5px;
background-color: #b7084e;
color: #fff;
border-radius: 3px;
font-size: 14px;
line-height: 1;
text-align: center;
i {
width: 1em;
height: 1em;
}
&:hover {
background-color: #840739;
color: #fff;
}
}
//Scale
.tippy-box[data-animation=scale][data-placement*=top]{transform-origin:bottom}
.tippy-box[data-animation=scale][data-placement*=bottom]{transform-origin:top}
.tippy-box[data-animation=scale][data-placement*=left]{transform-origin:right}
.tippy-box[data-animation=scale][data-placement*=right]{transform-origin:left}
.tippy-box[data-animation=scale][data-state=hidden]{transform:scale(.5);opacity:0}
// Perspective
.tippy-box[data-animation=perspective][data-placement^=top]{transform-origin:bottom}
.tippy-box[data-animation=perspective][data-placement^=top][data-state=visible]{transform:perspective(700px)}
.tippy-box[data-animation=perspective][data-placement^=top][data-state=hidden]{transform:perspective(700px) translateY(8px) rotateX(60deg)}
.tippy-box[data-animation=perspective][data-placement^=bottom]{transform-origin:top}
.tippy-box[data-animation=perspective][data-placement^=bottom][data-state=visible]{transform:perspective(700px)}
.tippy-box[data-animation=perspective][data-placement^=bottom][data-state=hidden]{transform:perspective(700px) translateY(-8px) rotateX(-60deg)}
.tippy-box[data-animation=perspective][data-placement^=left]{transform-origin:right}
.tippy-box[data-animation=perspective][data-placement^=left][data-state=visible]{transform:perspective(700px)}
.tippy-box[data-animation=perspective][data-placement^=left][data-state=hidden]{transform:perspective(700px) translateX(8px) rotateY(-60deg)}
.tippy-box[data-animation=perspective][data-placement^=right]{transform-origin:left}
.tippy-box[data-animation=perspective][data-placement^=right][data-state=visible]{transform:perspective(700px)}
.tippy-box[data-animation=perspective][data-placement^=right][data-state=hidden]{transform:perspective(700px) translateX(-8px) rotateY(60deg)}
.tippy-box[data-animation=perspective][data-state=hidden]{opacity:0}
// shift-away
.tippy-box[data-animation=shift-away][data-state=hidden]{opacity:0}
.tippy-box[data-animation=shift-away][data-state=hidden][data-placement^=top]{transform:translateY(10px)}
.tippy-box[data-animation=shift-away][data-state=hidden][data-placement^=bottom]{transform:translateY(-10px)}
.tippy-box[data-animation=shift-away][data-state=hidden][data-placement^=left]{transform:translateX(10px)}
.tippy-box[data-animation=shift-away][data-state=hidden][data-placement^=right]{transform:translateX(-10px)}
// shift-toward
.tippy-box[data-animation=shift-toward][data-state=hidden]{opacity:0}
.tippy-box[data-animation=shift-toward][data-state=hidden][data-placement^=top]{transform:translateY(-10px)}
.tippy-box[data-animation=shift-toward][data-state=hidden][data-placement^=bottom]{transform:translateY(10px)}
.tippy-box[data-animation=shift-toward][data-state=hidden][data-placement^=left]{transform:translateX(-10px)}
.tippy-box[data-animation=shift-toward][data-state=hidden][data-placement^=right]{transform:translateX(10px)}
}