@sikka/hawa 0.0.2 → 0.0.3

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 (130) hide show
  1. package/.github/workflows/hawa-publish.yml +43 -0
  2. package/.prettierrc +28 -28
  3. package/README.md +149 -148
  4. package/package.json +49 -47
  5. package/rollup.config.js +30 -30
  6. package/src/blocks/Account/UserProfile.js +15 -0
  7. package/src/blocks/Account/UserSettings.js +15 -0
  8. package/src/blocks/Account/index.js +2 -0
  9. package/src/blocks/AuthForms/NewPasswordForm.js +17 -0
  10. package/src/blocks/AuthForms/ResetPasswordForm.js +14 -0
  11. package/src/blocks/AuthForms/SignInForm.js +19 -0
  12. package/src/{components/Hawa → blocks}/AuthForms/SignUpForm.js +20 -26
  13. package/src/{components/Hawa → blocks}/AuthForms/index.js +4 -4
  14. package/src/{components/Hawa → blocks}/AuthForms/viaFacebook.js +0 -0
  15. package/src/{components/Hawa → blocks}/AuthForms/viaGithub.js +0 -0
  16. package/src/{components/Hawa → blocks}/AuthForms/viaGoogle.js +0 -0
  17. package/src/{components/Hawa → blocks}/AuthForms/viaTwitter.js +0 -0
  18. package/src/index.js +1 -1
  19. package/src/layout/Box.js +25 -0
  20. package/src/layout/index.js +1 -0
  21. package/src/stories/ActionButton.stories.js +49 -0
  22. package/src/stories/AdaptiveButton.stories.js +80 -80
  23. package/src/stories/Alert.stories.js +41 -48
  24. package/src/stories/AuthForm.stories.js +79 -76
  25. package/src/stories/Box.stories.js +64 -45
  26. package/src/stories/CheckBox.stories.js +35 -34
  27. package/src/stories/GlobalVariables.stories.js +101 -108
  28. package/src/stories/HawaProvider.stories.js +23 -23
  29. package/src/stories/InputLabel.stories.js +92 -100
  30. package/src/stories/Introduction.stories.js +211 -0
  31. package/src/stories/RadioSelector.stories.js +69 -69
  32. package/src/stories/TextField.stories.js +50 -50
  33. package/src/stories/UserAccount.stories.js +46 -0
  34. package/src/styles.css +400 -400
  35. package/src/themes/HawaProvider.js +45 -0
  36. package/src/ui/ActionButton.js +15 -0
  37. package/src/{components/Hawa/AdaptiveButton → ui}/AdaptiveButton.js +252 -254
  38. package/src/{components/Hawa/AutoCompleteField/AutoCompleteField.jsx → ui/AutoCompleteField.js} +33 -33
  39. package/src/{components/Hawa/Checkbox/Checkbox.jsx → ui/Checkbox.js} +21 -20
  40. package/src/{components/Hawa/DragDropImages/DragDropImages.jsx → ui/DragDropImages.js} +180 -180
  41. package/src/{components/Hawa/Hawa.jsx → ui/Hawa.js} +3 -3
  42. package/src/{components/Hawa/RadioBox/RadioBox.jsx → ui/RadioBox.js} +29 -29
  43. package/src/{components/Hawa/RadioSelector/RadioSelector.jsx → ui/RadioSelector.js} +51 -51
  44. package/src/{components/Hawa/Row/Row.jsx → ui/Row.js} +21 -21
  45. package/src/{components/Hawa/SelectedField/SelectedField.jsx → ui/SelectedField.js} +46 -46
  46. package/src/ui/StyledAlert.js +30 -0
  47. package/src/ui/StyledInputLabel.js +19 -0
  48. package/src/{components/Hawa/StyledTooltip → ui}/StyledTooltip.js +46 -46
  49. package/src/{components/Hawa/TabPanel/TabPanel.jsx → ui/TabPanel.js} +37 -37
  50. package/src/{components/Hawa/TextArea/TextArea.jsx → ui/TextArea.js} +38 -38
  51. package/src/{components/Hawa/TextField → ui}/TextField.js +62 -54
  52. package/src/{components/Hawa → ui}/index.js +13 -10
  53. package/src/util.js +20 -20
  54. package/storybook-static/0.d3bc3395610cf5d3ee94.manager.bundle.js +1 -0
  55. package/storybook-static/0.dd3d47f5.iframe.bundle.js +1 -0
  56. package/storybook-static/1.4e43f671.iframe.bundle.js +3 -0
  57. package/storybook-static/{1.7c0dc86d.iframe.bundle.js.LICENSE.txt → 1.4e43f671.iframe.bundle.js.LICENSE.txt} +0 -0
  58. package/storybook-static/1.4e43f671.iframe.bundle.js.map +1 -0
  59. package/storybook-static/2.9a757207.iframe.bundle.js +1 -0
  60. package/storybook-static/{3.592ce28f.iframe.bundle.js → 3.c1dc7159.iframe.bundle.js} +0 -0
  61. package/storybook-static/4.8c311a6b48cad9f29317.manager.bundle.js +2 -0
  62. package/storybook-static/{5.f459d151315e6780c20f.manager.bundle.js.LICENSE.txt → 4.8c311a6b48cad9f29317.manager.bundle.js.LICENSE.txt} +0 -0
  63. package/storybook-static/5.88fe62ee92ff5ca67829.manager.bundle.js +1 -0
  64. package/storybook-static/6.96d184f368dea006cb52.manager.bundle.js +2 -0
  65. package/storybook-static/{11.f4e922583ae35da460f3.manager.bundle.js.LICENSE.txt → 6.96d184f368dea006cb52.manager.bundle.js.LICENSE.txt} +0 -0
  66. package/storybook-static/{7.3d04765dbf3f1dcd706c.manager.bundle.js → 7.5ec31f3702b08ab0b71c.manager.bundle.js} +1 -1
  67. package/storybook-static/7.69d2e532.iframe.bundle.js +1 -0
  68. package/storybook-static/8.5ce13be7612bd3a6b864.manager.bundle.js +1 -0
  69. package/storybook-static/{8.8e2132ec.iframe.bundle.js → 8.68cd1217.iframe.bundle.js} +2 -2
  70. package/storybook-static/{8.8e2132ec.iframe.bundle.js.LICENSE.txt → 8.68cd1217.iframe.bundle.js.LICENSE.txt} +0 -0
  71. package/storybook-static/8.68cd1217.iframe.bundle.js.map +1 -0
  72. package/storybook-static/{9.109ea555.iframe.bundle.js → 9.488e3969.iframe.bundle.js} +0 -0
  73. package/storybook-static/iframe.html +2 -2
  74. package/storybook-static/index.html +9 -1
  75. package/storybook-static/main.65cb2769.iframe.bundle.js +1 -0
  76. package/storybook-static/main.7e391cf7bf72b0d18ea5.manager.bundle.js +1 -0
  77. package/storybook-static/{runtime~main.ffc8677e.iframe.bundle.js → runtime~main.6e2e1544.iframe.bundle.js} +1 -1
  78. package/storybook-static/runtime~main.cc29f4c2175f187a3707.manager.bundle.js +1 -0
  79. package/storybook-static/vendors~main.d144d840.iframe.bundle.js +3 -0
  80. package/storybook-static/{vendors~main.4aa936b1.iframe.bundle.js.LICENSE.txt → vendors~main.d144d840.iframe.bundle.js.LICENSE.txt} +0 -0
  81. package/storybook-static/vendors~main.d144d840.iframe.bundle.js.map +1 -0
  82. package/storybook-static/vendors~main.f228d62e92b69563cefb.manager.bundle.js +2 -0
  83. package/storybook-static/{vendors~main.a935f15a2179a6eff5fd.manager.bundle.js.LICENSE.txt → vendors~main.f228d62e92b69563cefb.manager.bundle.js.LICENSE.txt} +6 -12
  84. package/yarn-error.log +10910 -0
  85. package/dist/index.es.js +0 -37
  86. package/dist/index.js +0 -37
  87. package/src/components/Hawa/AdaptiveButton/index.js +0 -1
  88. package/src/components/Hawa/AuthForms/NewPasswordForm.js +0 -23
  89. package/src/components/Hawa/AuthForms/ResetPasswordForm.js +0 -21
  90. package/src/components/Hawa/AuthForms/SignInForm.js +0 -25
  91. package/src/components/Hawa/AutoCompleteField/index.js +0 -1
  92. package/src/components/Hawa/Box/Box.js +0 -18
  93. package/src/components/Hawa/Box/index.js +0 -1
  94. package/src/components/Hawa/Checkbox/index.js +0 -1
  95. package/src/components/Hawa/DragDropImages/index.js +0 -1
  96. package/src/components/Hawa/HawaProvider/HawaProvider.js +0 -19
  97. package/src/components/Hawa/HawaProvider/index.js +0 -1
  98. package/src/components/Hawa/InputLabel/StyledInputLabel.js +0 -15
  99. package/src/components/Hawa/InputLabel/index.js +0 -1
  100. package/src/components/Hawa/RadioBox/index.js +0 -1
  101. package/src/components/Hawa/RadioSelector/index.js +0 -1
  102. package/src/components/Hawa/Row/index.js +0 -1
  103. package/src/components/Hawa/SelectedField/index.js +0 -1
  104. package/src/components/Hawa/StyledAlert/StyledAlert.js +0 -15
  105. package/src/components/Hawa/StyledAlert/index.js +0 -1
  106. package/src/components/Hawa/StyledTooltip/index.js +0 -1
  107. package/src/components/Hawa/TabPanel/index.js +0 -1
  108. package/src/components/Hawa/TextArea/index.js +0 -1
  109. package/src/components/Hawa/TextField/index.js +0 -1
  110. package/storybook-static/0.12392f0b.iframe.bundle.js +0 -1
  111. package/storybook-static/0.55b012452099ace2dca6.manager.bundle.js +0 -1
  112. package/storybook-static/1.0f38715c61c7c3cd11db.manager.bundle.js +0 -1
  113. package/storybook-static/1.7c0dc86d.iframe.bundle.js +0 -3
  114. package/storybook-static/1.7c0dc86d.iframe.bundle.js.map +0 -1
  115. package/storybook-static/10.9f2923a7561bc20fffdb.manager.bundle.js +0 -1
  116. package/storybook-static/11.f4e922583ae35da460f3.manager.bundle.js +0 -2
  117. package/storybook-static/12.1415460941f0bdcb8fa8.manager.bundle.js +0 -1
  118. package/storybook-static/2.ee357266.iframe.bundle.js +0 -1
  119. package/storybook-static/5.f459d151315e6780c20f.manager.bundle.js +0 -2
  120. package/storybook-static/6.3bd64d820f3745f262ff.manager.bundle.js +0 -1
  121. package/storybook-static/7.af56919f.iframe.bundle.js +0 -1
  122. package/storybook-static/8.8e2132ec.iframe.bundle.js.map +0 -1
  123. package/storybook-static/8.b541eadfcb9164835dfc.manager.bundle.js +0 -1
  124. package/storybook-static/9.411ac8e451bbb10926c7.manager.bundle.js +0 -1
  125. package/storybook-static/main.78b7d418.iframe.bundle.js +0 -1
  126. package/storybook-static/main.9bb085ebb152f5b19a2a.manager.bundle.js +0 -1
  127. package/storybook-static/runtime~main.9468098d21070636985f.manager.bundle.js +0 -1
  128. package/storybook-static/vendors~main.4aa936b1.iframe.bundle.js +0 -3
  129. package/storybook-static/vendors~main.4aa936b1.iframe.bundle.js.map +0 -1
  130. package/storybook-static/vendors~main.a935f15a2179a6eff5fd.manager.bundle.js +0 -2
