hart-estate-widget 0.0.60 → 0.0.63

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.
package/README.md CHANGED
@@ -10,26 +10,19 @@
10
10
  ```js
11
11
  import React, { useEffect, useState } from 'react';
12
12
  import { Widget } from 'hart-estate-widget';
13
- import 'hart-estate-widget/build/index.css';
14
13
 
15
14
  const WIDGET_OPTIONS = {
16
- tabs: ['planImage', 'topView', 'topDownView', 'rotation', 'panorama'],
15
+ tabs: ['planImage', 'rotation', 'panorama'],
17
16
  logo: '/path/to/logo.png',
18
17
  planImage: '/path/to/plan.jpg',
19
- topView: '/path/to/top_view.jpg',
20
- topDownView: '/path/to/top_down_view.jpg',
21
18
  rotationImages: [
22
19
  '/path/to/rotation_image_1.jpg',
23
- '/path/to/rotation_image_2.jpg',
24
- '/path/to/rotation_image_3.jpg',
25
- '/path/to/rotation_image_4.jpg',
20
+ ...
26
21
  '/path/to/rotation_image_5.jpg',
27
22
  ],
28
23
  panoramaImages: [
29
24
  '/path/to/panorama_image_1.jpg',
30
- '/path/to/panorama_image_2.jpg',
31
- '/path/to/panorama_image_3.jpg',
32
- '/path/to/panorama_image_4.jpg',
25
+ ...
33
26
  '/path/to/panorama_image_5.jpg',
34
27
  ],
35
28
  };
@@ -40,7 +33,18 @@ const App = () => {
40
33
  useEffect(() => {
41
34
  const createdWidget = new Widget('#widget-container', WIDGET_OPTIONS);
42
35
 
36
+ const onResize = () => {
37
+ const { innerWidth: width, innerHeight: height } = window;
38
+ createdWidget.updateSize({ width, height });
39
+ };
40
+
41
+ window.addEventListener('resize', onResize);
42
+
43
43
  setState(createdWidget);
44
+
45
+ return function cleanup() {
46
+ window.removeEventListener('resize', onResize);
47
+ };
44
48
  }, []);
45
49
 
46
50
  return (
@@ -60,23 +64,23 @@ export App;
60
64
  ```js
61
65
  {
62
66
  // элементы
63
- tabs: ['planImage', 'topView', 'topDownView', 'rotation', 'panorama'], // включенные элементы
67
+ tabs: ['rotation', 'panorama'], // включенные элементы
64
68
 
65
69
  // логотип
66
70
  logo: '', // путь к логотипу
67
71
  logoUrl: '', // ссылка, открывающаяся по клику на логотип
68
72
 
69
73
  // локализация
70
- locale: 'en', // языковой код ISO 639 (Доступно: ru, en)
74
+ locale: 'en', // языковой код ISO 639
71
75
 
72
76
  // ширина/высота
73
- width: 500,
74
- height: 750,
77
+ width: 1920,
78
+ height: 1080,
75
79
 
76
80
  // значения
77
- planImage: '', // путь к изображению планировки
78
- topView: '', // путь к изображению вида сверху
79
- topDownView: '', // путь к изображению вида сверху под углом
81
+ planImage: '', // путь к изображению планировки (необходимо для панорамного тура)
82
+ topViewImage: '', // путь к изображению планировки сверху
83
+ rotationMode: 'default', // режим работы изображений планировки
80
84
  rotationImages: [], // пути к изображениям кругового просмотра (порядок обязателен)
81
85
  panoramaImages: [], // пути к изображениям 360°
82
86
  }
@@ -86,11 +90,15 @@ export App;
86
90
  ## Типы элементов
87
91
  ```js
88
92
  tabs: [
89
- 'planImage', // изображение планировки
90
- 'topView', // изображение вида сверху
91
- 'topDownView', // изображение вида сверху под углом
92
93
  'rotation', // изображения кругового просмотра (порядок обязателен)
93
94
  'panorama', // изображения 360°
94
- ]
95
+ ],
96
+ rotationMode: [
97
+ 'default', // режим просмотра вида сверху (несколько ракурсов) и стилизованной планировки
98
+ 'threesixty', // режим прокрутки изображений кругового просмотра
99
+ ],
100
+ locale: [
101
+ 'ru', // русский язык
102
+ 'en', // английский язык
103
+ ],
95
104
  ```
