hart-estate-widget 0.0.62 → 0.0.65

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 (33) hide show
  1. package/README.md +33 -23
  2. package/build/assets/css/app.css +1 -1
  3. package/build/assets/css/app.css.map +1 -1
  4. package/build/assets/icons/arrow-left.svg +4 -0
  5. package/build/assets/icons/arrow-right.svg +4 -0
  6. package/build/assets/icons/plan.svg +5 -0
  7. package/build/assets/icons/render.svg +7 -0
  8. package/build/assets/icons/surface.svg +5 -0
  9. package/build/assets/sass/components/instructions.sass +10 -10
  10. package/build/assets/sass/components/loader.sass +33 -32
  11. package/build/assets/sass/components/model.sass +1 -1
  12. package/build/assets/sass/components/panorama.sass +14 -16
  13. package/build/assets/sass/components/rotation.sass +202 -0
  14. package/build/assets/sass/components/tabs.sass +6 -112
  15. package/build/assets/sass/index.sass +13 -40
  16. package/build/assets/sass/mixin.sass +37 -1
  17. package/build/assets/sass/vars.sass +4 -5
  18. package/build/components/Application.js +22 -20
  19. package/build/components/PanoramaTab.js +34 -60
  20. package/build/components/RotationTab/DefaultView.js +124 -0
  21. package/build/components/RotationTab/ThreesixtyView.js +45 -0
  22. package/build/components/{RotationTab.js → RotationTab/index.js} +90 -55
  23. package/build/components/Widget.js +38 -22
  24. package/build/config/defaultConfig.js +8 -4
  25. package/build/enums/deviceWidth.js +12 -3
  26. package/build/enums/rotationModes.js +11 -0
  27. package/build/index.js +8 -8
  28. package/build/store/apiStore.js +51 -19
  29. package/build/store/fullScreenStore.js +36 -1
  30. package/build/store/index.js +13 -1
  31. package/build/store/modelStore.js +10 -5
  32. package/package.json +1 -1
  33. package/build/components/ImageTab.js +0 -23
package/README.md CHANGED
@@ -9,27 +9,21 @@
9
9
 
10
10
  ```js
11
11
  import React, { useEffect, useState } from 'react';
12
- import { Widget } from 'hart-estate-widget';
13
- import 'hart-estate-widget/build/index.css';
12
+ import { Widget, rotationModes } from 'hart-estate-widget';
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',
18
+ rotationMode: rotationModes.DEFAULY,
21
19
  rotationImages: [
22
20
  '/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',
21
+ ...
26
22
  '/path/to/rotation_image_5.jpg',
27
23
  ],
28
24
  panoramaImages: [
29
25
  '/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',
26
+ ...
33
27
  '/path/to/panorama_image_5.jpg',
34
28
  ],
35
29
  };
@@ -40,7 +34,18 @@ const App = () => {
40
34
  useEffect(() => {
41
35
  const createdWidget = new Widget('#widget-container', WIDGET_OPTIONS);
42
36
 
37
+ const onResize = () => {
38
+ const { innerWidth: width, innerHeight: height } = window;
39
+ createdWidget.updateSize({ width, height });
40
+ };
41
+
42
+ window.addEventListener('resize', onResize);
43
+
43
44
  setState(createdWidget);
45
+
46
+ return function cleanup() {
47
+ window.removeEventListener('resize', onResize);
48
+ };
44
49
  }, []);
45
50
 
46
51
  return (
@@ -60,23 +65,24 @@ export App;
60
65
  ```js
61
66
  {
62
67
  // элементы
63
- tabs: ['planImage', 'topView', 'topDownView', 'rotation', 'panorama'], // включенные элементы
68
+ tabs: ['rotation', 'panorama'], // включенные элементы
64
69
 
65
70
  // логотип
66
71
  logo: '', // путь к логотипу
67
72
  logoUrl: '', // ссылка, открывающаяся по клику на логотип
68
73
 
69
74
  // локализация
70
- locale: 'en', // языковой код ISO 639 (Доступно: ru, en)
75
+ locale: 'en', // языковой код ISO 639
71
76
 
72
77
  // ширина/высота
73
- width: 500,
74
- height: 750,
78
+ width: 1920,
79
+ height: 1080,
80
+ resizable: true, // автоматически менять размер виджета под размер контейнера при изменении размеров окна
75
81
 
76
82
  // значения
77
- planImage: '', // путь к изображению планировки
78
- topView: '', // путь к изображению вида сверху
79
- topDownView: '', // путь к изображению вида сверху под углом
83
+ planImage: '', // путь к изображению планировки (необходимо для панорамного тура)
84
+ topViewImage: '', // путь к изображению планировки сверху
85
+ rotationMode: 'default', // режим работы изображений планировки
80
86
  rotationImages: [], // пути к изображениям кругового просмотра (порядок обязателен)
81
87
  panoramaImages: [], // пути к изображениям 360°
82
88
  }
