@micromag/viewer 0.2.401 → 0.2.403

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/assets/css/styles.css +1 -1
  2. package/es/index.js +65 -65
  3. package/lib/index.js +67 -67
  4. package/package.json +11 -13
  5. package/scss/styles.scss +1 -1
package/assets/css/styles.css CHANGED
@@ -1,8 +1,8 @@
1
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 .micromag-viewer-menuPreview,.micromag-viewer-container .micromag-viewer-menuPreviewContainer,.micromag-viewer-container .micromag-viewer-screen,.micromag-viewer-container .micromag-viewer-screenInner{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-viewer-container .micromag-viewer-screen:focus-visible{outline:3px solid #a13dff}.micromag-viewer-container{background-color:#1c1c1c;color:#fff}.micromag-viewer-container,.micromag-viewer-container .micromag-viewer-content{position:relative;width:100%;height:100%;overflow:hidden}.micromag-viewer-container .micromag-viewer-content{z-index:1;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.micromag-viewer-container .micromag-viewer-menuDotsContainer{-ms-touch-action:none;touch-action:none;visibility:hidden;position:absolute;z-index:2;top:0;right:50%;width:100%;-webkit-transform:translateX(50%);-ms-transform:translateX(50%);transform:translateX(50%)}.micromag-viewer-container .micromag-viewer-menuDots{position:relative;padding:8px 10px;-webkit-transition:opacity .25s ease;-o-transition:opacity .25s ease;transition:opacity .25s ease}.micromag-viewer-container .micromag-viewer-menuPreviewContainer{visibility:hidden;z-index:3;top:-100%}.micromag-viewer-container .micromag-viewer-menuPreview{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%)}.micromag-viewer-container .micromag-viewer-screen{display:-webkit-flex;display:-ms-flexbox;display:flex;opacity:0}.micromag-viewer-container .micromag-viewer-screen.micromag-viewer-current{opacity:1}.micromag-viewer-container.micromag-viewer-landscape .micromag-viewer-screen{top:0;right:auto;bottom:0;left:50%;margin:auto;-webkit-transition:opacity .3s ease,-webkit-transform .3s ease;transition:opacity .3s ease,-webkit-transform .3s ease;-o-transition:transform .3s ease,opacity .3s ease;transition:transform .3s ease,opacity .3s ease;transition:transform .3s ease,opacity .3s ease,-webkit-transform .3s ease;opacity:.2;cursor:pointer}.micromag-viewer-container.micromag-viewer-landscape .micromag-viewer-screen:focus-visible,.micromag-viewer-container.micromag-viewer-landscape .micromag-viewer-screen:hover{opacity:.3}.micromag-viewer-container.micromag-viewer-landscape .micromag-viewer-screen.micromag-viewer-current{opacity:1;cursor:auto}.micromag-viewer-container.micromag-viewer-hideMenu:not(.micromag-viewer-landscape) .micromag-viewer-menuDotsContainer{pointer-events:none}.micromag-viewer-container.micromag-viewer-hideMenu:not(.micromag-viewer-landscape) .micromag-viewer-menuDots{opacity:0}.micromag-viewer-container.micromag-viewer-ready .micromag-viewer-menuDotsContainer,.micromag-viewer-container.micromag-viewer-ready .micromag-viewer-menuPreviewContainer{visibility:visible}
2
2
  .micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-closeButton,.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-item .micromag-viewer-menus-menu-dots-button,.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-menuButton{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-menuButton{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-closeButton:focus-visible,.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-menuButton:focus-visible{outline:3px solid #a13dff}.micromag-viewer-menus-menu-dots-container{position:relative}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-item,.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-items{margin:0;padding:0;list-style:none}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-items{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;width:100%}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-item{-webkit-flex:1 1;-ms-flex:1 1;flex:1 1}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-item .micromag-viewer-menus-menu-dots-button{display:block;width:100%;padding:10px 2px}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-item .micromag-viewer-menus-menu-dots-dot{display:block;width:100%;height:2px;border-radius:2px}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-item:last-child{margin-right:0}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-menu{display:-webkit-flex;display:-ms-flexbox;display:flex;position:relative;-webkit-box-sizing:content-box;box-sizing:content-box;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;width:16px;height:16px;padding-left:10px}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-menuIcon{display:block;height:100%}.micromag-viewer-menus-menu-dots-container .micromag-viewer-menus-menu-dots-closeButton{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;padding-left:10px;font-size:26px}.micromag-viewer-menus-menu-dots-container.micromag-viewer-menus-menu-dots-vertical{background:rgba(0,0,0,0)}.micromag-viewer-menus-menu-dots-container.micromag-viewer-menus-menu-dots-vertical,.micromag-viewer-menus-menu-dots-container.micromag-viewer-menus-menu-dots-vertical .micromag-viewer-menus-menu-dots-items{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.micromag-viewer-menus-menu-dots-container.micromag-viewer-menus-menu-dots-vertical .micromag-viewer-menus-menu-dots-items{width:auto;height:100%}.micromag-viewer-menus-menu-dots-container.micromag-viewer-menus-menu-dots-vertical .micromag-viewer-menus-menu-dots-item .micromag-viewer-menus-menu-dots-button{width:auto;height:100%;padding:2px 10px}.micromag-viewer-menus-menu-dots-container.micromag-viewer-menus-menu-dots-vertical .micromag-viewer-menus-menu-dots-item .micromag-viewer-menus-menu-dots-dot{width:2px;height:100%}.micromag-viewer-menus-menu-dots-container.micromag-viewer-menus-menu-dots-vertical .micromag-viewer-menus-menu-dots-menu{position:absolute;top:10px;right:10px;padding-left:0}.micromag-viewer-menus-menu-dots-container.micromag-viewer-menus-menu-dots-withShadow{background:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.4)),to(rgba(0,0,0,0)));background:-o-linear-gradient(rgba(0,0,0,.4),rgba(0,0,0,0));background:linear-gradient(rgba(0,0,0,.4),rgba(0,0,0,0))}
3
3
 
4
+ .micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenButton{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-activeScreenBorder,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-itemContent,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenButton,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-scroll{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-button:focus-visible,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-shareButton:focus-visible{outline:3px solid #a13dff}.micromag-viewer-menus-menu-preview-container{display:-webkit-flex;display:-ms-flexbox;display:flex;position:relative;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;height:100%;padding:10px;background-color:#000;background-repeat:no-repeat;background-position:50%;background-size:cover;color:#fff}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenButton{display:block}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenButton:focus-visible{border:4px solid #a13dff;outline: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-container .micromag-viewer-menus-menu-preview-header{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;margin-bottom:20px}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-button,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-shareButton{display:inline-block;border:0;border-radius:0;background-color:rgba(0,0,0,0);color:inherit;font-size:.9rem;font-weight:600;line-height:1.4;text-align:center;vertical-align:middle;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-button{width:20px;margin-left:10px;padding:0}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-button:first-child{margin-left:0}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-shareButton{z-index:1}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-icon{display:block;width:100%;height:100%}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-buttons{display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.micromag-viewer-menus-menu-preview-container .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-container .micromag-viewer-menus-menu-preview-title{margin-right:auto;color:#fff;font-family:Helvetica,Arial,sans-serif}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-content,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-nav{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-nav{overflow:hidden}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-item,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-items{margin:0;padding:0;list-style:none}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-items{display:-webkit-flex;display:-ms-flexbox;display:flex;position:relative;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-item{position:relative;height:0}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-item.micromag-viewer-menus-menu-preview-active .micromag-viewer-menus-menu-preview-screenButton{pointer-events:none}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-itemContent{padding:2px}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenContainer{position:relative;height:100%}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-activeScreenBorder{border:2px solid #fff}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenContent{-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top;background-color:#2b2b2b}
4
5
  .micromag-viewer-partials-share-modal-container{pointer-events:none}.micromag-viewer-partials-share-modal-container .micromag-viewer-partials-share-modal-content{padding:5px;-webkit-transform:scale(.8);-ms-transform:scale(.8);transform:scale(.8);-webkit-transform-origin:center top;-ms-transform-origin:center top;transform-origin:center top;-webkit-transition:all .2s ease;-o-transition:all .2s ease;transition:all .2s ease;border-radius:10px;opacity:0;background-color:#fff}.micromag-viewer-partials-share-modal-container .micromag-viewer-partials-share-modal-content:before{content:"";position:absolute;bottom:100%;left:50%;width:0;height:0;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);border-right:8px solid rgba(0,0,0,0);border-bottom:8px solid #fff;border-left:8px solid rgba(0,0,0,0)}.micromag-viewer-partials-share-modal-container button{display:block;margin:5px}.micromag-viewer-partials-share-modal-container.micromag-viewer-partials-share-modal-opened{pointer-events:auto}.micromag-viewer-partials-share-modal-container.micromag-viewer-partials-share-modal-opened .micromag-viewer-partials-share-modal-content{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);opacity:1}
5
6
  .micromag-viewer-partials-share-button-container{position:relative;white-space:nowrap}.micromag-viewer-partials-share-button-container .micromag-viewer-partials-share-button-shareModal{position:absolute;top:100%;right:50%;margin-top:15px;-webkit-transform:translateX(50%);-ms-transform:translateX(50%);transform:translateX(50%)}
6
- .micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenButton{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-activeScreenBorder,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-itemContent,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenButton,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-scroll{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-button:focus-visible,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-shareButton:focus-visible{outline:3px solid #a13dff}.micromag-viewer-menus-menu-preview-container{display:-webkit-flex;display:-ms-flexbox;display:flex;position:relative;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;height:100%;padding:10px;background-color:#000;background-repeat:no-repeat;background-position:50%;background-size:cover;color:#fff}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenButton{display:block}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenButton:focus-visible{border:4px solid #a13dff;outline: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-container .micromag-viewer-menus-menu-preview-header{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;margin-bottom:20px}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-button,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-shareButton{display:inline-block;border:0;border-radius:0;background-color:rgba(0,0,0,0);color:inherit;font-size:.9rem;font-weight:600;line-height:1.4;text-align:center;vertical-align:middle;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-button{width:20px;margin-left:10px;padding:0}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-button:first-child{margin-left:0}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-shareButton{z-index:1}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-header .micromag-viewer-menus-menu-preview-icon{display:block;width:100%;height:100%}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-buttons{display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.micromag-viewer-menus-menu-preview-container .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-container .micromag-viewer-menus-menu-preview-title{margin-right:auto;color:#fff;font-family:Helvetica,Arial,sans-serif}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-content,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-nav{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-nav{overflow:hidden}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-item,.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-items{margin:0;padding:0;list-style:none}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-items{display:-webkit-flex;display:-ms-flexbox;display:flex;position:relative;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-item{position:relative;height:0}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-item.micromag-viewer-menus-menu-preview-active .micromag-viewer-menus-menu-preview-screenButton{pointer-events:none}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-itemContent{padding:2px}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenContainer{position:relative;height:100%}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-activeScreenBorder{border:2px solid #fff}.micromag-viewer-menus-menu-preview-container .micromag-viewer-menus-menu-preview-screenContent{-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top;background-color:#2b2b2b}
7
7
  .micromag-viewer-screen-container{position:relative;height:100%;pointer-events:none}.micromag-viewer-screen-container.micromag-viewer-screen-current{pointer-events:auto}
8
8
  .micromag-screen-audio-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-audio-disabled.micromag-screen-audio-container{overflow:hidden;pointer-events:none}.micromag-screen-audio-hidden.micromag-screen-audio-container{display:none;visibility:hidden}.micromag-screen-audio-placeholder.micromag-screen-audio-container .micromag-screen-audio-content{position:relative;padding:6px}.micromag-screen-audio-container .micromag-screen-audio-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-audio-container .micromag-screen-audio-mediaControls{padding:10px 20px 0}.micromag-screen-audio-container .micromag-screen-audio-audio{position:absolute;bottom:50%;left:0;width:100%;-webkit-transform:translateY(50%);-ms-transform:translateY(50%);transform:translateY(50%)}.micromag-screen-audio-container .micromag-screen-audio-bottomContent{position:relative}.micromag-screen-audio-container .micromag-screen-audio-empty{width:100%;height:100px;margin:0 auto}.micromag-screen-audio-container.micromag-screen-audio-isPreview{pointer-events:none}.micromag-screen-contribution-container .micromag-screen-contribution-content{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-contribution-container .micromag-screen-contribution-buttonSubmit:focus-visible{outline:3px solid #a13dff}.micromag-screen-contribution-container{position:relative}@-webkit-keyframes micromag-screen-contribution-rotate{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes micromag-screen-contribution-rotate{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.micromag-screen-contribution-container .micromag-screen-contribution-emptyInputMessage,.micromag-screen-contribution-container .micromag-screen-contribution-emptyInputName,.micromag-screen-contribution-container .micromag-screen-contribution-emptySubmit,.micromag-screen-contribution-container .micromag-screen-contribution-emptyTitle{margin-bottom:10px;padding:10px}.micromag-screen-contribution-container .micromag-screen-contribution-emptyInputMessage{height:100px}.micromag-screen-contribution-container .micromag-screen-contribution-title{padding-bottom:20px}.micromag-screen-contribution-container .micromag-screen-contribution-interactiveContainer{-webkit-transition-property:height;-o-transition-property:height;transition-property:height;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}.micromag-screen-contribution-container .micromag-screen-contribution-form{position:relative}.micromag-screen-contribution-container .micromag-screen-contribution-buttonSubmit,.micromag-screen-contribution-container .micromag-screen-contribution-inputMessage,.micromag-screen-contribution-container .micromag-screen-contribution-inputName{display:block;width:100%;padding:4px}.micromag-screen-contribution-container .micromag-screen-contribution-inputMessage,.micromag-screen-contribution-container .micromag-screen-contribution-inputName{margin-bottom:10px}.micromag-screen-contribution-container .micromag-screen-contribution-inputMessage{height:100px}.micromag-screen-contribution-container .micromag-screen-contribution-buttonSubmit{border:0}.micromag-screen-contribution-container .micromag-screen-contribution-buttonSubmit:disabled{opacity:1}.micromag-screen-contribution-container .micromag-screen-contribution-formContent{-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}.micromag-screen-contribution-container .micromag-screen-contribution-formLoading{position:absolute;top:50%;left:50%;width:40px;height:40px;margin-top:-20px;margin-left:-20px;-webkit-transition:opacity .25s ease;-o-transition:opacity .25s ease;transition:opacity .25s ease;-webkit-animation:micromag-screen-contribution-rotate 1s linear infinite;animation:micromag-screen-contribution-rotate 1s linear infinite;opacity:0;pointer-events:none}.micromag-screen-contribution-container .micromag-screen-contribution-formLoading .micromag-screen-contribution-loadingIcon{display:block;width:100%;height:100%}.micromag-screen-contribution-container .micromag-screen-contribution-contributionsContainer{position:relative;-webkit-transition:opacity .25s ease;-o-transition:opacity .25s ease;transition:opacity .25s ease;opacity:0}.micromag-screen-contribution-container .micromag-screen-contribution-contributionsContent{position:absolute;width:100%;height:0;overflow:hidden}.micromag-screen-contribution-container .micromag-screen-contribution-contributions{position:relative}.micromag-screen-contribution-container .micromag-screen-contribution-contribution{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid #fff}.micromag-screen-contribution-container .micromag-screen-contribution-contribution:first-child{padding-top:20px;border-top:1px solid #fff}.micromag-screen-contribution-container .micromag-screen-contribution-contribution:last-child{margin-bottom:0;padding-bottom:0;border-bottom:0}.micromag-screen-contribution-container .micromag-screen-contribution-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-contribution-container.micromag-screen-contribution-submitting .micromag-screen-contribution-form{pointer-events:none}.micromag-screen-contribution-container.micromag-screen-contribution-submitting .micromag-screen-contribution-formContent{opacity:.4}.micromag-screen-contribution-container.micromag-screen-contribution-submitting .micromag-screen-contribution-formLoading{opacity:1}.micromag-screen-contribution-container.micromag-screen-contribution-submitted .micromag-screen-contribution-formContent{opacity:0}.micromag-screen-contribution-container.micromag-screen-contribution-showContributions .micromag-screen-contribution-form{display:none}.micromag-screen-contribution-container.micromag-screen-contribution-showContributions .micromag-screen-contribution-contributionsContainer{opacity:1}.micromag-screen-contribution-container.micromag-screen-contribution-showContributions .micromag-screen-contribution-contributionsContent{position:relative;height:auto;overflow:visible}.micromag-screen-contribution-container.micromag-screen-contribution-isPlaceholder .micromag-screen-contribution-content{padding:10px}.micromag-screen-conversation-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-conversation-disabled.micromag-screen-conversation-container{overflow:hidden;pointer-events:none}.micromag-screen-conversation-hidden.micromag-screen-conversation-container{display:none;visibility:hidden}.micromag-screen-conversation-placeholder.micromag-screen-conversation-container .micromag-screen-conversation-content{position:relative;padding:6px}.micromag-screen-conversation-container{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}.micromag-screen-conversation-container .micromag-screen-conversation-conversationHeader{width:100%;padding-bottom:16px;font-style:italic}.micromag-screen-conversation-container .micromag-screen-conversation-empty{height:200px}.micromag-screen-conversation-container .micromag-screen-conversation-title{padding-bottom:16px}.micromag-screen-conversation-container .micromag-screen-conversation-callToAction a{padding:0}.micromag-screen-conversation-messageContainer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;color:#000}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-message{max-width:80%;margin:1px 0;padding:10px;-webkit-transition:border-radius .2s ease;-o-transition:border-radius .2s ease;transition:border-radius .2s ease;background-color:#fff;overflow-wrap:break-word}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-message.micromag-screen-conversation-normalLeft{border-radius:1px 15px 15px}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-message.micromag-screen-conversation-inBetweenLeft{border-radius:1px 15px 15px 1px}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-message.micromag-screen-conversation-normalRight{border-radius:15px 1px 15px 15px;background-color:#58afff}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-message.micromag-screen-conversation-inBetweenRight{border-radius:15px 1px 1px 15px;background-color:#58afff}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-message.micromag-screen-conversation-last{margin:1px 0 16px}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-speakerDetails{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;width:100%;padding-bottom:10px}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-speakerDetails.micromag-screen-conversation-right{-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-avatarContainer{width:30px;height:30px;margin-right:10px}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-avatarContainer.micromag-screen-conversation-right{margin-right:0;margin-left:10px}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-avatar{display:inline-block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:50%}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-imageContainer{width:100%;height:100%;padding-bottom:10px}.micromag-screen-conversation-messageContainer.micromag-screen-conversation-withAnimation .micromag-screen-conversation-message{-webkit-animation:micromag-screen-conversation-appear .18s ease forwards;animation:micromag-screen-conversation-appear .18s ease forwards}.micromag-screen-conversation-messageContainer.micromag-screen-conversation-withAnimation .micromag-screen-conversation-message.micromag-screen-conversation-normalLeft{-webkit-transform:translate(-300px) scale(.5);-ms-transform:translate(-300px) scale(.5);transform:translate(-300px) scale(.5)}.micromag-screen-conversation-messageContainer.micromag-screen-conversation-withAnimation .micromag-screen-conversation-message.micromag-screen-conversation-inBetweenLeft{border-radius:1px 15px 15px 1px}.micromag-screen-conversation-messageContainer.micromag-screen-conversation-withAnimation .micromag-screen-conversation-message.micromag-screen-conversation-normalRight{-webkit-transform:translate(300px) scale(.5);-ms-transform:translate(300px) scale(.5);transform:translate(300px) scale(.5)}@-webkit-keyframes micromag-screen-conversation-appear{to{-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}}@keyframes micromag-screen-conversation-appear{to{-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-loadingContainer{display:-webkit-flex;display:-ms-flexbox;display:flex;color:#fff}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-loading,.micromag-screen-conversation-messageContainer .micromag-screen-conversation-loadingContainer{-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-loading{display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;margin:5px 0 10px;padding:7px 10px;border-radius:10px;background:#fff}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-loading .micromag-screen-conversation-dot{width:5px;height:5px;margin-right:4px;-webkit-animation:micromag-screen-conversation-bounce .35s linear infinite alternate;animation:micromag-screen-conversation-bounce .35s linear infinite alternate;border-radius:50%;background:#000}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-loading .micromag-screen-conversation-dot:nth-child(2){-webkit-animation-delay:.08s;animation-delay:.08s}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-loading .micromag-screen-conversation-dot:nth-child(3){margin-right:0;-webkit-animation-delay:.16s;animation-delay:.16s}@-webkit-keyframes micromag-screen-conversation-bounce{0%{-webkit-transform:translateY(-2px);transform:translateY(-2px);opacity:.5}to{-webkit-transform:translateY(2px);transform:translateY(2px);opacity:1}}@keyframes micromag-screen-conversation-bounce{0%{-webkit-transform:translateY(-2px);transform:translateY(-2px);opacity:.5}to{-webkit-transform:translateY(2px);transform:translateY(2px);opacity:1}}.micromag-screen-conversation-messageContainer .micromag-screen-conversation-loadingSpeakerName{margin:0 5px;opacity:.6;font-size:12px;font-style:italic}.micromag-screen-conversation-messageContainer.micromag-screen-conversation-right{-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end}.micromag-screen-conversation-messageContainer.micromag-screen-conversation-right .micromag-screen-conversation-loadingContainer{-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.micromag-screen-gallery-container .micromag-screen-gallery-content,.micromag-screen-gallery-container .micromag-screen-gallery-image{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-gallery-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-gallery-disabled.micromag-screen-gallery-container{overflow:hidden;pointer-events:none}.micromag-screen-gallery-hidden.micromag-screen-gallery-container{display:none;visibility:hidden}.micromag-screen-gallery-placeholder.micromag-screen-gallery-container .micromag-screen-gallery-content{position:relative;padding:6px}.micromag-screen-gallery-container .micromag-screen-gallery-emptyCaption,.micromag-screen-gallery-container .micromag-screen-gallery-emptyImage{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-gallery-container .micromag-screen-gallery-grid{position:relative;height:100%}.micromag-screen-gallery-container .micromag-screen-gallery-placeholder{height:100%}.micromag-screen-gallery-container .micromag-screen-gallery-emptyCaption,.micromag-screen-gallery-container .micromag-screen-gallery-emptyImage{width:100%}.micromag-screen-gallery-container .micromag-screen-gallery-emptyImage{height:100%}.micromag-screen-gallery-container .micromag-screen-gallery-emptyCaption{height:50px;margin-top:10px}.micromag-screen-gallery-container .micromag-screen-gallery-gridItem{display:-webkit-flex;display:-ms-flexbox;display:flex;position:relative;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;height:100%}.micromag-screen-gallery-container .micromag-screen-gallery-imageContainer{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.micromag-screen-gallery-container .micromag-screen-gallery-caption{padding:10px 0}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyCaption,.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyImage{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-gallery-feed-container{position:relative}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyCaption,.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyImage{width:100%;margin:10px auto}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyImage{height:200px}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-emptyCaption{height:50px}.micromag-screen-gallery-feed-container .micromag-screen-gallery-feed-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-gallery-feed-container.micromag-screen-gallery-feed-isPlaceholder .micromag-screen-gallery-feed-layout{padding:10px}.micromag-screen-image-container .micromag-screen-image-image{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-image-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-image-disabled.micromag-screen-image-container{overflow:hidden;pointer-events:none}.micromag-screen-image-hidden.micromag-screen-image-container{display:none;visibility:hidden}.micromag-screen-image-placeholder.micromag-screen-image-container .micromag-screen-image-content{position:relative;padding:6px}.micromag-screen-image-container .micromag-screen-image-emptyImage,.micromag-screen-image-container .micromag-screen-image-emptyLegend,.micromag-screen-image-container .micromag-screen-image-emptyText,.micromag-screen-image-container .micromag-screen-image-emptyTitle{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-image-container .micromag-screen-image-content{position:relative;height:100%}.micromag-screen-image-container .micromag-screen-image-emptyImage,.micromag-screen-image-container .micromag-screen-image-emptyLegend,.micromag-screen-image-container .micromag-screen-image-emptyText,.micromag-screen-image-container .micromag-screen-image-emptyTitle{width:100%;margin:10px auto}.micromag-screen-image-container .micromag-screen-image-emptyImage{height:100%}.micromag-screen-image-container .micromag-screen-image-emptyTitle{height:100px}.micromag-screen-image-container .micromag-screen-image-emptyText{height:80px}.micromag-screen-image-container .micromag-screen-image-emptyLegend{height:50px}.micromag-screen-image-container .micromag-screen-image-imageContainer{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.micromag-screen-image-container .micromag-screen-image-placeholderImage{height:100%}.micromag-screen-image-container .micromag-screen-image-callToAction{margin-top:-10px}.micromag-screen-image-container.micromag-screen-image-isPlaceholder .micromag-screen-image-layout{padding:10px}.micromag-screen-image-container.micromag-screen-image-isCard .micromag-screen-image-placeholderImage{margin:-10px -10px 0}.micromag-screen-image-container.micromag-screen-image-isCardReverse .micromag-screen-image-placeholderImage{margin:10px -10px 0}.micromag-screen-image-container.micromag-screen-image-isCardReverse .micromag-screen-image-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-image-container.micromag-screen-image-isFullscreen .micromag-screen-image-layout{padding:0}.micromag-screen-image-container.micromag-screen-image-isFullscreen .micromag-screen-image-callToAction{position:absolute;bottom:10px;width:100%;margin-top:0}.micromag-screen-map-container .micromag-screen-map-markerOverlayContainer,.micromag-screen-map-container .micromag-screen-map-markerOverlayScrollable,.micromag-screen-map-container .micromag-screen-map-splash{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-map-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-map-disabled.micromag-screen-map-container{overflow:hidden;pointer-events:none}.micromag-screen-map-hidden.micromag-screen-map-container{display:none;visibility:hidden}.micromag-screen-map-placeholder.micromag-screen-map-container .micromag-screen-map-content{position:relative;padding:6px}.micromag-screen-map-container .micromag-screen-map-placeholder{height:100%}.micromag-screen-map-container .micromag-screen-map-markerOverlayContainer{-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease;opacity:0;background-color:rgba(28,28,28,.4);pointer-events:none}.micromag-screen-map-container .micromag-screen-map-markerOverlaySafe{display:block;width:100%}.micromag-screen-map-container .micromag-screen-map-markerOverlay{width:100%;overflow:hidden}.micromag-screen-map-container .micromag-screen-map-markerOverlay,.micromag-screen-map-container .micromag-screen-map-markerOverlayContent{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.micromag-screen-map-container .micromag-screen-map-markerOverlayContent{position:relative;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;padding:0 20px;-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);-webkit-transition:-webkit-transform .3s ease;transition:-webkit-transform .3s ease;-o-transition:transform .3s ease;transition:transform .3s ease;transition:transform .3s ease,-webkit-transform .3s ease;background-color:#fff}.micromag-screen-map-container .micromag-screen-map-markerOverlayContentInner{color:#1c1c1c}.micromag-screen-map-container .micromag-screen-map-swipeIndicator{width:30px;margin:10px auto;border:2px solid #adadad;border-radius:2px}.micromag-screen-map-container .micromag-screen-map-splash{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;padding:20px;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease;background-color:rgba(28,28,28,.75)}.micromag-screen-map-container .micromag-screen-map-splash .micromag-screen-map-description,.micromag-screen-map-container .micromag-screen-map-splash .micromag-screen-map-title{margin:10px 0}.micromag-screen-map-container .micromag-screen-map-splash .micromag-screen-map-button{display:inline-block}.micromag-screen-map-container .micromag-screen-map-splash .micromag-screen-map-emptyButton,.micromag-screen-map-container .micromag-screen-map-splash .micromag-screen-map-emptyDescription,.micromag-screen-map-container .micromag-screen-map-splash .micromag-screen-map-emptyTitle{width:100%;margin:5px auto}.micromag-screen-map-container .micromag-screen-map-splash .micromag-screen-map-emptyTitle{height:50px}.micromag-screen-map-container .micromag-screen-map-splash .micromag-screen-map-emptyDescription{height:80px}.micromag-screen-map-container .micromag-screen-map-splash .micromag-screen-map-emptyButton{height:70px}.micromag-screen-map-container .micromag-screen-map-splashButton{margin-top:10px}.micromag-screen-map-container .micromag-screen-map-closeButton{display:block;position:absolute;top:20px;right:20px;width:44px;height:44px;padding:0;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease;border-radius:50%;opacity:0;background-color:rgba(43,43,43,.8);font-size:30px;line-height:0;text-align:center;pointer-events:none}.micromag-screen-map-container .micromag-screen-map-markerDescription,.micromag-screen-map-container .micromag-screen-map-markerImage,.micromag-screen-map-container .micromag-screen-map-markerSubtitle,.micromag-screen-map-container .micromag-screen-map-markerTitle{margin-bottom:20px}.micromag-screen-map-container.micromag-screen-map-hasSelectedMarker .micromag-screen-map-markerOverlayContainer{opacity:1;pointer-events:auto}.micromag-screen-map-container.micromag-screen-map-hasSelectedMarker .micromag-screen-map-markerOverlayContent{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}.micromag-screen-map-container.micromag-screen-map-opened .micromag-screen-map-splash{opacity:0;pointer-events:none}.micromag-screen-map-container.micromag-screen-map-opened .micromag-screen-map-closeButton{opacity:1;pointer-events:all}.micromag-screen-quiz-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-quiz-disabled.micromag-screen-quiz-container{overflow:hidden;pointer-events:none}.micromag-screen-quiz-hidden.micromag-screen-quiz-container{display:none;visibility:hidden}.micromag-screen-quiz-placeholder.micromag-screen-quiz-container .micromag-screen-quiz-content{position:relative;padding:6px}.micromag-screen-quiz-container .micromag-screen-quiz-emptyAnswer,.micromag-screen-quiz-container .micromag-screen-quiz-emptyResult,.micromag-screen-quiz-container .micromag-screen-quiz-emptyTitle{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-quiz-container .micromag-screen-quiz-button:focus-visible{outline:3px solid #a13dff}.micromag-screen-quiz-container .micromag-screen-quiz-question{margin-bottom:10px}.micromag-screen-quiz-container .micromag-screen-quiz-answers,.micromag-screen-quiz-container .micromag-screen-quiz-items{position:relative}.micromag-screen-quiz-container .micromag-screen-quiz-item{-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity;-webkit-transition-duration:.15s;-o-transition-duration:.15s;transition-duration:.15s;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}.micromag-screen-quiz-container .micromag-screen-quiz-item.micromag-screen-quiz-rightAnswer{-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform}.micromag-screen-quiz-container .micromag-screen-quiz-item.micromag-screen-quiz-rightAnswer .micromag-screen-quiz-resultIcon{background-color:#0ed88f}.micromag-screen-quiz-container .micromag-screen-quiz-itemContent{padding:5px 0}.micromag-screen-quiz-container .micromag-screen-quiz-button{position:relative;width:100%;padding:10px 40px;border:2px solid #6c6c6c}.micromag-screen-quiz-container .micromag-screen-quiz-button:disabled{opacity:1;pointer-events:none}.micromag-screen-quiz-container .micromag-screen-quiz-resultIcon{display:-webkit-flex;display:-ms-flexbox;display:flex;position:absolute;top:50%;left:5px;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:32px;height:32px;margin-top:-16px;padding:5px;-webkit-transition:opacity .15s ease;-o-transition:opacity .15s ease;transition:opacity .15s ease;border:2px solid #1c1c1c;border-radius:50%;opacity:0;background-color:#ff2945}.micromag-screen-quiz-container .micromag-screen-quiz-result{position:absolute;-webkit-transition:opacity .5s ease;-o-transition:opacity .5s ease;transition:opacity .5s ease;opacity:0;pointer-events:none}.micromag-screen-quiz-container .micromag-screen-quiz-resultContent{padding:20px 0}.micromag-screen-quiz-container .micromag-screen-quiz-emptyAnswer,.micromag-screen-quiz-container .micromag-screen-quiz-emptyResult,.micromag-screen-quiz-container .micromag-screen-quiz-emptyTitle{width:100%;margin:0 auto}.micromag-screen-quiz-container .micromag-screen-quiz-emptyTitle{height:60px}.micromag-screen-quiz-container .micromag-screen-quiz-emptyAnswer{height:50px}.micromag-screen-quiz-container .micromag-screen-quiz-emptyResult{height:100px}.micromag-screen-quiz-container .micromag-screen-quiz-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-quiz-container.micromag-screen-quiz-answered .micromag-screen-quiz-resultIcon{opacity:1}.micromag-screen-quiz-container.micromag-screen-quiz-showResults .micromag-screen-quiz-item{opacity:0}.micromag-screen-quiz-container.micromag-screen-quiz-showResults .micromag-screen-quiz-item.micromag-screen-quiz-rightAnswer{opacity:1}.micromag-screen-quiz-container.micromag-screen-quiz-answerTransitionComplete .micromag-screen-quiz-item.micromag-screen-quiz-rightAnswer{-webkit-transition:none;-o-transition:none;transition:none}.micromag-screen-quiz-container.micromag-screen-quiz-answerTransitionComplete .micromag-screen-quiz-result{position:relative;opacity:1;pointer-events:all}.micromag-screen-quiz-container.micromag-screen-quiz-isPlaceholder .micromag-screen-quiz-layout{padding:10px}.micromag-screen-quiz-container.micromag-screen-quiz-isPlaceholder .micromag-screen-quiz-item{padding:1px 0}.micromag-screen-quote-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-quote-disabled.micromag-screen-quote-container{overflow:hidden;pointer-events:none}.micromag-screen-quote-hidden.micromag-screen-quote-container{display:none;visibility:hidden}.micromag-screen-quote-placeholder.micromag-screen-quote-container .micromag-screen-quote-content{position:relative;padding:6px}.micromag-screen-quote-container .micromag-screen-quote-emptyAuthor,.micromag-screen-quote-container .micromag-screen-quote-emptyQuote{border:2px dashed #343434;color:#343434;width:100%;margin:10px auto}.micromag-screen-quote-container .micromag-screen-quote-emptyQuote{height:200px}.micromag-screen-quote-container .micromag-screen-quote-emptyAuthor{height:50px}.micromag-screen-quote-container .micromag-screen-quote-quote{font-size:2em}.micromag-screen-quote-container .micromag-screen-quote-quote.micromag-screen-quote-withMargin{margin-bottom:1em}.micromag-screen-quote-container.micromag-screen-quote-isPlaceholder .micromag-screen-quote-layout{padding:10px}.micromag-screen-ranking-container .micromag-screen-ranking-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-ranking-container{position:relative}.micromag-screen-ranking-container .micromag-screen-ranking-empty{height:50px;margin-right:10px}.micromag-screen-ranking-container .micromag-screen-ranking-item{position:relative;padding:10px 0}.micromag-screen-ranking-container .micromag-screen-ranking-rankText{font-size:48px}.micromag-screen-ranking-container .micromag-screen-ranking-description,.micromag-screen-ranking-container .micromag-screen-ranking-title{padding:8px 0}.micromag-screen-ranking-container .micromag-screen-ranking-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-ranking-container.micromag-screen-ranking-sideLayout .micromag-screen-ranking-layout{display:table;width:100%}.micromag-screen-ranking-container.micromag-screen-ranking-sideLayout .micromag-screen-ranking-item{display:table-row;padding:0}.micromag-screen-ranking-container.micromag-screen-ranking-sideLayout .micromag-screen-ranking-content,.micromag-screen-ranking-container.micromag-screen-ranking-sideLayout .micromag-screen-ranking-rank{display:table-cell;padding:10px 0;vertical-align:top}.micromag-screen-ranking-container.micromag-screen-ranking-sideLayout .micromag-screen-ranking-rank{padding-right:20px}.micromag-screen-ranking-container.micromag-screen-ranking-isPlaceholder .micromag-screen-ranking-rank{color:rgba(28,28,28,.5);font-size:16px;text-align:left}.micromag-screen-ranking-container.micromag-screen-ranking-isPlaceholder .micromag-screen-ranking-scroll{padding:5px}.micromag-screen-ranking-container.micromag-screen-ranking-isPlaceholder .micromag-screen-ranking-description,.micromag-screen-ranking-container.micromag-screen-ranking-isPlaceholder .micromag-screen-ranking-title{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;padding:0}.micromag-screen-ranking-container.micromag-screen-ranking-isPlaceholder .micromag-screen-ranking-item{padding:1px 0}.micromag-screen-ranking-container.micromag-screen-ranking-isPlaceholder.micromag-screen-ranking-sideLayout .micromag-screen-ranking-rank{width:24px;padding-top:8px;padding-right:4px}.micromag-screen-ranking-container.micromag-screen-ranking-isPlaceholder.micromag-screen-ranking-sideLayout .micromag-screen-ranking-content{padding:5px 0}.micromag-screen-slideshow-container .micromag-screen-slideshow-content{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-slideshow-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-slideshow-disabled.micromag-screen-slideshow-container{overflow:hidden;pointer-events:none}.micromag-screen-slideshow-hidden.micromag-screen-slideshow-container{display:none;visibility:hidden}.micromag-screen-slideshow-placeholder.micromag-screen-slideshow-container .micromag-screen-slideshow-content{position:relative;padding:6px}.micromag-screen-survey-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-survey-disabled.micromag-screen-survey-container{overflow:hidden;pointer-events:none}.micromag-screen-survey-hidden.micromag-screen-survey-container{display:none;visibility:hidden}.micromag-screen-survey-placeholder.micromag-screen-survey-container .micromag-screen-survey-content{position:relative;padding:6px}.micromag-screen-survey-container .micromag-screen-survey-emptyAnswer,.micromag-screen-survey-container .micromag-screen-survey-emptyQuestion{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-survey-container .micromag-screen-survey-question{margin-bottom:20px}.micromag-screen-survey-container .micromag-screen-survey-answers,.micromag-screen-survey-container .micromag-screen-survey-items{position:relative}.micromag-screen-survey-container .micromag-screen-survey-item{padding:5px 0}.micromag-screen-survey-container .micromag-screen-survey-item:first-child .micromag-screen-survey-placeholderAnswer{width:80%}.micromag-screen-survey-container .micromag-screen-survey-item:last-child .micromag-screen-survey-placeholderAnswer{width:90%}.micromag-screen-survey-container .micromag-screen-survey-itemContent{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.micromag-screen-survey-container .micromag-screen-survey-resultContainer{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-align-self:center;-ms-flex-item-align:center;align-self:center;padding:15px 0;-webkit-transition-property:padding;-o-transition-property:padding;transition-property:padding;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}.micromag-screen-survey-container .micromag-screen-survey-resultContent{width:0;height:1em;-webkit-transition-property:width opacity;-o-transition-property:width opacity;transition-property:width opacity;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease;opacity:0}.micromag-screen-survey-container .micromag-screen-survey-result{position:relative;height:100%;background-color:#fff}.micromag-screen-survey-container .micromag-screen-survey-resultLabel{position:absolute;top:50%;left:100%;margin-left:5px;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);color:#fff}.micromag-screen-survey-container .micromag-screen-survey-itemInner{width:100%;-webkit-transition-property:width;-o-transition-property:width;transition-property:width;-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}.micromag-screen-survey-container .micromag-screen-survey-button{position:relative;display:-webkit-flex;display:-ms-flexbox;display:flex;width:100%;padding:0;border:2px solid #6c6c6c;-webkit-transition:opacity .5s ease-out;-o-transition:opacity .5s ease-out;transition:opacity .5s ease-out}.micromag-screen-survey-container .micromag-screen-survey-button:disabled{opacity:1;pointer-events:none}.micromag-screen-survey-container .micromag-screen-survey-itemLabel{display:inline-block;padding:10px;margin-left:50%;-webkit-transition:margin-left .3s ease-out,-webkit-transform .3s ease-out;transition:margin-left .3s ease-out,-webkit-transform .3s ease-out;-o-transition:margin-left .3s ease-out,transform .3s ease-out;transition:margin-left .3s ease-out,transform .3s ease-out;transition:margin-left .3s ease-out,transform .3s ease-out,-webkit-transform .3s ease-out;-webkit-transform:translate(-50%);-ms-transform:translate(-50%);transform:translate(-50%)}.micromag-screen-survey-container .micromag-screen-survey-emptyAnswer,.micromag-screen-survey-container .micromag-screen-survey-emptyQuestion{width:100%;margin:0 auto}.micromag-screen-survey-container .micromag-screen-survey-emptyQuestion{height:75px}.micromag-screen-survey-container .micromag-screen-survey-emptyAnswer{height:50px}.micromag-screen-survey-container.micromag-screen-survey-answered .micromag-screen-survey-resultContainer{padding-right:50px;padding-left:15px}.micromag-screen-survey-container.micromag-screen-survey-answered .micromag-screen-survey-resultContent{width:100%;opacity:1}.micromag-screen-survey-container.micromag-screen-survey-answered .micromag-screen-survey-button{border-color:rgba(0,0,0,0);background-color:rgba(0,0,0,0)}.micromag-screen-survey-container.micromag-screen-survey-answered .micromag-screen-survey-button,.micromag-screen-survey-container.micromag-screen-survey-answered .micromag-screen-survey-result,.micromag-screen-survey-container.micromag-screen-survey-answered .micromag-screen-survey-resultLabel{opacity:.6}.micromag-screen-survey-container.micromag-screen-survey-answered .micromag-screen-survey-itemLabel{margin-left:0;text-align:left;-webkit-transform:translate(-10px);-ms-transform:translate(-10px);transform:translate(-10px)}.micromag-screen-survey-container .micromag-screen-survey-userAnswer .micromag-screen-survey-button,.micromag-screen-survey-container .micromag-screen-survey-userAnswer .micromag-screen-survey-result,.micromag-screen-survey-container .micromag-screen-survey-userAnswer .micromag-screen-survey-resultLabel{opacity:1}.micromag-screen-survey-container.micromag-screen-survey-isPlaceholder .micromag-screen-survey-layout{padding:10px}.micromag-screen-survey-container.micromag-screen-survey-isPlaceholder .micromag-screen-survey-item{padding:1px 0}.micromag-screen-text-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-text-disabled.micromag-screen-text-container{overflow:hidden;pointer-events:none}.micromag-screen-text-hidden.micromag-screen-text-container{display:none;visibility:hidden}.micromag-screen-text-placeholder.micromag-screen-text-container .micromag-screen-text-content{position:relative;padding:6px}.micromag-screen-text-container .micromag-screen-text-emptyText,.micromag-screen-text-container .micromag-screen-text-emptyTitle{border:2px dashed #343434;color:#343434;width:100%;margin:10px auto}.micromag-screen-text-container .micromag-screen-text-emptyTitle{height:100px}.micromag-screen-text-container .micromag-screen-text-emptyText{height:50px}.micromag-screen-text-container .micromag-screen-text-title.micromag-screen-text-withMargin{margin-bottom:20px}.micromag-screen-text-container.micromag-screen-text-isPlaceholder .micromag-screen-text-layout{padding:10px}.micromag-screen-timeline-container .micromag-screen-timeline-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-timeline-container{position:relative}.micromag-screen-timeline-container .micromag-screen-timeline-empty{height:50px;margin-right:10px}.micromag-screen-timeline-container .micromag-screen-timeline-item{position:relative}.micromag-screen-timeline-container .micromag-screen-timeline-element,.micromag-screen-timeline-container .micromag-screen-timeline-timeline{display:-webkit-flex;display:-ms-flexbox;display:flex}.micromag-screen-timeline-container .micromag-screen-timeline-timeline{-webkit-box-sizing:content-box;box-sizing:content-box;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-ms-flex-negative:0;-webkit-flex-shrink:0;flex-shrink:0;-webkit-align-items:center;-ms-flex-align:center;align-items:center;width:15px;padding-right:20px}.micromag-screen-timeline-container .micromag-screen-timeline-line{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;width:1px}.micromag-screen-timeline-container .micromag-screen-timeline-line.micromag-screen-timeline-hidden{width:auto}.micromag-screen-timeline-container .micromag-screen-timeline-bullet{width:15px;height:15px;margin:2px 0;border-width:1px;border-style:solid}.micromag-screen-timeline-container .micromag-screen-timeline-content{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.micromag-screen-timeline-container .micromag-screen-timeline-content.micromag-screen-timeline-lastContent{margin-bottom:20px}.micromag-screen-timeline-container .micromag-screen-timeline-description,.micromag-screen-timeline-container .micromag-screen-timeline-imageContainer,.micromag-screen-timeline-container .micromag-screen-timeline-title{padding:8px 0}.micromag-screen-timeline-container .micromag-screen-timeline-image,.micromag-screen-timeline-container .micromag-screen-timeline-imageContainer,.micromag-screen-timeline-container .micromag-screen-timeline-video{position:relative}.micromag-screen-timeline-container .micromag-screen-timeline-imageContainer{overflow:hidden}.micromag-screen-timeline-container .micromag-screen-timeline-callToAction{position:absolute;bottom:0;left:0;width:100%}.micromag-screen-timeline-container.micromag-screen-timeline-isPlaceholder .micromag-screen-timeline-scroll{padding:10px}.micromag-screen-timeline-container.micromag-screen-timeline-isPlaceholder .micromag-screen-timeline-timeline{padding-right:0}.micromag-screen-timeline-container.micromag-screen-timeline-isPlaceholder .micromag-screen-timeline-bullet{width:10px;height:10px;border-color:rgba(28,28,28,.5);background-color:rgba(28,28,28,.5)}.micromag-screen-timeline-container.micromag-screen-timeline-isPlaceholder .micromag-screen-timeline-content.micromag-screen-timeline-lastContent{margin-bottom:4px}.micromag-screen-timeline-container.micromag-screen-timeline-isPlaceholder .micromag-screen-timeline-description,.micromag-screen-timeline-container.micromag-screen-timeline-isPlaceholder .micromag-screen-timeline-imageContainer,.micromag-screen-timeline-container.micromag-screen-timeline-isPlaceholder .micromag-screen-timeline-title{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;height:100%;padding:2px 0}.micromag-screen-timeline-container.micromag-screen-timeline-isPlaceholder .micromag-screen-timeline-line{background-color:rgba(28,28,28,.5)}.micromag-screen-timeline-container.micromag-screen-timeline-circleBulletShape .micromag-screen-timeline-bullet{border-radius:50%}.micromag-screen-timeline-container.micromag-screen-timeline-withoutLines .micromag-screen-timeline-timeline{visibility:hidden}.micromag-screen-title-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-title-disabled.micromag-screen-title-container{overflow:hidden;pointer-events:none}.micromag-screen-title-hidden.micromag-screen-title-container{display:none;visibility:hidden}.micromag-screen-title-placeholder.micromag-screen-title-container .micromag-screen-title-content{position:relative;padding:6px}.micromag-screen-title-container .micromag-screen-title-emptyDescription,.micromag-screen-title-container .micromag-screen-title-emptySubtitle,.micromag-screen-title-container .micromag-screen-title-emptyTitle{border:2px dashed #343434;color:#343434;width:100%;margin:10px auto}.micromag-screen-title-container .micromag-screen-title-emptyTitle{height:100px}.micromag-screen-title-container .micromag-screen-title-emptyDescription,.micromag-screen-title-container .micromag-screen-title-emptySubtitle{height:50px}.micromag-screen-title-container .micromag-screen-title-subtitle.micromag-screen-title-withMargin,.micromag-screen-title-container .micromag-screen-title-title.micromag-screen-title-withMargin{margin-bottom:.2em}.micromag-screen-title-container.micromag-screen-title-isPlaceholder .micromag-screen-title-layout{padding:10px}.micromag-screen-video-container .micromag-screen-video-content,.micromag-screen-video-container .micromag-screen-video-empty,.micromag-screen-video-container .micromag-screen-video-emptyContainer,.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-image,.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-placeholder,.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-video-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-video-disabled.micromag-screen-video-container{overflow:hidden;pointer-events:none}.micromag-screen-video-hidden.micromag-screen-video-container{display:none;visibility:hidden}.micromag-screen-video-placeholder.micromag-screen-video-container .micromag-screen-video-content{position:relative;padding:6px}.micromag-screen-video-container .micromag-screen-video-empty{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-video-container .micromag-screen-video-emptyContainer{top:50%;height:0;padding-bottom:56.25%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.micromag-screen-video-container .micromag-screen-video-empty{margin:0}.micromag-screen-video-container .micromag-screen-video-content{overflow:hidden}.micromag-screen-video-container .micromag-screen-video-mediaControls{padding:10px 20px 20px}.micromag-screen-video-container .micromag-screen-video-placeholder{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;height:100%}.micromag-screen-video-container .micromag-screen-video-videoContainer{position:absolute}.micromag-screen-video-container .micromag-screen-video-bottomContent{position:absolute;bottom:0;width:100%}.micromag-screen-video-container.micromag-screen-video-fullscreen .micromag-screen-video-emptyContainer{top:0;height:100%;padding-bottom:0;-webkit-transform:none;-ms-transform:none;transform:none}.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-screen-video-360-container .micromag-screen-video-360-canvas,.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton,.micromag-screen-video-360-container .micromag-screen-video-360-content,.micromag-screen-video-360-container .micromag-screen-video-360-placeholder,.micromag-screen-video-360-container .micromag-screen-video-360-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-screen-video-360-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-video-360-disabled.micromag-screen-video-360-container{overflow:hidden;pointer-events:none}.micromag-screen-video-360-hidden.micromag-screen-video-360-container{display:none;visibility:hidden}.micromag-screen-video-360-placeholder.micromag-screen-video-360-container .micromag-screen-video-360-content{position:relative;padding:6px}.micromag-screen-video-360-container .micromag-screen-video-360-empty{border:2px dashed #343434;color:#343434;height:100%;margin:0}.micromag-screen-video-360-container .micromag-screen-video-360-canvasButton{-ms-touch-action:none;touch-action:none}.micromag-screen-video-360-container .micromag-screen-video-360-videoContainer{position:absolute}.micromag-screen-video-360-container .micromag-screen-video-360-video{visibility:hidden}.micromag-screen-video-360-container .micromag-screen-video-360-video video{height:100%}.micromag-screen-video-360-container .micromag-screen-video-360-mediaControls{padding:10px 20px 20px}.micromag-screen-video-360-container .micromag-screen-video-360-placeholder{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;height:100%}.micromag-screen-video-360-container .micromag-screen-video-360-bottomContent{position:absolute;bottom:0;width:100%}.micromag-screen-video-360-container.micromag-screen-video-360-showVideo .micromag-screen-video-360-video{visibility:visible}.micromag-element-audio-audio-wave-container .micromag-element-audio-audio-wave-button{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-element-audio-audio-wave-container .micromag-element-audio-audio-wave-button,.micromag-element-audio-audio-wave-container .micromag-element-audio-audio-wave-canvasBackground,.micromag-element-audio-audio-wave-container .micromag-element-audio-audio-wave-canvasProgress{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-element-audio-audio-wave-container{position:relative;height:100px;-ms-touch-action:pan-y;touch-action:pan-y}.micromag-element-audio-container .micromag-element-audio-wave{height:150px}.micromag-element-background-container,.micromag-element-background-layer,.micromag-element-background-layers,.micromag-element-background-video,.micromag-element-background-videoContainer{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-element-background-container{z-index:0;overflow:hidden}.micromag-element-background-layer,.micromag-element-background-layers{z-index:0}.micromag-element-background-right .micromag-element-background-background{right:0;left:auto}.micromag-element-background-bottom .micromag-element-background-background{top:auto;bottom:0}.micromag-element-button-container{display:inline-block;position:relative;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:5px 10px;border-radius:0;background-color:hsla(0,0%,100%,.1)}.micromag-element-button-container.micromag-element-button-active,.micromag-element-button-container.micromag-element-button-focus,.micromag-element-button-container:active,.micromag-element-button-container:focus{-webkit-box-shadow:none!important;box-shadow:none!important}.micromag-element-button-container.micromag-element-button-disabled,.micromag-element-button-container:disabled{cursor:auto}@-webkit-keyframes micromag-element-call-to-action-appear{0%{-webkit-transform:scale(0);transform:scale(0);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes micromag-element-call-to-action-appear{0%{-webkit-transform:scale(0);transform:scale(0);opacity:0}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.micromag-element-call-to-action-container{position:relative;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease;opacity:1;text-align:center}.micromag-element-call-to-action-container .micromag-element-call-to-action-arrow{-webkit-animation:micromag-element-call-to-action-upAndDown .5s ease-in-out infinite alternate;animation:micromag-element-call-to-action-upAndDown .5s ease-in-out infinite alternate}.micromag-element-call-to-action-container .micromag-element-call-to-action-label{display:block}.micromag-element-call-to-action-container .micromag-element-call-to-action-button{display:block;margin:0 auto;padding:20px 0;-ms-touch-action:none;touch-action:none;-webkit-user-drag:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.micromag-element-call-to-action-container .micromag-element-call-to-action-button:hover{text-decoration:none}.micromag-element-call-to-action-container .micromag-element-call-to-action-selfTargetLink{display:none}.micromag-element-call-to-action-container .micromag-element-call-to-action-leavingFrame{position:fixed;top:0;left:0;width:100vw;height:100vh;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-animation:micromag-element-call-to-action-appear .5s ease both;animation:micromag-element-call-to-action-appear .5s ease both;opacity:0;background-color:#fff}.micromag-element-call-to-action-container.micromag-element-call-to-action-animationDisabled .micromag-element-call-to-action-arrow{-webkit-animation:none;animation:none}.micromag-element-call-to-action-container.micromag-element-call-to-action-invalidUrl{opacity:.5;pointer-events:none}.micromag-element-call-to-action-container.micromag-element-call-to-action-invalidUrl .micromag-element-call-to-action-arrow{-webkit-animation:none;animation:none}.micromag-element-call-to-action-container.micromag-element-call-to-action-disabled{opacity:0;pointer-events:none}@-webkit-keyframes micromag-element-call-to-action-upAndDown{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(25%);transform:translateY(25%)}}@keyframes micromag-element-call-to-action-upAndDown{0%{-webkit-transform:translateY(0);transform:translateY(0)}to{-webkit-transform:translateY(25%);transform:translateY(25%)}}.micromag-element-checkbox-container{position:relative}.micromag-element-checkbox-container .micromag-element-checkbox-label{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-align-items:center;-ms-flex-align:center;align-items:center;margin-bottom:0}.micromag-element-checkbox-container .micromag-element-checkbox-input{margin-right:5px}.micromag-element-closed-captions-container{position:relative;text-align:center}.micromag-element-closed-captions-container .micromag-element-closed-captions-captions{display:inline-block;padding:10px;background-color:#1c1c1c;color:#fff;word-break:break-word}.micromag-element-container-container{position:relative;overflow:hidden}.micromag-element-grid-container{position:relative}.micromag-element-grid-container .micromag-element-grid-items{-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch;height:100%}.micromag-element-grid-container .micromag-element-grid-cross,.micromag-element-grid-container .micromag-element-grid-items{display:-webkit-flex;display:-ms-flexbox;display:flex;position:relative}.micromag-element-grid-container .micromag-element-grid-axis{position:relative}.micromag-element-heading-container em,.micromag-element-heading-container i{font-style:italic}.micromag-element-heading-container b,.micromag-element-heading-container strong{font-weight:700}.micromag-element-heading-container p{margin-top:.5em;margin-bottom:.5em}.micromag-element-heading-container mark{padding:0;-webkit-box-decoration-break:clone;box-decoration-break:clone}.micromag-element-heading-container{line-height:1}.micromag-element-heading-container,.micromag-element-heading-container p{margin:0;padding:0}.micromag-element-image-container .micromag-element-image-showEmpty{margin:5px auto}.micromag-element-image-container{position:relative;overflow:hidden}.micromag-element-image-container .micromag-element-image-img{display:block;position:relative}.micromag-element-image-container .micromag-element-image-showEmpty{width:300px;height:200px;border:2px dashed #343434;color:#343434}.micromag-element-layout-container.micromag-element-layout-fullscreen{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-element-layout-container{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.micromag-element-layout-container,.micromag-element-layout-container .micromag-element-layout-horizontal{display:-webkit-flex;display:-ms-flexbox;display:flex}.micromag-element-layout-container .micromag-element-layout-horizontal{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row}.micromag-element-link-container{margin:0;padding:0}.micromag-element-map-container,.micromag-element-map-container .micromag-element-map-map{width:100%;height:100%}.micromag-element-map-container.micromag-element-map-preventScroll .micromag-element-map-map div{cursor:default}.micromag-element-map-container{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;padding:0}.micromag-element-media-controls-seek-bar-container .micromag-element-media-controls-seek-bar-button{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-element-media-controls-seek-bar-container .micromag-element-media-controls-seek-bar-button,.micromag-element-media-controls-seek-bar-container .micromag-element-media-controls-seek-bar-progress{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-element-media-controls-seek-bar-container{position:relative;height:10px}.micromag-element-media-controls-seek-bar-container .micromag-element-media-controls-seek-bar-progress{position:relative;-webkit-transform-origin:left center;-ms-transform-origin:left center;transform-origin:left center}.micromag-element-media-controls-container .micromag-element-media-controls-muteButton,.micromag-element-media-controls-container .micromag-element-media-controls-playPauseButton{display:inline-block;position:relative;padding:0;border:0;background:rgba(0,0,0,0);color:inherit;font-family:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.micromag-element-media-controls-container .micromag-element-media-controls-toggles{position:relative;color:#fff}.micromag-element-media-controls-container .micromag-element-media-controls-seekBar{margin-bottom:10px}.micromag-element-media-controls-container .micromag-element-media-controls-muteButton,.micromag-element-media-controls-container .micromag-element-media-controls-playPauseButton{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:60px;height:60px}.micromag-element-media-controls-container .micromag-element-media-controls-playPauseButton{visibility:hidden;margin:0 auto;border:2px solid #fff;border-radius:50%}.micromag-element-media-controls-container .micromag-element-media-controls-playPauseButton .micromag-element-media-controls-icon{display:block;width:40%;height:40%;-webkit-transform:translateX(5%);-ms-transform:translateX(5%);transform:translateX(5%)}.micromag-element-media-controls-container .micromag-element-media-controls-muteButton{visibility:hidden;position:absolute;top:50%;right:0;width:40px;height:40px;margin-top:-20px}.micromag-element-media-controls-container .micromag-element-media-controls-muteButton .micromag-element-media-controls-icon{display:block;width:90%;height:90%}.micromag-element-media-controls-container .micromag-element-media-controls-muteButton:after{content:"";display:none;position:absolute;top:0;left:50%;width:2px;height:100%;margin-left:-1px;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);background-color:#fff}.micromag-element-media-controls-container.micromag-element-media-controls-playing .micromag-element-media-controls-playPauseButton .micromag-element-media-controls-icon{-webkit-transform:none;-ms-transform:none;transform:none}.micromag-element-media-controls-container.micromag-element-media-controls-muted .micromag-element-media-controls-muteButton{visibility:visible}.micromag-element-media-controls-container.micromag-element-media-controls-muted .micromag-element-media-controls-muteButton:after{display:block}.micromag-element-media-controls-container.micromag-element-media-controls-withPlayPause .micromag-element-media-controls-playPauseButton{visibility:visible}.micromag-element-quote-container{font-family:Helvetica,Arial,sans-serif;font-size:16px;font-weight:400;line-height:1.1}.micromag-element-quote-container em,.micromag-element-quote-container i{font-style:italic}.micromag-element-quote-container b,.micromag-element-quote-container strong{font-weight:700}.micromag-element-quote-container p{margin-top:.5em;margin-bottom:.5em}.micromag-element-quote-container mark{padding:0;-webkit-box-decoration-break:clone;box-decoration-break:clone}.micromag-element-quote-container{line-height:1.3}.micromag-element-quote-container h2{font-size:2em}.micromag-element-quote-container h3{font-size:1.75em}.micromag-element-quote-container h4{font-size:1.5em}.micromag-element-quote-container blockquote{padding:0 0 0 1em}.micromag-element-quote-container{margin:0;padding:0}.micromag-element-quote-container.micromag-element-quote-showEmpty{display:inline-block;width:300px;height:80px;border:2px dashed #343434;color:#343434}.micromag-element-scroll-container.micromag-element-scroll-withScroll .micromag-element-scroll-scrollable{scrollbar-width:none}.micromag-element-scroll-container.micromag-element-scroll-withScroll .micromag-element-scroll-scrollable::-webkit-scrollbar{display:none}.micromag-element-scroll-container{position:relative;height:100%;min-height:inherit;margin:0 auto}.micromag-element-scroll-container .micromag-element-scroll-scrollable{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;width:100%;height:100%;min-height:inherit}.micromag-element-scroll-container .micromag-element-scroll-arrowContainer{position:absolute;bottom:0;left:0;width:100%;-webkit-transition:opacity .3s ease;-o-transition:opacity .3s ease;transition:opacity .3s ease;opacity:0;text-align:center;pointer-events:none}.micromag-element-scroll-container .micromag-element-scroll-arrow{display:inline-block;width:20px;height:20px;-webkit-animation:micromag-element-scroll-upAndDown .75s ease-in-out infinite alternate;animation:micromag-element-scroll-upAndDown .75s ease-in-out infinite alternate;color:#fff}.micromag-element-scroll-container .micromag-element-scroll-arrow path{stroke-width:20;stroke:#1c1c1c}.micromag-element-scroll-container.micromag-element-scroll-withScroll .micromag-element-scroll-scrollable{overflow-x:hidden;overflow-y:auto}.micromag-element-scroll-container.micromag-element-scroll-withScroll.micromag-element-scroll-containOverscroll .micromag-element-scroll-scrollable,.micromag-element-scroll-container.micromag-element-scroll-withScroll .micromag-element-scroll-scrollable{-ms-scroll-chaining:none;overscroll-behavior:contain}.micromag-element-scroll-container.micromag-element-scroll-top .micromag-element-scroll-scrollee{margin-bottom:auto}.micromag-element-scroll-container.micromag-element-scroll-middle .micromag-element-scroll-scrollee{margin:auto 0}.micromag-element-scroll-container.micromag-element-scroll-bottom .micromag-element-scroll-scrollee{margin-top:auto}.micromag-element-scroll-container.micromag-element-scroll-withArrow .micromag-element-scroll-arrowContainer{opacity:1}@-webkit-keyframes micromag-element-scroll-upAndDown{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes micromag-element-scroll-upAndDown{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%)}to{-webkit-transform:translateY(0);transform:translateY(0)}}.micromag-element-stack-spacer-container{-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1}.micromag-element-stack-spacer-container.micromag-element-stack-spacer-hasSize{-webkit-flex-grow:0;-ms-flex-positive:0;flex-grow:0}.micromag-element-stack-container{display:-webkit-flex;display:-ms-flexbox;display:flex}.micromag-element-text-container{font-family:Helvetica,Arial,sans-serif;font-size:16px;font-weight:400;line-height:1.1}.micromag-element-text-container em,.micromag-element-text-container i{font-style:italic}.micromag-element-text-container b,.micromag-element-text-container strong{font-weight:700}.micromag-element-text-container p{margin-top:.5em;margin-bottom:.5em}.micromag-element-text-container mark{padding:0;-webkit-box-decoration-break:clone;box-decoration-break:clone}.micromag-element-text-container{line-height:1.3}.micromag-element-text-container h2{font-size:2em}.micromag-element-text-container h3{font-size:1.75em}.micromag-element-text-container h4{font-size:1.5em}.micromag-element-text-container blockquote{padding:0 0 0 1em}.micromag-element-text-container{margin:0;padding:0}.micromag-element-text-container.micromag-element-text-showEmpty{display:inline-block;width:300px;height:80px;border:2px dashed #343434;color:#343434}.micromag-element-text-container.micromag-element-text-withLineClamp{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}.micromag-element-text-input-container{font-family:Helvetica,Arial,sans-serif;font-size:16px;font-weight:400;line-height:1.1}.micromag-element-text-input-container em,.micromag-element-text-input-container i{font-style:italic}.micromag-element-text-input-container b,.micromag-element-text-input-container strong{font-weight:700}.micromag-element-text-input-container p{margin-top:.5em;margin-bottom:.5em}.micromag-element-text-input-container mark{padding:0;-webkit-box-decoration-break:clone;box-decoration-break:clone}.micromag-element-text-input-container{line-height:1.3}.micromag-element-text-input-container h2{font-size:2em}.micromag-element-text-input-container h3{font-size:1.75em}.micromag-element-text-input-container h4{font-size:1.5em}.micromag-element-text-input-container blockquote{padding:0 0 0 1em}.micromag-element-text-input-container{margin:0;padding:0}.micromag-element-text-input-element{border:0;outline:0;background-color:hsla(0,0%,100%,.1)}.micromag-element-video-container.micromag-element-video-withSize .micromag-element-video-video{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-element-video-container{position:relative}.micromag-element-video-container .micromag-element-video-video{display:block;width:100%}.micromag-element-visual-container{position:relative;overflow:hidden}.micromag-element-visual-container .micromag-element-visual-videoContainer{position:absolute;overflow:hidden}.sr-only:not(:focus):not(:active){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;-webkit-clip-path:inset(50%);clip-path:inset(50%)}
package/es/index.js CHANGED
@@ -17,10 +17,10 @@ import { useDocumentEvent, useParsedStory, useLoadedFonts, useTrackScreenView, u
17
17
  import { getStyleFromColor, getStyleFromText, getDeviceScreens } from '@micromag/core/utils';
18
18
  import { useSpring, config } from '@react-spring/core';
19
19
  import { animated } from '@react-spring/web';
20
+ import { useDrag } from '@use-gesture/react';
20
21
  import classNames from 'classnames';
21
22
  import { Helmet } from 'react-helmet';
22
23
  import { useIntl, FormattedMessage } from 'react-intl';
23
- import { useDrag } from 'react-use-gesture';
24
24
  import { faTimes, faShare, faCompress, faExpand } from '@fortawesome/free-solid-svg-icons';
25
25
  import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
26
26
  import Scroll from '@micromag/element-scroll';
@@ -127,8 +127,8 @@ var ViewerMenuDots = function ViewerMenuDots(_ref) {
127
127
  return /*#__PURE__*/React.createElement("nav", {
128
128
  className: classNames([styles$5.container, (_ref3 = {}, _defineProperty(_ref3, className, className !== null), _defineProperty(_ref3, styles$5.vertical, direction === 'vertical'), _defineProperty(_ref3, styles$5.withShadow, withShadow), _ref3)]),
129
129
  "aria-label": intl.formatMessage({
130
- "id": "bLYuuN",
131
- "defaultMessage": [{
130
+ id: "bLYuuN",
131
+ defaultMessage: [{
132
132
  "type": 0,
133
133
  "value": "You are on screen "
134
134
  }, {
@@ -178,15 +178,15 @@ var ViewerMenuDots = function ViewerMenuDots(_ref) {
178
178
  }), /*#__PURE__*/React.createElement("button", {
179
179
  type: "button",
180
180
  title: intl.formatMessage({
181
- "id": "F/gl4b",
182
- "defaultMessage": [{
181
+ id: "F/gl4b",
182
+ defaultMessage: [{
183
183
  "type": 0,
184
184
  "value": "Menu"
185
185
  }]
186
186
  }),
187
187
  "aria-label": intl.formatMessage({
188
- "id": "F/gl4b",
189
- "defaultMessage": [{
188
+ id: "F/gl4b",
189
+ defaultMessage: [{
190
190
  "type": 0,
191
191
  "value": "Menu"
192
192
  }]
@@ -207,15 +207,15 @@ var ViewerMenuDots = function ViewerMenuDots(_ref) {
207
207
  className: styles$5.closeButton,
208
208
  onClick: onClose,
209
209
  title: intl.formatMessage({
210
- "id": "dj/p/q",
211
- "defaultMessage": [{
210
+ id: "dj/p/q",
211
+ defaultMessage: [{
212
212
  "type": 0,
213
213
  "value": "Close"
214
214
  }]
215
215
  }),
216
216
  "aria-label": intl.formatMessage({
217
- "id": "dj/p/q",
218
- "defaultMessage": [{
217
+ id: "dj/p/q",
218
+ defaultMessage: [{
219
219
  "type": 0,
220
220
  "value": "Close"
221
221
  }]
@@ -228,7 +228,9 @@ var ViewerMenuDots = function ViewerMenuDots(_ref) {
228
228
  ViewerMenuDots.propTypes = propTypes$7;
229
229
  ViewerMenuDots.defaultProps = defaultProps$7;
230
230
 
231
- var styles$3 = {"container":"micromag-viewer-partials-share-modal-container","content":"micromag-viewer-partials-share-modal-content","opened":"micromag-viewer-partials-share-modal-opened"};
231
+ var styles$3 = {"container":"micromag-viewer-menus-menu-preview-container","screenButton":"micromag-viewer-menus-menu-preview-screenButton","activeScreenBorder":"micromag-viewer-menus-menu-preview-activeScreenBorder","itemContent":"micromag-viewer-menus-menu-preview-itemContent","scroll":"micromag-viewer-menus-menu-preview-scroll","header":"micromag-viewer-menus-menu-preview-header","button":"micromag-viewer-menus-menu-preview-button","shareButton":"micromag-viewer-menus-menu-preview-shareButton","disabled":"micromag-viewer-menus-menu-preview-disabled","icon":"micromag-viewer-menus-menu-preview-icon","buttons":"micromag-viewer-menus-menu-preview-buttons","organisation":"micromag-viewer-menus-menu-preview-organisation","title":"micromag-viewer-menus-menu-preview-title","content":"micromag-viewer-menus-menu-preview-content","nav":"micromag-viewer-menus-menu-preview-nav","item":"micromag-viewer-menus-menu-preview-item","items":"micromag-viewer-menus-menu-preview-items","active":"micromag-viewer-menus-menu-preview-active","screenContainer":"micromag-viewer-menus-menu-preview-screenContainer","screenContent":"micromag-viewer-menus-menu-preview-screenContent"};
232
+
233
+ var styles$2 = {"container":"micromag-viewer-partials-share-modal-container","content":"micromag-viewer-partials-share-modal-content","opened":"micromag-viewer-partials-share-modal-opened"};
232
234
 
233
235
  var propTypes$6 = {
234
236
  url: PropTypes.string,
@@ -291,13 +293,13 @@ var ShareModal = function ShareModal(_ref) {
291
293
  }, [opened, onCancel]);
292
294
  useDocumentEvent('click', onDocumentClick, opened);
293
295
  return /*#__PURE__*/React.createElement("div", {
294
- className: classNames([styles$3.container, (_ref2 = {}, _defineProperty(_ref2, className, className), _defineProperty(_ref2, styles$3.opened, opened), _ref2)]),
296
+ className: classNames([styles$2.container, (_ref2 = {}, _defineProperty(_ref2, className, className), _defineProperty(_ref2, styles$2.opened, opened), _ref2)]),
295
297
  ref: containerRef,
296
298
  "aria-hidden": opened ? null : '-1'
297
299
  }, /*#__PURE__*/React.createElement("div", {
298
- className: styles$3.content
300
+ className: styles$2.content
299
301
  }, /*#__PURE__*/React.createElement("div", {
300
- className: styles$3.buttons
302
+ className: styles$2.buttons
301
303
  }, /*#__PURE__*/React.createElement(FacebookShareButton, Object.assign({}, shareButtonProps, {
302
304
  quote: title,
303
305
  beforeOnClick: function beforeOnClick() {
@@ -325,7 +327,7 @@ var ShareModal = function ShareModal(_ref) {
325
327
  ShareModal.propTypes = propTypes$6;
326
328
  ShareModal.defaultProps = defaultProps$6;
327
329
 
328
- var styles$2 = {"container":"micromag-viewer-partials-share-button-container","shareModal":"micromag-viewer-partials-share-button-shareModal"};
330
+ var styles$1 = {"container":"micromag-viewer-partials-share-button-container","shareModal":"micromag-viewer-partials-share-button-shareModal"};
329
331
 
330
332
  var propTypes$5 = {
331
333
  title: PropTypes.string,
@@ -377,27 +379,27 @@ var ShareButton = function ShareButton(_ref) {
377
379
  setStoryShareModalOpened(false);
378
380
  }, [setStoryShareModalOpened]);
379
381
  return /*#__PURE__*/React.createElement("div", {
380
- className: classNames([styles$2.container, _defineProperty({}, className, className !== null)])
382
+ className: classNames([styles$1.container, _defineProperty({}, className, className !== null)])
381
383
  }, /*#__PURE__*/React.createElement(Button, {
382
384
  className: classNames([_defineProperty({}, buttonClassName, buttonClassName !== null)]),
383
385
  onClick: onShareIconClick,
384
386
  title: intl.formatMessage({
385
- "id": "7tw6U2",
386
- "defaultMessage": [{
387
+ id: "7tw6U2",
388
+ defaultMessage: [{
387
389
  "type": 0,
388
390
  "value": "Share"
389
391
  }]
390
392
  }),
391
393
  "aria-label": intl.formatMessage({
392
- "id": "7tw6U2",
393
- "defaultMessage": [{
394
+ id: "7tw6U2",
395
+ defaultMessage: [{
394
396
  "type": 0,
395
397
  "value": "Share"
396
398
  }]
397
399
  }),
398
400
  focusable: focusable
399
401
  }, children), /*#__PURE__*/React.createElement(ShareModal, {
400
- className: styles$2.shareModal,
402
+ className: styles$1.shareModal,
401
403
  opened: storyShareModalOpened,
402
404
  title: title,
403
405
  url: url,
@@ -409,8 +411,6 @@ var ShareButton = function ShareButton(_ref) {
409
411
  ShareButton.propTypes = propTypes$5;
410
412
  ShareButton.defaultProps = defaultProps$5;
411
413
 
412
- var styles$1 = {"container":"micromag-viewer-menus-menu-preview-container","screenButton":"micromag-viewer-menus-menu-preview-screenButton","activeScreenBorder":"micromag-viewer-menus-menu-preview-activeScreenBorder","itemContent":"micromag-viewer-menus-menu-preview-itemContent","scroll":"micromag-viewer-menus-menu-preview-scroll","header":"micromag-viewer-menus-menu-preview-header","button":"micromag-viewer-menus-menu-preview-button","shareButton":"micromag-viewer-menus-menu-preview-shareButton","disabled":"micromag-viewer-menus-menu-preview-disabled","icon":"micromag-viewer-menus-menu-preview-icon","buttons":"micromag-viewer-menus-menu-preview-buttons","organisation":"micromag-viewer-menus-menu-preview-organisation","title":"micromag-viewer-menus-menu-preview-title","content":"micromag-viewer-menus-menu-preview-content","nav":"micromag-viewer-menus-menu-preview-nav","item":"micromag-viewer-menus-menu-preview-item","items":"micromag-viewer-menus-menu-preview-items","active":"micromag-viewer-menus-menu-preview-active","screenContainer":"micromag-viewer-menus-menu-preview-screenContainer","screenContent":"micromag-viewer-menus-menu-preview-screenContent"};
413
-
414
414
  var propTypes$4 = {
415
415
  viewerTheme: PropTypes$1.viewerTheme,
416
416
  screenWidth: PropTypes.number,
@@ -446,7 +446,7 @@ var defaultProps$4 = {
446
446
  className: null
447
447
  };
448
448
 
449
- var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
449
+ function ViewerMenuPreview(_ref) {
450
450
  var viewerTheme = _ref.viewerTheme,
451
451
  screenWidth = _ref.screenWidth,
452
452
  title = _ref.title,
@@ -556,90 +556,90 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
556
556
  setScrolledBottom(false);
557
557
  }, [setScrolledBottom]);
558
558
  return hasSize ? /*#__PURE__*/React.createElement("div", Object.assign({
559
- className: classNames([styles$1.container, _defineProperty({}, className, className !== null)]),
559
+ className: classNames([styles$3.container, _defineProperty({}, className, className !== null)]),
560
560
  style: _objectSpread(_objectSpread(_objectSpread({}, backgroundColorStyle), brandImageStyle), {}, {
561
561
  width: screenWidth
562
562
  }),
563
563
  "aria-hidden": focusable ? null : 'true'
564
564
  }, dragBind()), /*#__PURE__*/React.createElement("div", {
565
- className: styles$1.header
565
+ className: styles$3.header
566
566
  }, brandLogoUrl !== null ? /*#__PURE__*/React.createElement("div", {
567
- className: styles$1.organisation,
567
+ className: styles$3.organisation,
568
568
  style: {
569
569
  backgroundImage: "url(".concat(brandLogoUrl, ")")
570
570
  }
571
571
  }) : null, /*#__PURE__*/React.createElement("div", {
572
- className: styles$1.title,
572
+ className: styles$3.title,
573
573
  style: titleStyle
574
574
  }, title), /*#__PURE__*/React.createElement("div", {
575
- className: styles$1.buttons,
575
+ className: styles$3.buttons,
576
576
  style: colorSecondaryColorStyle
577
577
  }, /*#__PURE__*/React.createElement(ShareButton, {
578
- className: styles$1.shareButton,
579
- buttonClassName: styles$1.button,
578
+ className: styles$3.shareButton,
579
+ buttonClassName: styles$3.button,
580
580
  onShare: onShare,
581
581
  url: shareUrl,
582
582
  title: title,
583
583
  focusable: focusable
584
584
  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
585
- className: styles$1.icon,
585
+ className: styles$3.icon,
586
586
  icon: faShare
587
587
  })), fullscreenEnabled ? /*#__PURE__*/React.createElement(Button, {
588
- className: styles$1.button,
588
+ className: styles$3.button,
589
589
  onClick: toggleFullscreen,
590
590
  title: intl.formatMessage({
591
- "id": "AuxqcG",
592
- "defaultMessage": [{
591
+ id: "AuxqcG",
592
+ defaultMessage: [{
593
593
  "type": 0,
594
594
  "value": "Fullscreen"
595
595
  }]
596
596
  }),
597
597
  "aria-label": intl.formatMessage({
598
- "id": "AuxqcG",
599
- "defaultMessage": [{
598
+ id: "AuxqcG",
599
+ defaultMessage: [{
600
600
  "type": 0,
601
601
  "value": "Fullscreen"
602
602
  }]
603
603
  }),
604
604
  focusable: focusable
605
605
  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
606
- className: styles$1.icon,
606
+ className: styles$3.icon,
607
607
  icon: fullscreenActive ? faCompress : faExpand
608
608
  })) : null, /*#__PURE__*/React.createElement(Button, {
609
- className: styles$1.button,
609
+ className: styles$3.button,
610
610
  onClick: onClose,
611
611
  title: intl.formatMessage({
612
- "id": "dj/p/q",
613
- "defaultMessage": [{
612
+ id: "dj/p/q",
613
+ defaultMessage: [{
614
614
  "type": 0,
615
615
  "value": "Close"
616
616
  }]
617
617
  }),
618
618
  "aria-label": intl.formatMessage({
619
- "id": "dj/p/q",
620
- "defaultMessage": [{
619
+ id: "dj/p/q",
620
+ defaultMessage: [{
621
621
  "type": 0,
622
622
  "value": "Close"
623
623
  }]
624
624
  }),
625
625
  focusable: focusable
626
626
  }, /*#__PURE__*/React.createElement(FontAwesomeIcon, {
627
- className: styles$1.icon,
627
+ className: styles$3.icon,
628
628
  icon: faTimes
629
629
  })))), /*#__PURE__*/React.createElement("div", {
630
- className: styles$1.content
630
+ className: styles$3.content
631
631
  }, /*#__PURE__*/React.createElement(Scroll, {
632
- className: styles$1.scroll,
632
+ className: styles$3.scroll,
633
633
  onScrolledBottom: onScrolledBottom,
634
634
  onScrolledNotBottom: onScrolledNotBottom
635
635
  }, /*#__PURE__*/React.createElement("nav", {
636
- className: styles$1.nav
636
+ className: styles$3.nav
637
637
  }, /*#__PURE__*/React.createElement("ul", {
638
- className: styles$1.items
638
+ className: styles$3.items
639
639
  }, items.map(function (item, index) {
640
640
  var screenIndexLabel = intl.formatMessage({
641
- "id": "LkVfwW",
642
- "defaultMessage": [{
641
+ id: "LkVfwW",
642
+ defaultMessage: [{
643
643
  "type": 0,
644
644
  "value": "Screen "
645
645
  }, {
@@ -650,27 +650,27 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
650
650
  index: index + 1
651
651
  });
652
652
  var isCurrentScreenLabel = current === index ? " ".concat(intl.formatMessage({
653
- "id": "vmrJ8U",
654
- "defaultMessage": [{
653
+ id: "vmrJ8U",
654
+ defaultMessage: [{
655
655
  "type": 0,
656
656
  "value": "(current screen)"
657
657
  }]
658
658
  })) : '';
659
659
  var screenAriaLabel = screenIndexLabel + isCurrentScreenLabel;
660
660
  return /*#__PURE__*/React.createElement("li", {
661
- className: classNames([styles$1.item, _defineProperty({}, styles$1.active, current === index)]),
661
+ className: classNames([styles$3.item, _defineProperty({}, styles$3.active, current === index)]),
662
662
  key: "item-".concat(index),
663
663
  style: {
664
664
  paddingBottom: screenSizeRatio,
665
665
  width: "".concat(100 / thumbsPerLine, "%")
666
666
  }
667
667
  }, /*#__PURE__*/React.createElement("div", {
668
- className: styles$1.itemContent
668
+ className: styles$3.itemContent
669
669
  }, /*#__PURE__*/React.createElement("div", {
670
- className: styles$1.screenContainer,
670
+ className: styles$3.screenContainer,
671
671
  ref: index === 0 ? firstScreenContainerRef : null
672
672
  }, /*#__PURE__*/React.createElement("div", {
673
- className: styles$1.screenContent,
673
+ className: styles$3.screenContent,
674
674
  style: thumbSize !== null ? {
675
675
  width: screenWidth,
676
676
  height: screenRatioHeight,
@@ -683,11 +683,11 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
683
683
  screen: item,
684
684
  focusable: false
685
685
  })), current === index ? /*#__PURE__*/React.createElement("div", {
686
- className: styles$1.activeScreenBorder,
686
+ className: styles$3.activeScreenBorder,
687
687
  style: borderPrimaryColorStyle
688
688
  }) : null)), /*#__PURE__*/React.createElement("button", {
689
689
  type: "button",
690
- className: styles$1.screenButton,
690
+ className: styles$3.screenButton,
691
691
  onClick: function onClick() {
692
692
  onClickItem(index);
693
693
  },
@@ -700,7 +700,7 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
700
700
  tabIndex: focusable ? '0' : '-1'
701
701
  }));
702
702
  })))))) : null;
703
- };
703
+ }
704
704
 
705
705
  ViewerMenuPreview.propTypes = propTypes$4;
706
706
  ViewerMenuPreview.defaultProps = defaultProps$4;
@@ -821,7 +821,7 @@ var defaultProps$2 = {
821
821
  className: null
822
822
  };
823
823
 
824
- var Viewer = function Viewer(_ref) {
824
+ function Viewer(_ref) {
825
825
  var _ref15;
826
826
 
827
827
  var story = _ref.story,
@@ -1395,7 +1395,7 @@ var Viewer = function Viewer(_ref) {
1395
1395
  }
1396
1396
  });
1397
1397
  var key = "screen-viewer-".concat(scr.id || '', "-").concat(i + 1);
1398
- var screenTransform = landscape ? "translateX(calc(".concat((screenWidth + landscapeScreenMargin) * (i - screenIndex), "px - 50%)) scale(").concat(current ? 1 : 0.9, ")") : "translateX(".concat(current ? 0 : '100%', ")");
1398
+ var screenTransform = landscape ? "translateX(calc(".concat((screenWidth + landscapeScreenMargin) * (i - screenIndex), "px - 50%)) scale(").concat(current ? 1 : 0.9, ")") : "translateX(".concat(current ? 0 : "".concat(active ? '100' : '101', "%"), ")");
1399
1399
  return /*#__PURE__*/React.createElement(React.Fragment, {
1400
1400
  key: key
1401
1401
  }, current && screenIndex > 0 ? /*#__PURE__*/React.createElement("button", {
@@ -1422,8 +1422,8 @@ var Viewer = function Viewer(_ref) {
1422
1422
  ,
1423
1423
  "aria-hidden": current ? null : 'true',
1424
1424
  "aria-label": intl.formatMessage({
1425
- "id": "LkVfwW",
1426
- "defaultMessage": [{
1425
+ id: "LkVfwW",
1426
+ defaultMessage: [{
1427
1427
  "type": 0,
1428
1428
  "value": "Screen "
1429
1429
  }, {
@@ -1454,7 +1454,7 @@ var Viewer = function Viewer(_ref) {
1454
1454
  }]
1455
1455
  })) : null);
1456
1456
  })) : null)));
1457
- };
1457
+ }
1458
1458
 
1459
1459
  Viewer.propTypes = propTypes$2;
1460
1460
  Viewer.defaultProps = defaultProps$2;
package/lib/index.js CHANGED
@@ -21,10 +21,10 @@ var hooks = require('@micromag/core/hooks');
21
21
  var utils = require('@micromag/core/utils');
22
22
  var core$1 = require('@react-spring/core');
23
23
  var web = require('@react-spring/web');
24
+ var react = require('@use-gesture/react');
24
25
  var classNames = require('classnames');
25
26
  var reactHelmet = require('react-helmet');
26
27
  var reactIntl = require('react-intl');
27
- var reactUseGesture = require('react-use-gesture');
28
28
  var freeSolidSvgIcons = require('@fortawesome/free-solid-svg-icons');
29
29
  var reactFontawesome = require('@fortawesome/react-fontawesome');
30
30
  var Scroll = require('@micromag/element-scroll');
@@ -144,8 +144,8 @@ var ViewerMenuDots = function ViewerMenuDots(_ref) {
144
144
  return /*#__PURE__*/React__default["default"].createElement("nav", {
145
145
  className: classNames__default["default"]([styles$5.container, (_ref3 = {}, _defineProperty__default["default"](_ref3, className, className !== null), _defineProperty__default["default"](_ref3, styles$5.vertical, direction === 'vertical'), _defineProperty__default["default"](_ref3, styles$5.withShadow, withShadow), _ref3)]),
146
146
  "aria-label": intl.formatMessage({
147
- "id": "bLYuuN",
148
- "defaultMessage": [{
147
+ id: "bLYuuN",
148
+ defaultMessage: [{
149
149
  "type": 0,
150
150
  "value": "You are on screen "
151
151
  }, {
@@ -195,15 +195,15 @@ var ViewerMenuDots = function ViewerMenuDots(_ref) {
195
195
  }), /*#__PURE__*/React__default["default"].createElement("button", {
196
196
  type: "button",
197
197
  title: intl.formatMessage({
198
- "id": "F/gl4b",
199
- "defaultMessage": [{
198
+ id: "F/gl4b",
199
+ defaultMessage: [{
200
200
  "type": 0,
201
201
  "value": "Menu"
202
202
  }]
203
203
  }),
204
204
  "aria-label": intl.formatMessage({
205
- "id": "F/gl4b",
206
- "defaultMessage": [{
205
+ id: "F/gl4b",
206
+ defaultMessage: [{
207
207
  "type": 0,
208
208
  "value": "Menu"
209
209
  }]
@@ -224,15 +224,15 @@ var ViewerMenuDots = function ViewerMenuDots(_ref) {
224
224
  className: styles$5.closeButton,
225
225
  onClick: onClose,
226
226
  title: intl.formatMessage({
227
- "id": "dj/p/q",
228
- "defaultMessage": [{
227
+ id: "dj/p/q",
228
+ defaultMessage: [{
229
229
  "type": 0,
230
230
  "value": "Close"
231
231
  }]
232
232
  }),
233
233
  "aria-label": intl.formatMessage({
234
- "id": "dj/p/q",
235
- "defaultMessage": [{
234
+ id: "dj/p/q",
235
+ defaultMessage: [{
236
236
  "type": 0,
237
237
  "value": "Close"
238
238
  }]
@@ -245,7 +245,9 @@ var ViewerMenuDots = function ViewerMenuDots(_ref) {
245
245
  ViewerMenuDots.propTypes = propTypes$7;
246
246
  ViewerMenuDots.defaultProps = defaultProps$7;
247
247
 
248
- var styles$3 = {"container":"micromag-viewer-partials-share-modal-container","content":"micromag-viewer-partials-share-modal-content","opened":"micromag-viewer-partials-share-modal-opened"};
248
+ var styles$3 = {"container":"micromag-viewer-menus-menu-preview-container","screenButton":"micromag-viewer-menus-menu-preview-screenButton","activeScreenBorder":"micromag-viewer-menus-menu-preview-activeScreenBorder","itemContent":"micromag-viewer-menus-menu-preview-itemContent","scroll":"micromag-viewer-menus-menu-preview-scroll","header":"micromag-viewer-menus-menu-preview-header","button":"micromag-viewer-menus-menu-preview-button","shareButton":"micromag-viewer-menus-menu-preview-shareButton","disabled":"micromag-viewer-menus-menu-preview-disabled","icon":"micromag-viewer-menus-menu-preview-icon","buttons":"micromag-viewer-menus-menu-preview-buttons","organisation":"micromag-viewer-menus-menu-preview-organisation","title":"micromag-viewer-menus-menu-preview-title","content":"micromag-viewer-menus-menu-preview-content","nav":"micromag-viewer-menus-menu-preview-nav","item":"micromag-viewer-menus-menu-preview-item","items":"micromag-viewer-menus-menu-preview-items","active":"micromag-viewer-menus-menu-preview-active","screenContainer":"micromag-viewer-menus-menu-preview-screenContainer","screenContent":"micromag-viewer-menus-menu-preview-screenContent"};
249
+
250
+ var styles$2 = {"container":"micromag-viewer-partials-share-modal-container","content":"micromag-viewer-partials-share-modal-content","opened":"micromag-viewer-partials-share-modal-opened"};
249
251
 
250
252
  var propTypes$6 = {
251
253
  url: PropTypes__default["default"].string,
@@ -308,13 +310,13 @@ var ShareModal = function ShareModal(_ref) {
308
310
  }, [opened, onCancel]);
309
311
  hooks.useDocumentEvent('click', onDocumentClick, opened);
310
312
  return /*#__PURE__*/React__default["default"].createElement("div", {
311
- className: classNames__default["default"]([styles$3.container, (_ref2 = {}, _defineProperty__default["default"](_ref2, className, className), _defineProperty__default["default"](_ref2, styles$3.opened, opened), _ref2)]),
313
+ className: classNames__default["default"]([styles$2.container, (_ref2 = {}, _defineProperty__default["default"](_ref2, className, className), _defineProperty__default["default"](_ref2, styles$2.opened, opened), _ref2)]),
312
314
  ref: containerRef,
313
315
  "aria-hidden": opened ? null : '-1'
314
316
  }, /*#__PURE__*/React__default["default"].createElement("div", {
315
- className: styles$3.content
317
+ className: styles$2.content
316
318
  }, /*#__PURE__*/React__default["default"].createElement("div", {
317
- className: styles$3.buttons
319
+ className: styles$2.buttons
318
320
  }, /*#__PURE__*/React__default["default"].createElement(reactShare.FacebookShareButton, Object.assign({}, shareButtonProps, {
319
321
  quote: title,
320
322
  beforeOnClick: function beforeOnClick() {
@@ -342,7 +344,7 @@ var ShareModal = function ShareModal(_ref) {
342
344
  ShareModal.propTypes = propTypes$6;
343
345
  ShareModal.defaultProps = defaultProps$6;
344
346
 
345
- var styles$2 = {"container":"micromag-viewer-partials-share-button-container","shareModal":"micromag-viewer-partials-share-button-shareModal"};
347
+ var styles$1 = {"container":"micromag-viewer-partials-share-button-container","shareModal":"micromag-viewer-partials-share-button-shareModal"};
346
348
 
347
349
  var propTypes$5 = {
348
350
  title: PropTypes__default["default"].string,
@@ -394,27 +396,27 @@ var ShareButton = function ShareButton(_ref) {
394
396
  setStoryShareModalOpened(false);
395
397
  }, [setStoryShareModalOpened]);
396
398
  return /*#__PURE__*/React__default["default"].createElement("div", {
397
- className: classNames__default["default"]([styles$2.container, _defineProperty__default["default"]({}, className, className !== null)])
399
+ className: classNames__default["default"]([styles$1.container, _defineProperty__default["default"]({}, className, className !== null)])
398
400
  }, /*#__PURE__*/React__default["default"].createElement(components.Button, {
399
401
  className: classNames__default["default"]([_defineProperty__default["default"]({}, buttonClassName, buttonClassName !== null)]),
400
402
  onClick: onShareIconClick,
401
403
  title: intl.formatMessage({
402
- "id": "7tw6U2",
403
- "defaultMessage": [{
404
+ id: "7tw6U2",
405
+ defaultMessage: [{
404
406
  "type": 0,
405
407
  "value": "Share"
406
408
  }]
407
409
  }),
408
410
  "aria-label": intl.formatMessage({
409
- "id": "7tw6U2",
410
- "defaultMessage": [{
411
+ id: "7tw6U2",
412
+ defaultMessage: [{
411
413
  "type": 0,
412
414
  "value": "Share"
413
415
  }]
414
416
  }),
415
417
  focusable: focusable
416
418
  }, children), /*#__PURE__*/React__default["default"].createElement(ShareModal, {
417
- className: styles$2.shareModal,
419
+ className: styles$1.shareModal,
418
420
  opened: storyShareModalOpened,
419
421
  title: title,
420
422
  url: url,
@@ -426,8 +428,6 @@ var ShareButton = function ShareButton(_ref) {
426
428
  ShareButton.propTypes = propTypes$5;
427
429
  ShareButton.defaultProps = defaultProps$5;
428
430
 
429
- var styles$1 = {"container":"micromag-viewer-menus-menu-preview-container","screenButton":"micromag-viewer-menus-menu-preview-screenButton","activeScreenBorder":"micromag-viewer-menus-menu-preview-activeScreenBorder","itemContent":"micromag-viewer-menus-menu-preview-itemContent","scroll":"micromag-viewer-menus-menu-preview-scroll","header":"micromag-viewer-menus-menu-preview-header","button":"micromag-viewer-menus-menu-preview-button","shareButton":"micromag-viewer-menus-menu-preview-shareButton","disabled":"micromag-viewer-menus-menu-preview-disabled","icon":"micromag-viewer-menus-menu-preview-icon","buttons":"micromag-viewer-menus-menu-preview-buttons","organisation":"micromag-viewer-menus-menu-preview-organisation","title":"micromag-viewer-menus-menu-preview-title","content":"micromag-viewer-menus-menu-preview-content","nav":"micromag-viewer-menus-menu-preview-nav","item":"micromag-viewer-menus-menu-preview-item","items":"micromag-viewer-menus-menu-preview-items","active":"micromag-viewer-menus-menu-preview-active","screenContainer":"micromag-viewer-menus-menu-preview-screenContainer","screenContent":"micromag-viewer-menus-menu-preview-screenContent"};
430
-
431
431
  var propTypes$4 = {
432
432
  viewerTheme: core.PropTypes.viewerTheme,
433
433
  screenWidth: PropTypes__default["default"].number,
@@ -463,7 +463,7 @@ var defaultProps$4 = {
463
463
  className: null
464
464
  };
465
465
 
466
- var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
466
+ function ViewerMenuPreview(_ref) {
467
467
  var viewerTheme = _ref.viewerTheme,
468
468
  screenWidth = _ref.screenWidth,
469
469
  title = _ref.title,
@@ -551,7 +551,7 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
551
551
  scrolledBottom = _useState4[0],
552
552
  setScrolledBottom = _useState4[1];
553
553
 
554
- var dragBind = reactUseGesture.useDrag(function (_ref8) {
554
+ var dragBind = react.useDrag(function (_ref8) {
555
555
  var _ref8$direction = _slicedToArray__default["default"](_ref8.direction, 2),
556
556
  dy = _ref8$direction[1],
557
557
  last = _ref8.last,
@@ -573,90 +573,90 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
573
573
  setScrolledBottom(false);
574
574
  }, [setScrolledBottom]);
575
575
  return hasSize ? /*#__PURE__*/React__default["default"].createElement("div", Object.assign({
576
- className: classNames__default["default"]([styles$1.container, _defineProperty__default["default"]({}, className, className !== null)]),
576
+ className: classNames__default["default"]([styles$3.container, _defineProperty__default["default"]({}, className, className !== null)]),
577
577
  style: _objectSpread__default["default"](_objectSpread__default["default"](_objectSpread__default["default"]({}, backgroundColorStyle), brandImageStyle), {}, {
578
578
  width: screenWidth
579
579
  }),
580
580
  "aria-hidden": focusable ? null : 'true'
581
581
  }, dragBind()), /*#__PURE__*/React__default["default"].createElement("div", {
582
- className: styles$1.header
582
+ className: styles$3.header
583
583
  }, brandLogoUrl !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
584
- className: styles$1.organisation,
584
+ className: styles$3.organisation,
585
585
  style: {
586
586
  backgroundImage: "url(".concat(brandLogoUrl, ")")
587
587
  }
588
588
  }) : null, /*#__PURE__*/React__default["default"].createElement("div", {
589
- className: styles$1.title,
589
+ className: styles$3.title,
590
590
  style: titleStyle
591
591
  }, title), /*#__PURE__*/React__default["default"].createElement("div", {
592
- className: styles$1.buttons,
592
+ className: styles$3.buttons,
593
593
  style: colorSecondaryColorStyle
594
594
  }, /*#__PURE__*/React__default["default"].createElement(ShareButton, {
595
- className: styles$1.shareButton,
596
- buttonClassName: styles$1.button,
595
+ className: styles$3.shareButton,
596
+ buttonClassName: styles$3.button,
597
597
  onShare: onShare,
598
598
  url: shareUrl,
599
599
  title: title,
600
600
  focusable: focusable
601
601
  }, /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
602
- className: styles$1.icon,
602
+ className: styles$3.icon,
603
603
  icon: freeSolidSvgIcons.faShare
604
604
  })), fullscreenEnabled ? /*#__PURE__*/React__default["default"].createElement(components.Button, {
605
- className: styles$1.button,
605
+ className: styles$3.button,
606
606
  onClick: toggleFullscreen,
607
607
  title: intl.formatMessage({
608
- "id": "AuxqcG",
609
- "defaultMessage": [{
608
+ id: "AuxqcG",
609
+ defaultMessage: [{
610
610
  "type": 0,
611
611
  "value": "Fullscreen"
612
612
  }]
613
613
  }),
614
614
  "aria-label": intl.formatMessage({
615
- "id": "AuxqcG",
616
- "defaultMessage": [{
615
+ id: "AuxqcG",
616
+ defaultMessage: [{
617
617
  "type": 0,
618
618
  "value": "Fullscreen"
619
619
  }]
620
620
  }),
621
621
  focusable: focusable
622
622
  }, /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
623
- className: styles$1.icon,
623
+ className: styles$3.icon,
624
624
  icon: fullscreenActive ? freeSolidSvgIcons.faCompress : freeSolidSvgIcons.faExpand
625
625
  })) : null, /*#__PURE__*/React__default["default"].createElement(components.Button, {
626
- className: styles$1.button,
626
+ className: styles$3.button,
627
627
  onClick: onClose,
628
628
  title: intl.formatMessage({
629
- "id": "dj/p/q",
630
- "defaultMessage": [{
629
+ id: "dj/p/q",
630
+ defaultMessage: [{
631
631
  "type": 0,
632
632
  "value": "Close"
633
633
  }]
634
634
  }),
635
635
  "aria-label": intl.formatMessage({
636
- "id": "dj/p/q",
637
- "defaultMessage": [{
636
+ id: "dj/p/q",
637
+ defaultMessage: [{
638
638
  "type": 0,
639
639
  "value": "Close"
640
640
  }]
641
641
  }),
642
642
  focusable: focusable
643
643
  }, /*#__PURE__*/React__default["default"].createElement(reactFontawesome.FontAwesomeIcon, {
644
- className: styles$1.icon,
644
+ className: styles$3.icon,
645
645
  icon: freeSolidSvgIcons.faTimes
646
646
  })))), /*#__PURE__*/React__default["default"].createElement("div", {
647
- className: styles$1.content
647
+ className: styles$3.content
648
648
  }, /*#__PURE__*/React__default["default"].createElement(Scroll__default["default"], {
649
- className: styles$1.scroll,
649
+ className: styles$3.scroll,
650
650
  onScrolledBottom: onScrolledBottom,
651
651
  onScrolledNotBottom: onScrolledNotBottom
652
652
  }, /*#__PURE__*/React__default["default"].createElement("nav", {
653
- className: styles$1.nav
653
+ className: styles$3.nav
654
654
  }, /*#__PURE__*/React__default["default"].createElement("ul", {
655
- className: styles$1.items
655
+ className: styles$3.items
656
656
  }, items.map(function (item, index) {
657
657
  var screenIndexLabel = intl.formatMessage({
658
- "id": "LkVfwW",
659
- "defaultMessage": [{
658
+ id: "LkVfwW",
659
+ defaultMessage: [{
660
660
  "type": 0,
661
661
  "value": "Screen "
662
662
  }, {
@@ -667,27 +667,27 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
667
667
  index: index + 1
668
668
  });
669
669
  var isCurrentScreenLabel = current === index ? " ".concat(intl.formatMessage({
670
- "id": "vmrJ8U",
671
- "defaultMessage": [{
670
+ id: "vmrJ8U",
671
+ defaultMessage: [{
672
672
  "type": 0,
673
673
  "value": "(current screen)"
674
674
  }]
675
675
  })) : '';
676
676
  var screenAriaLabel = screenIndexLabel + isCurrentScreenLabel;
677
677
  return /*#__PURE__*/React__default["default"].createElement("li", {
678
- className: classNames__default["default"]([styles$1.item, _defineProperty__default["default"]({}, styles$1.active, current === index)]),
678
+ className: classNames__default["default"]([styles$3.item, _defineProperty__default["default"]({}, styles$3.active, current === index)]),
679
679
  key: "item-".concat(index),
680
680
  style: {
681
681
  paddingBottom: screenSizeRatio,
682
682
  width: "".concat(100 / thumbsPerLine, "%")
683
683
  }
684
684
  }, /*#__PURE__*/React__default["default"].createElement("div", {
685
- className: styles$1.itemContent
685
+ className: styles$3.itemContent
686
686
  }, /*#__PURE__*/React__default["default"].createElement("div", {
687
- className: styles$1.screenContainer,
687
+ className: styles$3.screenContainer,
688
688
  ref: index === 0 ? firstScreenContainerRef : null
689
689
  }, /*#__PURE__*/React__default["default"].createElement("div", {
690
- className: styles$1.screenContent,
690
+ className: styles$3.screenContent,
691
691
  style: thumbSize !== null ? {
692
692
  width: screenWidth,
693
693
  height: screenRatioHeight,
@@ -700,11 +700,11 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
700
700
  screen: item,
701
701
  focusable: false
702
702
  })), current === index ? /*#__PURE__*/React__default["default"].createElement("div", {
703
- className: styles$1.activeScreenBorder,
703
+ className: styles$3.activeScreenBorder,
704
704
  style: borderPrimaryColorStyle
705
705
  }) : null)), /*#__PURE__*/React__default["default"].createElement("button", {
706
706
  type: "button",
707
- className: styles$1.screenButton,
707
+ className: styles$3.screenButton,
708
708
  onClick: function onClick() {
709
709
  onClickItem(index);
710
710
  },
@@ -717,7 +717,7 @@ var ViewerMenuPreview = function ViewerMenuPreview(_ref) {
717
717
  tabIndex: focusable ? '0' : '-1'
718
718
  }));
719
719
  })))))) : null;
720
- };
720
+ }
721
721
 
722
722
  ViewerMenuPreview.propTypes = propTypes$4;
723
723
  ViewerMenuPreview.defaultProps = defaultProps$4;
@@ -838,7 +838,7 @@ var defaultProps$2 = {
838
838
  className: null
839
839
  };
840
840
 
841
- var Viewer = function Viewer(_ref) {
841
+ function Viewer(_ref) {
842
842
  var _ref15;
843
843
 
844
844
  var story = _ref.story,
@@ -1141,7 +1141,7 @@ var Viewer = function Viewer(_ref) {
1141
1141
  return "translateY(".concat(y * menuPreviewContainerHeight, "px)");
1142
1142
  })
1143
1143
  };
1144
- var menuDragBind = reactUseGesture.useDrag(function (_ref10) {
1144
+ var menuDragBind = react.useDrag(function (_ref10) {
1145
1145
  var _ref10$movement = _slicedToArray__default["default"](_ref10.movement, 2),
1146
1146
  my = _ref10$movement[1],
1147
1147
  first = _ref10.first,
@@ -1412,7 +1412,7 @@ var Viewer = function Viewer(_ref) {
1412
1412
  }
1413
1413
  });
1414
1414
  var key = "screen-viewer-".concat(scr.id || '', "-").concat(i + 1);
1415
- var screenTransform = landscape ? "translateX(calc(".concat((screenWidth + landscapeScreenMargin) * (i - screenIndex), "px - 50%)) scale(").concat(current ? 1 : 0.9, ")") : "translateX(".concat(current ? 0 : '100%', ")");
1415
+ var screenTransform = landscape ? "translateX(calc(".concat((screenWidth + landscapeScreenMargin) * (i - screenIndex), "px - 50%)) scale(").concat(current ? 1 : 0.9, ")") : "translateX(".concat(current ? 0 : "".concat(active ? '100' : '101', "%"), ")");
1416
1416
  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
1417
1417
  key: key
1418
1418
  }, current && screenIndex > 0 ? /*#__PURE__*/React__default["default"].createElement("button", {
@@ -1439,8 +1439,8 @@ var Viewer = function Viewer(_ref) {
1439
1439
  ,
1440
1440
  "aria-hidden": current ? null : 'true',
1441
1441
  "aria-label": intl.formatMessage({
1442
- "id": "LkVfwW",
1443
- "defaultMessage": [{
1442
+ id: "LkVfwW",
1443
+ defaultMessage: [{
1444
1444
  "type": 0,
1445
1445
  "value": "Screen "
1446
1446
  }, {
@@ -1471,7 +1471,7 @@ var Viewer = function Viewer(_ref) {
1471
1471
  }]
1472
1472
  })) : null);
1473
1473
  })) : null)));
1474
- };
1474
+ }
1475
1475
 
1476
1476
  Viewer.propTypes = propTypes$2;
1477
1477
  Viewer.defaultProps = defaultProps$2;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/viewer",
3
- "version": "0.2.401",
3
+ "version": "0.2.403",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -38,9 +38,7 @@
38
38
  "scss"
39
39
  ],
40
40
  "scripts": {
41
- "build:app": "cd src/app && NODE_ENV=production react-scripts build && rm -rf ../../public/ && mv ./build/ ../../public/",
42
- "prepare": "../../scripts/prepare-package.sh --scss",
43
- "start": "PUBLIC_URL=http://localhost/ react-scripts start"
41
+ "prepare": "../../scripts/prepare-package.sh --scss"
44
42
  },
45
43
  "devDependencies": {
46
44
  "react": "^16.8.0 || ^17.0.0",
@@ -55,14 +53,15 @@
55
53
  "@fortawesome/fontawesome-svg-core": "^1.2.32",
56
54
  "@fortawesome/free-solid-svg-icons": "^5.15.1",
57
55
  "@fortawesome/react-fontawesome": "^0.1.13",
58
- "@micromag/core": "^0.2.401",
59
- "@micromag/element-scroll": "^0.2.401",
60
- "@micromag/elements": "^0.2.401",
61
- "@micromag/fields": "^0.2.401",
62
- "@micromag/intl": "^0.2.401",
63
- "@micromag/screens": "^0.2.401",
56
+ "@micromag/core": "^0.2.403",
57
+ "@micromag/element-scroll": "^0.2.403",
58
+ "@micromag/elements": "^0.2.403",
59
+ "@micromag/fields": "^0.2.403",
60
+ "@micromag/intl": "^0.2.403",
61
+ "@micromag/screens": "^0.2.403",
64
62
  "@react-spring/core": "^9.1.1",
65
63
  "@react-spring/web": "^9.1.1",
64
+ "@use-gesture/react": "^10.2.4",
66
65
  "classnames": "^2.2.6",
67
66
  "lodash": "^4.17.21",
68
67
  "prop-types": "^15.7.2",
@@ -70,11 +69,10 @@
70
69
  "react-intl": "^5.12.1",
71
70
  "react-router": "^5.2.0",
72
71
  "react-router-dom": "^5.2.0",
73
- "react-share": "^4.3.1",
74
- "react-use-gesture": "^9.0.0"
72
+ "react-share": "^4.3.1"
75
73
  },
76
74
  "publishConfig": {
77
75
  "access": "public"
78
76
  },
79
- "gitHead": "fd03ec6d9decc9e18d6088a36e47c7b1e0e72b4c"
77
+ "gitHead": "7a6604651c990286e594350ef730d40772937195"
80
78
  }
package/scss/styles.scss CHANGED
@@ -1 +1 @@
1
- @import '~@micromag/viewer/assets/css/styles.css';
1
+ @import '..//assets/css/styles.css';