Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Terms of Service popup added (Closes #129) #130

Open
wants to merge 1 commit into
base: dev
Choose a base branch
from
Open

Terms of Service popup added (Closes #129) #130

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 16 additions & 11 deletions src/components/Footer/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import remarkGfm from "remark-gfm";
import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
import PrivacyPolicyPopup from "../Privacy";
import LegalNoticePopup from "../LegalNotice";
import TermService from "../TermsOfService";

const Footer = () => {
const [privacyPolicy, setPrivacyPolicy] = useState("");
Expand All @@ -15,6 +16,7 @@ const Footer = () => {
const [popupContent, setPopupContent] = useState("");
const [isPopupOpenprivacy, setIsPopupOpenprivacy] = useState<boolean>(false);
const [isPopupOpenlegal, setIsPopupOpenlegal] = useState<boolean>(false);
const [isPopupOpenterms, setIsPopupOpenterms] = useState<boolean>(false);
useEffect(() => {
const fetchContent = async () => {
try {
Expand Down Expand Up @@ -248,12 +250,12 @@ const Footer = () => {
</button>
</li>
<li>
<a
href="/#footer"
<button
onClick={() => setIsPopupOpenterms(true)}
className="mb-3 inline-block text-base text-gray-7 hover:text-primary"
>
Terms of Service
</a>
</button>
</li>
</ul>
</div>
Expand Down Expand Up @@ -352,23 +354,26 @@ const Footer = () => {
>
Legal notice
</button>
<a
href="#"
onClick={(e) => {
e.preventDefault();
openPopup(termsOfService);
}}
<button
onClick={() => setIsPopupOpenterms(true)}
className="px-3 text-base text-gray-7 hover:text-white hover:underline"
>
Terms of service
</a>
</button>
</div>
</div>
<PrivacyPolicyPopup
isOpen={isPopupOpenprivacy}
onClose={() => setIsPopupOpenprivacy(false)}
/>
<LegalNoticePopup isOpen={isPopupOpenlegal} onClose={()=> setIsPopupOpenlegal(false)}/>
<TermService
isOpen={isPopupOpenterms}
onClose={() => setIsPopupOpenterms(false)}
/>
<LegalNoticePopup
isOpen={isPopupOpenlegal}
onClose={() => setIsPopupOpenlegal(false)}
/>
{/* Popup Modal */}
{isPopupOpen && (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-gray-900 bg-opacity-60">
Expand Down
287 changes: 287 additions & 0 deletions src/components/TermsOfService/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,287 @@
import React from "react";

interface TermServiceProps {
isOpen: boolean;
onClose: () => void;
}

const TermService: React.FC<TermServiceProps> = ({ isOpen, onClose }) => {
if (!isOpen) return null; // Prevent rendering when not open

return (
<div className="fixed inset-0 flex items-center justify-center bg-gray-800 bg-opacity-50">
<div className="relative w-full max-w-3xl rounded-lg bg-white shadow-lg">
{/* Close Button */}
<button
onClick={onClose}
className="absolute right-3 top-3 rounded-full bg-gray-200 p-2 text-gray-500 hover:text-gray-800"
aria-label="Close Terms of Service"
>
×
</button>

{/* Scrollable Content */}
<div className="max-h-[80vh] overflow-y-auto p-8 pt-12">
<h2 className="mb-4 text-2xl font-bold text-indigo-600">
Terms of Service for DevRhylme Foundation
</h2>

<p className="text-gray-700">
Welcome to Devrhylme.org. These Terms of Service ("Terms") govern
your access to and use of Devrhylme.org ("the Website"), operated by
Devrhylme.org, a non-profit organization dedicated to [Insert
Mission Statement]. By accessing or using the Website, you agree to
be bound by these Terms. If you do not agree with any part of these
Terms, you must not use the Website.
</p>

<h3 className="mb-2 mt-6 text-lg font-semibold text-indigo-600">
1. Use of the Website
</h3>

<h4 className="text-md mt-4 font-semibold text-gray-800">
1.1 Eligibility
</h4>
<ul className="list-disc pl-5 text-gray-700">
<li>
Be at least 18 years of age or have the consent of a legal
guardian.
</li>
<li>Comply with all applicable laws and regulations.</li>
</ul>

<h4 className="text-md mt-4 font-semibold text-gray-800">
1.2 Permitted Use
</h4>
<p className="text-gray-700">
You may use the Website for lawful purposes only. Prohibited
activities include but are not limited to:
</p>
<ul className="list-disc pl-5 text-gray-700">
<li>
Copying, reproducing, or distributing Website content without
explicit permission.
</li>
<li>
Introducing or distributing malicious software, such as viruses,
worms, or spyware.
</li>
<li>
Attempting to gain unauthorized access to the Website, its
systems, or data.
</li>
<li>Misrepresenting your identity or affiliation.</li>
<li>
Engaging in activities that could damage the reputation of
Devrhylme.org or its community.
</li>
</ul>
<h4 className="text-md mt-4 font-semibold text-gray-800">
1.3 Access Restrictions
</h4>
<p className="text-gray-700">
We reserve the right to restrict, suspend, or terminate access to
the Website for any user who violates these Terms or engages in
harmful behavior.
</p>

<h3 className="mb-2 mt-6 text-lg font-semibold text-indigo-600">
2. Account Registration
</h3>

<h4 className="text-md mt-4 font-semibold text-gray-800">
2.1 Account Creation
</h4>
<p className="text-gray-700">
Certain features of the Website may require you to create an
account. By creating an account, you agree to:
</p>
<ul className="list-disc pl-5 text-gray-700">
<li>Provide accurate, current, and complete information.</li>
<li>Update your account details promptly if they change.</li>
</ul>

<h4 className="text-md mt-4 font-semibold text-gray-800">
2.2 Security Responsibilities
</h4>
<ul className="list-disc pl-5 text-gray-700">
<li>
Maintaining the confidentiality of your account credentials.
</li>
<li>
Notifying us immediately of any unauthorized use of your account.
</li>
<li>Using secure passwords and safeguarding your login details.</li>
</ul>

<h3 className="mb-2 mt-6 text-lg font-semibold text-indigo-600">
3. Donations and Payments
</h3>

<h4 className="text-md mt-4 font-semibold text-gray-800">
3.1 Donations
</h4>
<ul className="list-disc pl-5 text-gray-700">
<li>
You confirm that the funds are your own or that you have
authorization to use them.{" "}
</li>
<li>
Donations are non-refundable unless explicitly stated otherwise.{" "}
</li>
</ul>
<h4 className="text-md mt-4 font-semibold text-gray-800">
3.2 Payment Methods
</h4>
<p className="text-gray-700">
Payments are processed through secure third-party services. While we
strive to ensure security, Devrhylme.org is not responsible for
issues arising from these payment processors.
</p>
<h4 className="text-md mt-4 font-semibold text-gray-800">
3.2 Tax Exemptions
</h4>
<p className="text-gray-700">
As a non-profit organization, donations to Devrhylme.org may be
tax-deductible in certain jurisdictions. Consult your tax advisor
for details.
</p>

<h3 className="mb-2 mt-6 text-lg font-semibold text-indigo-600">
4. Intellectual Property
</h3>
<h4 className="text-md mt-4 font-semibold text-gray-800">
4.1 Ownership
</h4>
<p className="text-gray-700">
All intellectual property, including text, images, designs, and
code, is owned by or licensed to Devrhylme.org. Unauthorized use,
reproduction, or distribution is strictly prohibited.
</p>
<h4 className="text-md mt-4 font-semibold text-gray-800">
4.2 User Contributions
</h4>
<p className="text-gray-700">
By submitting content (e.g., comments, feedback, suggestions) to the
Website, you grant Devrhylme.org a perpetual, non-exclusive,
royalty-free license to use, modify, and distribute the content for
any purpose, with or without attribution.
</p>
<h3 className="mb-2 mt-6 text-lg font-semibold text-indigo-600">
5. Privacy
</h3>
<p className="text-gray-700">
Your use of the Website is subject to our Privacy Policy , which
outlines how we collect, store, and use your personal information.
</p>

<h3 className="mb-2 mt-6 text-lg font-semibold text-indigo-600">
6. Disclaimers and Limitation of Liability
</h3>
<h4 className="text-md mt-4 font-semibold text-gray-800">
6.1 Disclaimer of Warranties
</h4>
<p className="text-gray-700">
The Website and its content are provided "as is" and "as available"
without any warranties of any kind, express or implied. This
includes but is not limited to:
</p>
<ul className="list-disc pl-5 text-gray-700">
<li>The accuracy or completeness of information provided.</li>
<li>
The availability of the Website or its uninterrupted
functionality.
</li>
</ul>

<h4 className="text-md mt-4 font-semibold text-gray-800">
6.2 Limitation of Liability
</h4>
<p className="text-gray-700">
To the fullest extent permitted by law, Devrhylme.org is not liable
for:
</p>
<ul className="list-disc pl-5 text-gray-700">
<li>Indirect, incidental, or consequential damages.</li>
<li>
Loss of data, revenue, or profits arising from your use of the
Website.
</li>
<li>
Third-party content or services accessed through the Website.
</li>
</ul>

<h3 className="mb-2 mt-6 text-lg font-semibold text-indigo-600">
7. Termination
</h3>
<h4 className="text-md mt-4 font-semibold text-gray-800">
7.1 Limitation of Liability
</h4>
<p className="text-gray-700">
We reserve the right to terminate or suspend your access to the
Website, with or without notice, for any reason, including but not
limited to:
</p>
<ul className="list-disc pl-5 text-gray-700">
<li>Violations of these Terms. .</li>
<li>Fraudulent or harmful activity.</li>
</ul>
<h4 className="text-md mt-4 font-semibold text-gray-800">
7.2 Effect of Termination
</h4>
<p className="text-gray-700">
Upon termination, your right to access the Website and its services
ceases immediately. Any data or content you provided may be retained
or deleted at our discretion.
</p>

<h3 className="mb-2 mt-6 text-lg font-semibold text-indigo-600">
8. Governing Law
</h3>
<p className="text-gray-700">
These Terms and any disputes arising from your use of the Website
are governed by the laws of [Insert Jurisdiction].
</p>

<h3 className="mb-2 mt-6 text-lg font-semibold text-indigo-600">
9. Changes to These Terms
</h3>
<p className="text-gray-700">
Devrhylme.org reserves the right to update or modify these Terms at
any time.
</p>

<h3 className="mb-2 mt-6 text-lg font-semibold text-indigo-600">
10. Contact Information
</h3>
<p className="text-gray-700">
If you have questions or concerns about these Terms, please contact
us:
</p>
<p className="font-semibold text-gray-700">
Email:{" "}
<a href="mailto:contact@devrhylme.org" className="text-indigo-600">
contact@devrhylme.org
</a>
</p>
<p className="font-semibold text-gray-700">
Address: 3A, Tilak Marg Road, Lucknow, Uttar Pradesh
</p>

{/* Accept Button */}
<div className="mt-6 flex justify-end">
<button
onClick={onClose}
className="rounded-lg bg-indigo-600 px-6 py-2 text-white hover:bg-indigo-700"
>
Accept & Continue
</button>
</div>
</div>
</div>
</div>
);
};

export default TermService;
Loading