@mycause/ui 0.0.0-ce0170ad → 0.0.0-cf96d552

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 (113) hide show
  1. package/CHANGELOG.md +258 -0
  2. package/README.md +9 -0
  3. package/dist/components/button-select/button-select.d.ts +12 -0
  4. package/dist/components/button-select/button-select.stories.d.ts +13 -0
  5. package/dist/components/button-select/index.d.ts +1 -0
  6. package/dist/components/campaign-card/campaign-card.d.ts +9 -0
  7. package/dist/components/campaign-card/campaign-card.stories.d.ts +14 -0
  8. package/dist/components/campaign-card/index.d.ts +1 -0
  9. package/dist/components/campaign-of-month/campaign-of-month.d.ts +12 -0
  10. package/dist/components/campaign-of-month/campaign-of-month.stories.d.ts +14 -0
  11. package/dist/components/campaign-of-month/index.d.ts +1 -0
  12. package/dist/components/campain-card/campain-card.d.ts +9 -0
  13. package/dist/components/campain-card/campain-card.stories.d.ts +14 -0
  14. package/dist/components/charity-card/charity-card.d.ts +7 -0
  15. package/dist/components/charity-card/charity-card.stories.d.ts +14 -0
  16. package/dist/components/charity-card/index.d.ts +1 -0
  17. package/dist/components/combo-field/combo-field.d.ts +4 -1
  18. package/dist/components/comment-section/comment-section.d.ts +23 -0
  19. package/dist/components/comment-section/comment-section.stories.d.ts +13 -0
  20. package/dist/components/comment-section/index.d.ts +1 -0
  21. package/dist/components/comment-section/sub-comments.d.ts +6 -0
  22. package/dist/components/cropper/cropper.d.ts +5 -2
  23. package/dist/components/cropper/cropper.stories.d.ts +1 -2
  24. package/dist/components/date-picker/date-picker.d.ts +3 -3
  25. package/dist/components/date-picker/single-date-picker.d.ts +4 -3
  26. package/dist/components/donate-card/donate-card.d.ts +8 -0
  27. package/dist/components/donate-card/donate-card.stories.d.ts +14 -0
  28. package/dist/components/donate-card/index.d.ts +1 -0
  29. package/dist/components/donation-form/donation-details.d.ts +12 -0
  30. package/dist/components/donation-form/donation-form.d.ts +64 -0
  31. package/dist/components/{phone-number-field/phone-number-field.stories.d.ts → donation-form/donation-form.stories.d.ts} +1 -1
  32. package/dist/components/donation-form/donation-payment.d.ts +13 -0
  33. package/dist/components/donation-form/donation-select.d.ts +13 -0
  34. package/dist/components/donation-form/index.d.ts +1 -0
  35. package/dist/components/elevation/elevation.d.ts +2 -1
  36. package/dist/components/featured-campaign-card /featured-campaign-card.d.ts +14 -0
  37. package/dist/components/featured-campaign-card /featured-campaign-card.stories.d.ts +14 -0
  38. package/dist/components/featured-campaign-card /index.d.ts +1 -0
  39. package/dist/components/featured-campain-card /featured-campain-card .stories.d.ts +14 -0
  40. package/dist/components/featured-campain-card /featured-campain-card.d.ts +14 -0
  41. package/dist/components/fundraising-section/fundraising-section.d.ts +9 -0
  42. package/dist/components/fundraising-section/fundraising-section.stories.d.ts +14 -0
  43. package/dist/components/fundraising-section/index.d.ts +1 -0
  44. package/dist/components/hero-banner/hero-banner.d.ts +9 -0
  45. package/dist/components/hero-banner/hero-banner.stories.d.ts +14 -0
  46. package/dist/components/hero-banner/index.d.ts +1 -0
  47. package/dist/components/horizontalbar/horizontalbar.d.ts +11 -0
  48. package/dist/components/horizontalbar/horizontalbar.stories.d.ts +26 -0
  49. package/dist/components/horizontalbar/index.d.ts +1 -0
  50. package/dist/components/icon/heart-toggle.d.ts +11 -0
  51. package/dist/components/icon/heart-toggle.stories.d.ts +13 -0
  52. package/dist/components/icon/index.d.ts +1 -1
  53. package/dist/components/index.d.ts +6 -1
  54. package/dist/components/list/list.d.ts +30 -14
  55. package/dist/components/list/list.stories.d.ts +8 -2
  56. package/dist/components/login/login.d.ts +13 -6
  57. package/dist/components/login/login.stories.d.ts +2 -3
  58. package/dist/components/modal/modal.d.ts +4 -3
  59. package/dist/components/modal/modal.stories.d.ts +6 -0
  60. package/dist/components/nav/index.d.ts +1 -0
  61. package/dist/components/nav/nav-actions.d.ts +5 -0
  62. package/dist/components/nav/nav-bar.d.ts +7 -0
  63. package/dist/components/nav/nav-call-to-action.d.ts +5 -0
  64. package/dist/components/nav/nav-expanded.d.ts +11 -0
  65. package/dist/components/nav/nav-list.d.ts +27 -0
  66. package/dist/components/nav/nav-menu-control.d.ts +7 -0
  67. package/dist/components/nav/nav-menu.d.ts +12 -0
  68. package/dist/components/nav/nav-search-control.d.ts +7 -0
  69. package/dist/components/nav/nav-search.d.ts +9 -0
  70. package/dist/components/nav/nav-sign-in-control.d.ts +11 -0
  71. package/dist/components/nav/nav-user-menu-items.d.ts +20 -0
  72. package/dist/components/nav/nav-user-menu.d.ts +18 -0
  73. package/dist/components/nav/nav.d.ts +55 -0
  74. package/dist/components/nav/nav.stories.d.ts +11 -0
  75. package/dist/components/navigation/navigation-list.d.ts +3 -1
  76. package/dist/components/navigation/navigation-menu.d.ts +2 -1
  77. package/dist/components/navigation/navigation-sign-in-control.d.ts +6 -3
  78. package/dist/components/navigation/navigation.d.ts +12 -1
  79. package/dist/components/navigation/navigation.stories.d.ts +3 -21
  80. package/dist/components/phone-number-input/index.d.ts +2 -0
  81. package/dist/components/{phone-number-field/phone-number-field.d.ts → phone-number-input/phone-number-input.d.ts} +5 -3
  82. package/dist/components/phone-number-input/phone-number-input.stories.d.ts +13 -0
  83. package/dist/components/{phone-number-field → phone-number-input}/util.d.ts +0 -0
  84. package/dist/components/popup/index.d.ts +1 -0
  85. package/dist/components/popup/popup.d.ts +8 -0
  86. package/dist/components/popup/popup.stories.d.ts +14 -0
  87. package/dist/components/progressbar/index.d.ts +1 -0
  88. package/dist/components/progressbar/progressbar.d.ts +8 -0
  89. package/dist/components/progressbar/progressbar.stories.d.ts +14 -0
  90. package/dist/components/select/select.d.ts +3 -1
  91. package/dist/components/spinner/index.d.ts +1 -0
  92. package/dist/components/spinner/spinner.d.ts +8 -0
  93. package/dist/components/spinner/spinner.stories.d.ts +13 -0
  94. package/dist/components/start-campaign-card/index.d.ts +1 -0
  95. package/dist/components/start-campaign-card/start-campaign-card.d.ts +8 -0
  96. package/dist/components/start-campaign-card/start-campaign-card.stories.d.ts +14 -0
  97. package/dist/components/start-campain-card/start-campain-card.d.ts +8 -0
  98. package/dist/components/start-campain-card/start-campain-card.stories.d.ts +14 -0
  99. package/dist/components/statistics/statistics.d.ts +2 -1
  100. package/dist/components/tabs/tabs.d.ts +3 -1
  101. package/dist/components/text/text.d.ts +1 -1
  102. package/dist/components/text-field/text-field.d.ts +2 -0
  103. package/dist/index.esm.js +7164 -6037
  104. package/dist/index.js +7182 -6050
  105. package/dist/utils/parse-numbers.d.ts +2 -0
  106. package/package.json +6 -3
  107. package/styles/index.css +385 -384
  108. package/dist/components/login/login-email.d.ts +0 -3
  109. package/dist/components/login/login-register-email.d.ts +0 -3
  110. package/dist/components/login/login-select.d.ts +0 -3
  111. package/dist/components/mycause-statistics/index.d.ts +0 -1
  112. package/dist/components/mycause-statistics/mycause-statistics.d.ts +0 -12
  113. package/dist/components/phone-number-field/index.d.ts +0 -2
