@riosst100/pwa-marketplace 1.2.6 → 1.2.7

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 (129) hide show
  1. package/.github/workflows/dependabot.yml +28 -28
  2. package/package.json +18 -18
  3. package/src/Utilities/graphQL.js +76 -76
  4. package/src/componentOverrideMapping.js +17 -16
  5. package/src/components/BecomeSeller/becomeSeller.js +335 -335
  6. package/src/components/BecomeSeller/becomeSeller.module.css +46 -46
  7. package/src/components/BecomeSellerLink/becomeSellerLink.js +52 -52
  8. package/src/components/BecomeSellerLink/becomeSellerLink.module.css +12 -12
  9. package/src/components/BecomeSellerPage/becomeSellerPage.js +45 -45
  10. package/src/components/BecomeSellerPage/becomeSellerPage.module.css +21 -21
  11. package/src/components/Filter/index.js +53 -53
  12. package/src/components/Header/becomeSellerLink.js +28 -28
  13. package/src/components/Header/becomeSellerLink.module.css +12 -12
  14. package/src/components/Header/websiteSwitcher.js +109 -109
  15. package/src/components/Pagination/index.js +49 -40
  16. package/src/components/PhoneTextInput/phoneTextInput.module.css +21 -21
  17. package/src/components/ProductItem/index.js +50 -50
  18. package/src/components/Search/index.js +16 -16
  19. package/src/components/Seller/index.js +1 -1
  20. package/src/components/Seller/seller.js +249 -42
  21. package/src/components/SellerAccountPage/sellerAccountPage.js +110 -110
  22. package/src/components/SellerAccountPage/sellerAccountPage.module.css +55 -55
  23. package/src/components/SellerCountry/sellerCountry.gql.js +11 -11
  24. package/src/components/SellerInformation/index.js +1 -1
  25. package/src/components/SellerInformation/sellerInformation.js +90 -84
  26. package/src/components/SellerLocation/index.js +1 -1
  27. package/src/components/SellerLocation/sellerLocation.js +19 -18
  28. package/src/components/SellerLocation/sellerLocationItem.js +27 -25
  29. package/src/components/SellerPage/sellerPage.js +9 -9
  30. package/src/components/SellerProducts/sellerProducts.js +47 -218
  31. package/src/components/SellerReview/index.js +1 -1
  32. package/src/components/SellerReview/sellerReview.js +143 -143
  33. package/src/components/SellerReviewItem/sellerReviewItem.js +60 -60
  34. package/src/components/SellerVerification/sellerVerification.js +198 -198
  35. package/src/components/SellerVerification/sellerVerification.module.css +47 -47
  36. package/src/components/SellerVerificationPage/sellerVerificationPage.js +43 -43
  37. package/src/components/SellerVerificationPage/sellerVerificationPage.module.css +21 -21
  38. package/src/components/SortBy/index.js +24 -16
  39. package/src/components/WebsiteSwitcher/websiteSwitcher.js +109 -109
  40. package/src/components/commons/Slider/index.js +13 -13
  41. package/src/components/commons/Tabs/index.js +64 -62
  42. package/src/index.js +6 -6
  43. package/src/intercept.js +113 -113
  44. package/src/moduleOverrideWebpackPlugin.js +70 -70
  45. package/src/overwrites/peregrine/lib/store/actions/user/asyncActions.js +96 -96
  46. package/src/overwrites/peregrine/lib/talons/AccountMenu/useAccountMenuItems.js +74 -74
  47. package/src/overwrites/peregrine/lib/talons/Adapter/useAdapter.js +208 -208
  48. package/src/overwrites/peregrine/lib/talons/Header/storeSwitcher.gql.js +45 -45
  49. package/src/overwrites/peregrine/lib/talons/Header/useStoreSwitcher.js +204 -204
  50. package/src/overwrites/peregrine/lib/talons/Region/useRegion.js +102 -102
  51. package/src/overwrites/peregrine/lib/talons/SignIn/signIn.gql.js +56 -56
  52. package/src/overwrites/peregrine/lib/talons/SignIn/useSignIn.js +226 -226
  53. package/src/overwrites/peregrine/lib/util/deriveErrorMessage.js +34 -34
  54. package/src/overwrites/pwa-buildpack/lib/queries/getAvailableStoresConfigData.graphql +11 -11
  55. package/src/overwrites/venia-ui/lib/components/Adapter/adapter.js +112 -112
  56. package/src/overwrites/venia-ui/lib/components/Header/header.js +130 -118
  57. package/src/overwrites/venia-ui/lib/components/Header/storeSwitcher.js +105 -105
  58. package/src/overwrites/venia-ui/lib/components/Header/switcherItem.js +47 -47
  59. package/src/overwrites/venia-ui/lib/components/MegaMenu/__tests__/MegaMenu.spec.js +91 -91
  60. package/src/overwrites/venia-ui/lib/components/MegaMenu/__tests__/MegaMenuItem.spec.js +123 -123
  61. package/src/overwrites/venia-ui/lib/components/MegaMenu/__tests__/Submenu.spec.js +61 -61
  62. package/src/overwrites/venia-ui/lib/components/MegaMenu/__tests__/SubmenuColumn.spec.js +50 -50
  63. package/src/overwrites/venia-ui/lib/components/MegaMenu/__tests__/__snapshots__/MegaMenu.spec.js.snap +114 -114
  64. package/src/overwrites/venia-ui/lib/components/MegaMenu/__tests__/__snapshots__/MegaMenuItem.spec.js.snap +71 -71
  65. package/src/overwrites/venia-ui/lib/components/MegaMenu/__tests__/__snapshots__/Submenu.spec.js.snap +59 -59
  66. package/src/overwrites/venia-ui/lib/components/MegaMenu/__tests__/__snapshots__/SubmenuColumn.spec.js.snap +34 -34
  67. package/src/overwrites/venia-ui/lib/components/MegaMenu/index.js +1 -1
  68. package/src/overwrites/venia-ui/lib/components/MegaMenu/megaMenu.js +90 -90
  69. package/src/overwrites/venia-ui/lib/components/MegaMenu/megaMenu.module.css +12 -12
  70. package/src/overwrites/venia-ui/lib/components/MegaMenu/megaMenuItem.js +156 -156
  71. package/src/overwrites/venia-ui/lib/components/MegaMenu/megaMenuItem.module.css +30 -30
  72. package/src/overwrites/venia-ui/lib/components/MegaMenu/submenu.js +89 -89
  73. package/src/overwrites/venia-ui/lib/components/MegaMenu/submenu.module.css +42 -42
  74. package/src/overwrites/venia-ui/lib/components/MegaMenu/submenuColumn.js +99 -99
  75. package/src/overwrites/venia-ui/lib/components/MegaMenu/submenuColumn.module.css +28 -28
  76. package/src/overwrites/venia-ui/lib/components/SearchBar/__stories__/searchBar.js +11 -11
  77. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/__snapshots__/searchField.spec.js.snap +72 -72
  78. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/__snapshots__/suggestedCategories.spec.js.snap +30 -30
  79. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/__snapshots__/suggestedProduct.spec.js.snap +69 -69
  80. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/__snapshots__/suggestedProducts.spec.js.snap +7 -7
  81. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/__snapshots__/suggestions.spec.js.snap +12 -12
  82. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/autocomplete.spec.js +52 -52
  83. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/searchBar.spec.js +82 -82
  84. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/searchField.spec.js +87 -87
  85. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/suggestedCategories.spec.js +45 -45
  86. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/suggestedProduct.spec.js +43 -43
  87. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/suggestedProducts.spec.js +45 -45
  88. package/src/overwrites/venia-ui/lib/components/SearchBar/__tests__/suggestions.spec.js +110 -110
  89. package/src/overwrites/venia-ui/lib/components/SearchBar/autocomplete.js +172 -172
  90. package/src/overwrites/venia-ui/lib/components/SearchBar/autocomplete.module.css +62 -62
  91. package/src/overwrites/venia-ui/lib/components/SearchBar/index.js +1 -1
  92. package/src/overwrites/venia-ui/lib/components/SearchBar/searchBar.js +74 -74
  93. package/src/overwrites/venia-ui/lib/components/SearchBar/searchBar.module.css +49 -49
  94. package/src/overwrites/venia-ui/lib/components/SearchBar/searchField.js +40 -40
  95. package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedCategories.js +48 -48
  96. package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedCategories.module.css +13 -13
  97. package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedCategory.js +49 -49
  98. package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedProduct.js +97 -97
  99. package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedProduct.module.css +24 -24
  100. package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedProducts.js +43 -43
  101. package/src/overwrites/venia-ui/lib/components/SearchBar/suggestedProducts.module.css +13 -13
  102. package/src/overwrites/venia-ui/lib/components/SearchBar/suggestions.js +75 -75
  103. package/src/overwrites/venia-ui/lib/components/SearchBar/suggestions.module.css +6 -6
  104. package/src/overwrites/venia-ui/lib/components/StoreCodeRoute/storeCodeRoute.js +75 -75
  105. package/src/overwrites/venia-ui/lib/targets/venia-ui-intercept.js +70 -70
  106. package/src/queries/getAvailableWebsitesConfigData.graphql +14 -14
  107. package/src/queries/index.js +30 -30
  108. package/src/talons/BecomeSeller/becomeSeller.gql.js +45 -45
  109. package/src/talons/BecomeSeller/useBecomeSeller.js +145 -145
  110. package/src/talons/BecomeSellerLink/useBecomeSellerLink.js +11 -11
  111. package/src/talons/BecomeSellerPage/useBecomeSellerPage.js +76 -76
  112. package/src/talons/Header/useBecomeSellerLink.js +13 -13
  113. package/src/talons/Header/useWebsiteSwitcher.js +218 -218
  114. package/src/talons/Seller/seller.gql.js +139 -204
  115. package/src/talons/Seller/useSeller.js +66 -71
  116. package/src/talons/SellerAccountPage/useSellerAccountPage.js +174 -174
  117. package/src/talons/SellerCountry/useSellerCountry.js +25 -25
  118. package/src/talons/WebsiteByIp/getWebsiteByIp.gql.js +13 -13
  119. package/src/talons/WebsiteByIp/useWebsiteByIp.js +34 -34
  120. package/src/talons/WebsiteSwitcher/useWebsiteSwitcher.js +218 -218
  121. package/src/theme/vars.js +6 -6
  122. package/src/util/mapSeller.js +7 -7
  123. package/src/components/OperatingHours/index.js +0 -1
  124. package/src/components/OperatingHours/operatingHours.js +0 -32
  125. package/src/components/Seller/sellerAddressCard.js +0 -48
  126. package/src/components/SellerDetail/index.js +0 -1
  127. package/src/components/SellerDetail/sellerDetail.js +0 -158
  128. package/src/components/SellerPage/core.js +0 -10
  129. package/src/talons/SellerProducts/useSellerProducts.js +0 -129