@@ -86,11 +92,15 @@ export App;
86
92
  ## Типы элементов
87
93
  ```js
88
94
  tabs: [
89
- 'planImage', // изображение планировки
90
- 'topView', // изображение вида сверху
91
- 'topDownView', // изображение вида сверху под углом
92
95
  'rotation', // изображения кругового просмотра (порядок обязателен)
93
96
  'panorama', // изображения 360°
94
- ]
97
+ ],
98
+ rotationMode: [
99
+ rotationModes.DEFAULT, // режим просмотра вида сверху (несколько ракурсов) и стилизованной планировки
100
+ rotationModes.THREESIXTY, // режим прокрутки изображений кругового просмотра
101
+ ],
102
+ locale: [
103
+ 'ru', // русский язык
104
+ 'en', // английский язык
105
+ ],
95
106
  ```
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{width:100%;height:100%;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:100vh;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__rotation{width:100%;height:100%}.widget-application .widget-tab__rotation-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__rotation-start{height:60px;width:166px;padding:0 20px 0 8px;bottom:35px}.widget-application--mobile.widget-application .widget-tab__rotation-start{height:44px;width:115px;padding:0 10px 0 6px}.widget-application--smallMobile.widget-application .widget-tab__rotation-start{height:36px;width:85px;padding:0 8px 0 6px;bottom:30px}.widget-application .widget-tab__rotation-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__rotation-start-icon{padding:7px;margin-right:15px}.widget-application--mobile.widget-application .widget-tab__rotation-start-icon{margin-right:7px}.widget-application--smallMobile.widget-application .widget-tab__rotation-start-icon{padding:6px;margin-right:5px}.widget-application .widget-tab__rotation-start-icon img{display:block;position:relative;top:2px;width:34px}.widget-application--tablet.widget-application .widget-tab__rotation-start-icon img{width:30px;top:1px}.widget-application--mobile.widget-application .widget-tab__rotation-start-icon img{width:19px;top:0}.widget-application--smallMobile.widget-application .widget-tab__rotation-start-icon img{width:15px}.widget-application .widget-tab__rotation-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__rotation-start span{font-size:20px}.widget-application--mobile.widget-application .widget-tab__rotation-start span{font-size:14px}.widget-application--smallMobile.widget-application .widget-tab__rotation-start span{font-size:10px;top:0}.widget-application .widget-tab__threesixty,.widget-application .widget-tab__isometry{width:100%;height:100%;touch-action:none;-webkit-touch-action:none}.widget-application .widget-tab__threesixty-container,.widget-application .widget-tab__isometry-container{width:100% !important;height:100% !important;position:relative;background-image:none !important}.widget-application .widget-tab__threesixty-container img,.widget-application .widget-tab__isometry-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,.widget-application .widget-tab__isometry-container img.active{opacity:1}.widget-application .widget-tab__threesixty--active{cursor:move}.widget-application .widget-tab__isometry-arrows{position:absolute;z-index:3;left:50%;bottom:35px;transform:translateX(-50%);height:72px;display:flex;align-items:center;justify-content:center}.widget-application--tablet.widget-application .widget-tab__isometry-arrows{bottom:35px;height:60px}.widget-application--mobile.widget-application .widget-tab__isometry-arrows{height:44px}.widget-application--smallMobile.widget-application .widget-tab__isometry-arrows{bottom:30px;height:36px}.widget-application .widget-tab__isometry-arrows span{font-size:28px;font-weight:bold;display:block;margin:0 9px}.widget-application--tablet.widget-application .widget-tab__isometry-arrows span{font-size:22px}.widget-application--mobile.widget-application .widget-tab__isometry-arrows span{font-size:17px;margin:0 3px}.widget-application--smallMobile.widget-application .widget-tab__isometry-arrows span{font-size:14px;margin:0}.widget-application .widget-tab__isometry-arrow{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:5px}.widget-application .widget-tab__isometry-arrow img{width:32px}.widget-application--tablet.widget-application .widget-tab__isometry-arrow img{width:24px}.widget-application--mobile.widget-application .widget-tab__isometry-arrow img{width:18px}.widget-application--smallMobile.widget-application .widget-tab__isometry-arrow img{width:14px}.widget-application .widget-tab__isometry-buttons{position:absolute;z-index:3;left:44px;bottom:35px;display:flex;align-items:center;justify-content:flex-end}.widget-application--tablet.widget-application .widget-tab__isometry-buttons{left:20px;bottom:35px}.widget-application--smallMobile.widget-application .widget-tab__isometry-buttons{bottom:30px}.widget-application .widget-tab__isometry-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;margin-top:40px}.widget-application--tablet.widget-application .widget-tab__isometry-button{margin-top:20px;width:60px;height:60px}.widget-application--mobile.widget-application .widget-tab__isometry-button{margin-top:10px;width:44px;height:44px}.widget-application--smallMobile.widget-application .widget-tab__isometry-button{width:36px;height:36px}.widget-application .widget-tab__isometry-button img{display:block;width:50px}.widget-application--tablet.widget-application .widget-tab__isometry-button img{width:40px}.widget-application--mobile.widget-application .widget-tab__isometry-button img{width:30px}.widget-application--smallMobile.widget-application .widget-tab__isometry-button img{width:25px}.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,WACA,YACA,UACA,gBACA,kBACA,UACA,iBCLM,KDMN,eAEA,+EACE,mCACA,kCACA,qCACA,qBACA,gBACA,MCRQ,QDSR,aACA,UACA,SACA,sBACA,8BAEF,iCACE,kBACA,UACA,SACA,UEhBO,4DFkBL,UACA,SEnBK,iEFqBL,SACF,qCACE,cACA,WACA,YACA,mBACA,uBE3BK,gEF6BH,WACA,YE9BG,gEFgCH,WACA,YEjCG,qEFmCH,WACA,YAEN,oDElCA,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,YFOJ,6CEpCA,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,YFSJ,4CEtCA,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,aACA,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,0CACE,WACA,YACA,gDJPJ,YACA,YACA,gBACA,yBACA,eIKM,kBACA,SACA,YACA,2BACA,aACA,mBACA,uBACA,sBACA,iBLXD,QKYC,mBACA,YACA,YJPG,2EISD,YACA,YACA,qBACA,YJZC,2EIcD,YACA,YACA,qBJhBC,gFIkBD,YACA,WACA,oBACA,YACF,qDACE,aACA,mBACA,uBACA,kBACA,iBLpCF,KKqCE,kBACA,aJ7BC,gFI+BC,YACA,kBJhCD,gFIkCC,iBJlCD,qFIoCC,YACA,iBACF,yDACE,cACA,kBACA,QACA,WJ1CD,oFI4CG,WACA,QJ7CH,oFI+CG,WACA,MJhDH,yFIkDG,WACN,qDACE,eACA,iBACA,MLzDE,QK0DF,yBACA,WACA,cACA,kBACA,kBACA,QJ5DC,gFI8DC,eJ9DD,gFIgEC,eJhED,qFIkEC,eACA,MAER,sFAEE,WACA,YLlEJ,kBACA,0BKmEI,0GACE,sBACA,uBACA,kBACA,iCACA,kHACE,kBACA,SACA,QACA,gCACA,eACA,gBACA,YACA,aACA,mBACA,UACA,oBL1FR,iBACA,yBACA,eACA,uBKyFQ,gIACE,UAGN,oDACE,YAGF,iDACE,kBACA,UACA,SACA,YACA,2BACA,YACA,aACA,mBACA,uBJ7GG,4EI+GD,YACA,YJhHC,4EIkHD,YJlHC,iFIoHD,YACA,YACF,sDACE,eACA,iBACA,cACA,aJ1HC,iFI4HC,eJ5HD,iFI8HC,eACA,aJ/HD,sFIiIC,eACA,SACN,gDJhJJ,YACA,YACA,gBACA,yBACA,eI8IM,aACA,mBACA,uBACA,YACA,oDACE,WJ1IC,+EI4IC,WJ5ID,+EI8IC,WJ9ID,oFIgJC,WACN,kDACE,kBACA,UACA,UACA,YACA,aACA,mBACA,yBJxJG,6EI0JD,UACA,YJ3JC,kFI6JD,YACJ,iDJ3KJ,YACA,YACA,gBACA,yBACA,eIyKM,WACA,YACA,kBACA,aACA,mBACA,uBACA,iBL7KD,QK8KC,gBJvKG,4EIyKD,gBACA,WACA,YJ3KC,4EI6KD,gBACA,WACA,YJ/KC,iFIiLD,WACA,YACF,qDACE,cACA,WJrLC,gFIuLC,WJvLD,gFIyLC,WJzLD,qFI2LC,WCtMV,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"}
@@ -0,0 +1,4 @@
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M27 16H5" stroke="#413E3E" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
+ <path d="M14 7L5 16L14 25" stroke="#413E3E" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
4
+ </svg>
@@ -0,0 +1,4 @@
1
+ <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M5 16H27" stroke="#413E3E" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
3
+ <path d="M18 7L27 16L18 25" stroke="#413E3E" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
4
+ </svg>
@@ -0,0 +1,5 @@
1
+ <svg width="50" height="49" viewBox="0 0 50 49" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M38.9972 38.8994H11.0036C10.7827 38.8994 10.6036 38.7203 10.6036 38.4994L10.6035 10.9989C10.6035 10.778 10.7826 10.5989 11.0035 10.5989H38.9972C39.2181 10.5989 39.3972 10.778 39.3972 10.9989V38.4994C39.3972 38.7203 39.2181 38.8994 38.9972 38.8994Z" stroke="#413E3E" stroke-width="3.15271"/>
3
+ <path d="M12.1699 19.1946H24.1341C24.3551 19.1946 24.5341 19.3737 24.5341 19.5946V37.3214" stroke="#413E3E" stroke-width="2"/>
4
+ <path d="M37.8206 20.5945H30.984C30.7631 20.5945 30.584 20.4154 30.584 20.1945V12.1687" stroke="#413E3E" stroke-width="2"/>
5
+ </svg>
@@ -0,0 +1,7 @@
1
+ <svg width="50" height="50" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M7.16992 35.8557L24.837 43.177L41.8497 35.8557" stroke="#413E3E" stroke-width="3.15271" stroke-linecap="round" stroke-linejoin="round"/>
3
+ <path d="M26.3301 43.1946L8.83008 35.6946L25.8301 28.1946L42.8301 35.6946L26.3301 43.1946Z" fill="#C4C4C4"/>
4
+ <path d="M7.16992 35.8196V13.8557L24.837 6.53442L41.8497 13.8557V35.8196" stroke="#413E3E" stroke-width="3.15271" stroke-linecap="round" stroke-linejoin="round"/>
5
+ <path d="M24.8359 6.69458V28.1585" stroke="#413E3E" stroke-width="3.15271" stroke-linecap="round" stroke-linejoin="round"/>
6
+ <path d="M7.16992 36.5159L24.837 29.1946L41.8497 36.5159L24.837 43.8372L7.16992 36.5159Z" stroke="#413E3E" stroke-width="3.15271" stroke-linecap="round" stroke-linejoin="round"/>
7
+ </svg>
@@ -0,0 +1,5 @@
1
+ <svg width="50" height="50" viewBox="0 0 50 50" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M25.5147 39L7.5 31.5L16.25 27.75L20.625 25.875L25 27.75L29.375 25.875L33.75 27.75L42.5 31.5L25.5147 39Z" fill="#C4C4C4"/>
3
+ <path d="M30.1509 25.125L34.934 27.25L44.5 31.5L25.3679 40L5.5 31.5L15.434 27.25L20.4009 25.125" stroke="#413E3E" stroke-width="3.15271" stroke-linecap="round" stroke-linejoin="round"/>
4
+ <path d="M5.5 18.5L25.3679 10L44.5 18.5L25.3679 27L5.5 18.5Z" stroke="#413E3E" stroke-width="3.15271" stroke-linecap="round" stroke-linejoin="round"/>
5
+ </svg>
@@ -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%
@@ -110,13 +110,13 @@
110
110
  top: 50%
111
111
  transform: translate(-50%, -50%)
112
112
  width: 100vw
113
- height: calc(100 * var(--vh))
113
+ height: 100vh
114
114
  background-color: transparentize(#C4C4C4, .2)
115
115
  svg
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