@geosolutions/react-joyride/lib/react-joyride-compiled.css.map

Create walkthroughs and guided tours for your apps

{"version":3,"sources":["webpack:///./styles/C:/Work/Projects/geosolutions-it/react-joyride/src/styles/react-joyride.scss"],"names":[],"mappings":"AA+EE,gBAhBA,6DACA,6BACA,SACA,eACA,qBACA,cACA,UAYE,YACA,kBACA,WACA,YAnFiB,CAsEnB,mEAGE,YAAa,CACd,uBAYG,0HACA,sBACA,kBACA,cACA,WACA,SACA,WACA,kBACA,QACA,yGACA,SAAU,CACX,uBAGC,0HACA,mCACA,sBACA,kBACA,sBACA,cACA,YACA,OACA,WACA,kBACA,MACA,6FACA,oFACA,UAAW,CACZ,iBAID,SACA,OACA,kBACA,QACA,MACA,YA3HiB,CA4HlB,cAGC,kBACA,+DACA,iBAAkB,CAHnB,qBAMG,kEA7HkC,CA8HnC,iBAID,sBACA,kBACA,WACA,eACA,0LACA,UACA,aACA,oBACA,wDACA,YACA,YAnJiB,CAqJjB,0BACE,sFACA,gEA7I8D,wDA8I/D,2BAGC,4BAEA,iBAAkB,CArBrB,mFA2BG,eA9HwD,CAmG3D,oKA8BK,sLACA,YACA,SACA,UACA,6FACA,UA/JyB,CA4H9B,0EA0CG,kBA7IwD,CAmG3D,2JA6CK,qLACA,aACA,YACA,SACA,6FACA,UA9KyB,CA4H9B,6GAyDK,QACA,mFAAwB,CAExB,oCA5DL,6GA6DO,OAAQ,CAEX,CA/DJ,+GAqEK,UACA,SACA,mFAAwB,CAExB,oCAzEL,+GA0EO,QAAS,CAEZ,CA5EJ,sBAgFG,iBAnLwD,CAmG3D,iDAmFK,qLACA,YACA,YACA,UAzLsD,CAmG3D,uBA2FG,gBA9LwD,CAmG3D,kDA8FK,sLACA,YACA,WACA,UApMsD,CAqMvD,wBA5KL,6DACA,6BACA,SACA,eACA,qBACA,cACA,UA2KI,kaACA,4BACA,wBACA,YACA,kBACA,WACA,qBACA,SACA,WACA,WAcE,aAAc,CAhMpB,2FAGE,YAAa,CACd,4DAkLK,wBACA,YAAa,CACd,gCAGC,WACA,QAjPsB,CAkPvB,yBAUD,6BACA,WACA,eACA,mBACA,mBACA,iBAAkB,CANnB,gDASG,mBAAoB,CACrB,uBAID,eACA,oBACA,kBAAmB,CACpB,yBAGC,gBAAiB,CAClB,yBAnOH,6DACA,6BACA,SACA,eACA,qBACA,cACA,SAAU,CAEV,8FAGE,YAAa,CACd,kCA6NK,sBACA,kBACA,WACA,iBACA,2CAA6C,CAL9C,yHAUG,yBACA,UAlRiB,CAmRlB,oCAID,WACA,iBAAkB,CACnB,+BAGC,WACA,WACA,iBAAkB,CACnB,oDAKC,gBAAiB,CAFpB,sDAMG,YAAa,CACd,oCAhML,iBAoMI,WAzT+B,CA+TlC,CAHC,oCAvMF,iBAwMI,WA7TsC,CA+TzC,CAGH,mCACE,GACE,+CAAqB,CAGvB,GACE,UACA,+EAAoC,EAPxC,2BACE,GACE,+CAAqB,CAGvB,GACE,UACA,+EAAoC,EAIxC,wCACE,IACE,UAAY,CAGd,IACE,UAAY,EANhB,gCACE,IACE,UAAY,CAGd,IACE,UAAY,EAIhB,wCACE,GACE,6CAAmB,CAGrB,IACE,WACA,iDAAsB,CAGxB,GACE,WACA,6CAAmB,EAZvB,gCACE,GACE,6CAAmB,CAGrB,IACE,WACA,iDAAsB,CAGxB,GACE,WACA,6CAAmB","file":"react-joyride-compiled.css","sourcesContent":["$joyride-color: #f04 !default;\r\n$joyride-zindex: 1500 !default;\r\n$joyride-overlay-color: rgba(#000, 0.5) !default;\r\n\r\n$joyride-beacon-color: $joyride-color !default;\r\n$joyride-beacon-size: 36px !default;\r\n\r\n$joyride-hole-border-radius: 4px !default;\r\n$joyride-hole-shadow: 0 0 15px rgba(#000, 0.5) !default;\r\n\r\n$joyride-tooltip-animation: joyride-tooltip 0.4s forwards;\r\n$joyride-tooltip-animation-timing: cubic-bezier(0, 1.05, 0.55, 1.18);\r\n\r\n$joyride-tooltip-arrow-size: 36px !default;\r\n$joyride-tooltip-bg-color: #fff !default;\r\n$joyride-tooltip-border-radius: 4px !default;\r\n$joyride-tooltip-color: #555 !default;\r\n$joyride-tooltip-font-size: 16px !default;\r\n$joyride-tooltip-padding: 20px !default;\r\n$joyride-tooltip-shadow: (x: 1px, y: 2px, blur: 3px, color: rgba(#000, 0.3)) !default;\r\n$joyride-tooltip-width: (290px, 360px, 450px) !default;\r\n\r\n$joyride-close: (color: rgba($joyride-tooltip-color, 0.5), size: 12px, top: 10px, right: 10px) !default;\r\n$joyride-close-visible: true !default;\r\n$joyride-close-image: 'data:image/svg+xml,%3Csvg%20width%3D%22#{map-get($joyride-close, 'size')}%22%20height%3D%22#{map-get($joyride-close, 'size')}%22%20viewBox%3D%220%200%2016%2016%22%20version%3D%221.1%22%20%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M14.117.323l-6.073%206.075-5.449-6.075c-.431-.431-1.131-.431-1.562%200-.431.431-.431%201.131%200%201.562l5.449%206.075-6.159%206.159c-.431.431-.431%201.134%200%201.562.431.431%201.131.431%201.562%200l6.075-6.073%205.449%206.073c.429.431%201.131.431%201.56%200%20.431-.429.431-1.131%200-1.562l-5.452-6.073%206.159-6.161c.431-.431.431-1.131%200-1.562-.431-.431-1.129-.431-1.56%200z%22%20fill%3D%22#{map-get($joyride-close, 'color')}%22%2F%3E%3C%2Fsvg%3E';\r\n\r\n$joyride-header-color: $joyride-tooltip-color !default;\r\n$joyride-header-font-size: 20px !default;\r\n$joyride-header-border-color: $joyride-color !default;\r\n$joyride-header-border-width: 1px !default;\r\n\r\n$joyride-button-bg-color: $joyride-color !default;\r\n$joyride-button-color: #fff !default;\r\n$joyride-button-border-radius: 4px !default;\r\n\r\n$joyride-back-button-color: $joyride-color !default;\r\n$joyride-skip-button-color: #ccc !default;\r\n\r\n$joyride-tooltip-arrow-height: $joyride-tooltip-arrow-size / 2;\r\n$joyride-tooltip-arrow-scale: ($joyride-tooltip-arrow-size / ($joyride-tooltip-arrow-size * 0 + 1)) / 16; // strip-units crazy hack\r\n\r\n@function joyride-arrow($location: top, $bg-color: $joyride-tooltip-bg-color) {\r\n  $height: $joyride-tooltip-arrow-height;\r\n  $width: $joyride-tooltip-arrow-size;\r\n  $rotate: '0';\r\n  $arrow-color: '%23' + str-slice(#{$bg-color}, 2);\r\n\r\n  @if $location == bottom {\r\n    $rotate: '180 8 4';\r\n  } @else if $location == left {\r\n    $height: $joyride-tooltip-arrow-size;\r\n    $width: $joyride-tooltip-arrow-height;\r\n    $rotate: '270 8 8';\r\n  } @else if $location == right {\r\n    $height: $joyride-tooltip-arrow-size;\r\n    $width: $joyride-tooltip-arrow-height;\r\n    $rotate: '90 4 4';\r\n  }\r\n\r\n  @return 'data:image/svg+xml,%3Csvg%20width%3D%22#{$width}%22%20height%3D%22#{$height}%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpolygon%20points%3D%220%2C%200%208%2C%208%2016%2C0%22%20fill%3D%22#{$arrow-color}%22%20transform%3D%22scale%28#{$joyride-tooltip-arrow-scale}%29%20rotate%28#{$rotate}%29%22%3E%3C%2Fpolygon%3E%3C%2Fsvg%3E';\r\n}\r\n\r\n@mixin reset-button() {\r\n  appearance: none;\r\n  background-color: transparent;\r\n  border: 0;\r\n  cursor: pointer;\r\n  display: inline-block;\r\n  line-height: 1;\r\n  padding: 0;\r\n\r\n  &:active,\r\n  &:focus,\r\n  &:hover {\r\n    outline: none;\r\n  }\r\n}\r\n\r\n.joyride {\r\n  &-beacon {\r\n    @include reset-button();\r\n    height: $joyride-beacon-size;\r\n    position: relative;\r\n    width: $joyride-beacon-size;\r\n    z-index: $joyride-zindex;\r\n\r\n    &__inner {\r\n      animation: joyride-beacon-inner 1.2s infinite ease-in-out;\r\n      background-color: $joyride-beacon-color;\r\n      border-radius: 50%;\r\n      display: block;\r\n      height: 50%;\r\n      left: 50%;\r\n      opacity: 0.7;\r\n      position: absolute;\r\n      top: 50%;\r\n      transform: translate(-50%, -50%);\r\n      width: 50%;\r\n    }\r\n\r\n    &__outer {\r\n      animation: joyride-beacon-outer 1.2s infinite ease-in-out;\r\n      background-color: rgba($joyride-beacon-color, 0.2);\r\n      border: ($joyride-beacon-size / 18) solid $joyride-beacon-color;\r\n      border-radius: 50%;\r\n      box-sizing: border-box;\r\n      display: block;\r\n      height: 100%;\r\n      left: 0;\r\n      opacity: 0.9;\r\n      position: absolute;\r\n      top: 0;\r\n      transform: translateY(-50%);\r\n      transform-origin: center;\r\n      width: 100%;\r\n    }\r\n  }\r\n\r\n  &-overlay {\r\n    bottom: 0;\r\n    left: 0;\r\n    position: absolute;\r\n    right: 0;\r\n    top: 0;\r\n    z-index: $joyride-zindex;\r\n  }\r\n\r\n  &-hole {\r\n    border-radius: $joyride-hole-border-radius;\r\n    box-shadow: 0 0 0 9999px $joyride-overlay-color, $joyride-hole-shadow;\r\n    position: absolute;\r\n\r\n    &.safari {\r\n      box-shadow: 0 0 999px 9999px $joyride-overlay-color, $joyride-hole-shadow;\r\n    }\r\n  }\r\n\r\n  &-tooltip {\r\n    background-color: $joyride-tooltip-bg-color;\r\n    border-radius: $joyride-tooltip-border-radius;\r\n    color: $joyride-tooltip-color;\r\n    cursor: default;\r\n    filter: drop-shadow(#{-(map-get($joyride-tooltip-shadow, 'x'))} #{-(map-get($joyride-tooltip-shadow, 'y'))} #{map-get($joyride-tooltip-shadow, 'blur')} #{map-get($joyride-tooltip-shadow, 'color')}) drop-shadow(#{map-get($joyride-tooltip-shadow, 'x')} #{map-get($joyride-tooltip-shadow, 'y')} #{map-get($joyride-tooltip-shadow, 'blur')} #{map-get($joyride-tooltip-shadow, 'color')});\r\n    opacity: 0;\r\n    padding: $joyride-tooltip-padding;\r\n    pointer-events: auto;\r\n    transform: translate3d(0, 0, 0);\r\n    width: nth($joyride-tooltip-width, 1);\r\n    z-index: $joyride-zindex + 10;\r\n\r\n    &--animate {\r\n      animation: $joyride-tooltip-animation;\r\n      animation-timing-function: $joyride-tooltip-animation-timing;\r\n    }\r\n\r\n    &__triangle {\r\n      background-repeat: no-repeat;\r\n      // overflow: hidden;\r\n      position: absolute;\r\n    }\r\n\r\n    &.bottom,\r\n    &.bottom-left,\r\n    &.bottom-right {\r\n      margin-top: $joyride-tooltip-arrow-height;\r\n\r\n      .joyride-tooltip__triangle {\r\n        background-image: url('#{joyride-arrow(bottom)}');\r\n        height: $joyride-tooltip-arrow-height;\r\n        left: 50%;\r\n        top: -($joyride-tooltip-arrow-height - 2);\r\n        transform: translateX(-50%);\r\n        width: $joyride-tooltip-arrow-size;\r\n      }\r\n    }\r\n\r\n    &.top,\r\n    &.top-left,\r\n    &.top-right {\r\n      margin-bottom: $joyride-tooltip-arrow-height;\r\n\r\n      .joyride-tooltip__triangle {\r\n        background-image: url('#{joyride-arrow(top)}');\r\n        bottom: -($joyride-tooltip-arrow-height - 2);\r\n        height: $joyride-tooltip-arrow-height;\r\n        left: 50%;\r\n        transform: translateX(-50%);\r\n        width: $joyride-tooltip-arrow-size;\r\n      }\r\n    }\r\n\r\n    &.bottom-left,\r\n    &.top-left {\r\n      .joyride-tooltip__triangle {\r\n        left: 3%;\r\n        transform: translateX(0);\r\n\r\n        @media screen and (min-width: 480px) {\r\n          left: 2%;\r\n        }\r\n      }\r\n    }\r\n\r\n    &.bottom-right,\r\n    &.top-right {\r\n      .joyride-tooltip__triangle {\r\n        left: auto;\r\n        right: 3%;\r\n        transform: translateX(0);\r\n\r\n        @media screen and (min-width: 480px) {\r\n          right: 2%;\r\n        }\r\n      }\r\n    }\r\n\r\n    &.left {\r\n      margin-right: $joyride-tooltip-arrow-height;\r\n\r\n      .joyride-tooltip__triangle {\r\n        background-image: url('#{joyride-arrow(left)}');\r\n        height: $joyride-tooltip-arrow-size;\r\n        right: -($joyride-tooltip-arrow-height - 2);\r\n        width: $joyride-tooltip-arrow-height;\r\n      }\r\n    }\r\n\r\n    &.right {\r\n      margin-left: $joyride-tooltip-arrow-height;\r\n\r\n      .joyride-tooltip__triangle {\r\n        background-image: url('#{joyride-arrow(right)}');\r\n        height: $joyride-tooltip-arrow-size;\r\n        left: -($joyride-tooltip-arrow-height - 2);\r\n        width: $joyride-tooltip-arrow-height;\r\n      }\r\n    }\r\n\r\n    &__close {\r\n      @include reset-button();\r\n      background-image: url($joyride-close-image);\r\n      background-repeat: no-repeat;\r\n      background-size: contain;\r\n      height: map-get($joyride-close, 'size');\r\n      position: absolute;\r\n      right: map-get($joyride-close, 'right');\r\n      text-decoration: none;\r\n      top: map-get($joyride-close, 'top');\r\n      width: map-get($joyride-close, 'size');\r\n      z-index: 10;\r\n\r\n      &:hover,\r\n      &:focus {\r\n        color: darken(map-get($joyride-close, 'color'), 10);\r\n        outline: none;\r\n      }\r\n\r\n      &--header {\r\n        right: $joyride-tooltip-padding;\r\n        top: $joyride-tooltip-padding;\r\n      }\r\n\r\n      @if $joyride-close-visible {\r\n        display: block;\r\n      } @else {\r\n        display: none;\r\n      }\r\n    }\r\n\r\n    &__header {\r\n      border-bottom: $joyride-header-border-width solid $joyride-header-border-color;\r\n      color: $joyride-header-color;\r\n      font-size: $joyride-header-font-size;\r\n      padding-bottom: 6px;\r\n      padding-right: 18px;\r\n      position: relative;\r\n\r\n      ~ .joyride-tooltip__main {\r\n        padding: 12px 0 18px;\r\n      }\r\n    }\r\n\r\n    &__main {\r\n      font-size: $joyride-tooltip-font-size;\r\n      padding-bottom: 18px;\r\n      padding-right: 18px;\r\n    }\r\n\r\n    &__footer {\r\n      text-align: right;\r\n    }\r\n\r\n    &__button {\r\n      @include reset-button();\r\n\r\n      &--primary {\r\n        background-color: $joyride-button-bg-color;\r\n        border-radius: $joyride-button-border-radius;\r\n        color: $joyride-button-color;\r\n        padding: 6px 12px;\r\n        transition: background-color 0.2s ease-in-out;\r\n\r\n        &:active,\r\n        &:focus,\r\n        &:hover {\r\n          background-color: lighten($joyride-button-bg-color, 6);\r\n          color: $joyride-button-color;\r\n        }\r\n      }\r\n\r\n      &--secondary {\r\n        color: $joyride-back-button-color;\r\n        margin-right: 10px;\r\n      }\r\n\r\n      &--skip {\r\n        color: $joyride-skip-button-color;\r\n        float: left;\r\n        margin-right: 10px;\r\n      }\r\n    }\r\n\r\n    &--standalone {\r\n      .joyride-tooltip__main {\r\n        padding-bottom: 0;\r\n      }\r\n\r\n      .joyride-tooltip__footer {\r\n        display: none;\r\n      }\r\n    }\r\n\r\n    @media screen and (min-width: 480px) {\r\n      width: nth($joyride-tooltip-width, 2);\r\n    }\r\n\r\n    @media screen and (min-width: 960px) {\r\n      width: nth($joyride-tooltip-width, 3);\r\n    }\r\n  }\r\n}\r\n\r\n@keyframes joyride-tooltip {\r\n  0% {\r\n    transform: scale(0.1);\r\n  }\r\n\r\n  100% {\r\n    opacity: 1;\r\n    transform: perspective(1px) scale(1);\r\n  }\r\n}\r\n\r\n@keyframes joyride-beacon-inner {\r\n  20% {\r\n    opacity: 0.9;\r\n  }\r\n\r\n  90% {\r\n    opacity: 0.7;\r\n  }\r\n}\r\n\r\n@keyframes joyride-beacon-outer {\r\n  0% {\r\n    transform: scale(1);\r\n  }\r\n\r\n  45% {\r\n    opacity: 0.7;\r\n    transform: scale(0.75);\r\n  }\r\n\r\n  100% {\r\n    opacity: 0.9;\r\n    transform: scale(1);\r\n  }\r\n}\r\n\n\n\n// WEBPACK FOOTER //\n// ./styles/C:/Work/Projects/geosolutions-it/react-joyride/src/styles/react-joyride.scss"],"sourceRoot":""}