-
Notifications
You must be signed in to change notification settings - Fork 213
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
221 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,221 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <meta http-equiv="X-UA-Compatible" content="ie=edge"> | ||
| <title>Cookie Policy - Collect Your Gaming Tools</title> | ||
| <style> | ||
| * { | ||
| margin: 0; | ||
| padding: 0; | ||
| box-sizing: border-box; | ||
| } | ||
|
|
||
| body { | ||
| font-family: Arial, sans-serif; | ||
| } | ||
|
|
||
| /* Navbar */ | ||
| .navbar { | ||
| display: flex; | ||
| justify-content: center; | ||
| align-items: center; | ||
| padding: 15px; | ||
| background-color: #333; | ||
| color: #fff; | ||
| } | ||
|
|
||
| .nav-links { | ||
| display: flex; | ||
| gap: 20px; /* Space between buttons */ | ||
| } | ||
|
|
||
| .nav-links a, .nav-links button { | ||
| color: #fff; | ||
| padding: 10px 20px; | ||
| background-color: #00bfff; | ||
| border: none; | ||
| border-radius: 5px; | ||
| cursor: pointer; | ||
| transition: background-color 0.3s ease-in-out; | ||
| text-decoration: none; | ||
| text-align: center; | ||
| } | ||
|
|
||
| .nav-links a:hover, .nav-links button:hover { | ||
| background-color: #008acc; | ||
| } | ||
|
|
||
| /* Light Theme */ | ||
| body.light-theme { | ||
| background-color: #f0f0f0; | ||
| color: #333; | ||
| } | ||
|
|
||
| .light-theme .cookie-policy-container { | ||
| background-color: #fff; | ||
| color: #333; | ||
| } | ||
|
|
||
| .light-theme footer { | ||
| background-color: #f0f0f0; | ||
| color: #333; | ||
| } | ||
|
|
||
| /* Dark Theme */ | ||
| body.dark-theme { | ||
| background-color: #1c1c1c; | ||
| color: #f0f0f0; | ||
| } | ||
|
|
||
| .dark-theme .cookie-policy-container { | ||
| background-color: #2b2b2b; | ||
| border-radius: 10px; | ||
| } | ||
|
|
||
| .dark-theme footer { | ||
| background-color: #151515; | ||
| color: #f0f0f0; | ||
| } | ||
|
|
||
| /* Cookie Policy Section */ | ||
| .cookie-policy-container { | ||
| max-width: 1200px; | ||
| margin: 50px auto; | ||
| padding: 20px; | ||
| } | ||
|
|
||
| .cookie-section { | ||
| margin-bottom: 30px; | ||
| padding: 20px; | ||
| border-radius: 10px; | ||
| transition: background-color 0.3s ease-in-out; | ||
| } | ||
|
|
||
| .cookie-section h2 { | ||
| color: #00bfff; | ||
| margin-bottom: 10px; | ||
| } | ||
|
|
||
| .cookie-section:hover { | ||
| background-color: rgba(0, 191, 255, 0.1); | ||
| } | ||
|
|
||
| ul { | ||
| list-style-type: square; | ||
| padding-left: 20px; | ||
| } | ||
|
|
||
| ul li { | ||
| margin-bottom: 10px; | ||
| } | ||
|
|
||
| /* Back to Home Button */ | ||
| .back-home { | ||
| text-align: center; | ||
| margin-top: 20px; | ||
| } | ||
|
|
||
| .back-home-btn { | ||
| padding: 10px 20px; | ||
| background-color: #00bfff; | ||
| color: #fff; | ||
| text-decoration: none; | ||
| border-radius: 5px; | ||
| transition: background-color 0.3s ease-in-out; | ||
| } | ||
|
|
||
| .back-home-btn:hover { | ||
| background-color: #008acc; | ||
| } | ||
|
|
||
| /* Footer */ | ||
| footer { | ||
| text-align: center; | ||
| padding: 20px; | ||
| margin-top: 50px; | ||
| border-top: 2px solid #00bfff; | ||
| } | ||
|
|
||
| footer p { | ||
| margin: 0; | ||
| } | ||
|
|
||
| /* Responsive Styles */ | ||
| @media (max-width: 600px) { | ||
| .navbar { | ||
| flex-direction: column; | ||
| } | ||
|
|
||
| .nav-links { | ||
| flex-direction: column; | ||
| gap: 10px; | ||
| } | ||
| } | ||
| </style> | ||
| </head> | ||
| <body class="dark-theme"> | ||
| <!-- Navbar with Home, About, and Theme Switcher --> | ||
| <nav class="navbar"> | ||
| <div class="nav-links"> | ||
| <a href="./index.html" class="nav-home">Home</a> | ||
| <a href="./aboutus.html" class="nav-about">About US</a> | ||
| <button id="theme-switcher" class="theme-btn">Switch Theme</button> | ||
| </div> | ||
| </nav> | ||
|
|
||
| <div class="cookie-policy-container"> | ||
| <div class="cookie-header"> | ||
| <h1>Cookie Policy</h1> | ||
| </div> | ||
|
|
||
| <div class="cookie-section" id="about-cookies"> | ||
| <h2>What Are Cookies?</h2> | ||
| <p>Cookies are small text files stored on your device when you visit a website. They help improve user experience and provide essential features such as user authentication.</p> | ||
| </div> | ||
|
|
||
| <div class="cookie-section" id="use-cookies"> | ||
| <h2>How We Use Cookies</h2> | ||
| <ul> | ||
| <li><strong>Necessary Cookies:</strong> Required for the website to function properly, enabling basic functionalities like page navigation and access to secure areas.</li> | ||
| <li><strong>Performance Cookies:</strong> Help us understand how visitors interact with the website by collecting information anonymously to improve the website.</li> | ||
| <li><strong>Functionality Cookies:</strong> Remember choices you make (e.g., language preference) to provide a more personalized experience.</li> | ||
| <li><strong>Targeting Cookies:</strong> Used to display relevant advertisements and track the effectiveness of marketing campaigns.</li> | ||
| </ul> | ||
| </div> | ||
|
|
||
| <div class="cookie-section" id="manage-cookies"> | ||
| <h2>Managing Your Cookies</h2> | ||
| <p>You can control and manage cookies through your browser settings. Disabling cookies may affect the functionality of this website.</p> | ||
| </div> | ||
|
|
||
| <div class="cookie-section" id="update-policy"> | ||
| <h2>Updates to This Cookie Policy</h2> | ||
| <p>We may update this Cookie Policy from time to time to reflect changes in legal, regulatory, or operational requirements. Please check this page regularly for updates.</p> | ||
| </div> | ||
|
|
||
| <!-- Back to Home Button --> | ||
| <div class="back-home"> | ||
| <a href="index.html" class="back-home-btn">Back to Home</a> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Footer --> | ||
| <footer> | ||
| <p>© 2024 Collect Your Gaming Tools. All rights reserved.</p> | ||
| </footer> | ||
|
|
||
| <!-- JavaScript for Theme Switching --> | ||
| <script> | ||
| const themeSwitcher = document.getElementById('theme-switcher'); | ||
| const body = document.body; | ||
|
|
||
| themeSwitcher.addEventListener('click', () => { | ||
| body.classList.toggle('dark-theme'); | ||
| body.classList.toggle('light-theme'); | ||
| themeSwitcher.textContent = body.classList.contains('dark-theme') ? 'Switch to Light Theme' : 'Switch to Dark Theme'; | ||
| }); | ||
| </script> | ||
| </body> | ||
| </html> |