mirror of
https://github.com/bookwyrm-social/bookwyrm.git
synced 2024-05-16 07:23:04 +00:00
37c2ad11b6
remove bottom border radius from message text and top border radius from message footer on guided tour popovers.
49 lines
2.8 KiB
SCSS
49 lines
2.8 KiB
SCSS
/*
|
|
Shepherd styles for guided tour.
|
|
Based on Shepherd v 10.0.0 styles.
|
|
*/
|
|
|
|
@use 'bulma/bulma.sass';
|
|
|
|
.shepherd-button {
|
|
@extend .button.mr-2;
|
|
}
|
|
|
|
.shepherd-button.shepherd-button-secondary {
|
|
@extend .button.is-light;
|
|
}
|
|
|
|
.shepherd-footer {
|
|
@extend .message-body;
|
|
@extend .is-info.is-light;
|
|
border-color: $info-light;
|
|
border-radius: 0 0 4px 4px;
|
|
}
|
|
|
|
.shepherd-cancel-icon{background:transparent;border:none;color:hsla(0,0%,50%,.75);cursor:pointer;font-size:2em;font-weight:400;margin:0;padding:0;transition:color .5s ease}.shepherd-cancel-icon:hover{color:rgba(0,0,0,.75)}.shepherd-has-title .shepherd-content .shepherd-cancel-icon{color:hsla(0,0%,50%,.75)}.shepherd-has-title .shepherd-content .shepherd-cancel-icon:hover{color:rgba(0,0,0,.75)}
|
|
|
|
.shepherd-header {
|
|
@extend .message-header;
|
|
@extend .is-info;
|
|
}
|
|
|
|
.shepherd-text {
|
|
@extend .message-body;
|
|
@extend .is-info.is-light;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.shepherd-content {
|
|
@extend .message;
|
|
}
|
|
|
|
.shepherd-element{background:$info-light;border-radius:5px;box-shadow:4px 4px 6px rgba(0,0,0,.2);max-width:400px;opacity:0;outline:none;transition:opacity .3s,visibility .3s;visibility:hidden;width:100%;z-index:9999}.shepherd-enabled.shepherd-element{opacity:1;visibility:visible}.shepherd-element[data-popper-reference-hidden]:not(.shepherd-centered){opacity:0;pointer-events:none;visibility:hidden}.shepherd-element,.shepherd-element *,.shepherd-element :after,.shepherd-element :before{box-sizing:border-box}.shepherd-arrow,.shepherd-arrow:before{height:16px;position:absolute;width:16px;z-index:-1}.shepherd-arrow:before{background:$info-light;box-shadow:0 2px 4px rgba(0,0,0,.2);content:"";transform:rotate(45deg)}.shepherd-element[data-popper-placement^=top]>.shepherd-arrow{bottom:-8px}.shepherd-element[data-popper-placement^=bottom]>.shepherd-arrow{top:-8px}.shepherd-element[data-popper-placement^=left]>.shepherd-arrow{right:-8px}.shepherd-element[data-popper-placement^=right]>.shepherd-arrow{left:-8px}.shepherd-element.shepherd-centered>.shepherd-arrow{opacity:0}.shepherd-element.shepherd-has-title[data-popper-placement^=bottom]>.shepherd-arrow:before{background-color:$info}.shepherd-target-click-disabled.shepherd-enabled.shepherd-target,.shepherd-target-click-disabled.shepherd-enabled.shepherd-target *{pointer-events:none}
|
|
|
|
.shepherd-modal-overlay-container{height:0;left:0;opacity:0;overflow:hidden;pointer-events:none;position:fixed;top:0;transition:all .3s ease-out,height 0ms .3s,opacity .3s 0ms;width:100vw;z-index:9997}.shepherd-modal-overlay-container.shepherd-modal-is-visible{height:100vh;opacity:.5;transform:translateZ(0);transition:all .3s ease-out,height 0s 0s,opacity .3s 0s}.shepherd-modal-overlay-container.shepherd-modal-is-visible path{pointer-events:all}
|
|
|
|
.tour-element-highlight {
|
|
border: 5px solid $info;
|
|
border-radius: 5px;
|
|
box-shadow:4px 4px 6px rgba(0,0,0,.2);
|
|
}
|