mirror of
https://github.com/aljazceru/landscape-template.git
synced 2026-01-08 00:44:29 +01:00
feat: categories drop-down
This commit is contained in:
MTG2000
384
package-lock.json
generated
384
package-lock.json
generated
@@ -43,7 +43,6 @@
|
||||
"react-responsive-carousel": "^3.2.22",
|
||||
"react-router-dom": "^6.2.2",
|
||||
"react-scripts": "4.0.3",
|
||||
"react-use": "^17.3.1",
|
||||
"typescript": "^4.4.4",
|
||||
"web-vitals": "^1.1.2",
|
||||
"webln": "^0.2.2"
|
||||
@@ -8378,11 +8377,6 @@
|
||||
"pretty-format": "^26.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/js-cookie": {
|
||||
"version": "2.2.7",
|
||||
"resolved": "https://registry.npmjs.org/@types/js-cookie/-/js-cookie-2.2.7.tgz",
|
||||
"integrity": "sha512-aLkWa0C0vO5b4Sr798E26QgOkss68Un0bLjs7u9qxzPT5CG+8DuNTffWES58YzJs3hrVAOs1wonycqEBqNJubA=="
|
||||
},
|
||||
"node_modules/@types/js-levenshtein": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/js-levenshtein/-/js-levenshtein-1.1.1.tgz",
|
||||
@@ -9149,11 +9143,6 @@
|
||||
"node": ">=10.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@xobotyi/scrollbar-width": {
|
||||
"version": "1.9.5",
|
||||
"resolved": "https://registry.npmjs.org/@xobotyi/scrollbar-width/-/scrollbar-width-1.9.5.tgz",
|
||||
"integrity": "sha512-N8tkAACJx2ww8vFMneJmaAgmjAG1tnVBZJRLRcx061tmsLRZHSEZSLuGWnwPtunsSLvSqXQ2wfp7Mgqg1I+2dQ=="
|
||||
},
|
||||
"node_modules/@xtuc/ieee754": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
|
||||
@@ -13225,15 +13214,6 @@
|
||||
"node": ">=4"
|
||||
}
|
||||
},
|
||||
"node_modules/css-in-js-utils": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.1.tgz",
|
||||
"integrity": "sha512-PJF0SpJT+WdbVVt0AOYp9C8GnuruRlL/UFW7932nLWmFLQTaWEzTBQEx7/hn4BuV+WON75iAViSUJLiU3PKbpA==",
|
||||
"dependencies": {
|
||||
"hyphenate-style-name": "^1.0.2",
|
||||
"isobject": "^3.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/css-loader": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmjs.org/css-loader/-/css-loader-4.3.0.tgz",
|
||||
@@ -16068,16 +16048,6 @@
|
||||
"resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
|
||||
"integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
|
||||
},
|
||||
"node_modules/fast-shallow-equal": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/fast-shallow-equal/-/fast-shallow-equal-1.0.0.tgz",
|
||||
"integrity": "sha512-HPtaa38cPgWvaCFmRNhlc6NG7pv6NUHqjPgVAkWGoB9mQMwYB27/K0CvOM5Czy+qpT3e8XJ6Q4aPAnzpNpzNaw=="
|
||||
},
|
||||
"node_modules/fastest-stable-stringify": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/fastest-stable-stringify/-/fastest-stable-stringify-2.0.2.tgz",
|
||||
"integrity": "sha512-bijHueCGd0LqqNK9b5oCMHc0MluJAx0cwqASgbWMvkO01lCYgIhacVRLcaDz3QnyYIRNJRDwMb41VuT6pHJ91Q=="
|
||||
},
|
||||
"node_modules/fastq": {
|
||||
"version": "1.13.0",
|
||||
"resolved": "https://registry.npmjs.org/fastq/-/fastq-1.13.0.tgz",
|
||||
@@ -18167,11 +18137,6 @@
|
||||
"node": ">=8.12.0"
|
||||
}
|
||||
},
|
||||
"node_modules/hyphenate-style-name": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.4.tgz",
|
||||
"integrity": "sha512-ygGZLjmXfPHj+ZWh6LwbC37l43MhfztxetbFCoYTM2VjkIUpeHgSNn7QIyVFj7YQ1Wl9Cbw5sholVJPzWvC2MQ=="
|
||||
},
|
||||
"node_modules/iconv-lite": {
|
||||
"version": "0.4.24",
|
||||
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
|
||||
@@ -18379,14 +18344,6 @@
|
||||
"integrity": "sha512-7NXolsK4CAS5+xvdj5OMMbI962hU/wvwoxk+LWR9Ek9bVtyuuYScDN6eS0rUm6TxApFpw7CX1o4uJzcd4AyD3Q==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/inline-style-prefixer": {
|
||||
"version": "6.0.1",
|
||||
"resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-6.0.1.tgz",
|
||||
"integrity": "sha512-AsqazZ8KcRzJ9YPN1wMH2aNM7lkWQ8tSPrW5uDk1ziYwiAPWSZnUsC7lfZq+BDqLqz0B4Pho5wscWcJzVvRzDQ==",
|
||||
"dependencies": {
|
||||
"css-in-js-utils": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/inquirer": {
|
||||
"version": "7.3.3",
|
||||
"resolved": "https://registry.npmjs.org/inquirer/-/inquirer-7.3.3.tgz",
|
||||
@@ -22980,50 +22937,6 @@
|
||||
"integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/nano-css": {
|
||||
"version": "5.3.4",
|
||||
"resolved": "https://registry.npmjs.org/nano-css/-/nano-css-5.3.4.tgz",
|
||||
"integrity": "sha512-wfcviJB6NOxDIDfr7RFn/GlaN7I/Bhe4d39ZRCJ3xvZX60LVe2qZ+rDqM49nm4YT81gAjzS+ZklhKP/Gnfnubg==",
|
||||
"dependencies": {
|
||||
"css-tree": "^1.1.2",
|
||||
"csstype": "^3.0.6",
|
||||
"fastest-stable-stringify": "^2.0.2",
|
||||
"inline-style-prefixer": "^6.0.0",
|
||||
"rtl-css-js": "^1.14.0",
|
||||
"sourcemap-codec": "^1.4.8",
|
||||
"stacktrace-js": "^2.0.2",
|
||||
"stylis": "^4.0.6"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "*",
|
||||
"react-dom": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/nano-css/node_modules/css-tree": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/css-tree/-/css-tree-1.1.3.tgz",
|
||||
"integrity": "sha512-tRpdppF7TRazZrjJ6v3stzv93qxRcSsFmW6cX0Zm2NVKpxE1WV1HblnghVv9TreireHkqI/VDEsfolRF1p6y7Q==",
|
||||
"dependencies": {
|
||||
"mdn-data": "2.0.14",
|
||||
"source-map": "^0.6.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=8.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/nano-css/node_modules/mdn-data": {
|
||||
"version": "2.0.14",
|
||||
"resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.14.tgz",
|
||||
"integrity": "sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow=="
|
||||
},
|
||||
"node_modules/nano-css/node_modules/source-map": {
|
||||
"version": "0.6.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
|
||||
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/nano-time": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/nano-time/-/nano-time-1.0.0.tgz",
|
||||
@@ -50134,45 +50047,6 @@
|
||||
"react": "^16.8.0 || ^17.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-universal-interface": {
|
||||
"version": "0.6.2",
|
||||
"resolved": "https://registry.npmjs.org/react-universal-interface/-/react-universal-interface-0.6.2.tgz",
|
||||
"integrity": "sha512-dg8yXdcQmvgR13RIlZbTRQOoUrDciFVoSBZILwjE2LFISxZZ8loVJKAkuzswl5js8BHda79bIb2b84ehU8IjXw==",
|
||||
"peerDependencies": {
|
||||
"react": "*",
|
||||
"tslib": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/react-use": {
|
||||
"version": "17.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-use/-/react-use-17.3.1.tgz",
|
||||
"integrity": "sha512-hs7+tS4rRm1QLHPfanLCqXIi632tP4V7Sai1ENUP2WTufU6am++tU9uSw9YrNCFqbABiEv0ndKU1XCUcfu2tXA==",
|
||||
"dependencies": {
|
||||
"@types/js-cookie": "^2.2.6",
|
||||
"@xobotyi/scrollbar-width": "^1.9.5",
|
||||
"copy-to-clipboard": "^3.3.1",
|
||||
"fast-deep-equal": "^3.1.3",
|
||||
"fast-shallow-equal": "^1.0.0",
|
||||
"js-cookie": "^2.2.1",
|
||||
"nano-css": "^5.3.1",
|
||||
"react-universal-interface": "^0.6.2",
|
||||
"resize-observer-polyfill": "^1.5.1",
|
||||
"screenfull": "^5.1.0",
|
||||
"set-harmonic-interval": "^1.0.1",
|
||||
"throttle-debounce": "^3.0.1",
|
||||
"ts-easing": "^0.2.0",
|
||||
"tslib": "^2.1.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.8.0 || ^17.0.0",
|
||||
"react-dom": "^16.8.0 || ^17.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-use/node_modules/js-cookie": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-2.2.1.tgz",
|
||||
"integrity": "sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ=="
|
||||
},
|
||||
"node_modules/read-pkg": {
|
||||
"version": "5.2.0",
|
||||
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz",
|
||||
@@ -50772,11 +50646,6 @@
|
||||
"version": "4.1.3",
|
||||
"integrity": "sha512-TVpMknnmdSRNhLPgTDSCQKw32zt1ZIJtEcSxfL/ihtDqShEMUs2X2UY/g96YAVynUXxqLWSXObLGIcqKHQObHw=="
|
||||
},
|
||||
"node_modules/resize-observer-polyfill": {
|
||||
"version": "1.5.1",
|
||||
"resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
|
||||
"integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
|
||||
},
|
||||
"node_modules/resolve": {
|
||||
"version": "1.18.1",
|
||||
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.18.1.tgz",
|
||||
@@ -51111,14 +50980,6 @@
|
||||
"node": "6.* || >= 7.*"
|
||||
}
|
||||
},
|
||||
"node_modules/rtl-css-js": {
|
||||
"version": "1.15.0",
|
||||
"resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.15.0.tgz",
|
||||
"integrity": "sha512-99Cu4wNNIhrI10xxUaABHsdDqzalrSRTie4GeCmbGVuehm4oj+fIy8fTzB+16pmKe8Bv9rl+hxIBez6KxExTew==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.1.2"
|
||||
}
|
||||
},
|
||||
"node_modules/run-async": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz",
|
||||
@@ -51558,17 +51419,6 @@
|
||||
"url": "https://opencollective.com/webpack"
|
||||
}
|
||||
},
|
||||
"node_modules/screenfull": {
|
||||
"version": "5.2.0",
|
||||
"resolved": "https://registry.npmjs.org/screenfull/-/screenfull-5.2.0.tgz",
|
||||
"integrity": "sha512-9BakfsO2aUQN2K9Fdbj87RJIEZ82Q9IGim7FqM5OsebfoFC6ZHXgDq/KvniuLTPdeM8wY2o6Dj3WQ7KeQCj3cA==",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/scuid": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/scuid/-/scuid-1.1.0.tgz",
|
||||
@@ -51780,14 +51630,6 @@
|
||||
"integrity": "sha512-edRH8mBKEWNVIVMKejNnuJxleqYE/ZSdcT8/Nem9/mmosx12pctd80s2Oy00KNZzrogMZS5mauK2/ymL1bvlvg==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/set-harmonic-interval": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/set-harmonic-interval/-/set-harmonic-interval-1.0.1.tgz",
|
||||
"integrity": "sha512-AhICkFV84tBP1aWqPwLZqFvAwqEoVA9kxNMniGEUvzOlm4vLmOFLiTT3UZ6bziJTy4bOVpzWGTfSCbmaayGx8g==",
|
||||
"engines": {
|
||||
"node": ">=6.9"
|
||||
}
|
||||
},
|
||||
"node_modules/set-value": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/set-value/-/set-value-2.0.1.tgz",
|
||||
@@ -52394,14 +52236,6 @@
|
||||
"resolved": "https://registry.npmjs.org/stable/-/stable-0.1.8.tgz",
|
||||
"integrity": "sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w=="
|
||||
},
|
||||
"node_modules/stack-generator": {
|
||||
"version": "2.0.5",
|
||||
"resolved": "https://registry.npmjs.org/stack-generator/-/stack-generator-2.0.5.tgz",
|
||||
"integrity": "sha512-/t1ebrbHkrLrDuNMdeAcsvynWgoH/i4o8EGGfX7dEYDoTXOYVAkEpFdtshlvabzc6JlJ8Kf9YdFEoz7JkzGN9Q==",
|
||||
"dependencies": {
|
||||
"stackframe": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"node_modules/stack-utils": {
|
||||
"version": "2.0.5",
|
||||
"resolved": "https://registry.npmjs.org/stack-utils/-/stack-utils-2.0.5.tgz",
|
||||
@@ -52426,33 +52260,6 @@
|
||||
"resolved": "https://registry.npmjs.org/stackframe/-/stackframe-1.2.0.tgz",
|
||||
"integrity": "sha512-GrdeshiRmS1YLMYgzF16olf2jJ/IzxXY9lhKOskuVziubpTYcYqyOwYeJKzQkwy7uN0fYSsbsC4RQaXf9LCrYA=="
|
||||
},
|
||||
"node_modules/stacktrace-gps": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/stacktrace-gps/-/stacktrace-gps-3.0.4.tgz",
|
||||
"integrity": "sha512-qIr8x41yZVSldqdqe6jciXEaSCKw1U8XTXpjDuy0ki/apyTn/r3w9hDAAQOhZdxvsC93H+WwwEu5cq5VemzYeg==",
|
||||
"dependencies": {
|
||||
"source-map": "0.5.6",
|
||||
"stackframe": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"node_modules/stacktrace-gps/node_modules/source-map": {
|
||||
"version": "0.5.6",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
|
||||
"integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI=",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/stacktrace-js": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/stacktrace-js/-/stacktrace-js-2.0.2.tgz",
|
||||
"integrity": "sha512-Je5vBeY4S1r/RnLydLl0TBTi3F2qdfWmYsGvtfZgEI+SCprPppaIhQf5nGcal4gI4cGpCV/duLcAzT1np6sQqg==",
|
||||
"dependencies": {
|
||||
"error-stack-parser": "^2.0.6",
|
||||
"stack-generator": "^2.0.5",
|
||||
"stacktrace-gps": "^3.0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/state-toggle": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/state-toggle/-/state-toggle-1.0.3.tgz",
|
||||
@@ -52919,10 +52726,6 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/stylis": {
|
||||
"version": "4.0.12",
|
||||
"integrity": "sha512-eVXQEZqRRFRvl8Aor1kNWN7ViNss9tYhphVBFNxyCJWKdK+FO5sOVKEHk7Dg/vLAr1xYQBpUb+7weU4AlDUm8g=="
|
||||
},
|
||||
"node_modules/subscriptions-transport-ws": {
|
||||
"version": "0.11.0",
|
||||
"resolved": "https://registry.npmjs.org/subscriptions-transport-ws/-/subscriptions-transport-ws-0.11.0.tgz",
|
||||
@@ -53725,6 +53528,7 @@
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-3.0.1.tgz",
|
||||
"integrity": "sha512-dTEWWNu6JmeVXY0ZYoPuH5cRIwc0MeGbJwah9KUNYSJwommQpCzTySTpEe8Gs1J23aeWEuAobe4Ag7EHVt/LOg==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
@@ -53948,11 +53752,6 @@
|
||||
"node": ">=6.10"
|
||||
}
|
||||
},
|
||||
"node_modules/ts-easing": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/ts-easing/-/ts-easing-0.2.0.tgz",
|
||||
"integrity": "sha512-Z86EW+fFFh/IFB1fqQ3/+7Zpf9t2ebOAxNI/V6Wo7r5gqiqtxmgTlQ1qbqQcjLKYeSHPTsEmvlJUDg/EuL0uHQ=="
|
||||
},
|
||||
"node_modules/ts-essentials": {
|
||||
"version": "2.0.12",
|
||||
"resolved": "https://registry.npmjs.org/ts-essentials/-/ts-essentials-2.0.12.tgz",
|
||||
@@ -62596,11 +62395,6 @@
|
||||
"pretty-format": "^26.0.0"
|
||||
}
|
||||
},
|
||||
"@types/js-cookie": {
|
||||
"version": "2.2.7",
|
||||
"resolved": "https://registry.npmjs.org/@types/js-cookie/-/js-cookie-2.2.7.tgz",
|
||||
"integrity": "sha512-aLkWa0C0vO5b4Sr798E26QgOkss68Un0bLjs7u9qxzPT5CG+8DuNTffWES58YzJs3hrVAOs1wonycqEBqNJubA=="
|
||||
},
|
||||
"@types/js-levenshtein": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@types/js-levenshtein/-/js-levenshtein-1.1.1.tgz",
|
||||
@@ -63264,11 +63058,6 @@
|
||||
"integrity": "sha512-V3BIhmY36fXZ1OtVcI9W+FxQqxVLsPKcNjWigIaa81dLC9IolJl5Mt4Cvhmr0flUnjSpTdrbMTSbXqYqV5dT6A==",
|
||||
"dev": true
|
||||
},
|
||||
"@xobotyi/scrollbar-width": {
|
||||
"version": "1.9.5",
|
||||
"resolved": "https://registry.npmjs.org/@xobotyi/scrollbar-width/-/scrollbar-width-1.9.5.tgz",
|
||||
"integrity": "sha512-N8tkAACJx2ww8vFMneJmaAgmjAG1tnVBZJRLRcx061tmsLRZHSEZSLuGWnwPtunsSLvSqXQ2wfp7Mgqg1I+2dQ=="
|
||||
},
|
||||
"@xtuc/ieee754": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
|
||||
@@ -66502,15 +66291,6 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"css-in-js-utils": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.1.tgz",
|
||||
"integrity": "sha512-PJF0SpJT+WdbVVt0AOYp9C8GnuruRlL/UFW7932nLWmFLQTaWEzTBQEx7/hn4BuV+WON75iAViSUJLiU3PKbpA==",
|
||||
"requires": {
|
||||
"hyphenate-style-name": "^1.0.2",
|
||||
"isobject": "^3.0.1"
|
||||
}
|
||||
},
|
||||
"css-loader": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmjs.org/css-loader/-/css-loader-4.3.0.tgz",
|
||||
@@ -68684,16 +68464,6 @@
|
||||
"resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
|
||||
"integrity": "sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc="
|
||||
},
|
||||
"fast-shallow-equal": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/fast-shallow-equal/-/fast-shallow-equal-1.0.0.tgz",
|
||||
"integrity": "sha512-HPtaa38cPgWvaCFmRNhlc6NG7pv6NUHqjPgVAkWGoB9mQMwYB27/K0CvOM5Czy+qpT3e8XJ6Q4aPAnzpNpzNaw=="
|
||||
},
|
||||
"fastest-stable-stringify": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/fastest-stable-stringify/-/fastest-stable-stringify-2.0.2.tgz",
|
||||
"integrity": "sha512-bijHueCGd0LqqNK9b5oCMHc0MluJAx0cwqASgbWMvkO01lCYgIhacVRLcaDz3QnyYIRNJRDwMb41VuT6pHJ91Q=="
|
||||
},
|
||||
"fastq": {
|
||||
"version": "1.13.0",
|
||||
"resolved": "https://registry.npmjs.org/fastq/-/fastq-1.13.0.tgz",
|
||||
@@ -70321,11 +70091,6 @@
|
||||
"resolved": "https://registry.npmjs.org/human-signals/-/human-signals-1.1.1.tgz",
|
||||
"integrity": "sha512-SEQu7vl8KjNL2eoGBLF3+wAjpsNfA9XMlXAYj/3EdaNfAlxKthD1xjEQfGOUhllCGGJVNY34bRr6lPINhNjyZw=="
|
||||
},
|
||||
"hyphenate-style-name": {
|
||||
"version": "1.0.4",
|
||||
"resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.4.tgz",
|
||||
"integrity": "sha512-ygGZLjmXfPHj+ZWh6LwbC37l43MhfztxetbFCoYTM2VjkIUpeHgSNn7QIyVFj7YQ1Wl9Cbw5sholVJPzWvC2MQ=="
|
||||
},
|
||||
"iconv-lite": {
|
||||
"version": "0.4.24",
|
||||
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
|
||||
@@ -70473,14 +70238,6 @@
|
||||
"integrity": "sha512-7NXolsK4CAS5+xvdj5OMMbI962hU/wvwoxk+LWR9Ek9bVtyuuYScDN6eS0rUm6TxApFpw7CX1o4uJzcd4AyD3Q==",
|
||||
"dev": true
|
||||
},
|
||||
"inline-style-prefixer": {
|
||||
"version": "6.0.1",
|
||||
"resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-6.0.1.tgz",
|
||||
"integrity": "sha512-AsqazZ8KcRzJ9YPN1wMH2aNM7lkWQ8tSPrW5uDk1ziYwiAPWSZnUsC7lfZq+BDqLqz0B4Pho5wscWcJzVvRzDQ==",
|
||||
"requires": {
|
||||
"css-in-js-utils": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"inquirer": {
|
||||
"version": "7.3.3",
|
||||
"resolved": "https://registry.npmjs.org/inquirer/-/inquirer-7.3.3.tgz",
|
||||
@@ -73937,42 +73694,6 @@
|
||||
"integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==",
|
||||
"dev": true
|
||||
},
|
||||
"nano-css": {
|
||||
"version": "5.3.4",
|
||||
"resolved": "https://registry.npmjs.org/nano-css/-/nano-css-5.3.4.tgz",
|
||||
"integrity": "sha512-wfcviJB6NOxDIDfr7RFn/GlaN7I/Bhe4d39ZRCJ3xvZX60LVe2qZ+rDqM49nm4YT81gAjzS+ZklhKP/Gnfnubg==",
|
||||
"requires": {
|
||||
"css-tree": "^1.1.2",
|
||||
"csstype": "^3.0.6",
|
||||
"fastest-stable-stringify": "^2.0.2",
|
||||
"inline-style-prefixer": "^6.0.0",
|
||||
"rtl-css-js": "^1.14.0",
|
||||
"sourcemap-codec": "^1.4.8",
|
||||
"stacktrace-js": "^2.0.2",
|
||||
"stylis": "^4.0.6"
|
||||
},
|
||||
"dependencies": {
|
||||
"css-tree": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/css-tree/-/css-tree-1.1.3.tgz",
|
||||
"integrity": "sha512-tRpdppF7TRazZrjJ6v3stzv93qxRcSsFmW6cX0Zm2NVKpxE1WV1HblnghVv9TreireHkqI/VDEsfolRF1p6y7Q==",
|
||||
"requires": {
|
||||
"mdn-data": "2.0.14",
|
||||
"source-map": "^0.6.1"
|
||||
}
|
||||
},
|
||||
"mdn-data": {
|
||||
"version": "2.0.14",
|
||||
"resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.14.tgz",
|
||||
"integrity": "sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow=="
|
||||
},
|
||||
"source-map": {
|
||||
"version": "0.6.1",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
|
||||
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"nano-time": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/nano-time/-/nano-time-1.0.0.tgz",
|
||||
@@ -94829,40 +94550,6 @@
|
||||
"use-latest": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"react-universal-interface": {
|
||||
"version": "0.6.2",
|
||||
"resolved": "https://registry.npmjs.org/react-universal-interface/-/react-universal-interface-0.6.2.tgz",
|
||||
"integrity": "sha512-dg8yXdcQmvgR13RIlZbTRQOoUrDciFVoSBZILwjE2LFISxZZ8loVJKAkuzswl5js8BHda79bIb2b84ehU8IjXw==",
|
||||
"requires": {}
|
||||
},
|
||||
"react-use": {
|
||||
"version": "17.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-use/-/react-use-17.3.1.tgz",
|
||||
"integrity": "sha512-hs7+tS4rRm1QLHPfanLCqXIi632tP4V7Sai1ENUP2WTufU6am++tU9uSw9YrNCFqbABiEv0ndKU1XCUcfu2tXA==",
|
||||
"requires": {
|
||||
"@types/js-cookie": "^2.2.6",
|
||||
"@xobotyi/scrollbar-width": "^1.9.5",
|
||||
"copy-to-clipboard": "^3.3.1",
|
||||
"fast-deep-equal": "^3.1.3",
|
||||
"fast-shallow-equal": "^1.0.0",
|
||||
"js-cookie": "^2.2.1",
|
||||
"nano-css": "^5.3.1",
|
||||
"react-universal-interface": "^0.6.2",
|
||||
"resize-observer-polyfill": "^1.5.1",
|
||||
"screenfull": "^5.1.0",
|
||||
"set-harmonic-interval": "^1.0.1",
|
||||
"throttle-debounce": "^3.0.1",
|
||||
"ts-easing": "^0.2.0",
|
||||
"tslib": "^2.1.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"js-cookie": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-2.2.1.tgz",
|
||||
"integrity": "sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ=="
|
||||
}
|
||||
}
|
||||
},
|
||||
"read-pkg": {
|
||||
"version": "5.2.0",
|
||||
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-5.2.0.tgz",
|
||||
@@ -95345,11 +95032,6 @@
|
||||
"version": "4.1.3",
|
||||
"integrity": "sha512-TVpMknnmdSRNhLPgTDSCQKw32zt1ZIJtEcSxfL/ihtDqShEMUs2X2UY/g96YAVynUXxqLWSXObLGIcqKHQObHw=="
|
||||
},
|
||||
"resize-observer-polyfill": {
|
||||
"version": "1.5.1",
|
||||
"resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
|
||||
"integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
|
||||
},
|
||||
"resolve": {
|
||||
"version": "1.18.1",
|
||||
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.18.1.tgz",
|
||||
@@ -95615,14 +95297,6 @@
|
||||
"resolved": "https://registry.npmjs.org/rsvp/-/rsvp-4.8.5.tgz",
|
||||
"integrity": "sha512-nfMOlASu9OnRJo1mbEk2cz0D56a1MBNrJ7orjRZQG10XDyuvwksKbuXNp6qa+kbn839HwjwhBzhFmdsaEAfauA=="
|
||||
},
|
||||
"rtl-css-js": {
|
||||
"version": "1.15.0",
|
||||
"resolved": "https://registry.npmjs.org/rtl-css-js/-/rtl-css-js-1.15.0.tgz",
|
||||
"integrity": "sha512-99Cu4wNNIhrI10xxUaABHsdDqzalrSRTie4GeCmbGVuehm4oj+fIy8fTzB+16pmKe8Bv9rl+hxIBez6KxExTew==",
|
||||
"requires": {
|
||||
"@babel/runtime": "^7.1.2"
|
||||
}
|
||||
},
|
||||
"run-async": {
|
||||
"version": "2.4.1",
|
||||
"resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.1.tgz",
|
||||
@@ -95946,11 +95620,6 @@
|
||||
"ajv-keywords": "^3.5.2"
|
||||
}
|
||||
},
|
||||
"screenfull": {
|
||||
"version": "5.2.0",
|
||||
"resolved": "https://registry.npmjs.org/screenfull/-/screenfull-5.2.0.tgz",
|
||||
"integrity": "sha512-9BakfsO2aUQN2K9Fdbj87RJIEZ82Q9IGim7FqM5OsebfoFC6ZHXgDq/KvniuLTPdeM8wY2o6Dj3WQ7KeQCj3cA=="
|
||||
},
|
||||
"scuid": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/scuid/-/scuid-1.1.0.tgz",
|
||||
@@ -96145,11 +95814,6 @@
|
||||
"integrity": "sha512-edRH8mBKEWNVIVMKejNnuJxleqYE/ZSdcT8/Nem9/mmosx12pctd80s2Oy00KNZzrogMZS5mauK2/ymL1bvlvg==",
|
||||
"dev": true
|
||||
},
|
||||
"set-harmonic-interval": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/set-harmonic-interval/-/set-harmonic-interval-1.0.1.tgz",
|
||||
"integrity": "sha512-AhICkFV84tBP1aWqPwLZqFvAwqEoVA9kxNMniGEUvzOlm4vLmOFLiTT3UZ6bziJTy4bOVpzWGTfSCbmaayGx8g=="
|
||||
},
|
||||
"set-value": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/set-value/-/set-value-2.0.1.tgz",
|
||||
@@ -96664,14 +96328,6 @@
|
||||
"resolved": "https://registry.npmjs.org/stable/-/stable-0.1.8.tgz",
|
||||
"integrity": "sha512-ji9qxRnOVfcuLDySj9qzhGSEFVobyt1kIOSkj1qZzYLzq7Tos/oUUWvotUPQLlrsidqsK6tBH89Bc9kL5zHA6w=="
|
||||
},
|
||||
"stack-generator": {
|
||||
"version": "2.0.5",
|
||||
"resolved": "https://registry.npmjs.org/stack-generator/-/stack-generator-2.0.5.tgz",
|
||||
"integrity": "sha512-/t1ebrbHkrLrDuNMdeAcsvynWgoH/i4o8EGGfX7dEYDoTXOYVAkEpFdtshlvabzc6JlJ8Kf9YdFEoz7JkzGN9Q==",
|
||||
"requires": {
|
||||
"stackframe": "^1.1.1"
|
||||
}
|
||||
},
|
||||
"stack-utils": {
|
||||
"version": "2.0.5",
|
||||
"resolved": "https://registry.npmjs.org/stack-utils/-/stack-utils-2.0.5.tgz",
|
||||
@@ -96692,32 +96348,6 @@
|
||||
"resolved": "https://registry.npmjs.org/stackframe/-/stackframe-1.2.0.tgz",
|
||||
"integrity": "sha512-GrdeshiRmS1YLMYgzF16olf2jJ/IzxXY9lhKOskuVziubpTYcYqyOwYeJKzQkwy7uN0fYSsbsC4RQaXf9LCrYA=="
|
||||
},
|
||||
"stacktrace-gps": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/stacktrace-gps/-/stacktrace-gps-3.0.4.tgz",
|
||||
"integrity": "sha512-qIr8x41yZVSldqdqe6jciXEaSCKw1U8XTXpjDuy0ki/apyTn/r3w9hDAAQOhZdxvsC93H+WwwEu5cq5VemzYeg==",
|
||||
"requires": {
|
||||
"source-map": "0.5.6",
|
||||
"stackframe": "^1.1.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"source-map": {
|
||||
"version": "0.5.6",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.6.tgz",
|
||||
"integrity": "sha1-dc449SvwczxafwwRjYEzSiu19BI="
|
||||
}
|
||||
}
|
||||
},
|
||||
"stacktrace-js": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/stacktrace-js/-/stacktrace-js-2.0.2.tgz",
|
||||
"integrity": "sha512-Je5vBeY4S1r/RnLydLl0TBTi3F2qdfWmYsGvtfZgEI+SCprPppaIhQf5nGcal4gI4cGpCV/duLcAzT1np6sQqg==",
|
||||
"requires": {
|
||||
"error-stack-parser": "^2.0.6",
|
||||
"stack-generator": "^2.0.5",
|
||||
"stacktrace-gps": "^3.0.4"
|
||||
}
|
||||
},
|
||||
"state-toggle": {
|
||||
"version": "1.0.3",
|
||||
"resolved": "https://registry.npmjs.org/state-toggle/-/state-toggle-1.0.3.tgz",
|
||||
@@ -97071,10 +96701,6 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"stylis": {
|
||||
"version": "4.0.12",
|
||||
"integrity": "sha512-eVXQEZqRRFRvl8Aor1kNWN7ViNss9tYhphVBFNxyCJWKdK+FO5sOVKEHk7Dg/vLAr1xYQBpUb+7weU4AlDUm8g=="
|
||||
},
|
||||
"subscriptions-transport-ws": {
|
||||
"version": "0.11.0",
|
||||
"resolved": "https://registry.npmjs.org/subscriptions-transport-ws/-/subscriptions-transport-ws-0.11.0.tgz",
|
||||
@@ -97678,7 +97304,8 @@
|
||||
"throttle-debounce": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-3.0.1.tgz",
|
||||
"integrity": "sha512-dTEWWNu6JmeVXY0ZYoPuH5cRIwc0MeGbJwah9KUNYSJwommQpCzTySTpEe8Gs1J23aeWEuAobe4Ag7EHVt/LOg=="
|
||||
"integrity": "sha512-dTEWWNu6JmeVXY0ZYoPuH5cRIwc0MeGbJwah9KUNYSJwommQpCzTySTpEe8Gs1J23aeWEuAobe4Ag7EHVt/LOg==",
|
||||
"dev": true
|
||||
},
|
||||
"through": {
|
||||
"version": "2.3.8",
|
||||
@@ -97853,11 +97480,6 @@
|
||||
"integrity": "sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==",
|
||||
"dev": true
|
||||
},
|
||||
"ts-easing": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/ts-easing/-/ts-easing-0.2.0.tgz",
|
||||
"integrity": "sha512-Z86EW+fFFh/IFB1fqQ3/+7Zpf9t2ebOAxNI/V6Wo7r5gqiqtxmgTlQ1qbqQcjLKYeSHPTsEmvlJUDg/EuL0uHQ=="
|
||||
},
|
||||
"ts-essentials": {
|
||||
"version": "2.0.12",
|
||||
"resolved": "https://registry.npmjs.org/ts-essentials/-/ts-essentials-2.0.12.tgz",
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "makers.bolt.fun",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@apollo/client": "^3.5.5",
|
||||
"@prisma/client": "3.5.0",
|
||||
@@ -38,7 +38,6 @@
|
||||
"react-responsive-carousel": "^3.2.22",
|
||||
"react-router-dom": "^6.2.2",
|
||||
"react-scripts": "4.0.3",
|
||||
"react-use": "^17.3.1",
|
||||
"typescript": "^4.4.4",
|
||||
"web-vitals": "^1.1.2",
|
||||
"webln": "^0.2.2"
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
import { ComponentStory, ComponentMeta } from '@storybook/react';
|
||||
import { MOCK_DATA } from 'src/mocks/data';
|
||||
|
||||
import CategoriesList from './CategoriesList';
|
||||
|
||||
export default {
|
||||
title: 'Shared/Navbar/CategoriesList',
|
||||
component: CategoriesList,
|
||||
|
||||
} as ComponentMeta<typeof CategoriesList>;
|
||||
|
||||
const Template: ComponentStory<typeof CategoriesList> = (args) => <CategoriesList {...args} />;
|
||||
|
||||
export const Default = Template.bind({});
|
||||
Default.args = {
|
||||
}
|
||||
|
||||
28
src/Components/Navbar/CategoriesList/CategoriesList.tsx
Normal file
28
src/Components/Navbar/CategoriesList/CategoriesList.tsx
Normal file
@@ -0,0 +1,28 @@
|
||||
import React from 'react'
|
||||
import { Link } from 'react-router-dom'
|
||||
import { MOCK_DATA } from 'src/mocks/data'
|
||||
import { ProjectCategory } from 'src/utils/interfaces'
|
||||
|
||||
interface Props {
|
||||
// categories: Pick<ProjectCategory, 'id' | 'title' | 'icon' | 'votes_sum'>[]
|
||||
classes?: Partial<{ list: string, item: string }>
|
||||
onClick?: (categoryId: number) => void
|
||||
}
|
||||
|
||||
const categories = MOCK_DATA['categories']
|
||||
|
||||
export default function CategoriesList({ classes = {}, onClick }: Props) {
|
||||
return (
|
||||
<ul className={classes.list}>
|
||||
{categories.map(category =>
|
||||
<Link
|
||||
onClick={() => onClick?.(category.id)}
|
||||
key={category.id}
|
||||
to={`/category/${category.id}`}>
|
||||
<li className={`flex p-16 text-body4 font-semibold items-center hover:bg-gray-100 rounded-8 ${classes.item}`} >
|
||||
<span className="text-body3 mr-8">{category.icon}</span> {category.title} <span className="ml-auto text-body5 font-normal text-gray-400">{category.votes_sum}</span>
|
||||
</li>
|
||||
</Link>)}
|
||||
</ul>
|
||||
)
|
||||
}
|
||||
@@ -8,15 +8,27 @@ import ASSETS from "src/assets";
|
||||
import Search from "./Search/Search";
|
||||
import IconButton from "../IconButton/IconButton";
|
||||
import { toggleSearch } from "src/redux/features/ui.slice";
|
||||
import { navLinks } from "./Navbar";
|
||||
import { Link } from "react-router-dom";
|
||||
import CategoriesList from "./CategoriesList/CategoriesList";
|
||||
import { useEffect, useRef, useState } from "react";
|
||||
import { IoExtensionPuzzle } from "react-icons/io5";
|
||||
import { useClickOutside, useToggle } from "@react-hookz/web";
|
||||
|
||||
|
||||
export default function NavDesktop() {
|
||||
const dispatch = useAppDispatch();
|
||||
const [categoriesOpen, toggleCategories] = useToggle(false)
|
||||
const categoriesRef = useRef<HTMLLIElement>(null)
|
||||
useClickOutside(categoriesRef, () => toggleCategories(false))
|
||||
|
||||
|
||||
const { isWalletConnected, searchOpen } = useAppSelector((state) => ({
|
||||
isWalletConnected: state.wallet.isConnected,
|
||||
searchOpen: state.ui.isSearchOpen
|
||||
}));
|
||||
|
||||
|
||||
const handleSearchClick = () => {
|
||||
dispatch(toggleSearch())
|
||||
};
|
||||
@@ -47,12 +59,44 @@ export default function NavDesktop() {
|
||||
<img className='h-40' src={ASSETS.Logo} alt="Bolt fun logo" />
|
||||
</h2>
|
||||
</a>
|
||||
{/* <ul className="flex gap-32 xl:gap-64">
|
||||
{navLinks.map((link, idx) => <li key={idx} className="text-body4 hover:text-primary-600">
|
||||
<Link to={link.url}><link.icon className={`text-body2 align-middle inline-block mr-8 ${link.color}`} /> {link.text}</Link></li>
|
||||
)}
|
||||
|
||||
</ul> */}
|
||||
<ul className="flex gap-32 xl:gap-64">
|
||||
{navLinks.map((link, idx) => <li key={idx} className=" relative">
|
||||
<Link to={link.url} className='text-body4 hover:text-primary-600'>
|
||||
<link.icon className={`text-body2 inline-block mr-8 text-primary-600`} />
|
||||
<span className="align-middle">{link.text}</span>
|
||||
</Link>
|
||||
{link.text === 'Categories' && <div className="absolute top-full left-0 w-[256px] border border-primary-50 rounded-8 shadow-2xl translate-y-16">
|
||||
<CategoriesList />
|
||||
</div>}
|
||||
</li>
|
||||
)}
|
||||
<li
|
||||
ref={categoriesRef}
|
||||
className="relative cursor-pointer" onClick={() => toggleCategories(!categoriesOpen)}>
|
||||
<p className='text-body4 hover:text-primary-600'>
|
||||
<IoExtensionPuzzle className={`text-body2 inline-block mr-8 text-primary-600`} />
|
||||
<span className="align-middle">Categories</span>
|
||||
</p>
|
||||
{<motion.div
|
||||
initial={{ opacity: 0, y: 200, display: 'none' }}
|
||||
animate={categoriesOpen ? {
|
||||
opacity: 1, y: 16, display: 'initial',
|
||||
transition: { ease: 'easeOut' }
|
||||
} : {
|
||||
opacity: 0, y: 200,
|
||||
transition: {
|
||||
ease: "easeIn",
|
||||
duration: .4
|
||||
},
|
||||
transitionEnd: {
|
||||
display: 'none'
|
||||
}
|
||||
}}
|
||||
className="absolute top-full left-0 w-[256px] border border-primary-50 rounded-8 shadow-2xl">
|
||||
<CategoriesList />
|
||||
</motion.div>}
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div className="ml-auto"></div>
|
||||
<motion.div
|
||||
|
||||
@@ -1,12 +1,24 @@
|
||||
import { motion } from "framer-motion";
|
||||
import { useEffect, useState } from "react";
|
||||
import { BsSearch } from "react-icons/bs";
|
||||
import { BsChevronDown, BsSearch } from "react-icons/bs";
|
||||
import { GrClose } from "react-icons/gr";
|
||||
import Button from "../Button/Button";
|
||||
import ASSETS from "src/assets";
|
||||
import Search from "./Search/Search";
|
||||
import IconButton from "../IconButton/IconButton";
|
||||
import { useAppDispatch, useAppSelector } from "src/utils/hooks";
|
||||
import { toggleSearch } from "src/redux/features/ui.slice";
|
||||
import { FiMenu } from "react-icons/fi";
|
||||
import { navLinks } from "./Navbar";
|
||||
import { Link } from "react-router-dom";
|
||||
import { IoExtensionPuzzle } from "react-icons/io5";
|
||||
import CategoriesList from "./CategoriesList/CategoriesList";
|
||||
import { useToggle } from "@react-hookz/web";
|
||||
import styles from './styles.module.css'
|
||||
|
||||
interface Props {
|
||||
}
|
||||
|
||||
|
||||
const navBtnVariant = {
|
||||
menuHide: { rotate: 90, opacity: 0 },
|
||||
@@ -14,37 +26,58 @@ const navBtnVariant = {
|
||||
closeHide: { rotate: -90, opacity: 0 },
|
||||
closeShow: { rotate: 0, opacity: 1 },
|
||||
};
|
||||
|
||||
const navListVariants = {
|
||||
init: { x: 0 },
|
||||
show: { x: "-100%" },
|
||||
hide: { x: 0 },
|
||||
};
|
||||
|
||||
interface Props {
|
||||
const categoriesListVariants = {
|
||||
open: {
|
||||
opacity: 1, y: 0, display: 'block',
|
||||
transition: { ease: 'easeOut' }
|
||||
},
|
||||
closed: {
|
||||
opacity: 0, y: -50,
|
||||
transition: {
|
||||
ease: "easeIn",
|
||||
duration: .2
|
||||
},
|
||||
transitionEnd: {
|
||||
display: 'none'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const categoriesArrowVariants = {
|
||||
open: { rotate: 180 },
|
||||
closed: { rotate: 0 }
|
||||
}
|
||||
|
||||
|
||||
export default function NavMobile({ }: Props) {
|
||||
const [open, setOpen] = useState(false);
|
||||
const dispatch = useAppDispatch();
|
||||
const { searchOpen } = useAppSelector((state) => ({
|
||||
isWalletConnected: state.wallet.isConnected,
|
||||
searchOpen: state.ui.isSearchOpen
|
||||
}));
|
||||
|
||||
const [drawerOpen, toggleDrawerOpen] = useToggle(false);
|
||||
const [categoriesOpen, toggleCategories] = useToggle(false)
|
||||
|
||||
|
||||
|
||||
const handleClick = () => {
|
||||
setOpen((open) => !open);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (open) document.body.style.overflowY = "hidden";
|
||||
if (drawerOpen) document.body.style.overflowY = "hidden";
|
||||
else document.body.style.overflowY = "initial";
|
||||
}, [open]);
|
||||
}, [drawerOpen]);
|
||||
|
||||
|
||||
|
||||
const handleSearchClick = () => {
|
||||
toggleDrawerOpen(false)
|
||||
dispatch(toggleSearch())
|
||||
};
|
||||
|
||||
@@ -52,8 +85,8 @@ export default function NavMobile({ }: Props) {
|
||||
|
||||
|
||||
return (
|
||||
<div className="w-screen z-[2010]">
|
||||
<nav className="bg-white fixed top-0 left-0 h-[67px] w-full p-16 px-32 flex justify-between items-center z-[2010]">
|
||||
<div className={`${styles.navMobile} w-screen z-[2010]`}>
|
||||
<nav className={`bg-white fixed top-0 left-0 h-[67px] w-full p-16 px-32 flex justify-between items-center z-[2010]`}>
|
||||
{/* <div className="w-40 h-40 bg-gray-100 rounded-8 mr-auto">
|
||||
<img className="w-full h-full object-cover" src="https://www.figma.com/file/OFowr5RJk9YZCW35KT7D5K/image/07b85d84145942255afd215b3da26dbbf1dd03bd?fuid=772401335362859303" alt="" />
|
||||
</div> */}
|
||||
@@ -66,39 +99,39 @@ export default function NavMobile({ }: Props) {
|
||||
animate={searchOpen ? { opacity: 0 } : { opacity: 1 }}
|
||||
className="flex"
|
||||
>
|
||||
<Button size="sm"
|
||||
{/* <Button size="sm"
|
||||
color="primary"
|
||||
className="rounded-24"
|
||||
href="https://form.jotform.com/220301236112030"
|
||||
newTab>
|
||||
Submit App️
|
||||
</Button>
|
||||
<IconButton className='ml-8 self-center' onClick={handleSearchClick}>
|
||||
</Button> */}
|
||||
{/* <IconButton className='ml-8 self-center' onClick={handleSearchClick}>
|
||||
<BsSearch className="text-gray-400" />
|
||||
</IconButton> */}
|
||||
<IconButton className='auto text-2xl w-[50px] h-[50px] hover:bg-gray-200 self-center' onClick={() => toggleDrawerOpen()}>
|
||||
{!drawerOpen ? (<motion.div key={drawerOpen ? 1 : 0} variants={navBtnVariant} initial='menuHide' animate='menuShow'><FiMenu /></motion.div>)
|
||||
: (<motion.div key={drawerOpen ? 1 : 0} variants={navBtnVariant} initial='closeHide' animate='closeShow'><GrClose /></motion.div>)}
|
||||
</IconButton>
|
||||
</motion.div>
|
||||
<Search width='calc(100vw - 64px)' />
|
||||
|
||||
{/* <button className='rounded-full ml-auto text-2xl w-[50px] h-[50px] hover:bg-gray-200' onClick={handleClick}>
|
||||
|
||||
{!open ? (<motion.div key={open ? 1 : 0} variants={navBtnVariant} initial='menuHide' animate='menuShow'><FiMenu /></motion.div>)
|
||||
: (<motion.div key={open ? 1 : 0} variants={navBtnVariant} initial='closeHide' animate='closeShow'><GrClose /></motion.div>)}
|
||||
</button> */}
|
||||
</nav>
|
||||
|
||||
<div className="fixed left-0 pointer-events-none z-[2010] w-full min-h-[calc(100vh-76px)]">
|
||||
{open && (
|
||||
{drawerOpen && (
|
||||
<div
|
||||
onClick={handleClick}
|
||||
onClick={() => toggleDrawerOpen()}
|
||||
className="pointer-events-auto absolute left-0 w-full min-h-full bg-gray-400 opacity-20"
|
||||
></div>
|
||||
)}
|
||||
<motion.div
|
||||
className="pointer-events-auto bg-white w-full sm:max-w-[400px] min-h-full absolute left-full border shadow-2xl pt-32 sm:p-32 flex flex-col"
|
||||
className="pointer-events-auto bg-white w-full sm:max-w-[400px] overflow-y-scroll absolute left-full border shadow-2xl px-16 flex flex-col"
|
||||
variants={navListVariants}
|
||||
animate={open ? "show" : "hide"}
|
||||
style={{ height: 'calc(100vh - 67px)' }}
|
||||
animate={drawerOpen ? "show" : "hide"}
|
||||
>
|
||||
<div className="px-16">
|
||||
<div className="flex flex-col gap-16 py-16">
|
||||
{/* <form className='relative' onSubmit={handleSubmit}>
|
||||
<BsSearch className='absolute top-1/2 left-20 transform -translate-x-1/2 -translate-y-1/2 text-gray-500' />
|
||||
<input
|
||||
@@ -116,19 +149,54 @@ export default function NavMobile({ }: Props) {
|
||||
<Button
|
||||
color="primary"
|
||||
fullWidth
|
||||
className="py-12 px-40 rounded-24 mt-40"
|
||||
className="py-12 px-40 rounded-24 "
|
||||
>
|
||||
Submit App️
|
||||
</Button>
|
||||
</a>
|
||||
|
||||
<Button
|
||||
color='gray'
|
||||
fullWidth
|
||||
className="py-12 px-40 rounded-24"
|
||||
onClick={() => handleSearchClick()}
|
||||
|
||||
>
|
||||
<BsSearch className='inline-block transform scale-125' />
|
||||
<span className="align-middle"> Search Apps</span>
|
||||
</Button>
|
||||
{/* <Button color='gray' fullWidth className="py-12 px-40 rounded-24 my-16"> <AiFillThunderbolt className='inline-block text-thunder transform scale-125' /> Connect Wallet </Button> */}
|
||||
</div>
|
||||
{/* <ul className="py-16 gap-64 border-t">
|
||||
{navLinks.map((link, idx) => <li key={idx} className="text-body3 p-16 hover:bg-gray-200">
|
||||
<Link to={link.url}><link.icon className={`text-body2 inline-block mr-12 ${link.color}`} /> {link.text} </Link></li>
|
||||
)}
|
||||
</ul> */}
|
||||
<ul className="px-16 py-16 pb-32 flex flex-wrap gap-y-12 border-t mt-32">
|
||||
<ul className="py-16 gap-64 border-t">
|
||||
{navLinks.map((link, idx) => <li key={idx} className="text-body3 p-16 active:bg-gray-200">
|
||||
<Link to={link.url}><link.icon className={`text-body2 inline-block mr-12 text-primary-600`} /> <span className="align-middle">{link.text}</span> </Link></li>
|
||||
)}
|
||||
<li >
|
||||
<p className="text-body3 flex items-center p-16 active:bg-gray-200 cursor-pointer"
|
||||
onClick={() => toggleCategories(!categoriesOpen)}
|
||||
>
|
||||
<IoExtensionPuzzle className={`text-body2 inline-block mr-12 text-primary-600`} /> Categories
|
||||
<motion.span
|
||||
variants={categoriesArrowVariants}
|
||||
initial={'closed'}
|
||||
animate={categoriesOpen ? 'open' : 'closed'}
|
||||
className="ml-auto">
|
||||
<BsChevronDown className=" text-gray-400" />
|
||||
</motion.span>
|
||||
</p>
|
||||
{<motion.div
|
||||
variants={categoriesListVariants}
|
||||
initial={'closed'}
|
||||
animate={categoriesOpen ? 'open' : 'closed'}
|
||||
>
|
||||
<CategoriesList
|
||||
classes={{ list: "pl-32" }}
|
||||
onClick={() => toggleDrawerOpen(false)}
|
||||
/>
|
||||
</motion.div>}
|
||||
</li>
|
||||
</ul>
|
||||
<ul className="px-16 py-16 pb-32 flex flex-wrap gap-y-12 border-t pt-32 mt-auto">
|
||||
<li className="text-body4 text-gray-500 hover:text-gray-700 w-1/2">
|
||||
<a href="/">About Us</a>
|
||||
</li>
|
||||
@@ -153,6 +221,7 @@ export default function NavMobile({ }: Props) {
|
||||
<li className="text-body4 text-gray-500 hover:text-gray-700 w-1/2">
|
||||
<a href="/">Cookies Settings</a>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</motion.div>
|
||||
</div>
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import NavMobile from "./NavMobile";
|
||||
import { FaHome } from "react-icons/fa";
|
||||
import { MdLocalFireDepartment } from "react-icons/md";
|
||||
import { MdHomeFilled, MdLocalFireDepartment } from "react-icons/md";
|
||||
import { IoExtensionPuzzle } from "react-icons/io5";
|
||||
import { useCallback } from "react";
|
||||
import { useAppDispatch, useAppSelector } from "src/utils/hooks";
|
||||
@@ -8,21 +7,23 @@ import { openModal } from "src/redux/features/modals.slice";
|
||||
import { setNavHeight } from "src/redux/features/ui.slice";
|
||||
import { useResizeListener } from "src/utils/hooks";
|
||||
import NavDesktop from "./NavDesktop";
|
||||
import { useMediaQuery } from "@react-hookz/web";
|
||||
import { MEDIA_QUERIES } from "src/utils/theme/media_queries";
|
||||
|
||||
export const navLinks = [
|
||||
{ text: "Explore", url: "/", icon: FaHome, color: "text-primary-600" },
|
||||
{ text: "Explore", url: "/", icon: MdHomeFilled, color: "text-primary-600" },
|
||||
{
|
||||
text: "Hottest",
|
||||
url: "/categories/hottest",
|
||||
icon: MdLocalFireDepartment,
|
||||
color: "text-primary-600",
|
||||
},
|
||||
{
|
||||
text: "Categories",
|
||||
url: "/categories",
|
||||
icon: IoExtensionPuzzle,
|
||||
color: "text-primary-600",
|
||||
},
|
||||
// {
|
||||
// text: "Categories",
|
||||
// url: "/categories",
|
||||
// icon: IoExtensionPuzzle,
|
||||
// color: "text-primary-600",
|
||||
// },
|
||||
];
|
||||
|
||||
export default function Navbar() {
|
||||
@@ -33,6 +34,8 @@ export default function Navbar() {
|
||||
isMobileScreen: state.ui.isMobileScreen
|
||||
}));
|
||||
|
||||
const isLargeScreen = useMediaQuery(MEDIA_QUERIES.isLarge)
|
||||
|
||||
|
||||
const onConnectWallet = () => {
|
||||
dispatch(
|
||||
@@ -70,10 +73,10 @@ export default function Navbar() {
|
||||
|
||||
return (
|
||||
<>
|
||||
{!isMobileScreen ?
|
||||
<NavDesktop />
|
||||
:
|
||||
{(isMobileScreen || !isLargeScreen) ?
|
||||
<NavMobile />
|
||||
:
|
||||
<NavDesktop />
|
||||
}
|
||||
</>
|
||||
);
|
||||
|
||||
20
src/Components/Navbar/styles.module.css
Normal file
20
src/Components/Navbar/styles.module.css
Normal file
@@ -0,0 +1,20 @@
|
||||
/* width */
|
||||
.navMobile ::-webkit-scrollbar {
|
||||
width: 4px;
|
||||
}
|
||||
|
||||
/* Track */
|
||||
.navMobile ::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/* Handle */
|
||||
.navMobile ::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
background-color: #aaa;
|
||||
}
|
||||
|
||||
/* Handle on hover */
|
||||
.navMobile ::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #999;
|
||||
}
|
||||
@@ -3,6 +3,5 @@ import Images_ExploreHeader2 from './images/shock-the-web.png'
|
||||
import Logo from './images/logo.png'
|
||||
|
||||
const ASSETS = { Images_ExploreHeader1, Images_ExploreHeader2, Logo }
|
||||
console.log(ASSETS);
|
||||
|
||||
export default ASSETS;
|
||||
@@ -5,52 +5,72 @@ let categories = [
|
||||
{
|
||||
"id": 10,
|
||||
"title": "Video",
|
||||
cover_image: ASSETS.Images_ExploreHeader1
|
||||
cover_image: ASSETS.Images_ExploreHeader1,
|
||||
icon: '📹',
|
||||
votes_sum: 1200,
|
||||
},
|
||||
{
|
||||
"id": 8,
|
||||
"title": "Shopping",
|
||||
cover_image: ASSETS.Images_ExploreHeader1
|
||||
cover_image: ASSETS.Images_ExploreHeader1,
|
||||
icon: '🛒',
|
||||
votes_sum: 850,
|
||||
},
|
||||
{
|
||||
"id": 5,
|
||||
"title": "Music",
|
||||
cover_image: ASSETS.Images_ExploreHeader1
|
||||
cover_image: ASSETS.Images_ExploreHeader1,
|
||||
icon: '🎭',
|
||||
votes_sum: 820,
|
||||
},
|
||||
{
|
||||
"id": 9,
|
||||
"title": "Miscellaneous",
|
||||
cover_image: ASSETS.Images_ExploreHeader1
|
||||
cover_image: ASSETS.Images_ExploreHeader1,
|
||||
icon: '🎁',
|
||||
votes_sum: 675,
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"title": "Gaming",
|
||||
cover_image: ASSETS.Images_ExploreHeader1
|
||||
cover_image: ASSETS.Images_ExploreHeader1,
|
||||
icon: '🎮',
|
||||
votes_sum: 675,
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"title": "Finance",
|
||||
cover_image: ASSETS.Images_ExploreHeader1
|
||||
cover_image: ASSETS.Images_ExploreHeader1,
|
||||
icon: '💵',
|
||||
votes_sum: 250,
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"title": "Digital Print",
|
||||
cover_image: ASSETS.Images_ExploreHeader1
|
||||
cover_image: ASSETS.Images_ExploreHeader1,
|
||||
icon: '🚨',
|
||||
votes_sum: 200,
|
||||
},
|
||||
{
|
||||
"id": 7,
|
||||
"title": "Digital Content",
|
||||
cover_image: ASSETS.Images_ExploreHeader1
|
||||
cover_image: ASSETS.Images_ExploreHeader1,
|
||||
icon: '💱',
|
||||
votes_sum: 180,
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"title": "Art",
|
||||
cover_image: ASSETS.Images_ExploreHeader1
|
||||
"title": "Art & Collectibles",
|
||||
cover_image: ASSETS.Images_ExploreHeader1,
|
||||
icon: '🎨',
|
||||
votes_sum: 120,
|
||||
},
|
||||
{
|
||||
"id": 6,
|
||||
"title": "Analytics",
|
||||
cover_image: ASSETS.Images_ExploreHeader1
|
||||
cover_image: ASSETS.Images_ExploreHeader1,
|
||||
icon: '💸',
|
||||
votes_sum: 100,
|
||||
},
|
||||
|
||||
]
|
||||
|
||||
@@ -5,11 +5,11 @@ import { IoClose } from 'react-icons/io5'
|
||||
import { ModalCard, modalCardVariants } from 'src/Components/Modals/ModalsContainer/ModalsContainer';
|
||||
import { useAppSelector } from 'src/utils/hooks';
|
||||
import { gql, useMutation, useApolloClient } from "@apollo/client";
|
||||
import useWindowSize from "react-use/lib/useWindowSize";
|
||||
import Confetti from "react-confetti";
|
||||
import { Wallet_Service } from 'src/services';
|
||||
import styles from './style.module.css'
|
||||
import { CONFIRM_VOTE_QUERY, CONFIRM_VOTE_QUERY_RES_TYPE, VOTE_QUERY, VOTE_QUERY_RES_TYPE } from './query';
|
||||
import { useWindowSize } from '@react-hookz/web';
|
||||
|
||||
const defaultOptions = [
|
||||
{ text: '100 sat', value: 100 },
|
||||
|
||||
@@ -17,8 +17,10 @@ export interface Project {
|
||||
export interface ProjectCategory {
|
||||
id: number;
|
||||
title: string;
|
||||
cover_image: string
|
||||
apps_count: number
|
||||
cover_image: string;
|
||||
icon: string;
|
||||
apps_count: number;
|
||||
votes_sum: number;
|
||||
}
|
||||
|
||||
export interface ProjectCard {
|
||||
|
||||
6
src/utils/theme/index.ts
Normal file
6
src/utils/theme/index.ts
Normal file
@@ -0,0 +1,6 @@
|
||||
export * as THEME from './media_queries'
|
||||
|
||||
const THEME = {}
|
||||
|
||||
|
||||
export default THEME;
|
||||
14
src/utils/theme/media_queries.js
Normal file
14
src/utils/theme/media_queries.js
Normal file
@@ -0,0 +1,14 @@
|
||||
export const screens = {
|
||||
sm: 640,
|
||||
md: 768,
|
||||
lg: 1024,
|
||||
xl: 1280,
|
||||
'2xl': 1536,
|
||||
}
|
||||
|
||||
export const MEDIA_QUERIES = {
|
||||
isSmall: `only screen and (min-width : ${screens.sm}px)`,
|
||||
isMedium: `only screen and (min-width : ${screens.md}px)`,
|
||||
isLarge: `only screen and (min-width : ${screens.lg}px)`,
|
||||
isXLarge: `only screen and (min-width : ${screens["2xl"]}px))`,
|
||||
}
|
||||
Reference in New Issue
Block a user