54 lines
1.1 KiB
SCSS
54 lines
1.1 KiB
SCSS
|
// Styles copied almost verbatim from Shepherd.js's default CSS.
|
||
|
// Since we have the Tildes CSS available in the content scripts anyway, we can
|
||
|
// use its classes for a lot of what we need. So instead of importing the full
|
||
|
// default styling from Shepherd.js and then overriding everything, only copy
|
||
|
// what we want and trim the rest.
|
||
|
|
||
|
.shepherd-modal-overlay-container {
|
||
|
height: 0;
|
||
|
left: 0;
|
||
|
opacity: 0;
|
||
|
overflow: hidden;
|
||
|
pointer-events: none;
|
||
|
position: fixed;
|
||
|
top: 0;
|
||
|
transition: all 0.3s ease-out, height 0ms 0.3s, opacity 0.3s 0ms;
|
||
|
width: 100vw;
|
||
|
z-index: 9997;
|
||
|
|
||
|
&.shepherd-modal-is-visible {
|
||
|
height: 100vh;
|
||
|
opacity: 0.5;
|
||
|
transform: translateZ(0);
|
||
|
transition: all 0.3s ease-out, height 0s 0s, opacity 0.3s 0s;
|
||
|
|
||
|
path {
|
||
|
pointer-events: all;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.shepherd-element {
|
||
|
opacity: 0;
|
||
|
outline: none;
|
||
|
padding: 16px;
|
||
|
transition: opacity 0.3s, visibility 0.3s;
|
||
|
visibility: hidden;
|
||
|
width: 100%;
|
||
|
z-index: 9999;
|
||
|
|
||
|
&.shepherd-enabled {
|
||
|
opacity: 1;
|
||
|
visibility: visible;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.shepherd-target {
|
||
|
&.shepherd-target-click-disabled {
|
||
|
&,
|
||
|
& * {
|
||
|
pointer-events: none;
|
||
|
}
|
||
|
}
|
||
|
}
|