96
-
@@ -1 +1 @@
1
- .widget-application{--vh: 100vh;width:100%;height:calc(100*var(--vh));overflow:hidden;position:relative;z-index:1;background-color:#fff;font-size:20px}.widget-application *,.widget-application *:before,.widget-application *:after{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:"Roboto Mono",sans-serif;text-decoration:none;font-weight:700;color:#413e3e;outline:none;padding:0;margin:0;box-sizing:border-box;-webkit-box-sizing:border-box}.widget-application .widget-logo{position:absolute;left:45px;top:30px;z-index:3}@media only screen and (max-width: 900px){.widget-application .widget-logo{left:20px;top:30px}}@media only screen and (max-width: 374px){.widget-application .widget-logo{top:25px}}.widget-application .widget-logo img{display:block;width:82px;height:82px;object-fit:contain;object-position:center}@media only screen and (max-width: 900px){.widget-application .widget-logo img{width:65px;height:65px}}@media only screen and (max-width: 545px){.widget-application .widget-logo img{width:42px;height:42px}}@media only screen and (max-width: 374px){.widget-application .widget-logo img{width:36px;height:36px}}.widget-application .widget-tab__panorama-close-map,.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{position:absolute;right:45px;top:36px;z-index:3;padding:10px;touch-action:none;ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-close-map,.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{right:17px;top:35px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-close-map,.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{padding:5px;right:20px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-close-map,.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{top:25px}}.widget-application .widget-tab__panorama-close-map img,.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{display:block;width:50px;height:50px;object-fit:contain;object-position:center}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-close-map img,.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{width:40px;height:40px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-close-map img,.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{width:32px;height:32px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-close-map img,.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{width:26px;height:26px}}.widget-application .widget-tab-buttons{position:absolute;z-index:3;right:44px;bottom:35px;display:flex;align-items:center;justify-content:flex-end}@media only screen and (max-width: 900px){.widget-application .widget-tab-buttons{right:20px;bottom:35px}}@media only screen and (max-width: 374px){.widget-application .widget-tab-buttons{bottom:30px}}.widget-application .widget-tab-button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;background-color:#eaeaea;color:#413e3e;font-size:28px;line-height:120%;font-weight:bold;margin-left:40px}@media only screen and (max-width: 900px){.widget-application .widget-tab-button{margin-left:20px;width:60px;height:60px;font-size:22px}}@media only screen and (max-width: 545px){.widget-application .widget-tab-button{margin-left:10px;font-size:17px;width:44px;height:44px}}@media only screen and (max-width: 374px){.widget-application .widget-tab-button{width:36px;height:36px;font-size:14px}}.widget-application .widget-tab-button--active{background-color:#fac62d}.widget-application .widget-tab{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:60px 30px}@media(max-width: 630px){.widget-application .widget-tab{padding:60px 20px}}.widget-application .widget-tab__image{max-width:100%;max-height:100%;object-fit:contain;display:block}.widget-application .widget-tab__threesixty{width:100%;height:100%;touch-action:none;-webkit-touch-action:none}.widget-application .widget-tab__threesixty-start{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;position:absolute;left:50%;bottom:35px;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;padding:0 25px 0 10px;background-color:#eaeaea;border-radius:38px;height:72px;width:202px}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start{height:60px;width:166px;padding:0 20px 0 8px;bottom:35px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__threesixty-start{height:44px;width:115px;padding:0 10px 0 6px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__threesixty-start{height:36px;width:94px;padding:0 8px 0 6px;bottom:30px}}.widget-application .widget-tab__threesixty-start-icon{display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#fff;margin-right:18px;padding:10px}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start-icon{padding:7px;margin-right:15px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__threesixty-start-icon{margin-right:7px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__threesixty-start-icon{padding:6px;margin-right:5px}}.widget-application .widget-tab__threesixty-start-icon img{display:block;position:relative;top:2px;width:34px}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start-icon img{width:30px;top:1px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__threesixty-start-icon img{width:19px;top:0}}@media only screen and (max-width: 374px){.widget-application .widget-tab__threesixty-start-icon img{width:15px}}.widget-application .widget-tab__threesixty-start span{font-size:24px;font-weight:bold;color:#413e3e;text-transform:uppercase;width:100%;display:block;text-align:center;position:relative;top:1px}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start span{font-size:20px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__threesixty-start span{font-size:14px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__threesixty-start span{font-size:12px}}.widget-application .widget-tab__threesixty-container{width:100% !important;height:100% !important;position:relative;background-image:none !important}.widget-application .widget-tab__threesixty-container img{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);max-width:100%;max-height:100%;width:600px;height:600px;object-fit:contain;opacity:0;pointer-events:none;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none}.widget-application .widget-tab__threesixty-container img.active{opacity:1}.widget-application .widget-tab__threesixty--active .widget-tab__threesixty-container{cursor:move}.widget-application .widget-tab-menu{position:absolute;z-index:3;left:15px;top:15px;max-height:100%;overflow-y:auto;padding-bottom:30px}.widget-application .widget-tab-menu__wallpapers{display:flex;flex-wrap:wrap;align-items:flex-start;margin-top:10px;width:100%}.widget-application .widget-tab-menu__wallpapers img{width:30px;height:30px;display:block;object-fit:cover;cursor:pointer;margin-right:10px;margin-block-end:10px}.widget-application .widget-tab-menu ul{list-style-type:none}.widget-application .widget-tab-menu ul li{color:#413e3e;background-color:#fac62d;padding:5px 15px;border-radius:10px;font-size:.7rem;border:none;cursor:pointer;margin-bottom:15px;width:200px;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none}.widget-application .widget-tab-menu ul li label{display:flex;cursor:inherit;width:100%}.widget-application .widget-tab-menu ul li input[type=color]{cursor:pointer;margin-left:auto;width:50px;height:20px;border:0;border-radius:5px}.widget-application .widget-tab-menu ul li input[type=color]::-webkit-color-swatch-wrapper{display:none !important}.widget-application .widget-tab-menu ul li input[type=file]{display:none}.widget-application .widget-tab-menu ul li:nth-child(1){position:relative}.widget-application .widget-tab-menu ul li:nth-child(1)::after{--bar-width: 2px;content:"";width:20px;height:15px;display:block;background:repeating-linear-gradient(180deg, #000000, #000000 var(--bar-width), rgba(0, 0, 0, 0) var(--bar-width), rgba(0, 0, 0, 0) calc(var(--bar-width) * 3));position:absolute;right:10px;top:50%;transform:translateY(-50%)}.widget-application .widget-instructions{position:absolute;z-index:2;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-position:center;background-repeat:no-repeat;background-size:cover}.widget-application .widget-instructions__content{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;background-color:rgba(234,234,234,.85);border-radius:20px;overflow:hidden;width:400px;max-width:calc(100% - 60px);padding:36px 30px 30px 30px;backdrop-filter:blur(5px);-moz-backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}@media only screen and (max-width: 545px){.widget-application .widget-instructions__content{width:280px;padding:26px 20px 20px 20px}}.widget-application .widget-instructions__steps{display:flex;align-items:flex-start;justify-content:center}.widget-application .widget-instructions__step{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;margin:0 15px}@media only screen and (max-width: 900px){.widget-application .widget-instructions__step{margin:0 10px}}.widget-application .widget-instructions__step img{display:block;width:52px;height:80px;object-fit:contain;object-position:center}@media only screen and (max-width: 545px){.widget-application .widget-instructions__step img{width:40px;height:60px}}@media only screen and (max-width: 374px){.widget-application .widget-instructions__step img{width:35px}}.widget-application .widget-instructions__step p{color:#413e3e;font-size:20px;font-weight:bold;text-align:center;margin-top:10px;max-width:130px}@media only screen and (max-width: 900px){.widget-application .widget-instructions__step p{font-size:18px;max-width:115px}}@media only screen and (max-width: 545px){.widget-application .widget-instructions__step p{font-size:16px}}@media only screen and (max-width: 374px){.widget-application .widget-instructions__step p{font-size:14px}}.widget-application .widget-instructions button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;display:flex;align-items:center;justify-content:center;height:44px;padding:0 33px;border-radius:52px;background-color:#fac62d;color:#413e3e;font-size:24px;font-weight:bold;text-transform:uppercase;margin:25px auto 0 auto}@media only screen and (max-width: 900px){.widget-application .widget-instructions button{font-size:18px;height:40px}}@media only screen and (max-width: 545px){.widget-application .widget-instructions button{font-size:16px;height:35px}}@media only screen and (max-width: 374px){.widget-application .widget-instructions button{font-size:14px;height:26px;padding:0 25px}}.widget-application .widget-tab__panorama{width:100%;height:100%;position:absolute;left:0;top:0;z-index:2}.widget-application .widget-tab__panorama-overlay{width:100%;height:100%;overflow:hidden;background:#fff !important}.widget-application .widget-tab__panorama-overlay *{display:none !important}.widget-application .widget-tab__panorama-overlay canvas{display:block !important}.widget-application .widget-tab__panorama-controls{position:absolute;z-index:2;left:50%;bottom:35px;display:flex;align-items:center;justify-content:center;padding:8px;border-radius:38px;background-color:rgba(0,0,0,.2);transform:translateX(-50%);backdrop-filter:blur(5px);-moz-backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-controls{padding:5px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-controls{bottom:30px}}.widget-application .widget-tab__panorama-controls-button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;width:55px;height:55px;border-radius:50%;background-color:#fff;display:flex;align-items:center;justify-content:center;margin-right:18px}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-controls-button{width:44px;height:44px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-controls-button{margin-right:10px;width:33px;height:33px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-controls-button{width:26px;height:26px}}.widget-application .widget-tab__panorama-controls-button img{display:block}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.7)}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.52)}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.45)}}.widget-application .widget-tab__panorama-controls-button:nth-last-child(1){margin-right:0}.widget-application .widget-tab__panorama-close-map{z-index:4}.widget-application .widget-tab__panorama-map{position:absolute;left:45px;bottom:35px;z-index:3;border-radius:10px;opacity:1;transition:opacity .5s;touch-action:none;-webkit-touch-action:none}.widget-application .widget-tab__panorama-map::before{content:"";position:absolute;z-index:-1;left:50%;top:50%;transform:translate(-50%, -50%);width:calc(100% + 16px);height:calc(100% + 16px);border-radius:inherit;background-color:#fff}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-map{left:20px;transform:scale(0.6);transform-origin:0% 100%}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-map{transform:scale(0.4)}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-map{bottom:30px;transform:scale(0.35)}}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-map--scaled{transform:scale(1.4) translate(-50%, 50%);left:50%;bottom:50%}.widget-application .widget-tab__panorama-map--scaled::after{content:"";position:absolute;z-index:-2;left:50%;top:50%;transform:translate(-50%, -50%);width:100vw;height:calc(100*var(--vh));background-color:rgba(196,196,196,.8)}.widget-application .widget-tab__panorama-map--scaled svg polygon:active{opacity:.3 !important}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-map--scaled{transform:scale(1) translate(-50%, 50%)}}.widget-application .widget-tab__panorama-map--hidden{opacity:0;pointer-events:none}.widget-application .widget-tab__panorama-map img{width:200px;border-radius:none;display:block;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none;-webkit-backface-visibility:hidden;-ms-transform:translateZ(0);-webkit-transform:translateZ(0);transform:translateZ(0)}.widget-application .widget-tab__panorama-map img:hover{box-shadow:1px 1px 10px rgba(0,0,0,.15)}.widget-application .widget-tab__panorama-map svg{position:absolute;left:0;top:0;width:200px;height:100%;z-index:3;display:block;border-radius:inherit}.widget-application .widget-tab__panorama-map svg polygon{opacity:0;fill:#fac62d;cursor:pointer}.widget-application .widget-tab__panorama-map svg polygon:hover{opacity:.3}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-map svg polygon:hover{opacity:0}}.widget-application .widget-tab__panorama-map__fov{position:absolute;left:0;top:0;width:0px;height:0px;border-radius:50%;border-left:30px solid rgba(250,198,45,0);border-right:30px solid rgba(250,198,45,0);border-bottom:30px solid rgba(250,198,45,0);border-top:40px solid rgba(250,198,45,.4);transform:translate(-50%, -50%) rotate(0rad);transform-origin:50% 50%;z-index:4;pointer-events:none}.widget-application .widget-tab__panorama-map__fov::before{content:"";position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%, -50%) translateY(-5px);width:15px;height:15px;background-color:#fac62d;border-radius:50%;border:2px solid #fac62d;box-shadow:inset 0 0 0 2px #fff}.widget-loader{display:block;position:relative;width:80px;height:80px}.widget-loader--absolute{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}.widget-loader--sm{transform:translate(-50%, -50%) scale(0.75)}.widget-loader div{position:absolute;top:33px;width:13px;height:13px;border-radius:50%;background:#fac62d;animation-timing-function:cubic-bezier(0, 1, 1, 0)}.widget-loader div:nth-child(1){left:8px;animation:widget-loader-1 .6s infinite}.widget-loader div:nth-child(2){left:8px;animation:widget-loader-2 .6s infinite}.widget-loader div:nth-child(3){left:32px;animation:widget-loader-2 .6s infinite}.widget-loader div:nth-child(4){left:56px;animation:widget-loader-3 .6s infinite}@keyframes widget-loader-1{0%{transform:scale(0)}100%{transform:scale(1)}}@keyframes widget-loader-3{0%{transform:scale(1)}100%{transform:scale(0)}}@keyframes widget-loader-2{0%{transform:translate(0, 0)}100%{transform:translate(24px, 0)}}.widget-application .widget-tab__model{width:100%;height:100%;position:absolute;left:0;top:0;z-index:2}.widget-application .widget-tab__model-scene{width:100%;height:100%;display:block}.widget-application .widget-tab__model-joystick{position:absolute;left:100px;bottom:100px;opacity:0;pointer-events:none}@media only screen and (max-width: 545px){.widget-application .widget-tab__model-joystick{left:50%;transform:translateX(-50%)}}.widget-application .widget-tab__model-joystick--active{opacity:1;pointer-events:unset}/*# sourceMappingURL=app.css.map */
1
+ .widget-application{--vh: 100vh;width:100%;height:calc(100*var(--vh));flex:none;overflow:hidden;position:relative;z-index:1;background-color:#fff;font-size:20px}.widget-application *,.widget-application *:before,.widget-application *:after{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:"Roboto Mono",sans-serif;text-decoration:none;font-weight:700;color:#413e3e;outline:none;padding:0;margin:0;box-sizing:border-box;-webkit-box-sizing:border-box}.widget-application .widget-logo{position:absolute;left:45px;top:30px;z-index:3}.widget-application--tablet.widget-application .widget-logo{left:20px;top:30px}.widget-application--smallMobile.widget-application .widget-logo{top:25px}.widget-application .widget-logo img{display:block;width:82px;height:82px;object-fit:contain;object-position:center}.widget-application--tablet.widget-application .widget-logo img{width:65px;height:65px}.widget-application--mobile.widget-application .widget-logo img{width:42px;height:42px}.widget-application--smallMobile.widget-application .widget-logo img{width:36px;height:36px}.widget-application .widget-tab__panorama-close-map{position:absolute;right:45px;top:36px;z-index:3;padding:10px;touch-action:none;ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer}.widget-application--tablet.widget-application .widget-tab__panorama-close-map{right:17px;top:35px}.widget-application--mobile.widget-application .widget-tab__panorama-close-map{padding:5px;right:20px}.widget-application--smallMobile.widget-application .widget-tab__panorama-close-map{top:25px}.widget-application .widget-tab__panorama-close-map img{display:block;width:50px;height:50px;object-fit:contain;object-position:center}.widget-application--tablet.widget-application .widget-tab__panorama-close-map img{width:40px;height:40px}.widget-application--mobile.widget-application .widget-tab__panorama-close-map img{width:32px;height:32px}.widget-application--smallMobile.widget-application .widget-tab__panorama-close-map img{width:26px;height:26px}.widget-application .widget-enter-fullscreen{position:absolute;right:45px;top:36px;z-index:3;padding:10px;touch-action:none;ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer}.widget-application--tablet.widget-application .widget-enter-fullscreen{right:17px;top:35px}.widget-application--mobile.widget-application .widget-enter-fullscreen{padding:5px;right:20px}.widget-application--smallMobile.widget-application .widget-enter-fullscreen{top:25px}.widget-application .widget-enter-fullscreen img{display:block;width:50px;height:50px;object-fit:contain;object-position:center}.widget-application--tablet.widget-application .widget-enter-fullscreen img{width:40px;height:40px}.widget-application--mobile.widget-application .widget-enter-fullscreen img{width:32px;height:32px}.widget-application--smallMobile.widget-application .widget-enter-fullscreen img{width:26px;height:26px}.widget-application .widget-exit-fullscreen{position:absolute;right:45px;top:36px;z-index:3;padding:10px;touch-action:none;ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer}.widget-application--tablet.widget-application .widget-exit-fullscreen{right:17px;top:35px}.widget-application--mobile.widget-application .widget-exit-fullscreen{padding:5px;right:20px}.widget-application--smallMobile.widget-application .widget-exit-fullscreen{top:25px}.widget-application .widget-exit-fullscreen img{display:block;width:50px;height:50px;object-fit:contain;object-position:center}.widget-application--tablet.widget-application .widget-exit-fullscreen img{width:40px;height:40px}.widget-application--mobile.widget-application .widget-exit-fullscreen img{width:32px;height:32px}.widget-application--smallMobile.widget-application .widget-exit-fullscreen img{width:26px;height:26px}.widget-application .widget-tab-buttons{position:absolute;z-index:3;right:44px;bottom:35px;display:flex;align-items:center;justify-content:flex-end}.widget-application--tablet.widget-application .widget-tab-buttons{right:20px;bottom:35px}.widget-application--smallMobile.widget-application .widget-tab-buttons{bottom:30px}.widget-application .widget-tab-button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;background-color:#eaeaea;color:#413e3e;font-size:28px;line-height:120%;font-weight:bold;margin-left:40px}.widget-application--tablet.widget-application .widget-tab-button{margin-left:20px;width:60px;height:60px;font-size:22px}.widget-application--mobile.widget-application .widget-tab-button{margin-left:10px;font-size:17px;width:44px;height:44px}.widget-application--smallMobile.widget-application .widget-tab-button{width:36px;height:36px;font-size:14px}.widget-application .widget-tab-button--active{background-color:#fac62d}.widget-application .widget-tab{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:60px 30px}.widget-application--smallMobile.widget-application .widget-tab{padding:60px 20px}.widget-application .widget-tab-menu{position:absolute;z-index:3;left:15px;top:15px;max-height:100%;overflow-y:auto;padding-bottom:30px}.widget-application .widget-tab-menu__wallpapers{display:flex;flex-wrap:wrap;align-items:flex-start;margin-top:10px;width:100%}.widget-application .widget-tab-menu__wallpapers img{width:30px;height:30px;display:block;object-fit:cover;cursor:pointer;margin-right:10px;margin-block-end:10px}.widget-application .widget-tab-menu ul{list-style-type:none}.widget-application .widget-tab-menu ul li{color:#413e3e;background-color:#fac62d;padding:5px 15px;border-radius:10px;font-size:.7rem;border:none;cursor:pointer;margin-bottom:15px;width:200px;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none}.widget-application .widget-tab-menu ul li label{display:flex;cursor:inherit;width:100%}.widget-application .widget-tab-menu ul li input[type=color]{cursor:pointer;margin-left:auto;width:50px;height:20px;border:0;border-radius:5px}.widget-application .widget-tab-menu ul li input[type=color]::-webkit-color-swatch-wrapper{display:none !important}.widget-application .widget-tab-menu ul li input[type=file]{display:none}.widget-application .widget-tab-menu ul li:nth-child(1){position:relative}.widget-application .widget-tab-menu ul li:nth-child(1)::after{--bar-width: 2px;content:"";width:20px;height:15px;display:block;background:repeating-linear-gradient(180deg, #000000, #000000 var(--bar-width), rgba(0, 0, 0, 0) var(--bar-width), rgba(0, 0, 0, 0) calc(var(--bar-width) * 3));position:absolute;right:10px;top:50%;transform:translateY(-50%)}.widget-application .widget-instructions{position:absolute;z-index:2;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-position:center;background-repeat:no-repeat;background-size:cover}.widget-application .widget-instructions__content{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;background-color:rgba(234,234,234,.85);border-radius:20px;overflow:hidden;width:400px;max-width:calc(100% - 60px);padding:36px 30px 30px 30px;backdrop-filter:blur(5px);-moz-backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.widget-application--mobile.widget-application .widget-instructions__content{width:280px;padding:26px 20px 20px 20px}.widget-application .widget-instructions__steps{display:flex;align-items:flex-start;justify-content:center}.widget-application .widget-instructions__step{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;margin:0 15px}.widget-application--tablet.widget-application .widget-instructions__step{margin:0 10px}.widget-application .widget-instructions__step img{display:block;width:52px;height:80px;object-fit:contain;object-position:center}.widget-application--mobile.widget-application .widget-instructions__step img{width:40px;height:60px}.widget-application--smallMobile.widget-application .widget-instructions__step img{width:35px}.widget-application .widget-instructions__step p{color:#413e3e;font-size:20px;font-weight:bold;text-align:center;margin-top:10px;max-width:130px}.widget-application--tablet.widget-application .widget-instructions__step p{font-size:18px;max-width:115px}.widget-application--mobile.widget-application .widget-instructions__step p{font-size:16px}.widget-application--smallMobile.widget-application .widget-instructions__step p{font-size:14px}.widget-application .widget-instructions button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;display:flex;align-items:center;justify-content:center;height:44px;padding:0 33px;border-radius:52px;background-color:#fac62d;color:#413e3e;font-size:24px;font-weight:bold;text-transform:uppercase;margin:25px auto 0 auto}.widget-application--tablet.widget-application .widget-instructions button{font-size:18px;height:40px}.widget-application--mobile.widget-application .widget-instructions button{font-size:16px;height:35px}.widget-application--smallMobile.widget-application .widget-instructions button{font-size:14px;height:26px;padding:0 25px}.widget-application .widget-tab__panorama{width:100%;height:100%;position:absolute;left:0;top:0;z-index:2}.widget-application .widget-tab__panorama-overlay{width:100%;height:100%;overflow:hidden;background:#fff !important}.widget-application .widget-tab__panorama-overlay *{display:none !important}.widget-application .widget-tab__panorama-overlay canvas{display:block !important}.widget-application .widget-tab__panorama-controls{position:absolute;z-index:2;left:50%;bottom:35px;display:flex;align-items:center;justify-content:center;padding:8px;border-radius:38px;background-color:rgba(0,0,0,.2);transform:translateX(-50%);backdrop-filter:blur(5px);-moz-backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.widget-application--mobile.widget-application .widget-tab__panorama-controls{padding:5px}.widget-application--smallMobile.widget-application .widget-tab__panorama-controls{bottom:30px}.widget-application .widget-tab__panorama-controls-button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;width:55px;height:55px;border-radius:50%;background-color:#fff;display:flex;align-items:center;justify-content:center;margin-right:18px}.widget-application--tablet.widget-application .widget-tab__panorama-controls-button{width:44px;height:44px}.widget-application--mobile.widget-application .widget-tab__panorama-controls-button{margin-right:10px;width:33px;height:33px}.widget-application--smallMobile.widget-application .widget-tab__panorama-controls-button{width:26px;height:26px}.widget-application .widget-tab__panorama-controls-button img{display:block}.widget-application--tablet.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.7)}.widget-application--mobile.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.52)}.widget-application--smallMobile.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.45)}.widget-application .widget-tab__panorama-controls-button:nth-last-child(1){margin-right:0}.widget-application .widget-tab__panorama-close-map{z-index:4}.widget-application .widget-tab__panorama-map{position:absolute;left:45px;bottom:35px;z-index:3;border-radius:10px;opacity:1;transition:opacity .5s;touch-action:none;-webkit-touch-action:none}.widget-application .widget-tab__panorama-map::before{content:"";position:absolute;z-index:-1;left:50%;top:50%;transform:translate(-50%, -50%);width:calc(100% + 16px);height:calc(100% + 16px);border-radius:inherit;background-color:#fff}.widget-application--tablet.widget-application .widget-tab__panorama-map{left:20px;transform:scale(0.6);transform-origin:0% 100%}.widget-application--mobile.widget-application .widget-tab__panorama-map{transform:scale(0.4)}.widget-application--smallMobile.widget-application .widget-tab__panorama-map{bottom:30px;transform:scale(0.35)}.widget-application--tablet.widget-application .widget-tab__panorama-map--scaled{transform:scale(1.4) translate(-50%, 50%);left:50%;bottom:50%}.widget-application--tablet.widget-application .widget-tab__panorama-map--scaled::after{content:"";position:absolute;z-index:-2;left:50%;top:50%;transform:translate(-50%, -50%);width:100vw;height:calc(100*var(--vh));background-color:rgba(196,196,196,.8)}.widget-application--tablet.widget-application .widget-tab__panorama-map--scaled svg polygon:active{opacity:.3 !important}.widget-application--mobile.widget-application .widget-tab__panorama-map--scaled{transform:scale(1) translate(-50%, 50%)}.widget-application .widget-tab__panorama-map--hidden{opacity:0;pointer-events:none}.widget-application .widget-tab__panorama-map img{width:200px;border-radius:none;display:block;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none;-webkit-backface-visibility:hidden;-ms-transform:translateZ(0);-webkit-transform:translateZ(0);transform:translateZ(0)}.widget-application .widget-tab__panorama-map img:hover{box-shadow:1px 1px 10px rgba(0,0,0,.15)}.widget-application .widget-tab__panorama-map svg{position:absolute;left:0;top:0;width:200px;height:100%;z-index:3;display:block;border-radius:inherit}.widget-application .widget-tab__panorama-map svg polygon{opacity:0;fill:#fac62d;cursor:pointer}.widget-application .widget-tab__panorama-map svg polygon:hover{opacity:.3}.widget-application .widget-tab__panorama-map__fov{position:absolute;left:0;top:0;width:0px;height:0px;border-radius:50%;border-left:30px solid rgba(250,198,45,0);border-right:30px solid rgba(250,198,45,0);border-bottom:30px solid rgba(250,198,45,0);border-top:40px solid rgba(250,198,45,.4);transform:translate(-50%, -50%) rotate(0rad);transform-origin:50% 50%;z-index:4;pointer-events:none}.widget-application .widget-tab__panorama-map__fov::before{content:"";position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%, -50%) translateY(-5px);width:15px;height:15px;background-color:#fac62d;border-radius:50%;border:2px solid #fac62d;box-shadow:inset 0 0 0 2px #fff}.widget-application .widget-tab__threesixty{width:100%;height:100%;touch-action:none;-webkit-touch-action:none}.widget-application .widget-tab__threesixty-start{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;position:absolute;left:50%;bottom:35px;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;padding:0 25px 0 10px;background-color:#eaeaea;border-radius:38px;height:72px;width:202px}.widget-application--tablet.widget-application .widget-tab__threesixty-start{height:60px;width:166px;padding:0 20px 0 8px;bottom:35px}.widget-application--mobile.widget-application .widget-tab__threesixty-start{height:44px;width:115px;padding:0 10px 0 6px}.widget-application--smallMobile.widget-application .widget-tab__threesixty-start{height:36px;width:85px;padding:0 8px 0 6px;bottom:30px}.widget-application .widget-tab__threesixty-start-icon{display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#fff;margin-right:18px;padding:10px}.widget-application--tablet.widget-application .widget-tab__threesixty-start-icon{padding:7px;margin-right:15px}.widget-application--mobile.widget-application .widget-tab__threesixty-start-icon{margin-right:7px}.widget-application--smallMobile.widget-application .widget-tab__threesixty-start-icon{padding:6px;margin-right:5px}.widget-application .widget-tab__threesixty-start-icon img{display:block;position:relative;top:2px;width:34px}.widget-application--tablet.widget-application .widget-tab__threesixty-start-icon img{width:30px;top:1px}.widget-application--mobile.widget-application .widget-tab__threesixty-start-icon img{width:19px;top:0}.widget-application--smallMobile.widget-application .widget-tab__threesixty-start-icon img{width:15px}.widget-application .widget-tab__threesixty-start span{font-size:24px;font-weight:bold;color:#413e3e;text-transform:uppercase;width:100%;display:block;text-align:center;position:relative;top:1px}.widget-application--tablet.widget-application .widget-tab__threesixty-start span{font-size:20px}.widget-application--mobile.widget-application .widget-tab__threesixty-start span{font-size:14px}.widget-application--smallMobile.widget-application .widget-tab__threesixty-start span{font-size:10px;top:0}.widget-application .widget-tab__threesixty-container{width:100% !important;height:100% !important;position:relative;background-image:none !important}.widget-application .widget-tab__threesixty-container img{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);max-width:100%;max-height:100%;width:600px;height:600px;object-fit:contain;opacity:0;pointer-events:none;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none}.widget-application .widget-tab__threesixty-container img.active{opacity:1}.widget-application .widget-tab__threesixty--active .widget-tab__threesixty-container{cursor:move}.widget-application .widget-loader{display:block;position:relative;width:80px;height:80px}.widget-application .widget-loader--absolute{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}.widget-application .widget-loader--sm{transform:translate(-50%, -50%) scale(0.75)}.widget-application .widget-loader div{position:absolute;top:33px;width:13px;height:13px;border-radius:50%;background:#fac62d;animation-timing-function:cubic-bezier(0, 1, 1, 0)}.widget-application .widget-loader div:nth-child(1){left:8px;animation:widget-loader-1 .6s infinite}.widget-application .widget-loader div:nth-child(2){left:8px;animation:widget-loader-2 .6s infinite}.widget-application .widget-loader div:nth-child(3){left:32px;animation:widget-loader-2 .6s infinite}.widget-application .widget-loader div:nth-child(4){left:56px;animation:widget-loader-3 .6s infinite}@keyframes widget-loader-1{0%{transform:scale(0)}100%{transform:scale(1)}}@keyframes widget-loader-3{0%{transform:scale(1)}100%{transform:scale(0)}}@keyframes widget-loader-2{0%{transform:translate(0, 0)}100%{transform:translate(24px, 0)}}.widget-application .widget-tab__model{width:100%;height:100%;position:absolute;left:0;top:0;z-index:2}.widget-application .widget-tab__model-scene{width:100%;height:100%;display:block}.widget-application .widget-tab__model-joystick{position:absolute;left:100px;bottom:100px;opacity:0;pointer-events:none}.widget-application--mobile.widget-application .widget-tab__model-joystick{left:50%;transform:translateX(-50%)}.widget-application .widget-tab__model-joystick--active{opacity:1;pointer-events:unset}/*# sourceMappingURL=app.css.map */
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../../../src/assets/sass/index.sass","../../../src/assets/sass/vars.sass","../../../src/assets/sass/mixin.sass","../../../src/assets/sass/components/tabs.sass","../../../src/assets/sass/components/instructions.sass","../../../src/assets/sass/components/panorama.sass","../../../src/assets/sass/components/loader.sass","../../../src/assets/sass/components/model.sass"],"names":[],"mappings":"AAGA,oBACE,YAEA,WACA,2BACA,gBACA,kBACA,UACA,iBCLM,KDMN,eAEA,+EACE,mCACA,kCACA,qCACA,qBACA,gBACA,MCRQ,QDSR,aACA,UACA,SACA,sBACA,8BAEF,iCACE,kBACA,UACA,SACA,UACA,0CALF,iCAMI,UACA,UACF,0CARF,iCASI,UACF,qCACE,cACA,WACA,YACA,mBACA,uBACA,0CANF,qCAOI,WACA,aACF,0CATF,qCAUI,WACA,aACF,0CAZF,qCAaI,WACA,aAEN,6IAGE,kBACA,WACA,SACA,UACA,aACA,kBE5DF,YACA,YACA,gBACA,yBACA,eF0DE,0CAVF,6IAWI,WACA,UACF,0CAbF,6IAcI,YACA,YACF,0CAhBF,6IAiBI,UACF,yJACE,cACA,WACA,YACA,mBACA,uBACA,0CANF,yJAOI,WACA,aACF,0CATF,yJAUI,WACA,aACF,0CAZF,yJAaI,WACA,aGjFN,wCACE,kBACA,UACA,WACA,YACA,aACA,mBACA,yBACA,0CARF,wCASI,WACA,aACF,0CAXF,wCAYI,aACJ,uCDhBA,YACA,YACA,gBACA,yBACA,eCcE,WACA,YACA,kBACA,aACA,mBACA,uBACA,iBFjBG,QEkBH,MFdQ,QEeR,eACA,iBACA,iBACA,iBACA,0CAdF,uCAeI,iBACA,WACA,YACA,gBACF,0CAnBF,uCAoBI,iBACA,eACA,WACA,aACF,0CAxBF,uCAyBI,WACA,YACA,gBACF,+CACE,iBFpCM,QEsCV,gCACE,WACA,YACA,aACA,mBACA,uBACA,kBACA,yBAPF,gCAQI,mBACF,uCACE,eACA,gBACA,mBACA,cACF,4CACE,WACA,YF3CJ,kBACA,0BE4CI,kDDjEJ,YACA,YACA,gBACA,yBACA,eC+DM,kBACA,SACA,YACA,2BACA,aACA,mBACA,uBACA,sBACA,iBFpED,QEqEC,mBACA,YACA,YACA,0CAdF,kDAeI,YACA,YACA,qBACA,aACF,0CAnBF,kDAoBI,YACA,YACA,sBACF,0CAvBF,kDAwBI,YACA,WACA,oBACA,aACF,uDACE,aACA,mBACA,uBACA,kBACA,iBF7FF,KE8FE,kBACA,aACA,0CARF,uDASI,YACA,mBACF,0CAXF,uDAYI,kBACF,0CAbF,uDAcI,YACA,kBACF,2DACE,cACA,kBACA,QACA,WACA,0CALF,2DAMI,WACA,SACF,0CARF,2DASI,WACA,OACF,0CAXF,2DAYI,YACN,uDACE,eACA,iBACA,MFlHE,QEmHF,yBACA,WACA,cACA,kBACA,kBACA,QACA,0CAVF,uDAWI,gBACF,0CAZF,uDAaI,gBACF,0CAdF,uDAeI,gBACN,sDACE,sBACA,uBACA,kBACA,iCACA,0DACE,kBACA,SACA,QACA,gCACA,eACA,gBACA,YACA,aACA,mBACA,UACA,oBF5IR,iBACA,yBACA,eACA,uBE2IQ,iEACE,UAEJ,sFACE,YAEN,qCACE,kBACA,UACA,UACA,SACA,gBACA,gBACA,oBACA,iDACE,aACA,eACA,uBACA,gBACA,WACA,qDACE,WACA,YACA,cACA,iBACA,eACA,kBACA,sBACJ,wCACE,qBACA,2CACE,MFhLE,QEiLF,iBFnLE,QEoLF,iBACA,mBACA,gBACA,YACA,eACA,mBACA,YFrLR,iBACA,yBACA,eACA,uBEoLQ,iDACE,aACA,eACA,WAEA,6DACE,eACA,iBACA,WACA,YACA,SACA,kBACA,2FACE,wBACJ,4DACE,aACJ,wDACE,kBACA,+DACE,iBACA,WACA,WACA,YACA,cACA,gKACA,kBACA,WACA,QACA,2BC9NZ,yCACE,kBACA,UACA,OACA,MACA,WACA,YACA,aACA,mBACA,uBACA,2BACA,4BACA,sBAEA,kDACE,aACA,sBACA,mBACA,2BACA,uCACA,mBACA,gBACA,YACA,4BACA,4BFpBJ,0BACA,+BACA,kCEoBI,0CAZF,kDAaI,YACA,6BACJ,gDACE,aACA,uBACA,uBACF,+CACE,aACA,sBACA,mBACA,2BACA,cACA,0CANF,+CAOI,eACF,mDACE,cACA,WACA,YACA,mBACA,uBACA,0CANF,mDAOI,WACA,aACF,0CATF,mDAUI,YACJ,iDACE,MH7CI,QG8CJ,eACA,iBACA,kBACA,gBACA,gBACA,0CAPF,iDAQI,eACA,iBACF,0CAVF,iDAWI,gBACF,0CAZF,iDAaI,gBACN,gDFrEF,YACA,YACA,gBACA,yBACA,eEmEI,aACA,mBACA,uBACA,YACA,eACA,mBACA,iBHpEM,QGqEN,MHnEM,QGoEN,eACA,iBACA,yBACA,wBACA,0CAdF,gDAeI,eACA,aACF,0CAjBF,gDAkBI,eACA,aACF,0CApBF,gDAqBI,eACA,YACA,gBCxFJ,0CACE,WACA,YACA,kBACA,OACA,MACA,UACA,kDACE,WACA,YACA,gBACA,2BACA,oDACE,wBACF,yDACE,yBACJ,mDACE,kBACA,UACA,SACA,YACA,aACA,mBACA,uBACA,YACA,mBACA,gCACA,2BHxBN,0BACA,+BACA,kCGwBM,0CAbF,mDAcI,aACF,0CAfF,mDAgBI,aACF,0DHrCN,YACA,YACA,gBACA,yBACA,eGmCQ,WACA,YACA,kBACA,iBJrCF,KIsCE,aACA,mBACA,uBACA,kBACA,0CAVF,0DAWI,WACA,aACF,0CAbF,0DAcI,kBACA,WACA,aACF,0CAjBF,0DAkBI,WACA,aACF,8DACE,cACA,0CAFF,8DAGI,sBACF,0CAJF,8DAKI,uBACF,0CANF,8DAOI,uBACJ,4EACE,eACN,oDACE,UACF,8CACE,kBACA,UACA,YACA,UACA,mBACA,UACA,uBJxDN,kBACA,0BIyDM,sDACE,WACA,kBACA,WACA,SACA,QACA,gCACA,wBACA,yBACA,sBACA,iBJnFF,KIoFA,0CApBF,8CAqBI,UACA,qBACA,0BACF,0CAxBF,8CAyBI,sBACF,0CA1BF,8CA2BI,YACA,uBAEA,0CADF,sDAEI,0CACA,SACA,WACA,6DACE,WACA,kBACA,WACA,SACA,QACA,gCACA,YACA,2BACA,sCAGE,yEACE,uBACR,0CAnBF,sDAoBI,yCACJ,sDACE,UACA,oBACF,kDACE,YACA,mBACA,cJ/GR,iBACA,yBACA,eACA,uBAOA,mCACA,4BACA,gCACA,wBIqGQ,wDACE,wCACJ,kDACE,kBACA,OACA,MACA,YACA,YACA,UACA,cACA,sBACA,0DACE,UACA,KJpIA,QIqIA,eACA,gEACE,WACA,0CAFF,gEAGI,WACR,mDACE,kBACA,OACA,MACA,UACA,WACA,kBACA,0CACA,2CACA,4CACA,0CACA,6CACA,yBACA,UACA,oBACA,2DACE,WACA,kBACA,UACA,SACA,QACA,iDACA,WACA,YACA,iBJlKA,QImKA,kBACA,yBACA,gCC7KZ,eACE,cACA,kBACA,WACA,YACA,yBACE,kBACA,SACA,QACA,gCACF,mBACE,4CACF,mBACE,kBACA,SACA,WACA,YACA,kBACA,WLVQ,QKWR,mDACA,gCACE,SACA,uCACF,gCACE,SACA,uCACF,gCACE,UACA,uCACF,gCACE,UACA,uCAEN,2BACE,GACE,mBACF,KACE,oBAEJ,2BACE,GACE,mBACF,KACE,oBAEJ,2BACE,GACE,0BAEF,KACE,8BChDA,uCACE,WACA,YACA,kBACA,OACA,MACA,UACA,6CACE,WACA,YACA,cACF,gDACE,kBACA,WACA,aACA,UACA,oBACA,0CANF,gDAOI,SACA,4BACF,wDACE,UACA","file":"app.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../../../src/assets/sass/index.sass","../../../src/assets/sass/vars.sass","../../../src/assets/sass/mixin.sass","../../../src/assets/sass/components/tabs.sass","../../../src/assets/sass/components/instructions.sass","../../../src/assets/sass/components/panorama.sass","../../../src/assets/sass/components/rotation.sass","../../../src/assets/sass/components/loader.sass","../../../src/assets/sass/components/model.sass"],"names":[],"mappings":"AAGA,oBACE,YAEA,WACA,2BACA,UACA,gBACA,kBACA,UACA,iBCPM,KDQN,eAEA,+EACE,mCACA,kCACA,qCACA,qBACA,gBACA,MCVQ,QDWR,aACA,UACA,SACA,sBACA,8BAEF,iCACE,kBACA,UACA,SACA,UElBO,4DFoBL,UACA,SErBK,iEFuBL,SACF,qCACE,cACA,WACA,YACA,mBACA,uBE7BK,gEF+BH,WACA,YEhCG,gEFkCH,WACA,YEnCG,qEFqCH,WACA,YAEN,oDEpCA,kBACA,WACA,SACA,UACA,aACA,kBAtBA,YACA,YACA,gBACA,yBACA,eASS,+EAYP,WACA,SAbO,+EAeP,YACA,WAhBO,oFAkBP,SACF,wDACE,cACA,WACA,YACA,mBACA,uBAxBO,mFA0BL,WACA,YA3BK,mFA6BL,WACA,YA9BK,wFAgCL,WACA,YFSJ,6CEtCA,kBACA,WACA,SACA,UACA,aACA,kBAtBA,YACA,YACA,gBACA,yBACA,eASS,wEAYP,WACA,SAbO,wEAeP,YACA,WAhBO,6EAkBP,SACF,iDACE,cACA,WACA,YACA,mBACA,uBAxBO,4EA0BL,WACA,YA3BK,4EA6BL,WACA,YA9BK,iFAgCL,WACA,YFWJ,4CExCA,kBACA,WACA,SACA,UACA,aACA,kBAtBA,YACA,YACA,gBACA,yBACA,eASS,uEAYP,WACA,SAbO,uEAeP,YACA,WAhBO,4EAkBP,SACF,gDACE,cACA,WACA,YACA,mBACA,uBAxBO,2EA0BL,WACA,YA3BK,2EA6BL,WACA,YA9BK,gFAgCL,WACA,YC3CJ,wCACE,kBACA,UACA,WACA,YACA,aACA,mBACA,yBDGO,mECDL,WACA,oFAEA,YACJ,uCDhBA,YACA,YACA,gBACA,yBACA,eCcE,WACA,YACA,kBACA,aACA,mBACA,uBACA,iBFlBG,QEmBH,MFfQ,QEgBR,eACA,iBACA,iBACA,iBDhBO,kECkBL,iBACA,WACA,YACA,eDrBK,kECuBL,iBACA,eACA,WACA,YD1BK,uEC4BL,WACA,YACA,eACF,+CACE,iBFrCM,QEuCV,gCACE,WACA,YACA,aACA,mBACA,uBACA,kBDxCO,gEC0CL,kBACF,qCACE,kBACA,UACA,UACA,SACA,gBACA,gBACA,oBACA,iDACE,aACA,eACA,uBACA,gBACA,WACA,qDACE,WACA,YACA,cACA,iBACA,eACA,kBACA,sBACJ,wCACE,qBACA,2CACE,MFvEE,QEwEF,iBF1EE,QE2EF,iBACA,mBACA,gBACA,YACA,eACA,mBACA,YF5ER,iBACA,yBACA,eACA,uBE2EQ,iDACE,aACA,eACA,WAEA,6DACE,eACA,iBACA,WACA,YACA,SACA,kBACA,2FACE,wBACJ,4DACE,aACJ,wDACE,kBACA,+DACE,iBACA,WACA,WACA,YACA,cACA,gKACA,kBACA,WACA,QACA,2BCpHZ,yCACE,kBACA,UACA,OACA,MACA,WACA,YACA,aACA,mBACA,uBACA,2BACA,4BACA,sBAEA,kDACE,aACA,sBACA,mBACA,2BACA,uCACA,mBACA,gBACA,YACA,4BACA,4BFpBJ,0BACA,+BACA,kCAIS,6EEiBH,YACA,4BACJ,gDACE,aACA,uBACA,uBACF,+CACE,aACA,sBACA,mBACA,2BACA,cF5BK,0EE8BH,cACF,mDACE,cACA,WACA,YACA,mBACA,uBFpCG,8EEsCD,WACA,YFvCC,mFEyCD,WACJ,iDACE,MH9CI,QG+CJ,eACA,iBACA,kBACA,gBACA,gBFhDG,4EEkDD,eACA,gBFnDC,4EEqDD,eFrDC,iFEuDD,eACN,gDFrEF,YACA,YACA,gBACA,yBACA,eEmEI,aACA,mBACA,uBACA,YACA,eACA,mBACA,iBHrEM,QGsEN,MHpEM,QGqEN,eACA,iBACA,yBACA,wBFrEK,2EEuEH,eACA,YFxEG,2EE0EH,eACA,YF3EG,gFE6EH,eACA,YACA,eCxFJ,0CACE,WACA,YACA,kBACA,OACA,MACA,UACA,kDACE,WACA,YACA,gBACA,2BACA,oDACE,wBACF,yDACE,yBACJ,mDACE,kBACA,UACA,SACA,YACA,aACA,mBACA,uBACA,YACA,mBACA,gCACA,2BHxBN,0BACA,+BACA,kCAIS,8EGqBD,YHrBC,mFGuBD,YACF,0DHrCN,YACA,YACA,gBACA,yBACA,eGmCQ,WACA,YACA,kBACA,iBJtCF,KIuCE,aACA,mBACA,uBACA,kBHjCC,qFGmCC,WACA,YHpCD,qFGsCC,kBACA,WACA,YHxCD,0FG0CC,WACA,YACF,8DACE,cH7CD,yFG+CG,qBH/CH,yFGiDG,sBHjDH,8FGmDG,sBACJ,4EACE,eACN,oDACE,UACF,8CACE,kBACA,UACA,YACA,UACA,mBACA,UACA,uBJzDN,kBACA,0BI0DM,sDACE,WACA,kBACA,WACA,SACA,QACA,gCACA,wBACA,yBACA,sBACA,iBJpFF,KCSG,yEG6ED,UACA,qBACA,yBH/EC,yEGiFD,qBHjFC,8EGmFD,YACA,sBHpFC,iFGuFC,0CACA,SACA,WACA,wFACE,WACA,kBACA,WACA,SACA,QACA,gCACA,YACA,2BACA,sCAGE,oGACE,sBHvGP,iFGyGC,wCACJ,sDACE,UACA,oBACF,kDACE,YACA,mBACA,cJhHR,iBACA,yBACA,eACA,uBAOA,mCACA,4BACA,gCACA,wBIsGQ,wDACE,wCACJ,kDACE,kBACA,OACA,MACA,YACA,YACA,UACA,cACA,sBACA,0DACE,UACA,KJrIA,QIsIA,eACA,gEACE,WACN,mDACE,kBACA,OACA,MACA,UACA,WACA,kBACA,0CACA,2CACA,4CACA,0CACA,6CACA,yBACA,UACA,oBACA,2DACE,WACA,kBACA,UACA,SACA,QACA,iDACA,WACA,YACA,iBJjKA,QIkKA,kBACA,yBACA,gCCxKR,4CACE,WACA,YLaJ,kBACA,0BKZI,kDJRJ,YACA,YACA,gBACA,yBACA,eIMM,kBACA,SACA,YACA,2BACA,aACA,mBACA,uBACA,sBACA,iBLZD,QKaC,mBACA,YACA,YJRG,6EIUD,YACA,YACA,qBACA,YJbC,6EIeD,YACA,YACA,qBJjBC,kFImBD,YACA,WACA,oBACA,YACF,uDACE,aACA,mBACA,uBACA,kBACA,iBLrCF,KKsCE,kBACA,aJ9BC,kFIgCC,YACA,kBJjCD,kFImCC,iBJnCD,uFIqCC,YACA,iBACF,2DACE,cACA,kBACA,QACA,WJ3CD,sFI6CG,WACA,QJ9CH,sFIgDG,WACA,MJjDH,2FImDG,WACN,uDACE,eACA,iBACA,ML1DE,QK2DF,yBACA,WACA,cACA,kBACA,kBACA,QJ7DC,kFI+DC,eJ/DD,kFIiEC,eJjED,uFImEC,eACA,MACN,sDACE,sBACA,uBACA,kBACA,iCACA,0DACE,kBACA,SACA,QACA,gCACA,eACA,gBACA,YACA,aACA,mBACA,UACA,oBLrFR,iBACA,yBACA,eACA,uBKoFQ,iEACE,UAEJ,sFACE,YCtGR,mCACE,cACA,kBACA,WACA,YACA,6CACE,kBACA,SACA,QACA,gCACF,uCACE,4CACF,uCACE,kBACA,SACA,WACA,YACA,kBACA,WNZM,QMaN,mDACA,oDACE,SACA,uCACF,oDACE,SACA,uCACF,oDACE,UACA,uCACF,oDACE,UACA,uCAER,2BACE,GACE,mBACF,KACE,oBAEJ,2BACE,GACE,mBACF,KACE,oBAEJ,2BACE,GACE,0BAEF,KACE,8BCjDA,uCACE,WACA,YACA,kBACA,OACA,MACA,UACA,6CACE,WACA,YACA,cACF,gDACE,kBACA,WACA,aACA,UACA,oBNNG,2EMQD,SACA,2BACF,wDACE,UACA","file":"app.css"}
@@ -28,7 +28,7 @@
28
28
  max-width: calc(100% - 60px)
29
29
  padding: 36px 30px 30px 30px
30
30
  @include blurBackground(5px)
31
- @media #{$mobile}
31
+ @include media($mobile)
32
32
  width: 280px
33
33
  padding: 26px 20px 20px 20px
34
34
  &__steps
@@ -41,7 +41,7 @@
41
41
  align-items: center
42
42
  justify-content: flex-start
43
43
  margin: 0 15px
44
- @media #{$tablet}
44
+ @include media($tablet)
45
45
  margin: 0 10px
46
46
  img
47
47
  display: block
@@ -49,10 +49,10 @@
49
49
  height: 80px
50
50
  object-fit: contain
51
51
  object-position: center
52
- @media #{$mobile}
52
+ @include media($mobile)
53
53
  width: 40px
54
54
  height: 60px
55
- @media #{$w-374}
55
+ @include media($smallMobile)
56
56
  width: 35px
57
57
  p
58
58
  color: $text-dark
@@ -61,12 +61,12 @@
61
61
  text-align: center
62
62
  margin-top: 10px
63
63
  max-width: 130px
64
- @media #{$tablet}
64
+ @include media($tablet)
65
65
  font-size: 18px
66
66
  max-width: 115px
67
- @media #{$mobile}
67
+ @include media($mobile)
68
68
  font-size: 16px
69
- @media #{$w-374}
69
+ @include media($smallMobile)
70
70
  font-size: 14px
71
71
  button
72
72
  @include customButton
@@ -82,13 +82,13 @@
82
82
  font-weight: bold
83
83
  text-transform: uppercase
84
84
  margin: 25px auto 0 auto
85
- @media #{$tablet}
85
+ @include media($tablet)
86
86
  font-size: 18px
87
87
  height: 40px
88
- @media #{$mobile}
88
+ @include media($mobile)
89
89
  font-size: 16px
90
90
  height: 35px
91
- @media #{$w-374}
91
+ @include media($smallMobile)
92
92
  font-size: 14px
93
93
  height: 26px
94
94
  padding: 0 25px
@@ -1,37 +1,38 @@
1
1
  @import '../vars'
2
2
 
3
- .widget-loader
4
- display: block
5
- position: relative
6
- width: 80px
7
- height: 80px
8
- &--absolute
9
- position: absolute
10
- left: 50%
11
- top: 50%
12
- transform: translate(-50%, -50%)
13
- &--sm
14
- transform: translate(-50%, -50%) scale(.75)
15
- div
16
- position: absolute
17
- top: 33px
18
- width: 13px
19
- height: 13px
20
- border-radius: 50%
21
- background: $mainColor
22
- animation-timing-function: cubic-bezier(0, 1, 1, 0)
23
- &:nth-child(1)
24
- left: 8px
25
- animation: widget-loader-1 0.6s infinite
26
- &:nth-child(2)
27
- left: 8px
28
- animation: widget-loader-2 0.6s infinite
29
- &:nth-child(3)
30
- left: 32px
31
- animation: widget-loader-2 0.6s infinite
32
- &:nth-child(4)
33
- left: 56px
34
- animation: widget-loader-3 0.6s infinite
3
+ .widget-application
4
+ .widget-loader
5
+ display: block
6
+ position: relative
7
+ width: 80px
8
+ height: 80px
9
+ &--absolute
10
+ position: absolute
11
+ left: 50%
12
+ top: 50%
13
+ transform: translate(-50%, -50%)
14
+ &--sm
15
+ transform: translate(-50%, -50%) scale(.75)
16
+ div
17
+ position: absolute
18
+ top: 33px
19
+ width: 13px
20
+ height: 13px
21
+ border-radius: 50%
22
+ background: $mainColor
23
+ animation-timing-function: cubic-bezier(0, 1, 1, 0)
24
+ &:nth-child(1)
25
+ left: 8px
26
+ animation: widget-loader-1 0.6s infinite
27
+ &:nth-child(2)
28
+ left: 8px
29
+ animation: widget-loader-2 0.6s infinite
30
+ &:nth-child(3)
31
+ left: 32px
32
+ animation: widget-loader-2 0.6s infinite
33
+ &:nth-child(4)
34
+ left: 56px
35
+ animation: widget-loader-3 0.6s infinite
35
36
 
36
37
  @keyframes widget-loader-1
37
38
  0%
@@ -19,7 +19,7 @@
19
19
  bottom: 100px
20
20
  opacity: 0
21
21
  pointer-events: none
22
- @media #{$mobile}
22
+ @include media($mobile)
23
23
  left: 50%
24
24
  transform: translateX(-50%)
25
25
  &--active
@@ -32,9 +32,9 @@
32
32
  background-color: transparentize($black, .8)
33
33
  transform: translateX(-50%)
34
34
  @include blurBackground(5px)
35
- @media #{$mobile}
35
+ @include media($mobile)
36
36
  padding: 5px
37
- @media #{$w-374}
37
+ @include media($smallMobile)
38
38
  bottom: 30px
39
39
  &-button
40
40
  @include customButton
@@ -46,23 +46,23 @@
46
46
  align-items: center
47
47
  justify-content: center
48
48
  margin-right: 18px
49
- @media #{$tablet}
49
+ @include media($tablet)
50
50
  width: 44px
51
51
  height: 44px
52
- @media #{$mobile}
52
+ @include media($mobile)
53
53
  margin-right: 10px
54
54
  width: 33px
55
55
  height: 33px
56
- @media #{$w-374}
56
+ @include media($smallMobile)
57
57
  width: 26px
58
58
  height: 26px
59
59
  img
60
60
  display: block
61
- @media #{$tablet}
61
+ @include media($tablet)
62
62
  transform: scale(.7)
63
- @media #{$mobile}
63
+ @include media($mobile)
64
64
  transform: scale(.52)
65
- @media #{$w-374}
65
+ @include media($smallMobile)
66
66
  transform: scale(.45)
67
67
  &:nth-last-child(1)
68
68
  margin-right: 0
@@ -88,17 +88,17 @@
88
88
  height: calc(100% + 16px)
89
89
  border-radius: inherit
90
90
  background-color: $white
91
- @media #{$tablet}
91
+ @include media($tablet)
92
92
  left: 20px
93
93
  transform: scale(.6)
94
94
  transform-origin: 0% 100%
95
- @media #{$mobile}
95
+ @include media($mobile)
96
96
  transform: scale(.4)
97
- @media #{$w-374}
97
+ @include media($smallMobile)
98
98
  bottom: 30px
99
99
  transform: scale(.35)
100
100
  &--scaled
101
- @media #{$tablet}
101
+ @include media($tablet)
102
102
  transform: scale(1.4) translate(-50%, 50%)
103
103
  left: 50%
104
104
  bottom: 50%
@@ -116,7 +116,7 @@
116
116
  polygon
117
117
  &:active
118
118
  opacity: .3 !important
119
- @media #{$mobile}
119
+ @include media($mobile)
120
120
  transform: scale(1) translate(-50%, 50%)
121
121
  &--hidden
122
122
  opacity: 0
@@ -144,8 +144,6 @@
144
144
  cursor: pointer
145
145
  &:hover
146
146
  opacity: .3
147
- @media #{$tablet}
148
- opacity: 0
149
147
  &__fov
150
148
  position: absolute
151
149
  left: 0
@@ -0,0 +1,106 @@
1
+ @import '../mixin'
2
+ @import '../vars'
3
+
4
+ .widget-application
5
+ .widget-tab
6
+ &__threesixty
7
+ width: 100%
8
+ height: 100%
9
+ @include noTouch
10
+ &-start
11
+ @include customButton
12
+ position: absolute
13
+ left: 50%
14
+ bottom: 35px
15
+ transform: translateX(-50%)
16
+ display: flex
17
+ align-items: center
18
+ justify-content: center
19
+ padding: 0 25px 0 10px
20
+ background-color: $gray
21
+ border-radius: 38px
22
+ height: 72px
23
+ width: 202px
24
+ @include media($tablet)
25
+ height: 60px
26
+ width: 166px
27
+ padding: 0 20px 0 8px
28
+ bottom: 35px
29
+ @include media($mobile)
30
+ height: 44px
31
+ width: 115px
32
+ padding: 0 10px 0 6px
33
+ @include media($smallMobile)
34
+ height: 36px
35
+ width: 85px
36
+ padding: 0 8px 0 6px
37
+ bottom: 30px
38
+ &-icon
39
+ display: flex
40
+ align-items: center
41
+ justify-content: center
42
+ border-radius: 50%
43
+ background-color: $white
44
+ margin-right: 18px
45
+ padding: 10px
46
+ @include media($tablet)
47
+ padding: 7px
48
+ margin-right: 15px
49
+ @include media($mobile)
50
+ margin-right: 7px
51
+ @include media($smallMobile)
52
+ padding: 6px
53
+ margin-right: 5px
54
+ img
55
+ display: block
56
+ position: relative
57
+ top: 2px
58
+ width: 34px
59
+ @include media($tablet)
60
+ width: 30px
61
+ top: 1px
62
+ @include media($mobile)
63
+ width: 19px
64
+ top: 0
65
+ @include media($smallMobile)
66
+ width: 15px
67
+ span
68
+ font-size: 24px
69
+ font-weight: bold
70
+ color: $text-dark
71
+ text-transform: uppercase
72
+ width: 100%
73
+ display: block
74
+ text-align: center
75
+ position: relative
76
+ top: 1px
77
+ @include media($tablet)
78
+ font-size: 20px
79
+ @include media($mobile)
80
+ font-size: 14px
81
+ @include media($smallMobile)
82
+ font-size: 10px
83
+ top: 0
84
+ &-container
85
+ width: 100% !important
86
+ height: 100% !important
87
+ position: relative
88
+ background-image: none !important
89
+ img
90
+ position: absolute
91
+ left: 50%
92
+ top: 50%
93
+ transform: translate(-50%, -50%)
94
+ max-width: 100%
95
+ max-height: 100%
96
+ width: 600px
97
+ height: 600px
98
+ object-fit: contain
99
+ opacity: 0
100
+ pointer-events: none
101
+ @include noSelect
102
+ &.active
103
+ opacity: 1
104
+ &--active
105
+ .widget-tab__threesixty-container
106
+ cursor: move