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

enhanced the terms and conditions page #1267

Merged
merged 9 commits into from
Jul 26, 2024
Merged

enhanced the terms and conditions page #1267

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
7c5e06a
enhanced the terms and conditions page
ayush-848 Jul 26, 2024
ffd4d34
u1
ayush-848 Jul 26, 2024
9c4494a
u2
ayush-848 Jul 26, 2024
881e4d6
u3
ayush-848 Jul 26, 2024
acb00aa
updated color
ayush-848 Jul 26, 2024
f36b707
updated color
ayush-848 Jul 26, 2024
fb96f37
color
ayush-848 Jul 26, 2024
ac62834
color
ayush-848 Jul 26, 2024
7bfc46c
Removed animations
ayush-848 Jul 26, 2024
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
249 changes: 128 additions & 121 deletions src/components/Terms/Terms.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,123 +1,130 @@
.privacy-page {
font-family: 'Poppins', sans-serif;
background-color: #f5f7fa;
min-height: 100vh;
display: flex;
flex-direction: column;
}

.privacy-policy-container {
max-width: 1200px;
margin: 2rem auto;
padding: 3rem;
background-color: #ffffff;
border-radius: 12px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
flex-grow: 1;
}

.privacy-policy-container h1,h2,h3 {
font-family: 'ABeeZee',sans-serif;
}
.privacy-policy-container p,li{
font-family: 'Poppins',sans-serif;
}

.breadcrumb {
display: flex;
align-items: center;
padding: 1rem 0;
font-size: 1rem;
color: #333;
font-size: 22px;
}
.terms-container .contents p{
display: flex;
align-items: center;
padding: 1rem 0;
font-size: 24px;
color: #333;
margin-bottom: 2rem;
}

.breadcrumb-item {
color: #007bff;
text-decoration: none;
margin-right: 0.5rem;
}

.breadcrumb-separator {
margin-right: 0.5rem;
color: #555;
}

.breadcrumb-item.active {
color: #6c757d;
cursor: default;
}

.privacy-policy-container h1 {
font-size: 40px;
text-align: center;
margin-bottom: 2rem;
color: #12229d;
}

.privacy-policy-container h2 {
color: #0d6fd7;
font-size: 30px;
margin-top: 3rem;
margin-bottom: 1.5rem;
}

.privacy-policy-container h3 {
color: #0d6fd7;
font-size: 28px;
margin-top: 2rem;
margin-bottom: 1rem;
}

.privacy-policy-container p {
font-size: 18px;
margin-bottom: 1.5rem;
color: #333;
line-height: 1.8;
text-align: justify;
}
.terms-container .contents ul{
margin-top: 30px !important;
}
.terms-container .contents li{
line-height-step: 2;
}
#dark p, #dark h1, #dark li{
color: white ;
}
#dark .terms-container h2{
color: #60a4ee !important;
}
#dark .terms-container h1{
color: #4491e4 !important;
}
.terms-container #cookies{
margin-top: 50px;
}
.terms-container #cookies p{
margin-top: 20px;
}
.breadcrumb-item {
color: #007bff;
text-decoration: none;
margin-right: 0.5rem;
}
.terms-container p{
margin-top: 40px !important;
}
.terms-container h1{
color: #0d6fd7 !important;
}
.terms-container p, .terms-container ul, .terms-container li{
animation: animator1 forwards 0.6s;
}
@keyframes animator1 {
from{
opacity: 0;
}to{
opacity: 1;
}
}
.terms-container h2{
margin-top: 20px !important;
font-size: 36px !important;
}
.terms-container #licenses p{
margin-top: 40px;
}
.breadcrumb-item:hover {
text-decoration: underline;
}

.breadcrumb-separator {
margin-right: 0.5rem;
color: #555;
}

.breadcrumb-item.active {
color: #6c757d;
cursor: default;
}

body {
font-family: Arial, sans-serif;
}

.terms-container {
max-width: 1000px;
margin: 0 auto;
padding: 2rem;
border-radius: 8px;
font-family: Arial, sans-serif;
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
transition: all 0.6s;
text-align: start;
}


.terms-container h1 {
font-family: "ABeeZee";
font-size: 70px;
display: flex;
justify-content: center;
margin-bottom: 1rem;
color: #333;
}

.terms-container h2 {
color: #34495e;
font-size: 30px;
}

.terms-container p {
font-size: 22px;
margin-bottom: 1rem;
font-family: "ABeeZee";
color: #666;
line-height: 1.6;
}

.terms-container ul {
list-style: disc inside;
margin-left: 20px;
}

