Last active
September 17, 2024 04:36
-
-
Save awhedbee22/3a568519e0c70840f2c2f1a9d4707b41 to your computer and use it in GitHub Desktop.
Toke Journals - Mobile App
This file contains hidden or 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
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>Toke Diary - Your Personal Cannabis Experience Tracker</title> | |
<script src="https://cdn.tailwindcss.com"></script> | |
<style> | |
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap'); | |
:root { | |
--twine-50: #fbf9f4; | |
--twine-100: #f5f1e4; | |
--twine-200: #ebe1c8; | |
--twine-300: #decda5; | |
--twine-400: #cfb17c; | |
--twine-500: #c7a26a; | |
--twine-600: #bc8e59; | |
--twine-700: #a57243; | |
--twine-800: #865d3c; | |
--twine-900: #6d4e33; | |
--twine-950: #39261a; | |
} | |
body { | |
font-family: 'Poppins', sans-serif; | |
background-color: var(--twine-100); | |
color: var(--twine-900); | |
} | |
.bg-gradient { | |
background: linear-gradient(135deg, var(--twine-600), var(--twine-800)); | |
} | |
.feature-card { | |
transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out; | |
} | |
.feature-card:hover { | |
transform: translateY(-5px); | |
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); | |
} | |
.btn { | |
transition: all 0.3s ease-in-out; | |
} | |
.btn:hover { | |
transform: translateY(-2px); | |
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); | |
} | |
</style> | |
</head> | |
<body> | |
<header class="bg-gradient text-white py-12"> | |
<div class="container mx-auto px-4 text-center"> | |
<h1 class="text-5xl font-bold mb-4">Toke Diary</h1> | |
<p class="text-2xl">Your Personal Cannabis Experience Tracker</p> | |
</div> | |
</header> | |
<nav class="bg-twine-700 text-twine-300 py-4 sticky top-0 z-50"> | |
<div class="container mx-auto px-4"> | |
<ul class="flex justify-center space-x-8"> | |
<li><a href="#features" class="hover:text-twine-300 transition duration-300">Features</a></li> | |
<li><a href="#privacy" class="hover:text-twine-300 transition duration-300">Privacy</a></li> | |
<li><a href="#download" class="hover:text-twine-300 transition duration-300">Download</a></li> | |
<li><a href="#contact" class="hover:text-twine-300 transition duration-300">Contact</a></li> | |
</ul> | |
</div> | |
</nav> | |
<main class="container mx-auto px-4 py-12"> | |
<section id="intro" class="mb-20"> | |
<div class="flex flex-col md:flex-row items-center"> | |
<div class="md:w-1/2 mb-8 md:mb-0"> | |
<h2 class="text-4xl font-bold mb-6">Track, Analyze, and Optimize Your Cannabis Experience</h2> | |
<p class="text-xl mb-8">Toke Diary is a comprehensive mobile application designed for both medical patients and recreational users to log, analyze, and understand their cannabis consumption patterns.</p> | |
<a href="#download" class="btn bg-twine-600 text-twine-300 px-8 py-3 rounded-full text-lg font-semibold inline-block hover:bg-twine-700">Get Started</a> | |
</div> | |
<div class="md:w-1/2"> | |
<img src="https://portfolio.alexwhedbee.com/wp-content/uploads/2024/09/TokeJournalMockup.png" alt="Toke Diary App Screenshot" class="rounded-lg"> | |
</div> | |
</div> | |
</section> | |
<section id="features" class="mb-20"> | |
<h2 class="text-4xl font-bold mb-12 text-center">Key Features</h2> | |
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
<div class="feature-card bg-white p-8 rounded-lg shadow-md"> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">Easy Journal Entries</h3> | |
<p>Quickly log your cannabis sessions with user-friendly interfaces designed for efficiency.</p> | |
</div> | |
<div class="feature-card bg-white p-8 rounded-lg shadow-md"> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">Strain Tracking</h3> | |
<p>Keep detailed records of different strains, consumption methods, and dosages for comprehensive insights.</p> | |
</div> | |
<div class="feature-card bg-white p-8 rounded-lg shadow-md"> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">Effects Monitoring</h3> | |
<p>Track mood and symptoms before and after use to better understand your body's response.</p> | |
</div> | |
<div class="feature-card bg-white p-8 rounded-lg shadow-md"> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">Data Visualization</h3> | |
<p>View detailed reports and analytics on your usage patterns and effects over time.</p> | |
</div> | |
<div class="feature-card bg-white p-8 rounded-lg shadow-md"> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">Secure and Private</h3> | |
<p>Your data is encrypted and stored securely, ensuring your privacy and peace of mind.</p> | |
</div> | |
<div class="feature-card bg-white p-8 rounded-lg shadow-md"> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">Customizable Experience</h3> | |
<p>Tailor the app to your specific needs and preferences for a personalized journey.</p> | |
</div> | |
</div> | |
</section> | |
<section id="privacy" class="mb-20"> | |
<h2 class="text-4xl font-bold mb-12 text-center">Privacy Policy</h2> | |
<div class="bg-white p-8 rounded-lg shadow-lg"> | |
<div class="grid grid-cols-1 md:grid-cols-2 gap-8"> | |
<div> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">Data Collection and Use</h3> | |
<p class="mb-6">Toke Diary collects only the information you provide within the app. This includes your email address for account creation and the data you input about your cannabis experiences. We do not collect any personal information beyond what is necessary for the app's functionality.</p> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">Data Storage and Security</h3> | |
<p class="mb-6">All data is encrypted and stored securely using industry-standard practices. We use Supabase for our backend services, which provides robust security measures to protect your information.</p> | |
</div> | |
<div> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">Data Sharing</h3> | |
<p class="mb-6">We do not share, sell, or rent your personal information to third parties. Your data is used solely for providing and improving the Toke Diary service.</p> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">User Rights</h3> | |
<p class="mb-6">You have the right to access, modify, or delete your personal data at any time through the app's settings. If you wish to completely delete your account and all associated data, please contact our support team.</p> | |
<h3 class="text-2xl font-semibold mb-4 text-twine-700">Changes to Privacy Policy</h3> | |
<p>We may update our Privacy Policy from time to time. We will notify you of any changes by posting the new Privacy Policy on this page and updating the "Last updated" date.</p> | |
</div> | |
</div> | |
</div> | |
</section> | |
<section id="download" class="mb-20 text-center"> | |
<h2 class="text-4xl font-bold mb-8">Download Toke Diary Today</h2> | |
<p class="text-xl mb-12">Start tracking your cannabis experiences and gain valuable insights into your consumption patterns.</p> | |
<div class="flex justify-center space-x-6"> | |
<a href="#" class="btn bg-twine-600 text-twine-300 px-8 py-4 rounded-full text-lg font-semibold inline-block hover:bg-twine-700"> | |
Download for iOS | |
</a> | |
<a href="#" class="btn bg-twine-600 text-twine-300 px-8 py-4 rounded-full text-lg font-semibold inline-block hover:bg-twine-700"> | |
Download for Android | |
</a> | |
</div> | |
</section> | |
<section id="contact" class="text-center"> | |
<h2 class="text-4xl font-bold mb-8">Contact Us</h2> | |
<p class="text-xl mb-6">Have questions or need support? We aren't ready for that...</p> | |
<p class="text-xl mb-6">Need to delete your account? <a href="mailto:[email protected]?subject=Please%20Remove%20my%20Account&body=Dear%20Support%20Team,%0D%0A%0D%0AI%20am%20writing%20to%20request%20the%20removal%20of%20my%20account%20associated%20with%20the%20email%20address%20[Your%20Email%20Address].%20Please%20proceed%20with%20deleting%20my%20account%20and%20all%20associated%20data.%0D%0A%0D%0AIf%20you%20require%20any%20additional%20information%20to%20process%20this%20request,%20please%20let%20me%20know.%0D%0A%0D%0AThank%20you%20for%20your%20assistance.%0D%0A%0D%0ASincerely,%0D%0A%0DYour%20Name">Email Us</a> | |
</section> | |
</main> | |
<footer class="bg-twine-800 text-twine-300 py-12"> | |
<div class="container mx-auto px-4 text-center"> | |
<p class="text-lg">© 2024 Toke Diary. All rights reserved.</p> | |
<p class="mt-4 text-twine-300">Developed in Sacramento, CA.</p> | |
</div> | |
</footer> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment