apirocket 0.0.20 → 0.1.0

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.
@@ -392,6 +392,155 @@
392
392
 
393
393
  .apirocket-cart-header-continue { display: none; }
394
394
  .apirocket-cart-header-login { display: none; }
395
+ }.apirocket-modal *,
396
+ .apirocket-modal *::before,
397
+ .apirocket-modal *::after { box-sizing: border-box; }
398
+
399
+ .apirocket-modal {
400
+ display: flex;
401
+ justify-content: center;
402
+ align-items: flex-start;
403
+ position: fixed;
404
+ z-index: 10001;
405
+ right: 0;
406
+ top: 0;
407
+ overflow: hidden;
408
+ overflow-y: auto;
409
+ width: 100%;
410
+ height: 100vh;
411
+ font-family: var(--cart-font-family, "Arial, Helvetica, sans-serif");
412
+ background-color: #f5f5f5;
413
+ }
414
+
415
+ .apirocket-modal-nav {
416
+ position: absolute;
417
+ display: flex;
418
+ align-items: center;
419
+ width: 90%;
420
+ max-width: 1100px;
421
+ height: 96px;
422
+ }
423
+
424
+ .apirocket-modal-nav-button {
425
+ display: flex;
426
+ align-items: center;
427
+ text-align: left;
428
+ color: #737373;
429
+ font-size: 16px;
430
+ font-weight: normal;
431
+ cursor: pointer;
432
+ }
433
+
434
+ .apirocket-modal-nav-button svg { margin-right: 16px; }
435
+
436
+ .apirocket-modal-content {
437
+ display: flex;
438
+ flex-flow: column;
439
+ width: 480px;
440
+ height: auto;
441
+ padding: 32px;
442
+ background-color: #fff;
443
+ margin-top: 96px;
444
+ margin-bottom: 32px;
445
+ }
446
+
447
+ .apirocket-modal-header {
448
+ position: relative;
449
+ padding-bottom: 32px;
450
+ }
451
+
452
+ .apirocket-modal-title {
453
+ font-size: 18px;
454
+ font-weight: bold;
455
+ line-height: 1;
456
+ color: #404040;
457
+ margin-bottom: 8px;
458
+ }
459
+
460
+ .apirocket-modal-subtitle {
461
+ font-size: 14px;
462
+ font-weight: normal;
463
+ line-height: 16px;
464
+ color: #737373;
465
+ }
466
+
467
+ .apirocket-modal-close {
468
+ position: absolute;
469
+ right: -16px;
470
+ top: -16px;
471
+ }
472
+
473
+ .apirocket-modal-close-icon {
474
+ height: var(--cart-header-text-close-icon-size, 24px);
475
+ width: var(--cart-header-text-close-icon-size, 24px);
476
+ color: var(--cart-header-text-close-icon-color, #a3a3a3);
477
+ cursor: pointer;
478
+ }
479
+
480
+ .apirocket-modal-body-text-password {
481
+ color: #404040;
482
+ font-size: 14px;
483
+ font-weight: normal;
484
+ line-height: 16px;
485
+ margin-top: -8px;text-align: right;
486
+ cursor: pointer;
487
+ }
488
+
489
+ .apirocket-modal-body-text-password:hover { text-decoration: underline; }
490
+
491
+ .apirocket-modal-footer-text {
492
+ color: #a3a3a3;
493
+ font-size: 14px;
494
+ font-weight: normal;
495
+ line-height: 16px;
496
+ text-align: center;
497
+ margin-top: 16px;
498
+ }
499
+
500
+ .apirocket-modal-footer-text span {
501
+ color: #404040;
502
+ cursor: pointer;
503
+ }
504
+
505
+ .apirocket-modal-footer-text span:hover { text-decoration: underline; }
506
+
507
+
508
+ .apirocket-modal-body {}
509
+
510
+ .apirocket-modal-footer {
511
+ padding-top: 32px;
512
+ }
513
+
514
+ .apirocket-modal-row {
515
+ display: flex;
516
+ justify-content: space-between;
517
+ align-items: flex-start;
518
+ }
519
+
520
+ .apirocket-modal-row > * {
521
+ flex: 1 1;
522
+ margin-right: 16px;
523
+ }
524
+
525
+ .apirocket-modal-row > *:last-child { margin-right: 0; }
526
+
527
+
528
+ @media (max-width: 720px) {
529
+ .apirocket-modal-row { display: block; }
530
+ .apirocket-modal-row > * { margin-right: 0; }
531
+
532
+ .apirocket-modal-nav { display: none; }
533
+
534
+ .apirocket-modal-content {
535
+ width: 95%;
536
+ margin-top: 32px;
537
+ padding: 24px;
538
+ }
539
+
540
+ .apirocket-modal-close {
541
+ right: -8px;
542
+ top: -8px;
543
+ }
395
544
  }.apirocket-checkout * { box-sizing: content-box; }
396
545
 
397
546
  .apirocket-checkout {
@@ -1074,155 +1223,87 @@
1074
1223
  }
1075
1224
 
1076
1225
 
1077
- .apirocket-modal *,
1078
- .apirocket-modal *::before,
1079
- .apirocket-modal *::after { box-sizing: border-box; }
1080
1226
 
1081
- .apirocket-modal {
1082
- display: flex;
1083
- justify-content: center;
1084
- align-items: flex-start;
1085
- position: fixed;
1086
- z-index: 10001;
1087
- right: 0;
1088
- top: 0;
1089
- overflow: hidden;
1090
- overflow-y: auto;
1227
+ .apirocket-button,
1228
+ button.apirocket-button {
1229
+ box-sizing: border-box !important;
1230
+ display: block;
1091
1231
  width: 100%;
1092
- height: 100vh;
1093
- font-family: var(--cart-font-family, "Arial, Helvetica, sans-serif");
1094
- background-color: #f5f5f5;
1095
- }
1096
-
1097
- .apirocket-modal-nav {
1098
- position: absolute;
1099
- display: flex;
1100
- align-items: center;
1101
- width: 90%;
1102
- max-width: 1100px;
1103
- height: 96px;
1104
- }
1105
-
1106
- .apirocket-modal-nav-button {
1107
- display: flex;
1108
- align-items: center;
1109
- text-align: left;
1110
- color: #737373;
1111
- font-size: 16px;
1112
- font-weight: normal;
1113
- cursor: pointer;
1114
- }
1115
-
1116
- .apirocket-modal-nav-button svg { margin-right: 16px; }
1117
-
1118
- .apirocket-modal-content {
1119
- display: flex;
1120
- flex-flow: column;
1121
- width: 480px;
1122
- height: auto;
1123
- padding: 32px;
1124
- background-color: #fff;
1125
- margin-top: 96px;
1126
- margin-bottom: 32px;
1127
- }
1128
-
1129
- .apirocket-modal-header {
1130
- position: relative;
1131
- padding-bottom: 32px;
1132
- }
1133
-
1134
- .apirocket-modal-title {
1135
- font-size: 18px;
1136
- font-weight: bold;
1232
+ padding: var(--cart-button-padding-y, 16px) var(--cart-button-padding-x, 16px);
1233
+ margin: 0px;
1234
+ border-radius: var(--cart-button-border-radius, 4px);
1235
+ background-color: var(--cart-button-background-color, transparent);
1236
+ border: 1px solid var(--cart-button-border-color, #e5e5e5);
1237
+ color: var(--cart-button-font-color, #737373);
1137
1238
  line-height: 1;
1138
- color: #404040;
1139
- margin-bottom: 8px;
1140
- }
1141
-
1142
- .apirocket-modal-subtitle {
1143
- font-size: 14px;
1144
- font-weight: normal;
1145
- line-height: 16px;
1146
- color: #737373;
1147
- }
1148
-
1149
- .apirocket-modal-close {
1150
- position: absolute;
1151
- right: -16px;
1152
- top: -16px;
1153
- }
1154
-
1155
- .apirocket-modal-close-icon {
1156
- height: var(--cart-header-text-close-icon-size, 24px);
1157
- width: var(--cart-header-text-close-icon-size, 24px);
1158
- color: var(--cart-header-text-close-icon-color, #a3a3a3);
1239
+ font-size: var(--cart-button-font-size, 16px);
1240
+ font-weight: var(--cart-button-font-weight, normal);
1241
+ text-align: center;
1242
+ transition-property: color, border-color, background-color, box-shadow;
1243
+ transition-timing-function: ease;
1244
+ transition-duration: 350ms;
1159
1245
  cursor: pointer;
1160
1246
  }
1161
1247
 
1162
- .apirocket-modal-body-text-password {
1163
- color: #404040;
1164
- font-size: 14px;
1165
- font-weight: normal;
1166
- line-height: 16px;
1167
- margin-top: -8px;text-align: right;
1168
- cursor: pointer;
1248
+ .apirocket-button:hover {
1249
+ background-color: var(--cart-button-background-color-hover, transparent);
1250
+ border-color: var(--cart-button-border-color-hover, #404040);
1251
+ color: var(--cart-button-font-color-hover, #404040);
1169
1252
  }
1170
1253
 
1171
- .apirocket-modal-body-text-password:hover { text-decoration: underline; }
1172
-
1173
- .apirocket-modal-footer-text {
1174
- color: #a3a3a3;
1175
- font-size: 14px;
1176
- font-weight: normal;
1177
- line-height: 16px;
1178
- text-align: center;
1179
- margin-top: 16px;
1254
+ .apirocket-button:focus {
1255
+ outline: none;
1256
+ text-decoration: underline;
1180
1257
  }
1181
1258
 
1182
- .apirocket-modal-footer-text span {
1183
- color: #404040;
1184
- cursor: pointer;
1259
+ .apirocket-button-link,
1260
+ button.apirocket-button-link {
1261
+ display: flex;
1262
+ align-items: center;
1263
+ text-align: left;
1264
+ justify-content: flex-start;
1265
+ align-items: center;
1266
+ border: none;
1267
+ padding-left: 0;
1268
+ padding-right: 0;
1269
+ width: auto;
1270
+ overflow: hidden;
1271
+ white-space: nowrap;
1272
+ text-overflow: ellipsis;
1185
1273
  }
1186
1274
 
1187
- .apirocket-modal-footer-text span:hover { text-decoration: underline; }
1188
-
1189
-
1190
- .apirocket-modal-body {}
1191
-
1192
- .apirocket-modal-footer {
1193
- padding-top: 32px;
1275
+ .apirocket-button-link span {
1276
+ margin-left: 16px;
1277
+ margin-right: 16px;
1194
1278
  }
1195
1279
 
1196
- .apirocket-modal-row {
1197
- display: flex;
1198
- justify-content: space-between;
1199
- align-items: flex-start;
1280
+ .apirocket-button-primary,
1281
+ button.apirocket-button-primary {
1282
+ background-color: var(--cart-button-primary-background-color, #1d4ed8);
1283
+ border-color: var(--cart-button-primary-border-color, #1d4ed8);
1284
+ color: var(--cart-button-primary-text-color, #fff);
1200
1285
  }
1201
1286
 
1202
- .apirocket-modal-row > * {
1203
- flex: 1 1;
1204
- margin-right: 16px;
1287
+ button.apirocket-button-primary:disabled {
1288
+ background-color: #eee;
1289
+ border-color: #eee;
1290
+ color: #ccc;
1205
1291
  }
1206
1292
 
1207
- .apirocket-modal-row > *:last-child { margin-right: 0; }
1208
-
1293
+ .apirocket-button-primary:hover {
1294
+ background-color: var(--cart-button-primary-background-color-hover, #1d4ed8);
1295
+ border-color: var(--cart-button-primary-border-color-hover, #1d4ed8);
1296
+ color: var(--cart-button-primary-text-color-hover, #fff);
1297
+ box-shadow: var(--cart-shadow-button-primary-hover, none);
1298
+ }
1209
1299
 
1210
1300
  @media (max-width: 720px) {
1211
- .apirocket-modal-row { display: block; }
1212
- .apirocket-modal-row > * { margin-right: 0; }
1213
-
1214
- .apirocket-modal-nav { display: none; }
1215
1301
 
1216
- .apirocket-modal-content {
1217
- width: 95%;
1218
- margin-top: 32px;
1219
- padding: 24px;
1302
+ .apirocket-button-link {
1303
+ width: 100%;
1304
+ justify-content: center;
1220
1305
  }
1221
1306
 
1222
- .apirocket-modal-close {
1223
- right: -8px;
1224
- top: -8px;
1225
- }
1226
1307
  }.apirocket-form-input {
1227
1308
  display: block;
1228
1309
  position: relative;
@@ -1592,88 +1673,7 @@
1592
1673
  .apirocket-form-select.invalid.touched .apirocket-form-select-placeholder { color: #dc2626; }
1593
1674
  .apirocket-form-select.invalid.touched .apirocket-form-select-error-message { display: block; }
1594
1675
 
1595
-
1596
- .apirocket-button,
1597
- button.apirocket-button {
1598
- box-sizing: border-box !important;
1599
- display: block;
1600
- width: 100%;
1601
- padding: var(--cart-button-padding-y, 16px) var(--cart-button-padding-x, 16px);
1602
- margin: 0px;
1603
- border-radius: var(--cart-button-border-radius, 4px);
1604
- background-color: var(--cart-button-background-color, transparent);
1605
- border: 1px solid var(--cart-button-border-color, #e5e5e5);
1606
- color: var(--cart-button-font-color, #737373);
1607
- line-height: 1;
1608
- font-size: var(--cart-button-font-size, 16px);
1609
- font-weight: var(--cart-button-font-weight, normal);
1610
- text-align: center;
1611
- transition-property: color, border-color, background-color, box-shadow;
1612
- transition-timing-function: ease;
1613
- transition-duration: 350ms;
1614
- cursor: pointer;
1615
- }
1616
-
1617
- .apirocket-button:hover {
1618
- background-color: var(--cart-button-background-color-hover, transparent);
1619
- border-color: var(--cart-button-border-color-hover, #404040);
1620
- color: var(--cart-button-font-color-hover, #404040);
1621
- }
1622
-
1623
- .apirocket-button:focus {
1624
- outline: none;
1625
- text-decoration: underline;
1626
- }
1627
-
1628
- .apirocket-button-link,
1629
- button.apirocket-button-link {
1630
- display: flex;
1631
- align-items: center;
1632
- text-align: left;
1633
- justify-content: flex-start;
1634
- align-items: center;
1635
- border: none;
1636
- padding-left: 0;
1637
- padding-right: 0;
1638
- width: auto;
1639
- overflow: hidden;
1640
- white-space: nowrap;
1641
- text-overflow: ellipsis;
1642
- }
1643
-
1644
- .apirocket-button-link span {
1645
- margin-left: 16px;
1646
- margin-right: 16px;
1647
- }
1648
-
1649
- .apirocket-button-primary,
1650
- button.apirocket-button-primary {
1651
- background-color: var(--cart-button-primary-background-color, #1d4ed8);
1652
- border-color: var(--cart-button-primary-border-color, #1d4ed8);
1653
- color: var(--cart-button-primary-text-color, #fff);
1654
- }
1655
-
1656
- button.apirocket-button-primary:disabled {
1657
- background-color: #eee;
1658
- border-color: #eee;
1659
- color: #ccc;
1660
- }
1661
-
1662
- .apirocket-button-primary:hover {
1663
- background-color: var(--cart-button-primary-background-color-hover, #1d4ed8);
1664
- border-color: var(--cart-button-primary-border-color-hover, #1d4ed8);
1665
- color: var(--cart-button-primary-text-color-hover, #fff);
1666
- box-shadow: var(--cart-shadow-button-primary-hover, none);
1667
- }
1668
-
1669
- @media (max-width: 720px) {
1670
-
1671
- .apirocket-button-link {
1672
- width: 100%;
1673
- justify-content: center;
1674
- }
1675
-
1676
- }.apirocket-summary {}
1676
+ .apirocket-summary {}
1677
1677
 
1678
1678
  .apirocket-summary-top {
1679
1679
  margin-top: 56px;