diff --git a/data/Coffee.json b/data/Coffee.json
index 6f432d9..093845f 100644
--- a/data/Coffee.json
+++ b/data/Coffee.json
@@ -182,5 +182,57 @@
"coffee2": "Flat White",
"comparisonDescription": "Macchiato is a strong coffee drink made with espresso and a small amount of milk, while Flat White consists of espresso topped with a thin layer of steamed milk. Macchiato has a high caffeine content and a smaller serving size of 30-60ml, whereas Flat White has a medium caffeine content and a serving size of 180ml."
}
+ ],
+ "coffeebeans": [
+ {
+ "id": 1,
+ "name": "Arabica",
+ "description": "Arabica is the most widely consumed coffee bean variety, known for its smooth, mild, and nuanced flavor profile. It often has sweet, fruity, and floral notes with a hint of acidity, which can range from crisp to wine-like. Arabica beans are grown at high altitudes, typically above 600 meters, and are more susceptible to pests and diseases, making them more expensive. They account for about 60-70% of global coffee production."
+ },
+ {
+ "id": 2,
+ "name": "Robusta",
+ "description": "Robusta beans are known for their strong, bold, and bitter flavor, often described as earthy or nutty with a hint of chocolate. They have nearly double the caffeine content of Arabica, giving them a harsher, more intense taste. Robusta is easier to grow, resistant to pests and diseases, and thrives at lower altitudes, which makes it more affordable. It is commonly used in espresso blends for its crema and in instant coffee."
+ },
+ {
+ "id": 3,
+ "name": "Liberica",
+ "description": "Liberica is a rare variety of coffee bean, known for its unique smoky, woody, and floral flavors, with a somewhat fruity undertone. The beans themselves are irregular in size and shape, which contributes to their distinctive aroma and taste. Liberica is mainly grown in Southeast Asia, particularly in the Philippines, and represents only a small percentage of the world’s coffee production. It is considered an acquired taste due to its bold, unusual flavor profile."
+ },
+ {
+ "id": 4,
+ "name": "Excelsa",
+ "description": "Excelsa is a variety of Liberica, but it has a very different flavor profile, often described as tart and fruity with a more complex, layered taste. It is used primarily in coffee blends to add depth and a mysterious twist to the flavor. Excelsa beans are grown in Southeast Asia and are relatively rare. The beans are smaller and rounder compared to other varieties, and they are often roasted dark to highlight their fruity and wine-like characteristics."
+ },
+ {
+ "id": 5,
+ "name": "Maragogipe",
+ "description": "Maragogipe, also known as 'Elephant Bean' due to its unusually large size, is a mutation of the Arabica bean. It has a mild and delicate flavor with a smooth body and low acidity, often characterized by floral and fruity notes. Maragogipe beans are rare and highly prized, especially in regions like Central and South America, where they are primarily grown."
+ },
+ {
+ "id": 6,
+ "name": "Bourbon",
+ "description": "Bourbon is a variety of Arabica that is cherished for its rich, sweet flavor profile. It often features complex notes of caramel, chocolate, and red fruit. Bourbon beans are known for their high-quality yield and are grown in countries like Brazil, Rwanda, and Burundi. The plant is more susceptible to diseases, which makes its production limited and more costly."
+ },
+ {
+ "id": 7,
+ "name": "Typica",
+ "description": "Typica is one of the oldest and most foundational Arabica varieties. It is known for producing high-quality coffee with clean, sweet flavors, often accompanied by fruity or floral notes. While Typica plants have lower yields compared to other varieties, they are still sought after for their excellent cup quality, particularly in specialty coffee markets."
+ },
+ {
+ "id": 8,
+ "name": "Catuai",
+ "description": "Catuai is a hybrid coffee variety derived from the Mundo Novo and Caturra plants. It is known for its high yields and resistance to wind and weather conditions. Catuai beans typically have a balanced flavor profile, with moderate acidity and sweetness, and are commonly grown in Brazil and Central America."
+ },
+ {
+ "id": 9,
+ "name": "SL28",
+ "description": "SL28 is a coffee variety known for its drought resistance and its ability to produce exceptionally high-quality beans. Originating in Kenya, SL28 is prized for its bright acidity, juicy fruit notes, and rich body. The flavor is often complex, with citrus, berry, and wine-like characteristics. It is a favorite among specialty coffee producers."
+ },
+ {
+ "id": 10,
+ "name": "Geisha",
+ "description": "Geisha (or Gesha) is one of the most expensive and sought-after coffee varieties, known for its exceptional and complex flavor profile. Originating from Ethiopia and now grown in countries like Panama, Geisha beans are famous for their floral aroma, vibrant acidity, and unique tasting notes that include jasmine, tropical fruit, and bergamot. Geisha beans have won numerous awards in coffee competitions and are considered a luxury among coffee connoisseurs."
+ }
]
}
diff --git a/package.json b/package.json
index e5f5a66..8f2effb 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
"@emotion/react": "^11.13.3",
"@emotion/styled": "^11.13.0",
"@reduxjs/toolkit": "^2.3.0",
+ "axios": "^1.7.7",
"framer-motion": "^11.5.4",
"json-server": "1.0.0-beta.1",
"path": "^0.12.7",
@@ -27,6 +28,7 @@
"react-dom": "^18.3.1",
"react-redux": "^9.1.2",
"react-router-dom": "^6.25.1",
+ "swiper": "^11.1.14",
"typescript-eslint": "^7.17.0"
},
"devDependencies": {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 334d1c9..a5fb715 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -23,6 +23,9 @@ importers:
'@reduxjs/toolkit':
specifier: ^2.3.0
version: 2.3.0(react-redux@9.1.2(@types/react@18.3.5)(react@18.3.1)(redux@5.0.1))(react@18.3.1)
+ axios:
+ specifier: ^1.7.7
+ version: 1.7.7
framer-motion:
specifier: ^11.5.4
version: 11.5.4(@emotion/is-prop-valid@1.3.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -50,6 +53,9 @@ importers:
react-router-dom:
specifier: ^6.25.1
version: 6.26.2(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+ swiper:
+ specifier: ^11.1.14
+ version: 11.1.14
typescript-eslint:
specifier: ^7.17.0
version: 7.18.0(eslint@8.57.0)(typescript@5.6.2)
@@ -2074,6 +2080,9 @@ packages:
ast-types-flow@0.0.8:
resolution: {integrity: sha512-OH/2E5Fg20h2aPrbe+QL8JZQFko0YZaF+j4mnQ7BGhfavO7OpSLa8a0y9sBwomHdSbkhTS8TQNayBfnW5DwbvQ==}
+ asynckit@0.4.0:
+ resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==}
+
autoprefixer@10.4.20:
resolution: {integrity: sha512-XY25y5xSv/wEoqzDyXXME4AFfkZI0P23z6Fs3YgymDnKJkCGOnkL0iTxCa85UTqaSgfcqyf3UA6+c7wUvx/16g==}
engines: {node: ^10 || ^12 || >=14}
@@ -2089,6 +2098,9 @@ packages:
resolution: {integrity: sha512-Mr2ZakwQ7XUAjp7pAwQWRhhK8mQQ6JAaNWSjmjxil0R8BPioMtQsTLOolGYkji1rcL++3dCqZA3zWqpT+9Ew6g==}
engines: {node: '>=4'}
+ axios@1.7.7:
+ resolution: {integrity: sha512-S4kL7XrjgBmvdGut0sN3yJxqYzrDOnivkBiN0OFs6hLiUam3UPvswUo0kqGyhqUZGEOytHyumEdXsAkgCOUf3Q==}
+
axobject-query@4.1.0:
resolution: {integrity: sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==}
engines: {node: '>= 0.4'}
@@ -2187,6 +2199,10 @@ packages:
color2k@2.0.3:
resolution: {integrity: sha512-zW190nQTIoXcGCaU08DvVNFTmQhUpnJfVuAKfWqUQkflXKpaDdpaYoM0iluLS9lgJNHyBF58KKA2FBEwkD7wog==}
+ combined-stream@1.0.8:
+ resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==}
+ engines: {node: '>= 0.8'}
+
commander@4.1.1:
resolution: {integrity: sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==}
engines: {node: '>= 6'}
@@ -2278,6 +2294,10 @@ packages:
resolution: {integrity: sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==}
engines: {node: '>= 0.4'}
+ delayed-stream@1.0.0:
+ resolution: {integrity: sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==}
+ engines: {node: '>=0.4.0'}
+
detect-node-es@1.1.0:
resolution: {integrity: sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ==}
@@ -2584,6 +2604,15 @@ packages:
resolution: {integrity: sha512-QFaHbhv9WPUeLYBDe/PAuLKJ4Dd9OPvKs9xZBr3yLXnUrDNaVXKu2baDBXe3naPY30hgHYSsf2JW4jzas2mDEQ==}
engines: {node: '>=10'}
+ follow-redirects@1.15.9:
+ resolution: {integrity: sha512-gew4GsXizNgdoRyqmyfMHyAmXsZDk6mHkSxZFCzW9gwlbtOW44CDtYavM+y+72qD/Vq2l550kMF52DT8fOLJqQ==}
+ engines: {node: '>=4.0'}
+ peerDependencies:
+ debug: '*'
+ peerDependenciesMeta:
+ debug:
+ optional: true
+
for-each@0.3.3:
resolution: {integrity: sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==}
@@ -2591,6 +2620,10 @@ packages:
resolution: {integrity: sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==}
engines: {node: '>=14'}
+ form-data@4.0.1:
+ resolution: {integrity: sha512-tzN8e4TX8+kkxGPK8D5u0FNmjPUjw3lwC9lSLxxoB/+GtsJG91CO8bSWy73APlgAZzZbXEYZJuxjkHH2w+Ezhw==}
+ engines: {node: '>= 6'}
+
fraction.js@4.3.7:
resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==}
@@ -3015,6 +3048,14 @@ packages:
resolution: {integrity: sha512-b+6KYJw+DwQjk24qCUuq+lZvRXDpXJ02qsllKgKaDurHpQ0v7D5op9VAkdYM/pXRhFeh7uLYHmnwFnYvdXGa3A==}
engines: {node: '>=12.4'}
+ mime-db@1.52.0:
+ resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
+ engines: {node: '>= 0.6'}
+
+ mime-types@2.1.35:
+ resolution: {integrity: sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==}
+ engines: {node: '>= 0.6'}
+
mime@4.0.4:
resolution: {integrity: sha512-v8yqInVjhXyqP6+Kw4fV3ZzeMRqEW6FotRsKXjRS5VMTNIuXsdRoAvklpoRgSqXm6o9VNH4/C0mgedko9DdLsQ==}
engines: {node: '>=16'}
@@ -3247,6 +3288,9 @@ packages:
prop-types@15.8.1:
resolution: {integrity: sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==}
+ proxy-from-env@1.1.0:
+ resolution: {integrity: sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==}
+
punycode@2.3.1:
resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==}
engines: {node: '>=6'}
@@ -3580,6 +3624,10 @@ packages:
resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
engines: {node: '>= 0.4'}
+ swiper@11.1.14:
+ resolution: {integrity: sha512-VbQLQXC04io6AoAjIUWuZwW4MSYozkcP9KjLdrsG/00Q/yiwvhz9RQyt0nHXV10hi9NVnDNy1/wv7Dzq1lkOCQ==}
+ engines: {node: '>= 4.7.0'}
+
synckit@0.9.1:
resolution: {integrity: sha512-7gr8p9TQP6RAHusBOSLs46F4564ZrjV8xFmw5zCmgmhGUcw2hxsShhJ6CEiHQMgPDwAQ1fWHPM0ypc4RMAig4A==}
engines: {node: ^14.18.0 || >=16.0.0}
@@ -6246,6 +6294,8 @@ snapshots:
ast-types-flow@0.0.8: {}
+ asynckit@0.4.0: {}
+
autoprefixer@10.4.20(postcss@8.4.47):
dependencies:
browserslist: 4.23.3
@@ -6262,6 +6312,14 @@ snapshots:
axe-core@4.10.0: {}
+ axios@1.7.7:
+ dependencies:
+ follow-redirects: 1.15.9
+ form-data: 4.0.1
+ proxy-from-env: 1.1.0
+ transitivePeerDependencies:
+ - debug
+
axobject-query@4.1.0: {}
babel-plugin-macros@3.1.0:
@@ -6395,6 +6453,10 @@ snapshots:
color2k@2.0.3: {}
+ combined-stream@1.0.8:
+ dependencies:
+ delayed-stream: 1.0.0
+
commander@4.1.1: {}
compute-scroll-into-view@3.0.3: {}
@@ -6500,6 +6562,8 @@ snapshots:
has-property-descriptors: 1.0.2
object-keys: 1.1.1
+ delayed-stream@1.0.0: {}
+
detect-node-es@1.1.0: {}
didyoumean@1.2.2: {}
@@ -6963,6 +7027,8 @@ snapshots:
dependencies:
tslib: 2.7.0
+ follow-redirects@1.15.9: {}
+
for-each@0.3.3:
dependencies:
is-callable: 1.2.7
@@ -6972,6 +7038,12 @@ snapshots:
cross-spawn: 7.0.3
signal-exit: 4.1.0
+ form-data@4.0.1:
+ dependencies:
+ asynckit: 0.4.0
+ combined-stream: 1.0.8
+ mime-types: 2.1.35
+
fraction.js@4.3.7: {}
framer-motion@11.5.4(@emotion/is-prop-valid@1.3.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
@@ -7371,6 +7443,12 @@ snapshots:
milliparsec@2.3.0: {}
+ mime-db@1.52.0: {}
+
+ mime-types@2.1.35:
+ dependencies:
+ mime-db: 1.52.0
+
mime@4.0.4: {}
minimatch@3.1.2:
@@ -7573,6 +7651,8 @@ snapshots:
object-assign: 4.1.1
react-is: 16.13.1
+ proxy-from-env@1.1.0: {}
+
punycode@2.3.1: {}
queue-microtask@1.2.3: {}
@@ -7944,6 +8024,8 @@ snapshots:
supports-preserve-symlinks-flag@1.0.0: {}
+ swiper@11.1.14: {}
+
synckit@0.9.1:
dependencies:
'@pkgr/core': 0.1.1
diff --git a/src/Assets/css/index.css b/src/Assets/css/index.css
index 4448281..412b762 100644
--- a/src/Assets/css/index.css
+++ b/src/Assets/css/index.css
@@ -6,6 +6,12 @@
@tailwind components;
@tailwind utilities;
+.swiper-slide {
+ display: flex; /* Center content within the slide */
+ align-items: center; /* Vertically center */
+ justify-content: center; /* Horizontally center */
+ height: 100%; /* Make slides fill the container height */
+}
a {
padding: 0;
}
diff --git a/src/Views/Footer/Footer.tsx b/src/Views/Footer/Footer.tsx
index d3827b3..a11a400 100644
--- a/src/Views/Footer/Footer.tsx
+++ b/src/Views/Footer/Footer.tsx
@@ -2,14 +2,8 @@ import "@public/logo/logo.svg";
import IdMaker from "./Footer_id_maker";
import { useTranslation } from "react-i18next";
-// Just for test the store
-import { useAppSelector, useAppDispatch } from "@/Hooks/hook";
-import { increment, decrement } from "@/State/example";
-
const Footer = () => {
// just for test
- const count = useAppSelector((state: any) => state.counter.value);
- const dispatch = useAppDispatch();
const { t } = useTranslation();
const developers = [
@@ -28,13 +22,6 @@ const Footer = () => {
];
return (
<>
-