package/styles/index.css CHANGED
@@ -1,3 +1,4 @@
1
+ @import url("https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/3.4.3/css/flag-icon.min.css");
1
2
  :root {
2
3
  --mdc-theme-primary: #358b76;
3
4
  --mdc-theme-secondary: #f05c6a;
@@ -1237,265 +1238,6 @@ svg.mdc-button__icon {
1237
1238
  .mdc-ripple-upgraded--background-focused .mdc-checkbox__background::before {
1238
1239
  content: none; }
1239
1240
 
1240
- /*!
1241
- * Cropper.js v1.5.6
1242
- * https://fengyuanchen.github.io/cropperjs
1243
- *
1244
- * Copyright 2015-present Chen Fengyuan
1245
- * Released under the MIT license
1246
- *
1247
- * Date: 2019-10-04T04:33:44.164Z
1248
- */
1249
- .cropper-container {
1250
- direction: ltr;
1251
- font-size: 0;
1252
- line-height: 0;
1253
- position: relative;
1254
- touch-action: none;
1255
- -webkit-user-select: none;
1256
- -moz-user-select: none;
1257
- -ms-user-select: none;
1258
- user-select: none; }
1259
-
1260
- .cropper-container img {
1261
- display: block;
1262
- height: 100%;
1263
- image-orientation: 0deg;
1264
- max-height: none !important;
1265
- max-width: none !important;
1266
- min-height: 0 !important;
1267
- min-width: 0 !important;
1268
- width: 100%; }
1269
-
1270
- .cropper-wrap-box,
1271
- .cropper-canvas,
1272
- .cropper-drag-box,
1273
- .cropper-crop-box,
1274
- .cropper-modal {
1275
- bottom: 0;
1276
- left: 0;
1277
- position: absolute;
1278
- right: 0;
1279
- top: 0; }
1280
-
1281
- .cropper-wrap-box,
1282
- .cropper-canvas {
1283
- overflow: hidden; }
1284
-
1285
- .cropper-drag-box {
1286
- background-color: #fff;
1287
- opacity: 0; }
1288
-
1289
- .cropper-modal {
1290
- background-color: #000;
1291
- opacity: 0.5; }
1292
-
1293
- .cropper-view-box {
1294
- display: block;
1295
- height: 100%;
1296
- outline: 1px solid #39f;
1297
- outline-color: rgba(51, 153, 255, 0.75);
1298
- overflow: hidden;
1299
- width: 100%; }
1300
-
1301
- .cropper-dashed {
1302
- border: 0 dashed #eee;
1303
- display: block;
1304
- opacity: 0.5;
1305
- position: absolute; }
1306
-
1307
- .cropper-dashed.dashed-h {
1308
- border-bottom-width: 1px;
1309
- border-top-width: 1px;
1310
- height: calc(100% / 3);
1311
- left: 0;
1312
- top: calc(100% / 3);
1313
- width: 100%; }
1314
-
1315
- .cropper-dashed.dashed-v {
1316
- border-left-width: 1px;
1317
- border-right-width: 1px;
1318
- height: 100%;
1319
- left: calc(100% / 3);
1320
- top: 0;
1321
- width: calc(100% / 3); }
1322
-
1323
- .cropper-center {
1324
- display: block;
1325
- height: 0;
1326
- left: 50%;
1327
- opacity: 0.75;
1328
- position: absolute;
1329
- top: 50%;
1330
- width: 0; }
1331
-
1332
- .cropper-center::before,
1333
- .cropper-center::after {
1334
- background-color: #eee;
1335
- content: ' ';
1336
- display: block;
1337
- position: absolute; }
1338
-
1339
- .cropper-center::before {
1340
- height: 1px;
1341
- left: -3px;
1342
- top: 0;
1343
- width: 7px; }
1344
-
1345
- .cropper-center::after {
1346
- height: 7px;
1347
- left: 0;
1348
- top: -3px;
1349
- width: 1px; }
1350
-
1351
- .cropper-face,
1352
- .cropper-line,
1353
- .cropper-point {
1354
- display: block;
1355
- height: 100%;
1356
- opacity: 0.1;
1357
- position: absolute;
1358
- width: 100%; }
1359
-
1360
- .cropper-face {
1361
- background-color: #fff;
1362
- left: 0;
1363
- top: 0; }
1364
-
1365
- .cropper-line {
1366
- background-color: #39f; }
1367
-
1368
- .cropper-line.line-e {
1369
- cursor: ew-resize;
1370
- right: -3px;
1371
- top: 0;
1372
- width: 5px; }
1373
-
1374
- .cropper-line.line-n {
1375
- cursor: ns-resize;
1376
- height: 5px;
1377
- left: 0;
1378
- top: -3px; }
1379
-
1380
- .cropper-line.line-w {
1381
- cursor: ew-resize;
1382
- left: -3px;
1383
- top: 0;
1384
- width: 5px; }
1385
-
1386
- .cropper-line.line-s {
1387
- bottom: -3px;
1388
- cursor: ns-resize;
1389
- height: 5px;
1390
- left: 0; }
1391
-
1392
- .cropper-point {
1393
- background-color: #39f;
1394
- height: 5px;
1395
- opacity: 0.75;
1396
- width: 5px; }
1397
-
1398
- .cropper-point.point-e {
1399
- cursor: ew-resize;
1400
- margin-top: -3px;
1401
- right: -3px;
1402
- top: 50%; }
1403
-
1404
- .cropper-point.point-n {
1405
- cursor: ns-resize;
1406
- left: 50%;
1407
- margin-left: -3px;
1408
- top: -3px; }
1409
-
1410
- .cropper-point.point-w {
1411
- cursor: ew-resize;
1412
- left: -3px;
1413
- margin-top: -3px;
1414
- top: 50%; }
1415
-
1416
- .cropper-point.point-s {
1417
- bottom: -3px;
1418
- cursor: s-resize;
1419
- left: 50%;
1420
- margin-left: -3px; }
1421
-
1422
- .cropper-point.point-ne {
1423
- cursor: nesw-resize;
1424
- right: -3px;
1425
- top: -3px; }
1426
-
1427
- .cropper-point.point-nw {
1428
- cursor: nwse-resize;
1429
- left: -3px;
1430
- top: -3px; }
1431
-
1432
- .cropper-point.point-sw {
1433
- bottom: -3px;
1434
- cursor: nesw-resize;
1435
- left: -3px; }
1436
-
1437
- .cropper-point.point-se {
1438
- bottom: -3px;
1439
- cursor: nwse-resize;
1440
- height: 20px;
1441
- opacity: 1;
1442
- right: -3px;
1443
- width: 20px; }
1444
-
1445
- @media (min-width: 768px) {
1446
- .cropper-point.point-se {
1447
- height: 15px;
1448
- width: 15px; } }
1449
-
1450
- @media (min-width: 992px) {
1451
- .cropper-point.point-se {
1452
- height: 10px;
1453
- width: 10px; } }
1454
-
1455
- @media (min-width: 1200px) {
1456
- .cropper-point.point-se {
1457
- height: 5px;
1458
- opacity: 0.75;
1459
- width: 5px; } }
1460
-
1461
- .cropper-point.point-se::before {
1462
- background-color: #39f;
1463
- bottom: -50%;
1464
- content: ' ';
1465
- display: block;
1466
- height: 200%;
1467
- opacity: 0;
1468
- position: absolute;
1469
- right: -50%;
1470
- width: 200%; }
1471
-
1472
- .cropper-invisible {
1473
- opacity: 0; }
1474
-
1475
- .cropper-bg {
1476
- background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC"); }
1477
-
1478
- .cropper-hide {
1479
- display: block;
1480
- height: 0;
1481
- position: absolute;
1482
- width: 0; }
1483
-
1484
- .cropper-hidden {
1485
- display: none !important; }
1486
-
1487
- .cropper-move {
1488
- cursor: move; }
1489
-
1490
- .cropper-crop {
1491
- cursor: crosshair; }
1492
-
1493
- .cropper-disabled .cropper-drag-box,
1494
- .cropper-disabled .cropper-face,
1495
- .cropper-disabled .cropper-line,
1496
- .cropper-disabled .cropper-point {
1497
- cursor: not-allowed; }
1498
-
1499
1241
  .PresetDateRangePicker_panel {
1500
1242
  padding: 0 22px 11px; }
1501
1243
 
@@ -2215,160 +1957,419 @@ svg.mdc-button__icon {
2215
1957
  position: absolute;
2216
1958
  width: 1px; }
2217
1959
 
2218
- .DateInput_fang {
2219
- position: absolute;
2220
- width: 20px;
2221
- height: 10px;
2222
- left: 22px;
2223
- z-index: 2; }
1960
+ .DateInput_fang {
1961
+ position: absolute;
1962
+ width: 20px;
1963
+ height: 10px;
1964
+ left: 22px;
1965
+ z-index: 2; }
1966
+
1967
+ .DateInput_fangShape {
1968
+ fill: #fff; }
1969
+
1970
+ .DateInput_fangStroke {
1971
+ stroke: #dbdbdb;
1972
+ fill: transparent; }
1973
+
1974
+ .DateRangePickerInput {
1975
+ background-color: #fff;
1976
+ display: inline-block; }
1977
+
1978
+ .DateRangePickerInput__disabled {
1979
+ background: #f2f2f2; }
1980
+
1981
+ .DateRangePickerInput__withBorder {
1982
+ border-radius: 2px;
1983
+ border: 1px solid #dbdbdb; }
1984
+
1985
+ .DateRangePickerInput__rtl {
1986
+ direction: rtl; }
1987
+
1988
+ .DateRangePickerInput__block {
1989
+ display: block; }
1990
+
1991
+ .DateRangePickerInput__showClearDates {
1992
+ padding-right: 30px; }
1993
+
1994
+ .DateRangePickerInput_arrow {
1995
+ display: inline-block;
1996
+ vertical-align: middle;
1997
+ color: #484848; }
1998
+
1999
+ .DateRangePickerInput_arrow_svg {
2000
+ vertical-align: middle;
2001
+ fill: #484848;
2002
+ height: 24px;
2003
+ width: 24px; }
2004
+
2005
+ .DateRangePickerInput_clearDates {
2006
+ background: 0 0;
2007
+ border: 0;
2008
+ color: inherit;
2009
+ font: inherit;
2010
+ line-height: normal;
2011
+ overflow: visible;
2012
+ cursor: pointer;
2013
+ padding: 10px;
2014
+ margin: 0 10px 0 5px;
2015
+ position: absolute;
2016
+ right: 0;
2017
+ top: 50%;
2018
+ transform: translateY(-50%); }
2019
+
2020
+ .DateRangePickerInput_clearDates__small {
2021
+ padding: 6px; }
2022
+
2023
+ .DateRangePickerInput_clearDates_default:focus,
2024
+ .DateRangePickerInput_clearDates_default:hover {
2025
+ background: #dbdbdb;
2026
+ border-radius: 50%; }
2027
+
2028
+ .DateRangePickerInput_clearDates__hide {
2029
+ visibility: hidden; }
2030
+
2031
+ .DateRangePickerInput_clearDates_svg {
2032
+ fill: #82888a;
2033
+ height: 12px;
2034
+ width: 15px;
2035
+ vertical-align: middle; }
2036
+
2037
+ .DateRangePickerInput_clearDates_svg__small {
2038
+ height: 9px; }
2039
+
2040
+ .DateRangePickerInput_calendarIcon {
2041
+ background: 0 0;
2042
+ border: 0;
2043
+ color: inherit;
2044
+ font: inherit;
2045
+ line-height: normal;
2046
+ overflow: visible;
2047
+ cursor: pointer;
2048
+ display: inline-block;
2049
+ vertical-align: middle;
2050
+ padding: 10px;
2051
+ margin: 0 5px 0 10px; }
2052
+
2053
+ .DateRangePickerInput_calendarIcon_svg {
2054
+ fill: #82888a;
2055
+ height: 15px;
2056
+ width: 14px;
2057
+ vertical-align: middle; }
2058
+
2059
+ .DateRangePicker {
2060
+ position: relative;
2061
+ display: inline-block; }
2062
+
2063
+ .DateRangePicker__block {
2064
+ display: block; }
2065
+
2066
+ .DateRangePicker_picker {
2067
+ z-index: 1;
2068
+ background-color: #fff;
2069
+ position: absolute; }
2070
+
2071
+ .DateRangePicker_picker__rtl {
2072
+ direction: rtl; }
2073
+
2074
+ .DateRangePicker_picker__directionLeft {
2075
+ left: 0; }
2076
+
2077
+ .DateRangePicker_picker__directionRight {
2078
+ right: 0; }
2079
+
2080
+ .DateRangePicker_picker__portal {
2081
+ background-color: rgba(0, 0, 0, 0.3);
2082
+ position: fixed;
2083
+ top: 0;
2084
+ left: 0;
2085
+ height: 100%;
2086
+ width: 100%; }
2087
+
2088
+ .DateRangePicker_picker__fullScreenPortal {
2089
+ background-color: #fff; }
2090
+
2091
+ .DateRangePicker_closeButton {
2092
+ background: 0 0;
2093
+ border: 0;
2094
+ color: inherit;
2095
+ font: inherit;
2096
+ line-height: normal;
2097
+ overflow: visible;
2098
+ cursor: pointer;
2099
+ position: absolute;
2100
+ top: 0;
2101
+ right: 0;
2102
+ padding: 15px;
2103
+ z-index: 2; }
2104
+
2105
+ .DateRangePicker_closeButton:focus,
2106
+ .DateRangePicker_closeButton:hover {
2107
+ color: #b0b3b4;
2108
+ text-decoration: none; }
2109
+
2110
+ .DateRangePicker_closeButton_svg {
2111
+ height: 15px;
2112
+ width: 15px;
2113
+ fill: #cacccd; }
2114
+
2115
+ /*!
2116
+ * Cropper.js v1.5.6
2117
+ * https://fengyuanchen.github.io/cropperjs
2118
+ *
2119
+ * Copyright 2015-present Chen Fengyuan
2120
+ * Released under the MIT license
2121
+ *
2122
+ * Date: 2019-10-04T04:33:44.164Z
2123
+ */
2124
+ .cropper-container {
2125
+ direction: ltr;
2126
+ font-size: 0;
2127
+ line-height: 0;
2128
+ position: relative;
2129
+ touch-action: none;
2130
+ -webkit-user-select: none;
2131
+ -moz-user-select: none;
2132
+ -ms-user-select: none;
2133
+ user-select: none; }
2134
+
2135
+ .cropper-container img {
2136
+ display: block;
2137
+ height: 100%;
2138
+ image-orientation: 0deg;
2139
+ max-height: none !important;
2140
+ max-width: none !important;
2141
+ min-height: 0 !important;
2142
+ min-width: 0 !important;
2143
+ width: 100%; }
2144
+
2145
+ .cropper-wrap-box,
2146
+ .cropper-canvas,
2147
+ .cropper-drag-box,
2148
+ .cropper-crop-box,
2149
+ .cropper-modal {
2150
+ bottom: 0;
2151
+ left: 0;
2152
+ position: absolute;
2153
+ right: 0;
2154
+ top: 0; }
2155
+
2156
+ .cropper-wrap-box,
2157
+ .cropper-canvas {
2158
+ overflow: hidden; }
2159
+
2160
+ .cropper-drag-box {
2161
+ background-color: #fff;
2162
+ opacity: 0; }
2163
+
2164
+ .cropper-modal {
2165
+ background-color: #000;
2166
+ opacity: 0.5; }
2167
+
2168
+ .cropper-view-box {
2169
+ display: block;
2170
+ height: 100%;
2171
+ outline: 1px solid #39f;
2172
+ outline-color: rgba(51, 153, 255, 0.75);
2173
+ overflow: hidden;
2174
+ width: 100%; }
2175
+
2176
+ .cropper-dashed {
2177
+ border: 0 dashed #eee;
2178
+ display: block;
2179
+ opacity: 0.5;
2180
+ position: absolute; }
2181
+
2182
+ .cropper-dashed.dashed-h {
2183
+ border-bottom-width: 1px;
2184
+ border-top-width: 1px;
2185
+ height: calc(100% / 3);
2186
+ left: 0;
2187
+ top: calc(100% / 3);
2188
+ width: 100%; }
2189
+
2190
+ .cropper-dashed.dashed-v {
2191
+ border-left-width: 1px;
2192
+ border-right-width: 1px;
2193
+ height: 100%;
2194
+ left: calc(100% / 3);
2195
+ top: 0;
2196
+ width: calc(100% / 3); }
2197
+
2198
+ .cropper-center {
2199
+ display: block;
2200
+ height: 0;
2201
+ left: 50%;
2202
+ opacity: 0.75;
2203
+ position: absolute;
2204
+ top: 50%;
2205
+ width: 0; }
2206
+
2207
+ .cropper-center::before,
2208
+ .cropper-center::after {
2209
+ background-color: #eee;
2210
+ content: ' ';
2211
+ display: block;
2212
+ position: absolute; }
2213
+
2214
+ .cropper-center::before {
2215
+ height: 1px;
2216
+ left: -3px;
2217
+ top: 0;
2218
+ width: 7px; }
2224
2219
 
2225
- .DateInput_fangShape {
2226
- fill: #fff; }
2220
+ .cropper-center::after {
2221
+ height: 7px;
2222
+ left: 0;
2223
+ top: -3px;
2224
+ width: 1px; }
2227
2225
 
2228
- .DateInput_fangStroke {
2229
- stroke: #dbdbdb;
2230
- fill: transparent; }
2226
+ .cropper-face,
2227
+ .cropper-line,
2228
+ .cropper-point {
2229
+ display: block;
2230
+ height: 100%;
2231
+ opacity: 0.1;
2232
+ position: absolute;
2233
+ width: 100%; }
2231
2234
 
2232
- .DateRangePickerInput {
2235
+ .cropper-face {
2233
2236
  background-color: #fff;
2234
- display: inline-block; }
2235
-
2236
- .DateRangePickerInput__disabled {
2237
- background: #f2f2f2; }
2237
+ left: 0;
2238
+ top: 0; }
2238
2239
 
2239
- .DateRangePickerInput__withBorder {
2240
- border-radius: 2px;
2241
- border: 1px solid #dbdbdb; }
2240
+ .cropper-line {
2241
+ background-color: #39f; }
2242
2242
 
2243
- .DateRangePickerInput__rtl {
2244
- direction: rtl; }
2243
+ .cropper-line.line-e {
2244
+ cursor: ew-resize;
2245
+ right: -3px;
2246
+ top: 0;
2247
+ width: 5px; }
2245
2248
 
2246
- .DateRangePickerInput__block {
2247
- display: block; }
2249
+ .cropper-line.line-n {
2250
+ cursor: ns-resize;
2251
+ height: 5px;
2252
+ left: 0;
2253
+ top: -3px; }
2248
2254
 
2249
- .DateRangePickerInput__showClearDates {
2250
- padding-right: 30px; }
2255
+ .cropper-line.line-w {
2256
+ cursor: ew-resize;
2257
+ left: -3px;
2258
+ top: 0;
2259
+ width: 5px; }
2251
2260
 
2252
- .DateRangePickerInput_arrow {
2253
- display: inline-block;
2254
- vertical-align: middle;
2255
- color: #484848; }
2261
+ .cropper-line.line-s {
2262
+ bottom: -3px;
2263
+ cursor: ns-resize;
2264
+ height: 5px;
2265
+ left: 0; }
2256
2266
 
2257
- .DateRangePickerInput_arrow_svg {
2258
- vertical-align: middle;
2259
- fill: #484848;
2260
- height: 24px;
2261
- width: 24px; }
2267
+ .cropper-point {
2268
+ background-color: #39f;
2269
+ height: 5px;
2270
+ opacity: 0.75;
2271
+ width: 5px; }
2262
2272
 
2263
- .DateRangePickerInput_clearDates {
2264
- background: 0 0;
2265
- border: 0;
2266
- color: inherit;
2267
- font: inherit;
2268
- line-height: normal;
2269
- overflow: visible;
2270
- cursor: pointer;
2271
- padding: 10px;
2272
- margin: 0 10px 0 5px;
2273
- position: absolute;
2274
- right: 0;
2275
- top: 50%;
2276
- transform: translateY(-50%); }
2273
+ .cropper-point.point-e {
2274
+ cursor: ew-resize;
2275
+ margin-top: -3px;
2276
+ right: -3px;
2277
+ top: 50%; }
2277
2278
 
2278
- .DateRangePickerInput_clearDates__small {
2279
- padding: 6px; }
2279
+ .cropper-point.point-n {
2280
+ cursor: ns-resize;
2281
+ left: 50%;
2282
+ margin-left: -3px;
2283
+ top: -3px; }
2280
2284
 
2281
- .DateRangePickerInput_clearDates_default:focus,
2282
- .DateRangePickerInput_clearDates_default:hover {
2283
- background: #dbdbdb;
2284
- border-radius: 50%; }
2285
+ .cropper-point.point-w {
2286
+ cursor: ew-resize;
2287
+ left: -3px;
2288
+ margin-top: -3px;
2289
+ top: 50%; }
2285
2290
 
2286
- .DateRangePickerInput_clearDates__hide {
2287
- visibility: hidden; }
2291
+ .cropper-point.point-s {
2292
+ bottom: -3px;
2293
+ cursor: s-resize;
2294
+ left: 50%;
2295
+ margin-left: -3px; }
2288
2296
 
2289
- .DateRangePickerInput_clearDates_svg {
2290
- fill: #82888a;
2291
- height: 12px;
2292
- width: 15px;
2293
- vertical-align: middle; }
2297
+ .cropper-point.point-ne {
2298
+ cursor: nesw-resize;
2299
+ right: -3px;
2300
+ top: -3px; }
2294
2301
 
2295
- .DateRangePickerInput_clearDates_svg__small {
2296
- height: 9px; }
2302
+ .cropper-point.point-nw {
2303
+ cursor: nwse-resize;
2304
+ left: -3px;
2305
+ top: -3px; }
2297
2306
 
2298
- .DateRangePickerInput_calendarIcon {
2299
- background: 0 0;
2300
- border: 0;
2301
- color: inherit;
2302
- font: inherit;
2303
- line-height: normal;
2304
- overflow: visible;
2305
- cursor: pointer;
2306
- display: inline-block;
2307
- vertical-align: middle;
2308
- padding: 10px;
2309
- margin: 0 5px 0 10px; }
2307
+ .cropper-point.point-sw {
2308
+ bottom: -3px;
2309
+ cursor: nesw-resize;
2310
+ left: -3px; }
2310
2311
 
2311
- .DateRangePickerInput_calendarIcon_svg {
2312
- fill: #82888a;
2313
- height: 15px;
2314
- width: 14px;
2315
- vertical-align: middle; }
2312
+ .cropper-point.point-se {
2313
+ bottom: -3px;
2314
+ cursor: nwse-resize;
2315
+ height: 20px;
2316
+ opacity: 1;
2317
+ right: -3px;
2318
+ width: 20px; }
2316
2319
 
2317
- .DateRangePicker {
2318
- position: relative;
2319
- display: inline-block; }
2320
+ @media (min-width: 768px) {
2321
+ .cropper-point.point-se {
2322
+ height: 15px;
2323
+ width: 15px; } }
2320
2324
 
2321
- .DateRangePicker__block {
2322
- display: block; }
2325
+ @media (min-width: 992px) {
2326
+ .cropper-point.point-se {
2327
+ height: 10px;
2328
+ width: 10px; } }
2323
2329
 
2324
- .DateRangePicker_picker {
2325
- z-index: 1;
2326
- background-color: #fff;
2327
- position: absolute; }
2330
+ @media (min-width: 1200px) {
2331
+ .cropper-point.point-se {
2332
+ height: 5px;
2333
+ opacity: 0.75;
2334
+ width: 5px; } }
2328
2335
 
2329
- .DateRangePicker_picker__rtl {
2330
- direction: rtl; }
2336
+ .cropper-point.point-se::before {
2337
+ background-color: #39f;
2338
+ bottom: -50%;
2339
+ content: ' ';
2340
+ display: block;
2341
+ height: 200%;
2342
+ opacity: 0;
2343
+ position: absolute;
2344
+ right: -50%;
2345
+ width: 200%; }
2331
2346
 
2332
- .DateRangePicker_picker__directionLeft {
2333
- left: 0; }
2347
+ .cropper-invisible {
2348
+ opacity: 0; }
2334
2349
 
2335
- .DateRangePicker_picker__directionRight {
2336
- right: 0; }
2350
+ .cropper-bg {
2351
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC"); }
2337
2352
 
2338
- .DateRangePicker_picker__portal {
2339
- background-color: rgba(0, 0, 0, 0.3);
2340
- position: fixed;
2341
- top: 0;
2342
- left: 0;
2343
- height: 100%;
2344
- width: 100%; }
2353
+ .cropper-hide {
2354
+ display: block;
2355
+ height: 0;
2356
+ position: absolute;
2357
+ width: 0; }
2345
2358
 
2346
- .DateRangePicker_picker__fullScreenPortal {
2347
- background-color: #fff; }
2359
+ .cropper-hidden {
2360
+ display: none !important; }
2348
2361
 
2349
- .DateRangePicker_closeButton {
2350
- background: 0 0;
2351
- border: 0;
2352
- color: inherit;
2353
- font: inherit;
2354
- line-height: normal;
2355
- overflow: visible;
2356
- cursor: pointer;
2357
- position: absolute;
2358
- top: 0;
2359
- right: 0;
2360
- padding: 15px;
2361
- z-index: 2; }
2362
+ .cropper-move {
2363
+ cursor: move; }
2362
2364
 
2363
- .DateRangePicker_closeButton:focus,
2364
- .DateRangePicker_closeButton:hover {
2365
- color: #b0b3b4;
2366
- text-decoration: none; }
2365
+ .cropper-crop {
2366
+ cursor: crosshair; }
2367
2367
 
2368
- .DateRangePicker_closeButton_svg {
2369
- height: 15px;
2370
- width: 15px;
2371
- fill: #cacccd; }
2368
+ .cropper-disabled .cropper-drag-box,
2369
+ .cropper-disabled .cropper-face,
2370
+ .cropper-disabled .cropper-line,
2371
+ .cropper-disabled .cropper-point {
2372
+ cursor: not-allowed; }
2372
2373
 
2373
2374
  .mdc-elevation--z0 {
2374
2375
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); }