diff --git a/client/package-lock.json b/client/package-lock.json index e82c2d7..fce8b84 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -19,7 +19,8 @@ "react-dom": "18.0.0", "react-scroll": "^1.8.7", "react-slick": "^0.29.0", - "slick-carousel": "^1.8.1" + "slick-carousel": "^1.8.1", + "styled-components": "^6.1.11" }, "devDependencies": { "@types/node": "17.0.25", @@ -1019,6 +1020,11 @@ "integrity": "sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ==", "dev": true }, + "node_modules/@types/stylis": { + "version": "4.2.5", + "resolved": "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.5.tgz", + "integrity": "sha512-1Xve+NMN7FWjY14vLoY5tL3BVEQ/n42YLwaqJIPYhotZ9uBHt87VceMwWQpzmdEt2TNXIorIFG+YeCUUW7RInw==" + }, "node_modules/@typescript-eslint/eslint-plugin": { "version": "5.62.0", "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.62.0.tgz", @@ -1520,6 +1526,14 @@ "node": ">=6" } }, + "node_modules/camelize": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/camelize/-/camelize-1.0.1.tgz", + "integrity": "sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ==", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/caniuse-lite": { "version": "1.0.30001617", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001617.tgz", @@ -1642,6 +1656,24 @@ "node": ">= 8" } }, + "node_modules/css-color-keywords": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz", + "integrity": "sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==", + "engines": { + "node": ">=4" + } + }, + "node_modules/css-to-react-native": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-3.2.0.tgz", + "integrity": "sha512-e8RKaLXMOFii+02mOlqwjbD00KSEKqblnpO9e++1aXS1fPQOpS1YoqdVHBqPjHNoxeF2mimzVqawm2KCbEdtHQ==", + "dependencies": { + "camelize": "^1.0.0", + "css-color-keywords": "^1.0.0", + "postcss-value-parser": "^4.0.2" + } + }, "node_modules/csstype": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", @@ -3988,6 +4020,11 @@ "url": "https://opencollective.com/postcss/" } }, + "node_modules/postcss-value-parser": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", + "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==" + }, "node_modules/prelude-ls": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz", @@ -4366,6 +4403,11 @@ "node": ">= 0.4" } }, + "node_modules/shallowequal": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz", + "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==" + }, "node_modules/shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -4556,6 +4598,70 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/styled-components": { + "version": "6.1.11", + "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-6.1.11.tgz", + "integrity": "sha512-Ui0jXPzbp1phYij90h12ksljKGqF8ncGx+pjrNPsSPhbUUjWT2tD1FwGo2LF6USCnbrsIhNngDfodhxbegfEOA==", + "dependencies": { + "@emotion/is-prop-valid": "1.2.2", + "@emotion/unitless": "0.8.1", + "@types/stylis": "4.2.5", + "css-to-react-native": "3.2.0", + "csstype": "3.1.3", + "postcss": "8.4.38", + "shallowequal": "1.1.0", + "stylis": "4.3.2", + "tslib": "2.6.2" + }, + "engines": { + "node": ">= 16" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/styled-components" + }, + "peerDependencies": { + "react": ">= 16.8.0", + "react-dom": ">= 16.8.0" + } + }, + "node_modules/styled-components/node_modules/postcss": { + "version": "8.4.38", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz", + "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==", + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "tidelift", + "url": "https://tidelift.com/funding/github/npm/postcss" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "dependencies": { + "nanoid": "^3.3.7", + "picocolors": "^1.0.0", + "source-map-js": "^1.2.0" + }, + "engines": { + "node": "^10 || ^12 || >=14" + } + }, + "node_modules/styled-components/node_modules/stylis": { + "version": "4.3.2", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.3.2.tgz", + "integrity": "sha512-bhtUjWd/z6ltJiQwg0dUfxEJ+W+jdqQd8TbWLWyeIJHlnsqmGLRFFd8e5mA0AZi/zx90smXRlN66YMTcaSFifg==" + }, + "node_modules/styled-components/node_modules/tslib": { + "version": "2.6.2", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", + "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" + }, "node_modules/styled-jsx": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/styled-jsx/-/styled-jsx-5.0.1.tgz", @@ -5539,6 +5645,11 @@ "integrity": "sha512-I8EUhyrgfLrcTkzV3TSsGyl1tSuPrEDzr0yd5m90UgNxQkyDXULk3b6MlQqTCpZpNtWe1K0hzclnZkTcLBe2UQ==", "dev": true }, + "@types/stylis": { + "version": "4.2.5", + "resolved": "https://registry.npmjs.org/@types/stylis/-/stylis-4.2.5.tgz", + "integrity": "sha512-1Xve+NMN7FWjY14vLoY5tL3BVEQ/n42YLwaqJIPYhotZ9uBHt87VceMwWQpzmdEt2TNXIorIFG+YeCUUW7RInw==" + }, "@typescript-eslint/eslint-plugin": { "version": "5.62.0", "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.62.0.tgz", @@ -5863,6 +5974,11 @@ "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz", "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==" }, + "camelize": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/camelize/-/camelize-1.0.1.tgz", + "integrity": "sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ==" + }, "caniuse-lite": { "version": "1.0.30001617", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001617.tgz", @@ -5948,6 +6064,21 @@ "which": "^2.0.1" } }, + "css-color-keywords": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/css-color-keywords/-/css-color-keywords-1.0.0.tgz", + "integrity": "sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==" + }, + "css-to-react-native": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-3.2.0.tgz", + "integrity": "sha512-e8RKaLXMOFii+02mOlqwjbD00KSEKqblnpO9e++1aXS1fPQOpS1YoqdVHBqPjHNoxeF2mimzVqawm2KCbEdtHQ==", + "requires": { + "camelize": "^1.0.0", + "css-color-keywords": "^1.0.0", + "postcss-value-parser": "^4.0.2" + } + }, "csstype": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", @@ -7684,6 +7815,11 @@ "source-map-js": "^1.0.1" } }, + "postcss-value-parser": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", + "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==" + }, "prelude-ls": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz", @@ -7947,6 +8083,11 @@ "has-property-descriptors": "^1.0.2" } }, + "shallowequal": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz", + "integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==" + }, "shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -8081,6 +8222,44 @@ "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==", "dev": true }, + "styled-components": { + "version": "6.1.11", + "resolved": "https://registry.npmjs.org/styled-components/-/styled-components-6.1.11.tgz", + "integrity": "sha512-Ui0jXPzbp1phYij90h12ksljKGqF8ncGx+pjrNPsSPhbUUjWT2tD1FwGo2LF6USCnbrsIhNngDfodhxbegfEOA==", + "requires": { + "@emotion/is-prop-valid": "1.2.2", + "@emotion/unitless": "0.8.1", + "@types/stylis": "4.2.5", + "css-to-react-native": "3.2.0", + "csstype": "3.1.3", + "postcss": "8.4.38", + "shallowequal": "1.1.0", + "stylis": "4.3.2", + "tslib": "2.6.2" + }, + "dependencies": { + "postcss": { + "version": "8.4.38", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz", + "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==", + "requires": { + "nanoid": "^3.3.7", + "picocolors": "^1.0.0", + "source-map-js": "^1.2.0" + } + }, + "stylis": { + "version": "4.3.2", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.3.2.tgz", + "integrity": "sha512-bhtUjWd/z6ltJiQwg0dUfxEJ+W+jdqQd8TbWLWyeIJHlnsqmGLRFFd8e5mA0AZi/zx90smXRlN66YMTcaSFifg==" + }, + "tslib": { + "version": "2.6.2", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz", + "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q==" + } + } + }, "styled-jsx": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/styled-jsx/-/styled-jsx-5.0.1.tgz", diff --git a/client/package.json b/client/package.json index 3545f8f..0a41bc3 100644 --- a/client/package.json +++ b/client/package.json @@ -20,7 +20,8 @@ "react-dom": "18.0.0", "react-scroll": "^1.8.7", "react-slick": "^0.29.0", - "slick-carousel": "^1.8.1" + "slick-carousel": "^1.8.1", + "styled-components": "^6.1.11" }, "devDependencies": { "@types/node": "17.0.25", diff --git a/client/src/components/footer/footer-navigation.tsx b/client/src/components/footer/footer-navigation.tsx index 84a6c93..8139277 100644 --- a/client/src/components/footer/footer-navigation.tsx +++ b/client/src/components/footer/footer-navigation.tsx @@ -24,7 +24,7 @@ const pageMenu: Array = [ const companyMenu: Array = [ { label: 'Contact Us', path: '#' }, { label: 'Privacy & Policy', path: '#' }, - { label: 'Term & Condition', path: '#' }, + { label: 'Term & Conditions', path: 'terms-and-conditions' }, { label: 'FAQ', path: '#' }, ] @@ -35,6 +35,7 @@ interface NavigationItemProps { const NavigationItem: FC = ({ label, path }) => { return ( + { + return ( + + + + + <span style={{ color: 'black' }}>Big</span> + <span style={{ color: '#17A589' }}>Ohhh</span> + <span style={{ color: 'black', fontSize:'18px' }}> / Terms and Conditions</span> + + +

Terms and Conditions

+
+

Last Updated: 18 May 2024

+

+ Welcome to BigOhhh! These terms and conditions outline the rules and regulations for the use of our website. + By accessing this website we assume you accept these terms and conditions. Do not continue to use BigOhhh if + you do not agree to take all of the terms and conditions stated on this page. +

+
+
+

Intellectual Property Rights

+

+ Other than the content you own, under these Terms, BigOhhh and/or its licensors own all the intellectual + property rights and materials contained in this Website. You are granted limited license only for purposes of + viewing the material contained on this Website. +

+
+
+

Restrictions

+

You are specifically restricted from all of the following:

+
    +
  • Publishing any Website material in any other media;
    • +
  • Selling, sublicensing and/or otherwise commercializing any Website material;
    • +
  • Publicly performing and/or showing any Website material;
    • +
  • Using this Website in any way that is or may be damaging to this Website;
    • +
  • Using this Website in any way that impacts user access to this Website;
    • +
  • Using this Website contrary to applicable laws and regulations, or in any way may cause harm to the Website, or to any person or business entity;
    • +
  • Engaging in any data mining, data harvesting, data extracting or any other similar activity in relation to this Website;
    • +
  • Using this Website to engage in any advertising or marketing.
    • +
+
+
+

Your Content

+

+ In these Website Standard Terms and Conditions, “Your Content” shall mean any audio, video text, images or + other material you choose to display on this Website. By displaying Your Content, you grant BigOhhh a + non-exclusive, worldwide irrevocable, sub-licensable license to use, reproduce, adapt, publish, translate and + distribute it in any and all media. +

+
+
+

No warranties

+

+ This Website is provided “as is,” with all faults, and BigOhhh express no representations or warranties, of any + kind related to this Website or the materials contained on this Website. Also, nothing contained on this + Website shall be interpreted as advising you. +

+
+
+

Limitation of liability

+

+ In no event shall BigOhhh, nor any of its officers, directors and employees, be held liable for anything + arising out of or in any way connected with your use of this Website whether such liability is under contract. + BigOhhh, including its officers, directors and employees shall not be held liable for any indirect, + consequential or special liability arising out of or in any way related to your use of this Website. +

+
+
+

Indemnification

+

+ You hereby indemnify to the fullest extent BigOhhh from and against any and/or all liabilities, costs, demands, + causes of action, damages and expenses arising in any way related to your breach of any of the provisions of + these Terms. +

+
+
+

Severability

+

+ If any provision of these Terms is found to be invalid under any applicable law, such provisions shall be + deleted without affecting the remaining provisions herein. +

+
+
+

Variation of Terms

+

+ BigOhhh is permitted to revise these Terms at any time as it sees fit, and by using this Website you are + expected to review these Terms on a regular basis. +

+
+
+

Assignment

+

+ The BigOhhh is allowed to assign, transfer, and subcontract its rights and/or obligations under these Terms + without any notification. However, you are not allowed to assign, transfer, or subcontract any of your rights + and/or obligations under these Terms. +

+
+
+

Entire Agreement

+

+ These Terms constitute the entire agreement between BigOhhh and you in relation to your use of this Website, + and supersede all prior agreements and understandings. +

+
+
+

Governing Law

+

+ These Terms will be governed by and interpreted in accordance with the laws of the State of [Your State], and + you submit to the non-exclusive jurisdiction of the state and federal courts located in [Your State] for the + resolution of any disputes. +

+ +
+ + + + + ); +}; + +const Container = styled.div` + display: flex; + flex-direction: column; + min-height: 100vh; + padding: 20px; + max-width: 800px; + margin: 0 auto; + color: #333; + padding-bottom: 60px; +`; + + + +const Title = styled.h1` + font-size: 2.5rem; + margin-bottom: 20px; + text-align: left; + color: #17A589` + ; + +const Section = styled.section` + margin-bottom: 20px; + + h2 { + font-size: 1.5rem; + margin-bottom: 10px; + } + + p, ul { + font-size: 1rem; + margin-bottom: 10px; + } + + ul { + padding-left: 20px; + + li { + margin-bottom: 5px; + } + } +`; + +const Footer = styled.footer` + text-align: center; + width: 100%; + background-color: #17A589; + color: white; + position: fixed; + left: 0; + bottom: 0; +`; + +const FooterContent = styled.div` + max-width: 800px; + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; +`; + +const FooterLinks = styled.div` + display: flex; + gap: 20px; + + a { + color: white; + text-decoration: none; + + &:hover { + text-decoration: underline; + } + } +`; + +export default TermsAndConditions; \ No newline at end of file