package/src/components/SellerReview/sellerReview.js CHANGED
@@ -1,144 +1,144 @@
1
- import React from 'react';
2
- import SellerReviewItem from '../SellerReviewItem';
3
- import Pagination from '../Pagination';
4
- import { Star1 } from 'iconsax-react';
5
-
6
- const SellerReview = () => {
7
- return (
8
- <>
9
- <div className='w-full flex items-start gap-[30px] '>
10
- <div className="w-full max-w-[300px] px-[25px] py-10 rounded-md border border-gray-200 flex-col justify-start items-start gap-[25px] inline-flex">
11
- <div className="justify-start items-end gap-[15px] inline-flex">
12
- <div className="text-center text-zinc-900 text-[40px] font-semibold leading-10">4.7</div>
13
- <div className="flex-col justify-start items-start gap-[9px] inline-flex">
14
- <div className="justify-start items-start gap-1.5 inline-flex">
15
- <div className="w-3.5 h-3.5 relative">
16
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
17
- </div>
18
- <div className="w-3.5 h-3.5 relative">
19
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
20
- </div>
21
- <div className="w-3.5 h-3.5 relative">
22
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
23
- </div>
24
- <div className="w-3.5 h-3.5 relative">
25
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
26
- </div>
27
- <div className="w-3.5 h-3.5 relative">
28
- <Star1 color='#D9D9D9' size={14} className='fill-[#D9D9D9]' />
29
- </div>
30
- </div>
31
- <div className="text-center text-zinc-900 text-sm font-normal leading-[18px]">(26 Reviews)</div>
32
- </div>
33
- </div>
34
- <div className="flex-col items-start gap-2 flex">
35
- <div className="flex gap-3 items-center">
36
- <div className="gap-2.5 flex items-center">
37
- <div className="gap-[5px] flex items-center">
38
- <div className="w-3.5 h-3.5 relative">
39
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
40
- </div>
41
- <div className="gap-2.5 flex">
42
- <div className="text-center text-zinc-900 text-sm font-normal font-['Noto Sans'] leading-[18px]">5</div>
43
- </div>
44
- </div>
45
- <div className="w-40 h-[6px] relative">
46
- <div className="w-full h-[6px] absolute bg-[#E4EBF5] rounded" />
47
- <div className="w-full h-[6px] absolute bg-[#4E31DB] rounded" />
48
- </div>
49
- </div>
50
- <div className="w-10 text-zinc-900 text-sm font-normal font-['Noto Sans'] leading-[18px]">12</div>
51
- </div>
52
- <div className="flex gap-3 items-center">
53
- <div className="gap-2.5 flex items-center">
54
- <div className="gap-[5px] flex items-center">
55
- <div className="w-3.5 h-3.5 relative">
56
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
57
- </div>
58
- <div className="gap-2.5 flex">
59
- <div className="text-center text-zinc-900 text-sm font-normal font-['Noto Sans'] leading-[18px]">4</div>
60
- </div>
61
- </div>
62
- <div className="w-40 h-[6px] relative">
63
- <div className="w-full h-[6px] absolute bg-[#E4EBF5] rounded" />
64
- <div className="w-[80%] h-[6px] absolute bg-[#4E31DB] rounded" />
65
- </div>
66
- </div>
67
- <div className="w-10 text-zinc-900 text-sm font-normal font-['Noto Sans'] leading-[18px]">8</div>
68
- </div>
69
- <div className="flex gap-3 items-center">
70
- <div className="gap-2.5 flex items-center">
71
- <div className="gap-[5px] flex items-center">
72
- <div className="w-3.5 h-3.5 relative">
73
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
74
- </div>
75
- <div className="gap-2.5 flex">
76
- <div className="text-center text-zinc-900 text-sm font-normal font-['Noto Sans'] leading-[18px]">3</div>
77
- </div>
78
- </div>
79
- <div className="w-40 h-[6px] relative">
80
- <div className="w-full h-[6px] absolute bg-[#E4EBF5] rounded" />
81
- <div className="w-[45%] h-[6px] absolute bg-[#4E31DB] rounded" />
82
- </div>
83
- </div>
84
- <div className="w-10 text-zinc-900 text-sm font-normal font-['Noto Sans'] leading-[18px]">5</div>
85
- </div>
86
- <div className="flex gap-3 items-center">
87
- <div className="gap-2.5 flex items-center">
88
- <div className="gap-[5px] flex items-center">
89
- <div className="w-3.5 h-3.5 relative">
90
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
91
- </div>
92
- <div className="gap-2.5 flex">
93
- <div className="text-center text-zinc-900 text-sm font-normal font-['Noto Sans'] leading-[18px]">2</div>
94
- </div>
95
- </div>
96
- <div className="w-40 h-[6px] relative">
97
- <div className="w-full h-[6px] absolute bg-[#E4EBF5] rounded" />
98
- <div className="w-[1%] h-[6px] absolute bg-[#4E31DB] rounded" />
99
- </div>
100
- </div>
101
- <div className="w-10 text-zinc-900 text-sm font-normal font-['Noto Sans'] leading-[18px]">1</div>
102
- </div>
103
- <div className="flex gap-3 items-center">
104
- <div className="gap-2.5 flex items-center">
105
- <div className="gap-[5px] flex items-center">
106
- <div className="w-3.5 h-3.5 relative">
107
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
108
- </div>
109
- <div className="gap-2.5 flex">
110
- <div className="text-center text-zinc-900 text-sm font-normal font-['Noto Sans'] leading-[18px]">1</div>
111
- </div>
112
- </div>
113
- <div className="w-40 h-[6px] relative">
114
- <div className="w-full h-[6px] absolute bg-[#E4EBF5] rounded" />
115
- <div className="w-[0%] h-[6px] absolute bg-[#4E31DB] rounded" />
116
- </div>
117
- </div>
118
- <div className="w-10 text-zinc-900 text-sm font-normal font-['Noto Sans'] leading-[18px]">0</div>
119
- </div>
120
- </div>
121
- <div className="self-stretch px-[30px] py-2.5 bg-white rounded-[30px] border border-indigo-600 justify-center items-center gap-2.5 inline-flex">
122
- <div className="text-indigo-600 text-base font-medium leading-tight">Write a review</div>
123
- </div>
124
- </div>
125
- <div className='flex flex-col w-full'>
126
- <div className='flex flex-col w-full items-start gap-[20px] relative mb-[30px]'>
127
- <SellerReviewItem />
128
- <SellerReviewItem />
129
- <SellerReviewItem />
130
- <SellerReviewItem />
131
- <SellerReviewItem />
132
- <SellerReviewItem />
133
- <SellerReviewItem />
134
- </div>
135
- <div className='pagination-container w-full flex justify-center'>
136
- <Pagination />
137
- </div>
138
- </div>
139
- </div>
140
- </>
141
- )
142
- }
143
-
1
+ import React from 'react';
2
+ import SellerReviewItem from '../SellerReviewItem';
3
+ import Pagination from '../Pagination';
4
+ import { Star1 } from 'iconsax-react';
5
+
6
+ const SellerReview = () => {
7
+ return (
8
+ <>
9
+ <div className='w-full flex items-start xs_flex-col lg_flex-row gap-[30px] '>
10
+ <div className="w-full xs_max-w-full lg_max-w-[300px] px-[25px] py-10 rounded-md border border-gray-200 flex-col justify-start items-start gap-[25px] inline-flex">
11
+ <div className="justify-start items-end gap-[15px] inline-flex">
12
+ <div className="text-center text-zinc-900 text-[40px] font-semibold leading-10">4.7</div>
13
+ <div className="flex-col justify-start items-start gap-[9px] inline-flex">
14
+ <div className="justify-start items-start gap-1.5 inline-flex">
15
+ <div className="w-3.5 h-3.5 relative">
16
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
17
+ </div>
18
+ <div className="w-3.5 h-3.5 relative">
19
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
20
+ </div>
21
+ <div className="w-3.5 h-3.5 relative">
22
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
23
+ </div>
24
+ <div className="w-3.5 h-3.5 relative">
25
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
26
+ </div>
27
+ <div className="w-3.5 h-3.5 relative">
28
+ <Star1 color='#D9D9D9' size={14} className='fill-[#D9D9D9]' />
29
+ </div>
30
+ </div>
31
+ <div className="text-center text-zinc-900 text-sm font-normal leading-[18px]">(26 Reviews)</div>
32
+ </div>
33
+ </div>
34
+ <div className="w-full flex-col items-start gap-2 flex">
35
+ <div className="flex xs_w-full lg_w-fit gap-3 items-center">
36
+ <div className="gap-2.5 flex items-center xs_w-full lg_w-fit">
37
+ <div className="gap-[5px] flex items-center">
38
+ <div className="w-3.5 h-3.5 relative">
39
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
40
+ </div>
41
+ <div className="gap-2.5 flex">
42
+ <div className="text-center text-zinc-900 text-sm font-normal leading-[18px]">5</div>
43
+ </div>
44
+ </div>
45
+ <div className="xs_w-full lg_w-40 h-[6px] relative">
46
+ <div className="w-full h-[6px] absolute bg-[#E4EBF5] rounded" />
47
+ <div className="w-full h-[6px] absolute bg-[#4E31DB] rounded" />
48
+ </div>
49
+ </div>
50
+ <div className="w-10 text-zinc-900 text-sm font-normal leading-[18px]">12</div>
51
+ </div>
52
+ <div className="flex xs_w-full lg_w-fit gap-3 items-center">
53
+ <div className="gap-2.5 flex items-center xs_w-full lg_w-fit">
54
+ <div className="gap-[5px] flex items-center">
55
+ <div className="w-3.5 h-3.5 relative">
56
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
57
+ </div>
58
+ <div className="gap-2.5 flex">
59
+ <div className="text-center text-zinc-900 text-sm font-normal leading-[18px]">4</div>
60
+ </div>
61
+ </div>
62
+ <div className="xs_w-full lg_w-40 h-[6px] relative">
63
+ <div className="w-full h-[6px] absolute bg-[#E4EBF5] rounded" />
64
+ <div className="w-[80%] h-[6px] absolute bg-[#4E31DB] rounded" />
65
+ </div>
66
+ </div>
67
+ <div className="w-10 text-zinc-900 text-sm font-normal leading-[18px]">8</div>
68
+ </div>
69
+ <div className="flex xs_w-full lg_w-fit gap-3 items-center">
70
+ <div className="gap-2.5 flex items-center xs_w-full lg_w-fit">
71
+ <div className="gap-[5px] flex items-center">
72
+ <div className="w-3.5 h-3.5 relative">
73
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
74
+ </div>
75
+ <div className="gap-2.5 flex">
76
+ <div className="text-center text-zinc-900 text-sm font-normal leading-[18px]">3</div>
77
+ </div>
78
+ </div>
79
+ <div className="xs_w-full lg_w-40 h-[6px] relative">
80
+ <div className="w-full h-[6px] absolute bg-[#E4EBF5] rounded" />
81
+ <div className="w-[45%] h-[6px] absolute bg-[#4E31DB] rounded" />
82
+ </div>
83
+ </div>
84
+ <div className="w-10 text-zinc-900 text-sm font-normal leading-[18px]">5</div>
85
+ </div>
86
+ <div className="flex xs_w-full lg_w-fit gap-3 items-center">
87
+ <div className="gap-2.5 flex items-center xs_w-full lg_w-fit">
88
+ <div className="gap-[5px] flex items-center">
89
+ <div className="w-3.5 h-3.5 relative">
90
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
91
+ </div>
92
+ <div className="gap-2.5 flex">
93
+ <div className="text-center text-zinc-900 text-sm font-normal leading-[18px]">2</div>
94
+ </div>
95
+ </div>
96
+ <div className="xs_w-full lg_w-40 h-[6px] relative">
97
+ <div className="w-full h-[6px] absolute bg-[#E4EBF5] rounded" />
98
+ <div className="w-[1%] h-[6px] absolute bg-[#4E31DB] rounded" />
99
+ </div>
100
+ </div>
101
+ <div className="w-10 text-zinc-900 text-sm font-normal leading-[18px]">1</div>
102
+ </div>
103
+ <div className="flex xs_w-full lg_w-fit gap-3 items-center">
104
+ <div className="gap-2.5 flex items-center xs_w-full lg_w-fit">
105
+ <div className="gap-[5px] flex items-center">
106
+ <div className="w-3.5 h-3.5 relative">
107
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
108
+ </div>
109
+ <div className="gap-2.5 flex">
110
+ <div className="text-center text-zinc-900 text-sm font-normal leading-[18px]">1</div>
111
+ </div>
112
+ </div>
113
+ <div className="xs_w-full lg_w-40 h-[6px] relative">
114
+ <div className="w-full h-[6px] absolute bg-[#E4EBF5] rounded" />
115
+ <div className="w-[0%] h-[6px] absolute bg-[#4E31DB] rounded" />
116
+ </div>
117
+ </div>
118
+ <div className="w-10 text-zinc-900 text-sm font-normal leading-[18px]">0</div>
119
+ </div>
120
+ </div>
121
+ <div className="xs_self-end lg_self-stretch px-[30px] py-2.5 bg-white rounded-[30px] border border-indigo-600 justify-center items-center gap-2.5 inline-flex">
122
+ <div className="text-indigo-600 text-base font-medium leading-tight">Write a review</div>
123
+ </div>
124
+ </div>
125
+ <div className='flex flex-col w-full'>
126
+ <div className='flex flex-col w-full items-start gap-[20px] relative mb-[30px]'>
127
+ <SellerReviewItem />
128
+ <SellerReviewItem />
129
+ <SellerReviewItem />
130
+ <SellerReviewItem />
131
+ <SellerReviewItem />
132
+ <SellerReviewItem />
133
+ <SellerReviewItem />
134
+ </div>
135
+ <div className='pagination-container w-full flex justify-center'>
136
+ <Pagination />
137
+ </div>
138
+ </div>
139
+ </div>
140
+ </>
141
+ )
142
+ }
143
+
144
144
  export default SellerReview;
