@micromag/viewer 0.3.307 → 0.3.308

package/assets/css/styles.css

@@ -8,7 +8,7 @@
 .micromag-viewer-menus-menu-preview-scroll{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-viewer-menus-menu-preview-container{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;background-repeat:no-repeat;background-position:50%;background-size:cover;-ms-touch-action:none;touch-action:none}.micromag-viewer-menus-menu-preview-container.micromag-viewer-menus-menu-preview-disabled .micromag-viewer-menus-menu-preview-screenButton{pointer-events:none}.micromag-viewer-menus-menu-preview-content{height:100%;max-height:100%}.micromag-viewer-menus-menu-preview-buttons,.micromag-viewer-menus-menu-preview-content{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.micromag-viewer-menus-menu-preview-buttons{display:-webkit-flex;display:-ms-flexbox;display:flex;z-index:3;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.micromag-viewer-menus-menu-preview-organisation{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:30px;height:30px;margin-right:10px;border-radius:50%;background-color:#fff;background-repeat:no-repeat;background-position:50%;background-size:contain}.micromag-viewer-menus-menu-preview-icon{display:block;width:1rem;height:auto}.micromag-viewer-menus-menu-preview-title{margin-right:auto;color:#fff;font-family:Helvetica,Arial,sans-serif}.micromag-viewer-menus-menu-preview-nav{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:10px;overflow:hidden}.micromag-viewer-menus-menu-preview-item,.micromag-viewer-menus-menu-preview-items{margin:0;padding:0;list-style:none}.micromag-viewer-menus-menu-preview-items{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.micromag-viewer-menus-menu-preview-item,.micromag-viewer-menus-menu-preview-items{position:relative}.micromag-viewer-menus-menu-preview-item{width:33.333%}.micromag-viewer-menus-menu-preview-inner{padding:2px}.micromag-viewer-menus-menu-preview-frame{width:100%;height:0;background-color:#343434}.micromag-viewer-menus-menu-preview-screen{-webkit-animation:micromag-viewer-menus-menu-preview-intro 1s cubic-bezier(.6,0,.4,1) 50ms 1 forwards;animation:micromag-viewer-menus-menu-preview-intro 1s cubic-bezier(.6,0,.4,1) 50ms 1 forwards;opacity:0}@-webkit-keyframes micromag-viewer-menus-menu-preview-intro{to{opacity:1}}@keyframes micromag-viewer-menus-menu-preview-intro{to{opacity:1}}
 .micromag-viewer-partials-micromag-preview-container{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}.micromag-viewer-partials-micromag-preview-cover{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;margin-right:.5rem;overflow:hidden}.micromag-viewer-partials-micromag-preview-info{white-space:normal}.micromag-viewer-partials-micromag-preview-url{margin:.5rem 0;font-size:.75rem}.micromag-viewer-partials-micromag-preview-container .micromag-viewer-partials-micromag-preview-title{margin-bottom:.25rem;font-family:Helvetica,Arial,sans-serif!important;font-size:1.1rem!important;font-weight:700}
 .micromag-viewer-menus-menu-share-scroll{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-viewer-menus-menu-share-container{background-repeat:no-repeat;background-position:50%;background-size:cover;-ms-touch-action:none;touch-action:none}.micromag-viewer-menus-menu-share-container.micromag-viewer-menus-menu-share-disabled .micromag-viewer-menus-menu-share-button{pointer-events:none}.micromag-viewer-menus-menu-share-content{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;height:100%;max-height:100%}.micromag-viewer-menus-menu-share-content,.micromag-viewer-menus-menu-share-inner{position:relative}.micromag-viewer-menus-menu-share-inner{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;max-width:500px;margin:0 auto;padding:10px}.micromag-viewer-menus-menu-share-organisation{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:30px;height:30px;margin-right:10px;border-radius:50%;background-color:#fff;background-repeat:no-repeat;background-position:50%;background-size:contain}.micromag-viewer-menus-menu-share-icon{display:block;width:1rem;height:auto}.micromag-viewer-menus-menu-share-header{max-width:600px;margin:.5rem 0;padding:.5rem;border-radius:.5rem;background-color:rgba(0,0,0,.15)}.micromag-viewer-menus-menu-share-mode{margin-top:.5rem}.micromag-viewer-menus-menu-share-mode label{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;font-size:14px;line-height:1.4;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.micromag-viewer-menus-menu-share-mode input{width:1rem;height:1rem;margin-right:.5rem;-webkit-transition:-webkit-transform .3s cubic-bezier(0,.6,.5,1);transition:-webkit-transform .3s cubic-bezier(0,.6,.5,1);-o-transition:transform .3s cubic-bezier(0,.6,.5,1);transition:transform .3s cubic-bezier(0,.6,.5,1);transition:transform .3s cubic-bezier(0,.6,.5,1), -webkit-transform .3s cubic-bezier(0,.6,.5,1);animation:micromag-viewer-menus-menu-share-bump .5s cubic-bezier(.6,0,.4,1) 1 alternate-reverse forwards;border:2px solid #fff;border-radius:4px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-viewer-menus-menu-share-mode input:active{-webkit-transform:scale(1.3);-ms-transform:scale(1.3);transform:scale(1.3);-webkit-transition:-webkit-transform .3s cubic-bezier(.41,1.69,.04,.67);transition:-webkit-transform .3s cubic-bezier(.41,1.69,.04,.67);-o-transition:transform .3s cubic-bezier(.41,1.69,.04,.67);transition:transform .3s cubic-bezier(.41,1.69,.04,.67);transition:transform .3s cubic-bezier(.41,1.69,.04,.67), -webkit-transform .3s cubic-bezier(.41,1.69,.04,.67)}.micromag-viewer-menus-menu-share-mode input:checked{background-color:#fff}.micromag-viewer-menus-menu-share-options{margin-bottom:3rem}
-.micromag-viewer-container{font-family:Helvetica,Arial,sans-serif;font-size:16px;font-weight:400;line-height:1.1}.micromag-viewer-container address,.micromag-viewer-container blockquote,.micromag-viewer-container caption,.micromag-viewer-container dl,.micromag-viewer-container figure,.micromag-viewer-container h1,.micromag-viewer-container h2,.micromag-viewer-container h3,.micromag-viewer-container h4,.micromag-viewer-container h5,.micromag-viewer-container h6,.micromag-viewer-container label,.micromag-viewer-container legend,.micromag-viewer-container li,.micromag-viewer-container ol,.micromag-viewer-container p,.micromag-viewer-container pre,.micromag-viewer-container ul{margin:0;padding:0}.micromag-viewer-container *,.micromag-viewer-container :after,.micromag-viewer-container :before{-webkit-box-sizing:border-box;box-sizing:border-box}.micromag-viewer-container h1,.micromag-viewer-container h2,.micromag-viewer-container h3,.micromag-viewer-container h4,.micromag-viewer-container h5,.micromag-viewer-container h6,.micromag-viewer-container li,.micromag-viewer-container p{font-weight:400}.micromag-viewer-menuContainer,.micromag-viewer-menuPreview,.micromag-viewer-menuShare,.micromag-viewer-screenContainer,.micromag-viewer-screensFrame{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-viewer-screenContainer:focus-visible{outline:3px solid #a13dff;outline-offset:4px}.micromag-viewer-container{position:relative;width:100%;height:100%;overflow:hidden;background-color:#1c1c1c;color:#fff}.micromag-viewer-container.micromag-viewer-landscape .micromag-viewer-screensFrame{top:0;bottom:0;left:50%;margin:auto;-webkit-transform:translate(-50%);-ms-transform:translate(-50%);transform:translate(-50%)}.micromag-viewer-container.micromag-viewer-hideMenu .micromag-viewer-menuNavContainer{opacity:0;pointer-events:none}.micromag-viewer-container.micromag-viewer-hideMenu .micromag-viewer-dots,.micromag-viewer-container.micromag-viewer-hideMenu .micromag-viewer-menuTopContainer{opacity:0}.micromag-viewer-content{position:absolute;z-index:1;width:100%;height:100%;overflow:hidden;cursor:-webkit-grab;cursor:grab;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-ms-touch-action:none;touch-action:none}.micromag-viewer-content:active{cursor:-webkit-grabbing;cursor:grabbing}.micromag-viewer-withoutGestures .micromag-viewer-content{cursor:inherit}.micromag-viewer-menuNavContainer{position:absolute;z-index:4;top:0;width:100%;-ms-touch-action:none;touch-action:none;-webkit-transition:opacity .5s cubic-bezier(.6,0,.4,1),background-image .5s cubic-bezier(.6,0,.4,1);-o-transition:opacity .5s cubic-bezier(.6,0,.4,1),background-image .5s cubic-bezier(.6,0,.4,1);transition:opacity .5s cubic-bezier(.6,0,.4,1),background-image .5s cubic-bezier(.6,0,.4,1)}.micromag-viewer-fadeMenu .micromag-viewer-menuNavContainer{opacity:.25}.micromag-viewer-menuNavContainer.micromag-viewer-withShadow{background-image:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,.75)),to(rgba(0,0,0,0)));background-image:-o-linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,0));background-image:linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,0))}.micromag-viewer-fadeMenu .micromag-viewer-menuNavContainer.micromag-viewer-withShadow{background-image:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,0)));background-image:-o-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0));background-image:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0))}.micromag-viewer-menuNavContainer.micromag-viewer-isOpened{opacity:1}.micromag-viewer-menuNavContainer.micromag-viewer-isOpened .micromag-viewer-dots{opacity:0}.micromag-viewer-menuNavContainer.micromag-viewer-isOpened.micromag-viewer-withShadow{background-image:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,.75)),to(rgba(0,0,0,0)));background-image:-o-linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,0));background-image:linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,0))}.micromag-viewer-menuTopContainer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-transition:opacity .2s cubic-bezier(.6,0,.4,1);-o-transition:opacity .2s cubic-bezier(.6,0,.4,1);transition:opacity .2s cubic-bezier(.6,0,.4,1)}.micromag-viewer-menuItem{display:block;width:50%;-ms-touch-action:none;touch-action:none}.micromag-viewer-menuItem:last-child{text-align:right}.micromag-viewer-menuButton{padding:.5rem .75rem;font-size:1rem}.micromag-viewer-slidingButton{display:inline-block}.micromag-viewer-screensMenuButtonToggled{right:0;left:auto}.micromag-viewer-dots{position:relative;z-index:3;top:-.25rem;padding:0 .5rem;-webkit-transition:opacity .3s cubic-bezier(0,.6,.5,1);-o-transition:opacity .3s cubic-bezier(0,.6,.5,1);transition:opacity .3s cubic-bezier(0,.6,.5,1)}.micromag-viewer-hideMenu .micromag-viewer-dots{pointer-events:none}.micromag-viewer-menuContainer{z-index:3;top:0}.micromag-viewer-menuPreview,.micromag-viewer-menuShare{z-index:4}.micromag-viewer-navButton{display:none;visibility:hidden;position:absolute;z-index:3;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);border:0}.micromag-viewer-navButton.micromag-viewer-previous{left:1.5rem}.micromag-viewer-navButton.micromag-viewer-next{right:1.5rem}@media screen and (min-width:1024px){.micromag-viewer-navButton{display:block;visibility:visible}}.micromag-viewer-screensFrame{z-index:1;-ms-touch-action:none;touch-action:none}.micromag-viewer-screenContainer{display:-webkit-flex;display:-ms-flexbox;display:flex;height:100%;opacity:0}.micromag-viewer-screen{pointer-events:none}.micromag-viewer-current .micromag-viewer-screen{pointer-events:auto}.micromag-viewer-playbackControls{position:absolute;z-index:2;bottom:0;left:0;width:100%;pointer-events:none}.micromag-viewer-arrowHint{position:absolute;top:70%;right:5%}.micromag-viewer-webView{z-index:10}.micromag-viewer-shareIncentiveContainer{position:absolute;z-index:1;top:0;left:10px;width:calc(100% - 20px);pointer-events:none}.micromag-viewer-shareIncentive{-webkit-transform:translateY(-10px);-ms-transform:translateY(-10px);transform:translateY(-10px);-webkit-transition:opacity .3s cubic-bezier(.9,0,.2,1),-webkit-transform .3s cubic-bezier(.9,0,.2,1);transition:opacity .3s cubic-bezier(.9,0,.2,1),-webkit-transform .3s cubic-bezier(.9,0,.2,1);-o-transition:opacity .3s cubic-bezier(.9,0,.2,1),transform .3s cubic-bezier(.9,0,.2,1);transition:opacity .3s cubic-bezier(.9,0,.2,1),transform .3s cubic-bezier(.9,0,.2,1);transition:opacity .3s cubic-bezier(.9,0,.2,1),transform .3s cubic-bezier(.9,0,.2,1),-webkit-transform .3s cubic-bezier(.9,0,.2,1);opacity:0}.micromag-viewer-shareIncentiveVisible .micromag-viewer-shareIncentive{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);-webkit-transition:opacity .3s cubic-bezier(.25,2,.2,1) .5s,-webkit-transform .3s cubic-bezier(.25,2,.2,1) .5s;transition:opacity .3s cubic-bezier(.25,2,.2,1) .5s,-webkit-transform .3s cubic-bezier(.25,2,.2,1) .5s;-o-transition:opacity .3s cubic-bezier(.25,2,.2,1) .5s,transform .3s cubic-bezier(.25,2,.2,1) .5s;transition:opacity .3s cubic-bezier(.25,2,.2,1) .5s,transform .3s cubic-bezier(.25,2,.2,1) .5s;transition:opacity .3s cubic-bezier(.25,2,.2,1) .5s,transform .3s cubic-bezier(.25,2,.2,1) .5s,-webkit-transform .3s cubic-bezier(.25,2,.2,1) .5s;opacity:1}
+.micromag-viewer-container{font-family:Helvetica,Arial,sans-serif;font-size:16px;font-weight:400;line-height:1.1}.micromag-viewer-container address,.micromag-viewer-container blockquote,.micromag-viewer-container caption,.micromag-viewer-container dl,.micromag-viewer-container figure,.micromag-viewer-container h1,.micromag-viewer-container h2,.micromag-viewer-container h3,.micromag-viewer-container h4,.micromag-viewer-container h5,.micromag-viewer-container h6,.micromag-viewer-container label,.micromag-viewer-container legend,.micromag-viewer-container li,.micromag-viewer-container ol,.micromag-viewer-container p,.micromag-viewer-container pre,.micromag-viewer-container ul{margin:0;padding:0}.micromag-viewer-container *,.micromag-viewer-container :after,.micromag-viewer-container :before{-webkit-box-sizing:border-box;box-sizing:border-box}.micromag-viewer-container h1,.micromag-viewer-container h2,.micromag-viewer-container h3,.micromag-viewer-container h4,.micromag-viewer-container h5,.micromag-viewer-container h6,.micromag-viewer-container li,.micromag-viewer-container p{font-weight:400}.micromag-viewer-menuContainer,.micromag-viewer-menuPreview,.micromag-viewer-menuShare,.micromag-viewer-screenContainer,.micromag-viewer-screensFrame{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-viewer-screenContainer:focus-visible{outline:3px solid #a13dff;outline-offset:4px}.micromag-viewer-container{position:relative;width:100%;height:100%;overflow:hidden;background-color:#1c1c1c;color:#fff}.micromag-viewer-container.micromag-viewer-landscape .micromag-viewer-screensFrame{top:0;bottom:0;left:50%;margin:auto;-webkit-transform:translate(-50%);-ms-transform:translate(-50%);transform:translate(-50%)}.micromag-viewer-container.micromag-viewer-hideMenu .micromag-viewer-menuNavContainer{opacity:0;pointer-events:none}.micromag-viewer-container.micromag-viewer-hideMenu .micromag-viewer-dots,.micromag-viewer-container.micromag-viewer-hideMenu .micromag-viewer-menuTopContainer{opacity:0}.micromag-viewer-content{position:absolute;z-index:1;width:100%;height:100%;overflow:hidden;cursor:-webkit-grab;cursor:grab;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-ms-touch-action:none;touch-action:none}.micromag-viewer-content:active{cursor:-webkit-grabbing;cursor:grabbing}.micromag-viewer-withoutGestures .micromag-viewer-content{cursor:inherit}.micromag-viewer-menuNavContainer{position:absolute;z-index:4;top:0;width:100%;-ms-touch-action:none;touch-action:none;-webkit-transition:opacity .5s cubic-bezier(.6,0,.4,1),background-image .5s cubic-bezier(.6,0,.4,1);-o-transition:opacity .5s cubic-bezier(.6,0,.4,1),background-image .5s cubic-bezier(.6,0,.4,1);transition:opacity .5s cubic-bezier(.6,0,.4,1),background-image .5s cubic-bezier(.6,0,.4,1)}.micromag-viewer-fadeMenu .micromag-viewer-menuNavContainer{opacity:.25}.micromag-viewer-menuNavContainer.micromag-viewer-withShadow{background-image:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,.75)),to(rgba(0,0,0,0)));background-image:-o-linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,0));background-image:linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,0))}.micromag-viewer-fadeMenu .micromag-viewer-menuNavContainer.micromag-viewer-withShadow{background-image:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,0)),to(rgba(0,0,0,0)));background-image:-o-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0));background-image:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0))}.micromag-viewer-menuNavContainer.micromag-viewer-isOpened{opacity:1}.micromag-viewer-menuNavContainer.micromag-viewer-isOpened .micromag-viewer-dots{opacity:0}.micromag-viewer-menuNavContainer.micromag-viewer-isOpened.micromag-viewer-withShadow{background-image:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,.75)),to(rgba(0,0,0,0)));background-image:-o-linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,0));background-image:linear-gradient(rgba(0,0,0,.75),rgba(0,0,0,0))}.micromag-viewer-menuTopContainer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-transition:opacity .2s cubic-bezier(.6,0,.4,1);-o-transition:opacity .2s cubic-bezier(.6,0,.4,1);transition:opacity .2s cubic-bezier(.6,0,.4,1)}.micromag-viewer-menuItem{display:block;width:50%;-ms-touch-action:none;touch-action:none}.micromag-viewer-menuItem:last-child{text-align:right}.micromag-viewer-menuButton{padding:.5rem .75rem;font-size:1rem}.micromag-viewer-slidingButton{display:inline-block}.micromag-viewer-screensMenuButtonToggled{right:0;left:auto}.micromag-viewer-dots{position:relative;z-index:3;top:-.25rem;padding:0 .5rem;-webkit-transition:opacity .3s cubic-bezier(0,.6,.5,1);-o-transition:opacity .3s cubic-bezier(0,.6,.5,1);transition:opacity .3s cubic-bezier(0,.6,.5,1)}.micromag-viewer-hideMenu .micromag-viewer-dots{pointer-events:none}.micromag-viewer-menuContainer{z-index:3;top:0}.micromag-viewer-menuPreview,.micromag-viewer-menuShare{z-index:4}.micromag-viewer-navButton{display:none;visibility:hidden;position:absolute;z-index:3;top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);border:0}.micromag-viewer-navButton.micromag-viewer-previous{left:1.5rem}.micromag-viewer-navButton.micromag-viewer-next{right:1.5rem}@media screen and (min-width:1024px){.micromag-viewer-navButton{display:block;visibility:visible}}.micromag-viewer-screensFrame{z-index:1;-ms-touch-action:none;touch-action:none}.micromag-viewer-screenContainer{display:-webkit-flex;display:-ms-flexbox;display:flex;height:100%;opacity:0}.micromag-viewer-screen{pointer-events:none}.micromag-viewer-current .micromag-viewer-screen{pointer-events:auto}.micromag-viewer-playbackControls{position:absolute;z-index:2;bottom:0;left:0;width:100%;pointer-events:none}.micromag-viewer-arrowHint{position:absolute;top:70%;right:5%}.micromag-viewer-webView{z-index:10}.micromag-viewer-shareIncentiveContainer{position:absolute;z-index:1;top:0;left:10px;width:calc(100% - 20px);pointer-events:none}.micromag-viewer-shareIncentive{display:inline-block;-webkit-transform:translateY(-10px);-ms-transform:translateY(-10px);transform:translateY(-10px);-webkit-transition:opacity .3s cubic-bezier(.9,0,.2,1),-webkit-transform .3s cubic-bezier(.9,0,.2,1);transition:opacity .3s cubic-bezier(.9,0,.2,1),-webkit-transform .3s cubic-bezier(.9,0,.2,1);-o-transition:opacity .3s cubic-bezier(.9,0,.2,1),transform .3s cubic-bezier(.9,0,.2,1);transition:opacity .3s cubic-bezier(.9,0,.2,1),transform .3s cubic-bezier(.9,0,.2,1);transition:opacity .3s cubic-bezier(.9,0,.2,1),transform .3s cubic-bezier(.9,0,.2,1),-webkit-transform .3s cubic-bezier(.9,0,.2,1);opacity:0;pointer-events:auto}.micromag-viewer-shareIncentiveVisible .micromag-viewer-shareIncentive{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);-webkit-transition:opacity .3s cubic-bezier(.25,2,.2,1) .5s,-webkit-transform .3s cubic-bezier(.25,2,.2,1) .5s;transition:opacity .3s cubic-bezier(.25,2,.2,1) .5s,-webkit-transform .3s cubic-bezier(.25,2,.2,1) .5s;-o-transition:opacity .3s cubic-bezier(.25,2,.2,1) .5s,transform .3s cubic-bezier(.25,2,.2,1) .5s;transition:opacity .3s cubic-bezier(.25,2,.2,1) .5s,transform .3s cubic-bezier(.25,2,.2,1) .5s;transition:opacity .3s cubic-bezier(.25,2,.2,1) .5s,transform .3s cubic-bezier(.25,2,.2,1) .5s,-webkit-transform .3s cubic-bezier(.25,2,.2,1) .5s;opacity:1}
 .micromag-viewer-screen-container{position:relative;width:100%;height:100%}.micromag-viewer-screen-inner{-webkit-transition:opacity .3s cubic-bezier(.4,0,.6,1);-o-transition:opacity .3s cubic-bezier(.4,0,.6,1);transition:opacity .3s cubic-bezier(.4,0,.6,1);background-color:#343434}.micromag-viewer-screen-navigationHint{position:absolute;top:50%;right:10%}
 .micromag-viewer-buttons-navigation-button-arrow{width:1rem;height:auto}.micromag-viewer-buttons-navigation-button-next .micromag-viewer-buttons-navigation-button-arrow{-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}.micromag-viewer-buttons-navigation-button-previous .micromag-viewer-buttons-navigation-button-arrow{-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg)}
 @media screen and (min-width:1024px){.micromag-viewer-partials-arrow-hint-container{display:none}}.micromag-viewer-partials-arrow-hint-inner:after{content:"";position:absolute;z-index:1;top:50%;left:50%;width:1000%;height:0;padding-bottom:1000%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-animation-name:micromag-viewer-partials-arrow-hint-shadowFade;animation-name:micromag-viewer-partials-arrow-hint-shadowFade;-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-timing-function:cubic-bezier(.4,0,.6,1);animation-timing-function:cubic-bezier(.4,0,.6,1);-webkit-animation-delay:.1s;animation-delay:.1s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate;background-image:-o-radial-gradient(rgba(28,28,28,.5),rgba(28,28,28,0) 50%);background-image:radial-gradient(rgba(28,28,28,.5),rgba(28,28,28,0) 50%);-webkit-animation-fill-mode:both;animation-fill-mode:both}.micromag-viewer-partials-arrow-hint-arrow{position:relative;z-index:2;width:1.5rem;height:auto;-webkit-animation-name:micromag-viewer-partials-arrow-hint-panX;animation-name:micromag-viewer-partials-arrow-hint-panX;-webkit-animation-duration:.8s;animation-duration:.8s;-webkit-animation-timing-function:cubic-bezier(.4,0,.6,1);animation-timing-function:cubic-bezier(.4,0,.6,1);-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate;-webkit-animation-fill-mode:both;animation-fill-mode:both}@-webkit-keyframes micromag-viewer-partials-arrow-hint-panX{0%{-webkit-transform:translateX(0) rotate(90deg);transform:translateX(0) rotate(90deg)}to{-webkit-transform:translateX(-1rem) rotate(90deg);transform:translateX(-1rem) rotate(90deg)}}@keyframes micromag-viewer-partials-arrow-hint-panX{0%{-webkit-transform:translateX(0) rotate(90deg);transform:translateX(0) rotate(90deg)}to{-webkit-transform:translateX(-1rem) rotate(90deg);transform:translateX(-1rem) rotate(90deg)}}@-webkit-keyframes micromag-viewer-partials-arrow-hint-shadowFade{0%{-webkit-transform:translate(-50%,-50%) translateY(0) scale(.75);transform:translate(-50%,-50%) translateY(0) scale(.75)}to{-webkit-transform:translate(-50%,-50%) translateX(-1rem) scale(1.25);transform:translate(-50%,-50%) translateX(-1rem) scale(1.25)}}@keyframes micromag-viewer-partials-arrow-hint-shadowFade{0%{-webkit-transform:translate(-50%,-50%) translateY(0) scale(.75);transform:translate(-50%,-50%) translateY(0) scale(.75)}to{-webkit-transform:translate(-50%,-50%) translateX(-1rem) scale(1.25);transform:translate(-50%,-50%) translateX(-1rem) scale(1.25)}}

package/es/index.js

@@ -2430,6 +2430,7 @@ var DRAG_PROGRESS_ACTIVATION_THRESHOLD = 0.3;
 var DRAG_VELOCITY_ACTIVATION_THRESHOLD = 0.3;
 var DEFAULT_TRANSITION_TYPE_LANDSCAPE = 'carousel';
 var DEFAULT_TRANSITION_TYPE_PORTRAIT = 'stack';
+var SHARE_INCENTIVE_TIMEOUT = 6000;
 var propTypes$2 = {
   story: PropTypes$1.story,
   // .isRequired,
@@ -2951,6 +2952,11 @@ var Viewer = function Viewer(_ref) {
       currentShareIncentive = _useState4[0],
       setCurrentShareIncentive = _useState4[1];
 
+  var _useState5 = useState(false),
+      _useState6 = _slicedToArray(_useState5, 2),
+      shareIncentiveVisible = _useState6[0],
+      setShareIncentiveVisible = _useState6[1];
+
   var _ref15 = currentScreen || {},
       _ref15$shareIncentive = _ref15.shareIncentive,
       shareIncentive = _ref15$shareIncentive === void 0 ? null : _ref15$shareIncentive;
@@ -2974,10 +2980,21 @@ var Viewer = function Viewer(_ref) {
       currentIncentiveLabel = _ref19$body === void 0 ? null : _ref19$body;
 
   useEffect(function () {
-    if (shareIncentive !== null && shareIncentiveLabel !== currentShareIncentiveLabel) {
+    setShareIncentiveVisible(true);
+
+    if (hasShareIncentive && shareIncentiveLabel !== currentShareIncentiveLabel) {
       setCurrentShareIncentive(shareIncentive);
     }
-  }, [incentiveLabel, currentIncentiveLabel, shareIncentive]);
+
+    var timeout = setTimeout(function () {
+      if (isView) {
+        setShareIncentiveVisible(false);
+      }
+    }, SHARE_INCENTIVE_TIMEOUT);
+    return function () {
+      clearTimeout(timeout);
+    };
+  }, [shareIncentiveLabel, setShareIncentiveVisible, hasShareIncentive, incentiveLabel, currentIncentiveLabel, setCurrentShareIncentive, isView]);
   return /*#__PURE__*/React.createElement(StoryProvider, {
     story: parsedStory
   }, /*#__PURE__*/React.createElement(ScreenSizeProvider, {
@@ -3074,7 +3091,7 @@ var Viewer = function Viewer(_ref) {
   })) : null, withNavigationHint && !withNeighborScreens && screenIndex === 0 && !hasInteracted ? /*#__PURE__*/React.createElement(ArrowHint, {
     className: styles$6.arrowHint
   }) : null) : null, /*#__PURE__*/React.createElement("div", {
-    className: classNames([styles$6.shareIncentiveContainer, _defineProperty({}, styles$6.shareIncentiveVisible, hasShareIncentive)]),
+    className: classNames([styles$6.shareIncentiveContainer, _defineProperty({}, styles$6.shareIncentiveVisible, hasShareIncentive && shareIncentiveVisible)]),
     style: {
       top: isEditor ? 10 : menuDotsContainerHeight - 10
     }

package/lib/index.js

@@ -2450,6 +2450,7 @@ var DRAG_PROGRESS_ACTIVATION_THRESHOLD = 0.3;
 var DRAG_VELOCITY_ACTIVATION_THRESHOLD = 0.3;
 var DEFAULT_TRANSITION_TYPE_LANDSCAPE = 'carousel';
 var DEFAULT_TRANSITION_TYPE_PORTRAIT = 'stack';
+var SHARE_INCENTIVE_TIMEOUT = 6000;
 var propTypes$2 = {
   story: core.PropTypes.story,
   // .isRequired,
@@ -2971,6 +2972,11 @@ var Viewer = function Viewer(_ref) {
       currentShareIncentive = _useState4[0],
       setCurrentShareIncentive = _useState4[1];
 
+  var _useState5 = React.useState(false),
+      _useState6 = _slicedToArray__default["default"](_useState5, 2),
+      shareIncentiveVisible = _useState6[0],
+      setShareIncentiveVisible = _useState6[1];
+
   var _ref15 = currentScreen || {},
       _ref15$shareIncentive = _ref15.shareIncentive,
       shareIncentive = _ref15$shareIncentive === void 0 ? null : _ref15$shareIncentive;
@@ -2994,10 +3000,21 @@ var Viewer = function Viewer(_ref) {
       currentIncentiveLabel = _ref19$body === void 0 ? null : _ref19$body;
 
   React.useEffect(function () {
-    if (shareIncentive !== null && shareIncentiveLabel !== currentShareIncentiveLabel) {
+    setShareIncentiveVisible(true);
+
+    if (hasShareIncentive && shareIncentiveLabel !== currentShareIncentiveLabel) {
       setCurrentShareIncentive(shareIncentive);
     }
-  }, [incentiveLabel, currentIncentiveLabel, shareIncentive]);
+
+    var timeout = setTimeout(function () {
+      if (isView) {
+        setShareIncentiveVisible(false);
+      }
+    }, SHARE_INCENTIVE_TIMEOUT);
+    return function () {
+      clearTimeout(timeout);
+    };
+  }, [shareIncentiveLabel, setShareIncentiveVisible, hasShareIncentive, incentiveLabel, currentIncentiveLabel, setCurrentShareIncentive, isView]);
   return /*#__PURE__*/React__default["default"].createElement(contexts.StoryProvider, {
     story: parsedStory
   }, /*#__PURE__*/React__default["default"].createElement(contexts.ScreenSizeProvider, {
@@ -3094,7 +3111,7 @@ var Viewer = function Viewer(_ref) {
   })) : null, withNavigationHint && !withNeighborScreens && screenIndex === 0 && !hasInteracted ? /*#__PURE__*/React__default["default"].createElement(ArrowHint, {
     className: styles$6.arrowHint
   }) : null) : null, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: classNames__default["default"]([styles$6.shareIncentiveContainer, _defineProperty__default["default"]({}, styles$6.shareIncentiveVisible, hasShareIncentive)]),
+    className: classNames__default["default"]([styles$6.shareIncentiveContainer, _defineProperty__default["default"]({}, styles$6.shareIncentiveVisible, hasShareIncentive && shareIncentiveVisible)]),
     style: {
       top: isEditor ? 10 : menuDotsContainerHeight - 10
     }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/viewer",
-    "version": "0.3.307",
+    "version": "0.3.308",
     "description": "",
     "keywords": [
         "javascript"
@@ -63,10 +63,10 @@
         "@micromag/element-scroll": "^0.3.307",
         "@micromag/element-share-options": "^0.3.307",
         "@micromag/element-webview": "^0.3.307",
-        "@micromag/elements": "^0.3.307",
+        "@micromag/elements": "^0.3.308",
         "@micromag/fields": "^0.3.307",
         "@micromag/intl": "^0.3.307",
-        "@micromag/screens": "^0.3.307",
+        "@micromag/screens": "^0.3.308",
         "@react-spring/core": "^9.1.1",
         "@react-spring/web": "^9.1.1",
         "@use-gesture/react": "^10.2.4",
@@ -85,5 +85,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "cdc815b7aebe1b9ae8741e1956e21780def64caf"
+    "gitHead": "20027b12d7b8d33d0a78995641de71aae4c26376"
 }