package/src/styles.css CHANGED
@@ -1,400 +1,400 @@
1
- .reset_password_root {
2
- display: flex;
3
- flex-direction: column;
4
- justify-content: center;
5
- align-items: center;
6
- flex-grow: 1;
7
- background-color: var(--light);
8
- }
9
- .reset_password_paper {
10
- margin-top: 8px;
11
- display: flex;
12
- flex-direction: column;
13
- align-items: center;
14
- }
15
- /* START INDEX.JS */
16
- .index_root {
17
- height: 100vh;
18
- display: flex;
19
- flex-direction: column;
20
- justify-content: center;
21
- align-items: center;
22
- }
23
- .index_logo {
24
- height: 70px;
25
- display: flex;
26
- flex-direction: column;
27
- justify-content: center;
28
- align-items: center;
29
- }
30
- .index_buttons_container {
31
- margin-top: 20px;
32
- display: flex;
33
- flex-direction: column;
34
- justify-content: center;
35
- align-items: center;
36
- }
37
- /* END INDEX.js */
38
- .account_section {
39
- display: flex;
40
- flex-direction: column;
41
- align-items: center;
42
- margin: 10px;
43
- /* max-width: 400px; */
44
- /* background-color: black; */
45
- }
46
- .account_deactivate {
47
- text-align: center;
48
- opacity: 1;
49
- font-size: 13px;
50
- color: red;
51
- padding: 5px;
52
- cursor: pointer;
53
- width: fit-content;
54
- }
55
- .text_button {
56
- cursor: pointer;
57
- color: var(--blue);
58
- font-weight: 500;
59
- }
60
- .bottom_text {
61
- margin-top: 10px;
62
- font-size: 14px;
63
- }
64
- .newsletter_container {
65
- display: flex;
66
- align-items: center;
67
- justify-content: flex-start;
68
- flex-direction: row;
69
- margin-top: 15px;
70
- }
71
- .modalTEST {
72
- background-color: red;
73
- width: 10px;
74
- }
75
- .modal_theme {
76
- background-color: black;
77
- opacity: 0.3;
78
- border: none;
79
- }
80
- .user_form {
81
- background-color: var(--lightGrey);
82
- padding: 20px;
83
- border-radius: var(--borderR);
84
- margin-bottom: 20px;
85
- margin-top: 10px;
86
- }
87
- .user_form_container {
88
- display: flex;
89
- flex-direction: column;
90
- justify-content: center;
91
- width: 90%;
92
- max-width: 400px;
93
- height: 100vh;
94
- }
95
- .input {
96
- color: black;
97
- background-color: var(--light);
98
- /* padding: 10px; */
99
- border-radius: var(--borderR);
100
- border-bottom: none;
101
- border: none;
102
- }
103
- .balanceInput {
104
- color: black;
105
- background-color: var(--light);
106
- padding: 10px;
107
- border-radius: var(--borderR);
108
- border-bottom: none;
109
- border: none;
110
- }
111
- .theme_form_input {
112
- color: black;
113
- background-color: var(--light);
114
- border-radius: var(--borderR);
115
- border-bottom: none;
116
- border: none;
117
- width: 100%;
118
- }
119
- .theme_input {
120
- color: black;
121
- background-color: var(--light);
122
- padding: 10px;
123
- border-radius: var(--borderR);
124
- border-bottom: none;
125
- border: none;
126
- width: 100%;
127
- }
128
- .theme_input2 {
129
- color: black;
130
- background-color: var(--light);
131
- /* padding: 10px; */
132
- border-radius: var(--borderR);
133
- border-bottom: none;
134
- border: none;
135
- width: 100%;
136
- }
137
- .theme_input2 input {
138
- color: black;
139
- background-color: var(--light);
140
- padding: 10px;
141
- border-radius: var(--borderR);
142
- border-bottom: none;
143
- border: none;
144
- width: 100%;
145
- }
146
- .theme_form_input input {
147
- color: black;
148
- background-color: var(--light);
149
- padding: 10px;
150
- border-radius: var(--borderR);
151
- border-bottom: none;
152
- border: none;
153
- width: 100%;
154
- }
155
- .form_textarea {
156
- color: black;
157
- background-color: var(--light);
158
- border-radius: var(--borderR);
159
- border-bottom: none;
160
- border: none;
161
- width: 100%;
162
- padding: 0px;
163
- margin: 0px;
164
- margin-bottom: 0px;
165
- resize: vertical;
166
- }
167
-
168
- .input_label {
169
- font-size: 15px;
170
- font-weight: 500;
171
- position: relative;
172
- /* margin-top: 10px; */
173
- margin: 15px;
174
- margin-left: 0px;
175
- }
176
- .loading_overlay {
177
- position: absolute;
178
- display: grid;
179
- place-items: center;
180
- height: 100%;
181
- width: 100%;
182
- z-index: 2;
183
- padding: 0;
184
- margin: 0px;
185
- }
186
- .inputLabel {
187
- font-size: 20px;
188
- margin-bottom: 10px;
189
- font-weight: 500;
190
-
191
- position: relative;
192
- }
193
- .navbar_root_container {
194
- /* flex-grow: 1; */
195
- padding-right: 10px;
196
- padding-left: 10px;
197
- width: 100%;
198
- background-color: blue;
199
- }
200
- .navbar_container {
201
- display: flex;
202
- flex-direction: row;
203
- justify-content: space-between;
204
- align-items: center;
205
- padding-right: 10px;
206
- padding-left: 10px;
207
- /* background-color: white; */
208
- }
209
- .navbar_logo {
210
- display: flex;
211
- justify-content: flex-start;
212
- align-items: center;
213
- height: 70px;
214
- cursor: pointer;
215
- padding: 0px;
216
- }
217
- .navbar_button {
218
- color: black;
219
- background-color: var(--light);
220
- box-shadow: none;
221
- /* border: 1px solid var(--blue); */
222
- }
223
- .navbar_button_primary {
224
- color: var(--light);
225
- background-color: var(--blue);
226
- box-shadow: none;
227
- }
228
- .error_page {
229
- /* background-color: green; */
230
- display: flex;
231
- flex-direction: column;
232
- justify-content: center;
233
- align-items: center;
234
- text-align: center;
235
- height: 100vh;
236
- }
237
- .error_page_text_main {
238
- /* background-color: darkgoldenrod; */
239
- padding: 10px;
240
- font-size: 30px;
241
- font-weight: 500;
242
- }
243
- .error_page_text_second {
244
- /* background-color: darkorchid; */
245
- padding: 10px;
246
- }
247
- .radio_selector_container {
248
- background-color: white;
249
- display: flex;
250
- flex-direction: row;
251
- border-radius: var(--borderR);
252
- margin-bottom: 10px;
253
- }
254
- .radio_option {
255
- background-color: var(--lightGrey);
256
- border-radius: var(--borderR);
257
- margin: 5px;
258
- padding: 10px;
259
- width: 100%;
260
- justify-content: center;
261
- align-items: center;
262
- text-align: center;
263
- font-size: 14px;
264
- cursor: pointer;
265
- white-space: nowrap;
266
- }
267
- .settings_row {
268
- background-color: var(--light);
269
- border-radius: var(--borderR);
270
- display: flex;
271
- flex-direction: row;
272
- justify-content: space-between;
273
- align-items: center;
274
- height: 50px;
275
- padding: 10px;
276
- width: 100%;
277
- }
278
- .settings_row_actions {
279
- background-color: rgb(223, 221, 221);
280
- width: 100%;
281
- max-width: 200px;
282
- border-radius: var(--borderR);
283
- }
284
- .white_button {
285
- background-color: rgb(223, 221, 221);
286
- padding: 10px;
287
- /* margin: 10px; */
288
- width: 100px;
289
- text-align: center;
290
- cursor: pointer;
291
- border-radius: var(--borderR);
292
- /* border-radius: 0 var(--borderR) var(--borderR) 0; */
293
- }
294
- .blue_button {
295
- background-color: var(--blue);
296
- color: white;
297
- padding: 10px;
298
- /* margin: 10px; */
299
- width: 100px;
300
- text-align: center;
301
- cursor: pointer;
302
- border-radius: var(--borderR);
303
- /* border-radius: var(--borderR) 0 0 var(--borderR); */
304
- }
305
- .route_loading {
306
- position: fixed;
307
- bottom: 20px;
308
- right: 20px;
309
- background-color: var(--blue);
310
- border-radius: var(--borderR);
311
- padding: 10px;
312
- height: 50px;
313
- width: 50px;
314
- display: flex;
315
- justify-content: center;
316
- align-items: center;
317
- z-index: 400;
318
- }
319
- .offline_banner {
320
- position: fixed;
321
- bottom: 20px;
322
- left: 20px;
323
- /* background-color: var(--red); */
324
- background-color: red;
325
- border-radius: var(--borderR);
326
- padding: 10px;
327
- height: 50px;
328
- /* width: 50px; */
329
- display: flex;
330
- justify-content: center;
331
- align-items: center;
332
- z-index: 400;
333
- color: white;
334
- }
335
- .language_modal_button {
336
- background-color: var(--blue);
337
- padding: 10px;
338
- height: 100%;
339
- width: 100%;
340
- border-radius: var(--borderR);
341
- text-align: center;
342
- color: white;
343
- margin: 10px;
344
- }
345
- .language_modal_buttons_container {
346
- margin: 10px;
347
- display: flex;
348
- flex-direction: row;
349
- justify-content: space-between;
350
- }
351
- .language_modal_root {
352
- display: flex;
353
- flex-direction: row;
354
- justify-content: space-between;
355
- padding: 20px;
356
- font-size: 20px;
357
- font-weight: 700px;
358
- width: 100%;
359
- }
360
- /* DragDropMenuLogo */
361
- .upload_error_container {
362
- background-color: #f44336;
363
- color: white;
364
- border-radius: var(--borderR);
365
- padding: 10px;
366
- margin: 5px;
367
- font-size: 13px;
368
- }
369
- .upload_main_container {
370
- display: flex;
371
- border-color: var(--blue);
372
- border-style: solid;
373
- border-radius: var(--borderR);
374
- border-width: 2px;
375
- cursor: pointer;
376
- }
377
- @media (max-width: 600px) {
378
- .radio_selector_container {
379
- width: 100%;
380
- flex-wrap: wrap;
381
- }
382
- .settings_row {
383
- flex-wrap: wrap;
384
- height: auto;
385
- }
386
- .white_button {
387
- width: 100%;
388
- }
389
- .blue_button {
390
- width: 100%;
391
- }
392
- .settings_row_actions {
393
- width: 100%;
394
- max-width: 100%;
395
- }
396
- .settings_row_title {
397
- margin-bottom: 10px;
398
- margin-top: 10px;
399
- }
400
- }
1
+ .reset_password_root {
2
+ display: flex;
3
+ flex-direction: column;
4
+ justify-content: center;
5
+ align-items: center;
6
+ flex-grow: 1;
7
+ background-color: var(--light);
8
+ }
9
+ .reset_password_paper {
10
+ margin-top: 8px;
11
+ display: flex;
12
+ flex-direction: column;
13
+ align-items: center;
14
+ }
15
+ /* START INDEX.JS */
16
+ .index_root {
17
+ height: 100vh;
18
+ display: flex;
19
+ flex-direction: column;
20
+ justify-content: center;
21
+ align-items: center;
22
+ }
23
+ .index_logo {
24
+ height: 70px;
25
+ display: flex;
26
+ flex-direction: column;
27
+ justify-content: center;
28
+ align-items: center;
29
+ }
30
+ .index_buttons_container {
31
+ margin-top: 20px;
32
+ display: flex;
33
+ flex-direction: column;
34
+ justify-content: center;
35
+ align-items: center;
36
+ }
37
+ /* END INDEX.js */
38
+ .account_section {
39
+ display: flex;
40
+ flex-direction: column;
41
+ align-items: center;
42
+ margin: 10px;
43
+ /* max-width: 400px; */
44
+ /* background-color: black; */
45
+ }
46
+ .account_deactivate {
47
+ text-align: center;
48
+ opacity: 1;
49
+ font-size: 13px;
50
+ color: red;
51
+ padding: 5px;
52
+ cursor: pointer;
53
+ width: fit-content;
54
+ }
55
+ .text_button {
56
+ cursor: pointer;
57
+ color: var(--blue);
58
+ font-weight: 500;
59
+ }
60
+ .bottom_text {
61
+ margin-top: 10px;
62
+ font-size: 14px;
63
+ }
64
+ .newsletter_container {
65
+ display: flex;
66
+ align-items: center;
67
+ justify-content: flex-start;
68
+ flex-direction: row;
69
+ margin-top: 15px;
70
+ }
71
+ .modalTEST {
72
+ background-color: red;
73
+ width: 10px;
74
+ }
75
+ .modal_theme {
76
+ background-color: black;
77
+ opacity: 0.3;
78
+ border: none;
79
+ }
80
+ .user_form {
81
+ background-color: var(--lightGrey);
82
+ padding: 20px;
83
+ border-radius: var(--borderR);
84
+ margin-bottom: 20px;
85
+ margin-top: 10px;
86
+ }
87
+ .user_form_container {
88
+ display: flex;
89
+ flex-direction: column;
90
+ justify-content: center;
91
+ width: 90%;
92
+ max-width: 400px;
93
+ height: 100vh;
94
+ }
95
+ .input {
96
+ color: black;
97
+ background-color: var(--light);
98
+ /* padding: 10px; */
99
+ border-radius: var(--borderR);
100
+ border-bottom: none;
101
+ border: none;
102
+ }
103
+ .balanceInput {
104
+ color: black;
105
+ background-color: var(--light);
106
+ padding: 10px;
107
+ border-radius: var(--borderR);
108
+ border-bottom: none;
109
+ border: none;
110
+ }
111
+ .theme_form_input {
112
+ color: black;
113
+ background-color: var(--light);
114
+ border-radius: var(--borderR);
115
+ border-bottom: none;
116
+ border: none;
117
+ width: 100%;
118
+ }
119
+ .theme_input {
120
+ color: black;
121
+ background-color: var(--light);
122
+ padding: 10px;
123
+ border-radius: var(--borderR);
124
+ border-bottom: none;
125
+ border: none;
126
+ width: 100%;
127
+ }
128
+ .theme_input2 {
129
+ color: black;
130
+ background-color: var(--light);
131
+ /* padding: 10px; */
132
+ border-radius: var(--borderR);
133
+ border-bottom: none;
134
+ border: none;
135
+ width: 100%;
136
+ }
137
+ .theme_input2 input {
138
+ color: black;
139
+ background-color: var(--light);
140
+ padding: 10px;
141
+ border-radius: var(--borderR);
142
+ border-bottom: none;
143
+ border: none;
144
+ width: 100%;
145
+ }
146
+ .theme_form_input input {
147
+ color: black;
148
+ background-color: var(--light);
149
+ padding: 10px;
150
+ border-radius: var(--borderR);
151
+ border-bottom: none;
152
+ border: none;
153
+ width: 100%;
154
+ }
155
+ .form_textarea {
156
+ color: black;
157
+ background-color: var(--light);
158
+ border-radius: var(--borderR);
159
+ border-bottom: none;
160
+ border: none;
161
+ width: 100%;
162
+ padding: 0px;
163
+ margin: 0px;
164
+ margin-bottom: 0px;
165
+ resize: vertical;
166
+ }
167
+
168
+ .input_label {
169
+ font-size: 15px;
170
+ font-weight: 500;
171
+ position: relative;
172
+ /* margin-top: 10px; */
173
+ margin: 15px;
174
+ margin-left: 0px;
175
+ }
176
+ .loading_overlay {
177
+ position: absolute;
178
+ display: grid;
179
+ place-items: center;
180
+ height: 100%;
181
+ width: 100%;
182
+ z-index: 2;
183
+ padding: 0;
184
+ margin: 0px;
185
+ }
186
+ .inputLabel {
187
+ font-size: 20px;
188
+ margin-bottom: 10px;
189
+ font-weight: 500;
190
+
191
+ position: relative;
192
+ }
193
+ .navbar_root_container {
194
+ /* flex-grow: 1; */
195
+ padding-right: 10px;
196
+ padding-left: 10px;
197
+ width: 100%;
198
+ background-color: blue;
199
+ }
200
+ .navbar_container {
201
+ display: flex;
202
+ flex-direction: row;
203
+ justify-content: space-between;
204
+ align-items: center;
205
+ padding-right: 10px;
206
+ padding-left: 10px;
207
+ /* background-color: white; */
208
+ }
209
+ .navbar_logo {
210
+ display: flex;
211
+ justify-content: flex-start;
212
+ align-items: center;
213
+ height: 70px;
214
+ cursor: pointer;
215
+ padding: 0px;
216
+ }
217
+ .navbar_button {
218
+ color: black;
219
+ background-color: var(--light);
220
+ box-shadow: none;
221
+ /* border: 1px solid var(--blue); */
222
+ }
223
+ .navbar_button_primary {
224
+ color: var(--light);
225
+ background-color: var(--blue);
226
+ box-shadow: none;
227
+ }
228
+ .error_page {
229
+ /* background-color: green; */
230
+ display: flex;
231
+ flex-direction: column;
232
+ justify-content: center;
233
+ align-items: center;
234
+ text-align: center;
235
+ height: 100vh;
236
+ }
237
+ .error_page_text_main {
238
+ /* background-color: darkgoldenrod; */
239
+ padding: 10px;
240
+ font-size: 30px;
241
+ font-weight: 500;
242
+ }
243
+ .error_page_text_second {
244
+ /* background-color: darkorchid; */
245
+ padding: 10px;
246
+ }
247
+ .radio_selector_container {
248
+ background-color: white;
249
+ display: flex;
250
+ flex-direction: row;
251
+ border-radius: var(--borderR);
252
+ margin-bottom: 10px;
253
+ }
254
+ .radio_option {
255
+ background-color: var(--lightGrey);
256
+ border-radius: var(--borderR);
257
+ margin: 5px;
258
+ padding: 10px;
259
+ width: 100%;
260
+ justify-content: center;
261
+ align-items: center;
262
+ text-align: center;
263
+ font-size: 14px;
264
+ cursor: pointer;
265
+ white-space: nowrap;
266
+ }
267
+ .settings_row {
268
+ background-color: var(--light);
269
+ border-radius: var(--borderR);
270
+ display: flex;
271
+ flex-direction: row;
272
+ justify-content: space-between;
273
+ align-items: center;
274
+ height: 50px;
275
+ padding: 10px;
276
+ width: 100%;
277
+ }
278
+ .settings_row_actions {
279
+ background-color: rgb(223, 221, 221);
280
+ width: 100%;
281
+ max-width: 200px;
282
+ border-radius: var(--borderR);
283
+ }
284
+ .white_button {
285
+ background-color: rgb(223, 221, 221);
286
+ padding: 10px;
287
+ /* margin: 10px; */
288
+ width: 100px;
289
+ text-align: center;
290
+ cursor: pointer;
291
+ border-radius: var(--borderR);
292
+ /* border-radius: 0 var(--borderR) var(--borderR) 0; */
293
+ }
294
+ .blue_button {
295
+ background-color: var(--blue);
296
+ color: white;
297
+ padding: 10px;
298
+ /* margin: 10px; */
299
+ width: 100px;
300
+ text-align: center;
301
+ cursor: pointer;
302
+ border-radius: var(--borderR);
303
+ /* border-radius: var(--borderR) 0 0 var(--borderR); */
304
+ }
305
+ .route_loading {
306
+ position: fixed;
307
+ bottom: 20px;
308
+ right: 20px;
309
+ background-color: var(--blue);
310
+ border-radius: var(--borderR);
311
+ padding: 10px;
312
+ height: 50px;
313
+ width: 50px;
314
+ display: flex;
315
+ justify-content: center;
316
+ align-items: center;
317
+ z-index: 400;
318
+ }
319
+ .offline_banner {
320
+ position: fixed;
321
+ bottom: 20px;
322
+ left: 20px;
323
+ /* background-color: var(--red); */
324
+ background-color: red;
325
+ border-radius: var(--borderR);
326
+ padding: 10px;
327
+ height: 50px;
328
+ /* width: 50px; */
329
+ display: flex;
330
+ justify-content: center;
331
+ align-items: center;
332
+ z-index: 400;
333
+ color: white;
334
+ }
335
+ .language_modal_button {
336
+ background-color: var(--blue);
337
+ padding: 10px;
338
+ height: 100%;
339
+ width: 100%;
340
+ border-radius: var(--borderR);
341
+ text-align: center;
342
+ color: white;
343
+ margin: 10px;
344
+ }
345
+ .language_modal_buttons_container {
346
+ margin: 10px;
347
+ display: flex;
348
+ flex-direction: row;
349
+ justify-content: space-between;
350
+ }
351
+ .language_modal_root {
352
+ display: flex;
353
+ flex-direction: row;
354
+ justify-content: space-between;
355
+ padding: 20px;
356
+ font-size: 20px;
357
+ font-weight: 700px;
358
+ width: 100%;
359
+ }
360
+ /* DragDropMenuLogo */
361
+ .upload_error_container {
362
+ background-color: #f44336;
363
+ color: white;
364
+ border-radius: var(--borderR);
365
+ padding: 10px;
366
+ margin: 5px;
367
+ font-size: 13px;
368
+ }
369
+ .upload_main_container {
370
+ display: flex;
371
+ border-color: var(--blue);
372
+ border-style: solid;
373
+ border-radius: var(--borderR);
374
+ border-width: 2px;
375
+ cursor: pointer;
376
+ }
377
+ @media (max-width: 600px) {
378
+ .radio_selector_container {
379
+ width: 100%;
380
+ flex-wrap: wrap;
381
+ }
382
+ .settings_row {
383
+ flex-wrap: wrap;
384
+ height: auto;
385
+ }
386
+ .white_button {
387
+ width: 100%;
388
+ }
389
+ .blue_button {
390
+ width: 100%;
391
+ }
392
+ .settings_row_actions {
393
+ width: 100%;
394
+ max-width: 100%;
395
+ }
396
+ .settings_row_title {
397
+ margin-bottom: 10px;
398
+ margin-top: 10px;
399
+ }
400
+ }