@iobroker/adapter-react-v5 6.1.10 → 7.0.1

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 (207) hide show
  1. package/Components/404.js +13 -13
  2. package/Components/Loader.js +223 -223
  3. package/Components/Loaders/PT.css +108 -108
  4. package/Components/Loaders/PT.js +103 -103
  5. package/Components/Loaders/Vendor.css +13 -13
  6. package/Components/Loaders/Vendor.js +7 -7
  7. package/Components/ObjectBrowser.js +29 -29
  8. package/Components/UploadImage.js +305 -305
  9. package/Components/loader.css +221 -221
  10. package/Components/types.d.ts +82 -82
  11. package/GenericApp.js +49 -49
  12. package/LICENSE +22 -22
  13. package/Prompt.js +7 -7
  14. package/README.md +1004 -1005
  15. package/Theme.js +8 -7
  16. package/assets/devices/Alarm Systems.svg +18 -18
  17. package/assets/devices/Amplifier.svg +21 -21
  18. package/assets/devices/Awnings.svg +4 -4
  19. package/assets/devices/Battery Status.svg +4 -4
  20. package/assets/devices/Ceiling Spotlights.svg +15 -15
  21. package/assets/devices/Chandelier.svg +6 -6
  22. package/assets/devices/Climate.svg +11 -11
  23. package/assets/devices/Coffee Makers.svg +5 -5
  24. package/assets/devices/Cold Water.svg +31 -31
  25. package/assets/devices/Computer.svg +21 -21
  26. package/assets/devices/Consumption.svg +7 -7
  27. package/assets/devices/Curtains.svg +43 -43
  28. package/assets/devices/Dishwashers.svg +11 -11
  29. package/assets/devices/Doors.svg +5 -5
  30. package/assets/devices/Doorstep.svg +35 -35
  31. package/assets/devices/Dryer.svg +13 -13
  32. package/assets/devices/Fan.svg +20 -20
  33. package/assets/devices/Floor Lamps.svg +4 -4
  34. package/assets/devices/Garage Doors.svg +9 -9
  35. package/assets/devices/Gates.svg +32 -32
  36. package/assets/devices/Hairdryer.svg +23 -23
  37. package/assets/devices/Handle.svg +6 -6
  38. package/assets/devices/Hanging Lamps.svg +8 -8
  39. package/assets/devices/Heater.svg +44 -44
  40. package/assets/devices/Hoods.svg +11 -11
  41. package/assets/devices/Hot Water.svg +9 -9
  42. package/assets/devices/Humidity.svg +41 -41
  43. package/assets/devices/Iron.svg +4 -4
  44. package/assets/devices/Irrigation.svg +22 -22
  45. package/assets/devices/Led Strip.svg +30 -30
  46. package/assets/devices/Light.svg +29 -29
  47. package/assets/devices/Lightings.svg +46 -46
  48. package/assets/devices/Lock.svg +19 -19
  49. package/assets/devices/Louvre.svg +6 -6
  50. package/assets/devices/Mowing Machine.svg +8 -8
  51. package/assets/devices/Music.svg +12 -12
  52. package/assets/devices/Outdoor Blinds.svg +6 -6
  53. package/assets/devices/People.svg +19 -19
  54. package/assets/devices/Pool.svg +7 -7
  55. package/assets/devices/Power Consumption.svg +12 -12
  56. package/assets/devices/Printer.svg +9 -9
  57. package/assets/devices/Pump.svg +9 -9
  58. package/assets/devices/Receiver.svg +18 -18
  59. package/assets/devices/Sconces.svg +9 -9
  60. package/assets/devices/Security.svg +34 -34
  61. package/assets/devices/Shading.svg +4 -4
  62. package/assets/devices/Shutters.svg +10 -10
  63. package/assets/devices/SmokeDetector.svg +12 -12
  64. package/assets/devices/Sockets.svg +13 -13
  65. package/assets/devices/Speaker.svg +35 -35
  66. package/assets/devices/Stove.svg +11 -11
  67. package/assets/devices/Table Lamps.svg +11 -11
  68. package/assets/devices/Temperature Sensors.svg +28 -28
  69. package/assets/devices/Tv.svg +7 -7
  70. package/assets/devices/Vacuum Cleaner.svg +15 -15
  71. package/assets/devices/Ventilation.svg +12 -12
  72. package/assets/devices/Washing Machines.svg +15 -15
  73. package/assets/devices/Water Consumption.svg +5 -5
  74. package/assets/devices/Water Heater.svg +8 -8
  75. package/assets/devices/Water.svg +40 -40
  76. package/assets/devices/Weather.svg +28 -28
  77. package/assets/devices/Window.svg +7 -7
  78. package/assets/lamp_ceiling.svg +8 -8
  79. package/assets/lamp_table.svg +7 -7
  80. package/assets/no_icon.svg +9 -9
  81. package/assets/rooms/Anteroom.svg +52 -52
  82. package/assets/rooms/Attic.svg +21 -21
  83. package/assets/rooms/Balcony.svg +12 -12
  84. package/assets/rooms/Barn.svg +5 -5
  85. package/assets/rooms/Basement.svg +4 -4
  86. package/assets/rooms/Bathroom.svg +38 -38
  87. package/assets/rooms/Bedroom.svg +5 -5
  88. package/assets/rooms/Boiler Room.svg +12 -12
  89. package/assets/rooms/Carport.svg +17 -17
  90. package/assets/rooms/Cellar.svg +89 -89
  91. package/assets/rooms/Chamber.svg +9 -9
  92. package/assets/rooms/Corridor.svg +52 -52
  93. package/assets/rooms/Dining Area.svg +37 -37
  94. package/assets/rooms/Dining Room.svg +37 -37
  95. package/assets/rooms/Dining.svg +37 -37
  96. package/assets/rooms/Dressing Room.svg +4 -4
  97. package/assets/rooms/Driveway.svg +14 -14
  98. package/assets/rooms/Entrance.svg +44 -44
  99. package/assets/rooms/Equipment Room.svg +14 -14
  100. package/assets/rooms/Front Yard.svg +64 -64
  101. package/assets/rooms/Gallery.svg +13 -13
  102. package/assets/rooms/Garage.svg +20 -20
  103. package/assets/rooms/Garden.svg +12 -12
  104. package/assets/rooms/Ground Floor.svg +95 -95
  105. package/assets/rooms/Guest Bathroom.svg +32 -32
  106. package/assets/rooms/Guest Room.svg +5 -5
  107. package/assets/rooms/Gym.svg +4 -4
  108. package/assets/rooms/Hall.svg +19 -19
  109. package/assets/rooms/Home Theater.svg +7 -7
  110. package/assets/rooms/Kitchen.svg +17 -17
  111. package/assets/rooms/Laundry Room.svg +11 -11
  112. package/assets/rooms/Living Area.svg +10 -10
  113. package/assets/rooms/Living Room.svg +10 -10
  114. package/assets/rooms/Locker Room.svg +16 -16
  115. package/assets/rooms/Nursery.svg +4 -4
  116. package/assets/rooms/Office.svg +8 -8
  117. package/assets/rooms/Outdoors.svg +7 -7
  118. package/assets/rooms/Playroom.svg +5 -5
  119. package/assets/rooms/Pool.svg +7 -7
  120. package/assets/rooms/Rear Wall.svg +30 -30
  121. package/assets/rooms/Second Floor.svg +95 -95
  122. package/assets/rooms/Shed.svg +16 -16
  123. package/assets/rooms/Sleeping Area.svg +22 -22
  124. package/assets/rooms/Stairway.svg +4 -4
  125. package/assets/rooms/Stairwell.svg +15 -15
  126. package/assets/rooms/Storeroom.svg +4 -4
  127. package/assets/rooms/Summer House.svg +27 -27
  128. package/assets/rooms/Swimming Pool.svg +21 -21
  129. package/assets/rooms/Terrace.svg +6 -6
  130. package/assets/rooms/Toilet.svg +10 -10
  131. package/assets/rooms/Upstairs.svg +5 -5
  132. package/assets/rooms/Wardrobe.svg +60 -60
  133. package/assets/rooms/Washroom.svg +19 -19
  134. package/assets/rooms/Wc.svg +10 -10
  135. package/assets/rooms/Windscreen.svg +60 -60
  136. package/assets/rooms/Workshop.svg +22 -22
  137. package/assets/rooms/Workspace.svg +8 -8
  138. package/craco-module-federation.js +71 -71
  139. package/icons/IconFx.js +1 -1
  140. package/icons/IconLogout.js +1 -1
  141. package/index.css +54 -54
  142. package/modulefederation.admin.config.js +31 -31
  143. package/package.json +4 -4
  144. package/src/AdminConnection.tsx +3 -3
  145. package/src/Components/404.tsx +121 -121
  146. package/src/Components/ColorPicker.tsx +315 -315
  147. package/src/Components/ComplexCron.tsx +507 -507
  148. package/src/Components/CopyToClipboard.tsx +165 -165
  149. package/src/Components/CustomModal.tsx +163 -163
  150. package/src/Components/FileBrowser.tsx +2414 -2414
  151. package/src/Components/FileViewer.tsx +393 -393
  152. package/src/Components/Icon.tsx +210 -210
  153. package/src/Components/IconPicker.tsx +149 -149
  154. package/src/Components/IconSelector.tsx +2202 -2202
  155. package/src/Components/Image.tsx +176 -176
  156. package/src/Components/Loader.tsx +304 -304
  157. package/src/Components/Logo.tsx +166 -166
  158. package/src/Components/MDUtils.tsx +100 -100
  159. package/src/Components/ObjectBrowser.tsx +8032 -8032
  160. package/src/Components/Router.tsx +90 -90
  161. package/src/Components/SaveCloseButtons.tsx +113 -113
  162. package/src/Components/Schedule.tsx +1724 -1724
  163. package/src/Components/SelectWithIcon.tsx +197 -197
  164. package/src/Components/TabContainer.tsx +55 -55
  165. package/src/Components/TabContent.tsx +37 -37
  166. package/src/Components/TabHeader.tsx +19 -19
  167. package/src/Components/TableResize.tsx +259 -259
  168. package/src/Components/TextWithIcon.tsx +148 -148
  169. package/src/Components/ToggleThemeMenu.tsx +34 -34
  170. package/src/Components/TreeTable.tsx +919 -919
  171. package/src/Components/UploadImage.tsx +599 -599
  172. package/src/Components/Utils.tsx +1794 -1794
  173. package/src/Components/loader.css +221 -221
  174. package/src/Components/withWidth.tsx +21 -21
  175. package/src/Connection.tsx +7 -7
  176. package/src/Dialogs/ComplexCron.tsx +129 -129
  177. package/src/Dialogs/Confirm.tsx +162 -162
  178. package/src/Dialogs/Cron.tsx +182 -182
  179. package/src/Dialogs/Error.tsx +72 -72
  180. package/src/Dialogs/Message.tsx +71 -71
  181. package/src/Dialogs/SelectFile.tsx +270 -270
  182. package/src/Dialogs/SelectID.tsx +298 -298
  183. package/src/Dialogs/SimpleCron.tsx +100 -100
  184. package/src/Dialogs/TextInput.tsx +107 -107
  185. package/src/GenericApp.tsx +976 -976
  186. package/src/LegacyConnection.tsx +3589 -3589
  187. package/src/Prompt.tsx +20 -20
  188. package/src/Theme.tsx +479 -479
  189. package/src/icons/IconAdapter.tsx +20 -20
  190. package/src/icons/IconAlias.tsx +20 -20
  191. package/src/icons/IconChannel.tsx +21 -21
  192. package/src/icons/IconClearFilter.tsx +22 -22
  193. package/src/icons/IconClosed.tsx +17 -17
  194. package/src/icons/IconCopy.tsx +16 -16
  195. package/src/icons/IconDevice.tsx +27 -27
  196. package/src/icons/IconDocument.tsx +17 -17
  197. package/src/icons/IconDocumentReadOnly.tsx +18 -18
  198. package/src/icons/IconExpert.tsx +18 -18
  199. package/src/icons/IconFx.tsx +36 -36
  200. package/src/icons/IconInstance.tsx +20 -20
  201. package/src/icons/IconLogout.tsx +30 -30
  202. package/src/icons/IconNoIcon.tsx +19 -19
  203. package/src/icons/IconOpen.tsx +17 -17
  204. package/src/icons/IconProps.tsx +15 -15
  205. package/src/icons/IconState.tsx +17 -17
  206. package/src/index.css +54 -54
  207. package/types.d.ts +134 -134