.terms-container ul li {
margin-bottom: 1rem;
cursor: pointer;
font-size: 22px;
}

}

.privacy-policy-container ul {
list-style: disc outside;
margin-left: 2rem;
margin-bottom: 1.5rem;
}

.privacy-policy-container ul li {
font-size: 18px;
margin-bottom: 1rem;
line-height: 1.8;
color: #333;
}

.highlights {
background-color: #f0f4f8;
padding: 2rem;
border-radius: 8px;
margin: 3rem 0;
border-left: 5px solid #0d6fd7;
}

.highlights h3 {
color: #0d6fd7;
margin-top: 0;
}

#dark .privacy-page {
background-color: #000;
}

#dark .privacy-policy-container {
background-color: #000;
}

#dark .privacy-policy-container p,
#dark .privacy-policy-container li {
color: #fff;
}

#dark .privacy-policy-container h2,h3 {
color: #60a4ee;
}

#dark .privacy-policy-container h1 {
color: #12229d;
}

#dark .highlights {
background-color: #000;
border-left-color: #4491e4;
}
77 changes: 37 additions & 40 deletions src/components/Terms/Terms.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,48 +50,42 @@ useEffect(() => {
}, [setFixed]);
return (
<>
<Navbar/>
<BackToHomeButton />

{/* breadcrumb */}
<div className="terms-container">


{/* terms page */}
<div className="contents">
<Navbar />
{/* Breadcrumb can be added here */}
<div className="privacy-page">
<div className="privacy-policy-container">
<h1>Terms & Conditions</h1>
<section id="cookies">

<section>
<h2>Cookies</h2>
<ul>
<li>We use cookies to enhance user experience.</li>
<li>Cookies help us understand user preferences.</li>
<li>By using our site, you consent to the use of cookies.</li>
</ul>
</section>
<section id="license">

<section>
<h2>License</h2>
<p>
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Maiores
eum explicabo quae totam voluptatum. Expedita nisi quo facere odio
quas obcaecati porro architecto minus, eum sed commodi ratione
modi deleniti perspiciatis! Labore ipsa sapiente ab minima
incidunt tempora perferendis iure at et placeat. Praesentium
temporibus nisi et est eius fugit.
By accessing and using Counsellor, you agree to comply with our licensing terms.
These terms ensure the protection of our intellectual property and maintain the
integrity of our content. We grant you a limited, non-exclusive, non-transferable
license to access and use our website for personal, non-commercial purposes.
</p>
<p>Unless explicitly stated, you are not permitted to:</p>
<ul>
<li>Republish material from CrickClub24</li>
<li>Sell, rent or sub-license material from CrickClub24</li>
<li>Reproduce, duplicate or copy material from CrickClub24</li>
<li>Redistribute content from CrickClub24</li>
<li>Republish material from Counsellor</li>
<li>Sell, rent or sub-license material from Counsellor</li>
<li>Reproduce, duplicate or copy material from Counsellor</li>
<li>Redistribute content from Counsellor</li>
</ul>
</section>


<section id="hyperlinking">

<section>
<h2>Hyperlinking to our Content</h2>
<p>
The following organizations may link to our Website without prior
written approval:
The following organizations may link to our Website without prior written approval:
</p>
<ul>
<li>Government agencies;</li>
Expand All @@ -100,33 +94,36 @@ useEffect(() => {
<li>Online directory distributors;</li>
<li>System wide Accredited Businesses.</li>
</ul>
</section>

<section id="iframes">
</section>
<section>
<h2>iFrames</h2>
<ul>
<li>Without prior approval and written permission, you may not create frames around our Webpages that alter in any way the visual presentation or appearance of our Website.</li>
<li>
Without prior approval and written permission, you may not create frames around our Webpages that alter in any way the visual presentation or appearance of our Website.
</li>
</ul>
</section>

<section id="liability">
<section>
<h2>Content Liability</h2>
<p>
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Ad
itaque iusto sed a consequuntur adipisci corporis quidem est.
Similique optio esse placeat reiciendis velit nemo rerum corporis
consectetur, perspiciatis, hic nostrum et illum recusandae ea,
asperiores ducimus distinctio temporibus nam!
While we strive to provide accurate and up-to-date information, Counsellor does not
warrant that the content on our website is complete, reliable, or error-free. We are
not liable for any inaccuracies, errors, or omissions in the content. Users are
responsible for verifying any information before relying on it. The content is provided
"as is" without any guarantees or warranties, express or implied.
</p>
</section>

<hr />

</div>
</div>

<hr />

<Footer />
</>
);

};

export default Terms;
Loading