package/src/components/SellerReviewItem/sellerReviewItem.js CHANGED
@@ -1,61 +1,61 @@
1
- import React from 'react';
2
- import { Star1 } from 'iconsax-react';
3
-
4
- const SellerReviewItem = () => {
5
- return (
6
- <>
7
- <div class="flex flex-col items-start gap-[10px] p-[25px] relative self-stretch w-full flex-[0_0_auto] bg-white rounded-[6px] border border-solid border-[#e6e9ea]">
8
- <div class="flex flex-col items-start gap-[20px] relative self-stretch w-full flex-[0_0_auto]">
9
- <div class="inline-flex flex-col items-start gap-[10px] relative flex-[0_0_auto]">
10
- <div class="inline-flex items-center gap-[15px] relative flex-[0_0_auto]">
11
- <div class="flex w-[40px] h-[40px] items-center justify-around gap-[10px] p-[10px] relative bg-[#4e31db] rounded-[30px]">
12
- <div class="relative w-fit [font-family:'Noto_Sans',Helvetica] font-semibold text-white text-[16px] text-center tracking-[0] leading-[18px] whitespace-nowrap">JD</div>
13
- </div>
14
- <div class="inline-flex flex-col items-start gap-[10px] relative flex-[0_0_auto]">
15
- <div class="relative w-fit mt-[-1.00px] [font-family:'Noto_Sans',Helvetica] font-medium text-[14px] text-center tracking-[0] leading-[18px] whitespace-nowrap">John Doe</div>
16
- <div class="relative w-fit [font-family:'Noto_Sans',Helvetica] font-medium text-[#999999] text-[12px] text-center tracking-[0] leading-[18px] whitespace-nowrap">18 January 2024</div>
17
- </div>
18
- </div>
19
- <div class="inline-flex items-start gap-[20px] relative flex-[0_0_auto]">
20
- <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
21
- <div class="relative w-fit [font-family:'Noto_Sans',Helvetica] font-normal text-[14px] tracking-[0] leading-[18px] whitespace-nowrap">Price</div>
22
- <div class="inline-flex items-start gap-[6px] relative flex-[0_0_auto]">
23
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
24
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
25
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
26
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
27
- <Star1 color='#D9D9D9' size={14} className='fill-[#D9D9D9]' />
28
- </div>
29
- </div>
30
- <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
31
- <div class="relative w-[37px] [font-family:'Noto_Sans',Helvetica] font-normal text-[14px] tracking-[0] leading-[18px]">Value</div>
32
- <div class="inline-flex items-start gap-[6px] relative flex-[0_0_auto]">
33
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
34
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
35
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
36
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
37
- <Star1 color='#D9D9D9' size={14} className='fill-[#D9D9D9]' />
38
- </div>
39
- </div>
40
- <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
41
- <div class="relative w-fit [font-family:'Noto_Sans',Helvetica] font-normal text-[14px] tracking-[0] leading-[18px] whitespace-nowrap">Quality</div>
42
- <div class="inline-flex items-start gap-[6px] relative flex-[0_0_auto]">
43
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
44
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
45
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
46
- <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
47
- <Star1 color='#D9D9D9' size={14} className='fill-[#D9D9D9]' />
48
- </div>
49
- </div>
50
- </div>
51
- </div>
52
- <p class="relative self-stretch [font-family:'Noto_Sans',Helvetica] font-normal text-[14px] tracking-[0] leading-[18px]">
53
- Got item at a great price. Arrived way quicker than expected, extremely well packaged and exactly as described. Highly recommend the seller.
54
- </p>
55
- </div>
56
- </div>
57
- </>
58
- )
59
- }
60
-
1
+ import React from 'react';
2
+ import { Star1 } from 'iconsax-react';
3
+
4
+ const SellerReviewItem = () => {
5
+ return (
6
+ <>
7
+ <div class="flex flex-col items-start gap-[10px] p-[25px] relative self-stretch w-full flex-[0_0_auto] bg-white rounded-[6px] border border-solid border-[#e6e9ea]">
8
+ <div class="flex flex-col items-start gap-[20px] relative self-stretch w-full flex-[0_0_auto]">
9
+ <div class="inline-flex flex-col items-start gap-[10px] relative flex-[0_0_auto]">
10
+ <div class="inline-flex items-center gap-[15px] relative flex-[0_0_auto]">
11
+ <div class="flex w-[40px] h-[40px] items-center justify-around gap-[10px] p-[10px] relative bg-[#4e31db] rounded-[30px]">
12
+ <div class="relative w-fit font-semibold text-white text-[16px] text-center tracking-[0] leading-[18px] whitespace-nowrap">JD</div>
13
+ </div>
14
+ <div class="inline-flex flex-col items-start gap-[10px] relative flex-[0_0_auto]">
15
+ <div class="relative w-fit mt-[-1.00px] font-medium text-[14px] text-center tracking-[0] leading-[18px] whitespace-nowrap">John Doe</div>
16
+ <div class="relative w-fit font-medium text-[#999999] text-[12px] text-center tracking-[0] leading-[18px] whitespace-nowrap">18 January 2024</div>
17
+ </div>
18
+ </div>
19
+ <div class="flex xs_flex-col sm_flex-row items-start xs_gap-1 sm_gap-[20px] relative flex-[0_0_auto]">
20
+ <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
21
+ <div class="relative w-fit font-normal text-[14px] tracking-[0] leading-[18px] whitespace-nowrap">Price</div>
22
+ <div class="inline-flex items-start gap-[6px] relative flex-[0_0_auto]">
23
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
24
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
25
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
26
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
27
+ <Star1 color='#D9D9D9' size={14} className='fill-[#D9D9D9]' />
28
+ </div>
29
+ </div>
30
+ <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
31
+ <div class="relative w-[37px] font-normal text-[14px] tracking-[0] leading-[18px]">Value</div>
32
+ <div class="inline-flex items-start gap-[6px] relative flex-[0_0_auto]">
33
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
34
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
35
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
36
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
37
+ <Star1 color='#D9D9D9' size={14} className='fill-[#D9D9D9]' />
38
+ </div>
39
+ </div>
40
+ <div class="inline-flex items-center gap-[10px] relative flex-[0_0_auto]">
41
+ <div class="relative w-fit font-normal text-[14px] tracking-[0] leading-[18px] whitespace-nowrap">Quality</div>
42
+ <div class="inline-flex items-start gap-[6px] relative flex-[0_0_auto]">
43
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
44
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
45
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
46
+ <Star1 color='#F7C317' size={14} className='fill-[#F7C317]' />
47
+ <Star1 color='#D9D9D9' size={14} className='fill-[#D9D9D9]' />
48
+ </div>
49
+ </div>
50
+ </div>
51
+ </div>
52
+ <p class="relative self-stretch font-normal text-[14px] tracking-[0] leading-[18px]">
53
+ Got item at a great price. Arrived way quicker than expected, extremely well packaged and exactly as described. Highly recommend the seller.
54
+ </p>
55
+ </div>
56
+ </div>
57
+ </>
58
+ )
59
+ }
60
+
61
61
  export default SellerReviewItem;