package/Components/404.js CHANGED
@@ -28,17 +28,17 @@ const styles = {
28
28
  fontFamily: "'Inconsolata', Helvetica, sans-serif",
29
29
  fontSize: '1.5rem',
30
30
  color: 'rgba(128, 175, 255, 0.8)',
31
- textShadow: `0 0 1ex rgba(51, 70, 255, 1),
31
+ textShadow: `0 0 1ex rgba(51, 70, 255, 1),
32
32
  0 0 2px rgba(255, 255, 255, 0.8)`,
33
33
  },
34
34
  overlay: {
35
35
  pointerEvents: 'none',
36
36
  width: '100%',
37
37
  height: '100%',
38
- background: `repeating-linear-gradient(
39
- 180deg,
40
- rgba(0, 0, 0, 0) 0,
41
- rgba(0, 0, 0, 0.3) 50%,
38
+ background: `repeating-linear-gradient(
39
+ 180deg,
40
+ rgba(0, 0, 0, 0) 0,
41
+ rgba(0, 0, 0, 0.3) 50%,
42
42
  rgba(0, 0, 0, 0) 100%)`,
43
43
  backgroundSize: 'auto 4px',
44
44
  zIndex: 99,
@@ -53,12 +53,12 @@ const styles = {
53
53
  bottom: 0,
54
54
  width: '100%',
55
55
  height: '100%',
56
- backgroundImage: `linear-gradient(
57
- 0deg,
58
- transparent 0%,
59
- rgba(32, 50, 128, 0.2) 2%,
60
- rgba(32, 50, 128, 0.8) 3%,
61
- rgba(32, 50, 128, 0.2) 3%,
56
+ backgroundImage: `linear-gradient(
57
+ 0deg,
58
+ transparent 0%,
59
+ rgba(32, 50, 128, 0.2) 2%,
60
+ rgba(32, 50, 128, 0.8) 3%,
61
+ rgba(32, 50, 128, 0.2) 3%,
62
62
  transparent 100%)`,
63
63
  backgroundRepeat: 'no-repeat',
64
64
  animation: 'scan 7.5s linear 0s infinite',
@@ -75,8 +75,8 @@ const styles = {
75
75
  },
76
76
  output: {
77
77
  color: 'rgba(128, 175, 255, 0.8)',
78
- textShadow: `
79
- 0 0 1px rgba(51, 70, 255, 0.4),
78
+ textShadow: `
79
+ 0 0 1px rgba(51, 70, 255, 0.4),
80
80
  0 0 2px rgba(255, 255, 255, 0.8)`,
81
81
  '&::before': {
82
82
  content: '"> "',
@@ -30,229 +30,229 @@ Object.defineProperty(exports, "__esModule", { value: true });
30
30
  *
31
31
  * */
32
32
  const react_1 = __importStar(require("react"));
33
- const loaderStyles = `
34
- /**
35
- * Copyright 2018-2024 Denis Haev (bluefox) <dogafox@gmail.com>
36
- *
37
- * MIT License
38
- *
39
- **/
40
-
41
- .logo-background-light, .logo-background-colored {
42
- background: white;
43
- }
44
- .logo-background-dark, .logo-background-blue {
45
- background: black;
46
- }
47
- .logo-div {
48
- position: absolute;
49
- top: 50%;
50
- left: 50%;
51
- -ms-transform: translateX(-50%) translateY(-50%);
52
- -webkit-transform: translate(-50%,-50%);
53
- transform: translate(-50%,-50%);
54
- overflow: hidden;
55
- border-radius: 50%;
56
- z-index: 2;
57
- }
58
- .logo-border {
59
- /*border-color: #164477;*/
60
- border-top-color: #3399CC;
61
- border-left-color: #164477;
62
- border-bottom-color: #164477;
63
- border-right-color: #164477;
64
- border-radius: 50%;
65
- border-style: solid;
66
- box-sizing: border-box;
67
- width: 100%;
68
- height: 100%;
69
- position: absolute;
70
- }
71
- .logo-top {
72
- position: absolute;
73
- width: 4.5%;
74
- height: 16%;
75
- top: 0;
76
- z-index: 2;
77
- }
78
- .logo-i {
79
- position: absolute;
80
- width: 14.5%;
81
- height: 60%;
82
- top: 20%;
83
- left: 42%;
84
- background: #3399CC;
85
- }
86
- .logo-i-top {
87
- position: absolute;
88
- width: 14.5%;
89
- height: 4%;
90
- left: 42%;
91
- background: #3399CC;
92
- border-radius: 100%;
93
- }
94
- .logo-back {
95
- width: 100%;
96
- height: 100%;
97
- z-index: 0;
98
- overflow: hidden;
99
- }
100
- @keyframes logo-grow {
101
- 0% {
102
- width: 230px;
103
- height: 230px;
104
- transform: translate(-50%,-50%) scale(1);
105
- opacity: 1
106
- }
107
- 99% {
108
- width: 230px;
109
- height: 230px;
110
- transform: translate(-50%,-50%) scale(10);
111
- opacity: 0;
112
- }
113
- 100% {
114
- width: 0;
115
- height: 0;
116
- opacity: 0;
117
- }
118
- }
119
- @keyframes logo-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
120
- @keyframes logo-color-inside-light {
121
- 0% {
122
- background: #FEFEFE;
123
- }
124
- 100% {
125
- background: #3399CC;
126
- }
127
- }
128
- @keyframes logo-color-inside-dark {
129
- 0% {
130
- background: #030303;
131
- }
132
- 100% {
133
- background: #3399CC;
134
- }
135
- }
136
- @keyframes logo-color-inside-colored {
137
- 0% {
138
- background: #FEFEFE;
139
- }
140
- 100% {
141
- background: #3399CC;
142
- }
143
- }
144
- @keyframes logo-color-inside-blue {
145
- 0% {
146
- background: #030303;
147
- }
148
- 100% {
149
- background: #3399CC;
150
- }
151
- }
152
-
153
- @keyframes logo-color-outside-light {
154
- 0% {
155
- border-color: #FEFEFE;
156
- }
157
- 100% {
158
- border-top-color: #3399CC;
159
- border-left-color: #164477;
160
- border-bottom-color: #164477;
161
- border-right-color: #164477;
162
- }
163
- }
164
- @keyframes logo-color-outside-dark {
165
- 0% {
166
- border-color: #040404;
167
- }
168
- 100% {
169
- border-top-color: #3399CC;
170
- border-left-color: #164477;
171
- border-bottom-color: #164477;
172
- border-right-color: #164477;
173
- }
174
- }
175
- @keyframes logo-color-outside-colored {
176
- 0% {
177
- border-color: #FEFEFE;
178
- }
179
- 100% {
180
- border-top-color: #3399CC;
181
- border-left-color: #164477;
182
- border-bottom-color: #164477;
183
- border-right-color: #164477;
184
- }
185
- }
186
- @keyframes logo-color-outside-blue {
187
- 0% {
188
- border-color: #040404;
189
- }
190
- 100% {
191
- border-top-color: #3399CC;
192
- border-left-color: #164477;
193
- border-bottom-color: #164477;
194
- border-right-color: #164477;
195
- }
196
- }
197
-
198
- .logo-animate-wait {
199
- animation: logo-color-outside 1.5s, logo-spin 1.5s linear infinite;
200
- }
201
-
202
- .logo-animate-grow-light {
203
- background: #DDD;
204
- }
205
- .logo-animate-grow-dark {
206
- background: #1d1d1d;
207
- }
208
- .logo-animate-grow-colored {
209
- background: #DDD;
210
- }
211
- .logo-animate-grow-blue {
212
- background: #1d1d1d;
213
- }
214
-
215
- .logo-animate-grow {
216
- display: inline-block;
217
- text-align: center;
218
- z-index: 1;
219
- top: 50%;
220
- left: 50%;
221
- -ms-transform: translateX(-50%) translateY(-50%);
222
- -webkit-transform: translate(-50%,-50%);
223
- transform: translate(-50%,-50%);
224
- width: 245px;
225
- height: 245px;
226
- border-radius: 50%;
227
- position: absolute;
228
- animation: logo-grow 1s 1 ease forwards;
229
- }
230
-
231
- .logo-animate-color-inside-light {
232
- animation: logo-color-inside-light 2.5s;
233
- }
234
- .logo-animate-color-inside-dark {
235
- animation: logo-color-inside-dark 2.5s;
236
- }
237
- .logo-animate-color-inside-colored {
238
- animation: logo-color-inside-colored 2.5s;
239
- }
240
- .logo-animate-color-inside-blue {
241
- animation: logo-color-inside-blue 2.5s;
242
- }
243
-
244
- .logo-animate-color-outside-light {
245
- animation: logo-color-outside-light 1.5s;
246
- }
247
- .logo-animate-color-outside-dark {
248
- animation: logo-color-outside-dark 1.5s;
249
- }
250
- .logo-animate-color-outside-colored {
251
- animation: logo-color-outside-colored 1.5s;
252
- }
253
- .logo-animate-color-outside-blue {
254
- animation: logo-color-outside-blue 1.5s;
255
- }
33
+ const loaderStyles = `
34
+ /**
35
+ * Copyright 2018-2024 Denis Haev (bluefox) <dogafox@gmail.com>
36
+ *
37
+ * MIT License
38
+ *
39
+ **/
40
+
41
+ .logo-background-light, .logo-background-colored {
42
+ background: white;
43
+ }
44
+ .logo-background-dark, .logo-background-blue {
45
+ background: black;
46
+ }
47
+ .logo-div {
48
+ position: absolute;
49
+ top: 50%;
50
+ left: 50%;
51
+ -ms-transform: translateX(-50%) translateY(-50%);
52
+ -webkit-transform: translate(-50%,-50%);
53
+ transform: translate(-50%,-50%);
54
+ overflow: hidden;
55
+ border-radius: 50%;
56
+ z-index: 2;
57
+ }
58
+ .logo-border {
59
+ /*border-color: #164477;*/
60
+ border-top-color: #3399CC;
61
+ border-left-color: #164477;
62
+ border-bottom-color: #164477;
63
+ border-right-color: #164477;
64
+ border-radius: 50%;
65
+ border-style: solid;
66
+ box-sizing: border-box;
67
+ width: 100%;
68
+ height: 100%;
69
+ position: absolute;
70
+ }
71
+ .logo-top {
72
+ position: absolute;
73
+ width: 4.5%;
74
+ height: 16%;
75
+ top: 0;
76
+ z-index: 2;
77
+ }
78
+ .logo-i {
79
+ position: absolute;
80
+ width: 14.5%;
81
+ height: 60%;
82
+ top: 20%;
83
+ left: 42%;
84
+ background: #3399CC;
85
+ }
86
+ .logo-i-top {
87
+ position: absolute;
88
+ width: 14.5%;
89
+ height: 4%;
90
+ left: 42%;
91
+ background: #3399CC;
92
+ border-radius: 100%;
93
+ }
94
+ .logo-back {
95
+ width: 100%;
96
+ height: 100%;
97
+ z-index: 0;
98
+ overflow: hidden;
99
+ }
100
+ @keyframes logo-grow {
101
+ 0% {
102
+ width: 230px;
103
+ height: 230px;
104
+ transform: translate(-50%,-50%) scale(1);
105
+ opacity: 1
106
+ }
107
+ 99% {
108
+ width: 230px;
109
+ height: 230px;
110
+ transform: translate(-50%,-50%) scale(10);
111
+ opacity: 0;
112
+ }
113
+ 100% {
114
+ width: 0;
115
+ height: 0;
116
+ opacity: 0;
117
+ }
118
+ }
119
+ @keyframes logo-spin { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }
120
+ @keyframes logo-color-inside-light {
121
+ 0% {
122
+ background: #FEFEFE;
123
+ }
124
+ 100% {
125
+ background: #3399CC;
126
+ }
127
+ }
128
+ @keyframes logo-color-inside-dark {
129
+ 0% {
130
+ background: #030303;
131
+ }
132
+ 100% {
133
+ background: #3399CC;
134
+ }
135
+ }
136
+ @keyframes logo-color-inside-colored {
137
+ 0% {
138
+ background: #FEFEFE;
139
+ }
140
+ 100% {
141
+ background: #3399CC;
142
+ }
143
+ }
144
+ @keyframes logo-color-inside-blue {
145
+ 0% {
146
+ background: #030303;
147
+ }
148
+ 100% {
149
+ background: #3399CC;
150
+ }
151
+ }
152
+
153
+ @keyframes logo-color-outside-light {
154
+ 0% {
155
+ border-color: #FEFEFE;
156
+ }
157
+ 100% {
158
+ border-top-color: #3399CC;
159
+ border-left-color: #164477;
160
+ border-bottom-color: #164477;
161
+ border-right-color: #164477;
162
+ }
163
+ }
164
+ @keyframes logo-color-outside-dark {
165
+ 0% {
166
+ border-color: #040404;
167
+ }
168
+ 100% {
169
+ border-top-color: #3399CC;
170
+ border-left-color: #164477;
171
+ border-bottom-color: #164477;
172
+ border-right-color: #164477;
173
+ }
174
+ }
175
+ @keyframes logo-color-outside-colored {
176
+ 0% {
177
+ border-color: #FEFEFE;
178
+ }
179
+ 100% {
180
+ border-top-color: #3399CC;
181
+ border-left-color: #164477;
182
+ border-bottom-color: #164477;
183
+ border-right-color: #164477;
184
+ }
185
+ }
186
+ @keyframes logo-color-outside-blue {
187
+ 0% {
188
+ border-color: #040404;
189
+ }
190
+ 100% {
191
+ border-top-color: #3399CC;
192
+ border-left-color: #164477;
193
+ border-bottom-color: #164477;
194
+ border-right-color: #164477;
195
+ }
196
+ }
197
+
198
+ .logo-animate-wait {
199
+ animation: logo-color-outside 1.5s, logo-spin 1.5s linear infinite;
200
+ }
201
+
202
+ .logo-animate-grow-light {
203
+ background: #DDD;
204
+ }
205
+ .logo-animate-grow-dark {
206
+ background: #1d1d1d;
207
+ }
208
+ .logo-animate-grow-colored {
209
+ background: #DDD;
210
+ }
211
+ .logo-animate-grow-blue {
212
+ background: #1d1d1d;
213
+ }
214
+
215
+ .logo-animate-grow {
216
+ display: inline-block;
217
+ text-align: center;
218
+ z-index: 1;
219
+ top: 50%;
220
+ left: 50%;
221
+ -ms-transform: translateX(-50%) translateY(-50%);
222
+ -webkit-transform: translate(-50%,-50%);
223
+ transform: translate(-50%,-50%);
224
+ width: 245px;
225
+ height: 245px;
226
+ border-radius: 50%;
227
+ position: absolute;
228
+ animation: logo-grow 1s 1 ease forwards;
229
+ }
230
+
231
+ .logo-animate-color-inside-light {
232
+ animation: logo-color-inside-light 2.5s;
233
+ }
234
+ .logo-animate-color-inside-dark {
235
+ animation: logo-color-inside-dark 2.5s;
236
+ }
237
+ .logo-animate-color-inside-colored {
238
+ animation: logo-color-inside-colored 2.5s;
239
+ }
240
+ .logo-animate-color-inside-blue {
241
+ animation: logo-color-inside-blue 2.5s;
242
+ }
243
+
244
+ .logo-animate-color-outside-light {
245
+ animation: logo-color-outside-light 1.5s;
246
+ }
247
+ .logo-animate-color-outside-dark {
248
+ animation: logo-color-outside-dark 1.5s;
249
+ }
250
+ .logo-animate-color-outside-colored {
251
+ animation: logo-color-outside-colored 1.5s;
252
+ }
253
+ .logo-animate-color-outside-blue {
254
+ animation: logo-color-outside-blue 1.5s;
255
+ }
256
256
  `;
257
257
  function Loader(props) {
258
258
  (0, react_1.useEffect)(() => {