From a1b20e2fc284b7647d065249d91722bf00fa5652 Mon Sep 17 00:00:00 2001 From: retoor Date: Sat, 8 Nov 2025 20:16:19 +0100 Subject: [PATCH] Page updates. --- retoors/static/css/components/solutions.css | 104 +++++--- retoors/static/css/components/support.css | 275 ++++++++++---------- retoors/static/css/components/use_cases.css | 118 +++++---- retoors/templates/pages/pricing.html | 82 +++--- retoors/templates/pages/security.html | 82 +++--- retoors/templates/pages/solutions.html | 92 ++++--- retoors/templates/pages/support.html | 99 ++++--- retoors/templates/pages/use_cases.html | 102 ++++---- retoors/views/site.py | 28 ++ 9 files changed, 559 insertions(+), 423 deletions(-) diff --git a/retoors/static/css/components/solutions.css b/retoors/static/css/components/solutions.css index 82bdc80..d987966 100644 --- a/retoors/static/css/components/solutions.css +++ b/retoors/static/css/components/solutions.css @@ -1,17 +1,13 @@ -/* Styles for the Solutions Page */ +/* Styles for the Solutions Page (solutions.html) */ .solutions-hero { text-align: center; - padding: 60px 20px; - background-color: var(--card-background); - margin-bottom: 40px; - border-radius: 8px; - box-shadow: 0 6px 20px var(--shadow-color); + padding: 40px 20px; + margin-bottom: 60px; } .solutions-hero h1 { - font-size: 3.2rem; - font-weight: 700; + font-size: 3rem; color: var(--text-color); margin-bottom: 1rem; } @@ -23,25 +19,23 @@ margin: 0 auto; } -.solutions-grid-section { - padding: 40px 20px; - background-color: var(--background-color); -} - -.solutions-grid { +.solution-sections { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; max-width: 1200px; - margin: 0 auto; + margin: 0 auto 60px auto; + padding: 0 20px; } .solution-card { background-color: var(--card-background); - padding: 30px; border-radius: 8px; box-shadow: 0 4px 15px var(--shadow-color); - text-align: center; + padding: 30px; + text-align: left; + display: flex; + flex-direction: column; transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out; } @@ -54,60 +48,88 @@ width: 60px; height: 60px; margin-bottom: 20px; - color: var(--accent-color); /* Assuming SVG icons can inherit color */ + align-self: center; /* Center the icon */ } -.solution-card h3 { - font-size: 1.5rem; +.solution-card h2 { + font-size: 1.8rem; color: var(--text-color); margin-bottom: 15px; + text-align: center; } .solution-card p { font-size: 1rem; color: var(--light-text-color); line-height: 1.6; + margin-bottom: 20px; } -.cta-bottom { +.solution-card ul { + list-style: none; + padding: 0; + margin-bottom: 20px; +} + +.solution-card ul li { + margin-bottom: 8px; + color: var(--text-color); + font-size: 0.95rem; + display: flex; + align-items: flex-start; +} + +.solution-card ul li::before { + content: '•'; /* Bullet point */ + color: var(--accent-color); + margin-right: 10px; + font-weight: bold; + font-size: 1.2em; + line-height: 1; +} + +.solution-card .btn-primary { + margin-top: auto; /* Push button to the bottom */ + align-self: center; /* Center the button */ + padding: 10px 20px; + font-size: 1rem; +} + +.solutions-cta { text-align: center; padding: 40px 20px; background-color: var(--background-color); + border-radius: 8px; + margin-bottom: 40px; +} + +.solutions-cta h2 { + font-size: 2rem; + color: var(--text-color); + margin-bottom: 30px; } /* Responsive adjustments */ -@media (max-width: 992px) { - .solutions-hero h1 { - font-size: 2.8rem; - } - .solutions-hero p { - font-size: 1.1rem; - } -} - @media (max-width: 768px) { - .solutions-hero { - padding: 40px 15px; - } .solutions-hero h1 { - font-size: 2.2rem; + font-size: 2.5rem; } .solutions-hero p { font-size: 1rem; } - .solutions-grid { - grid-template-columns: 1fr; /* Stack cards on small screens */ + .solution-sections { + grid-template-columns: 1fr; } - .solution-card { - padding: 25px; + .solutions-cta h2 { + font-size: 1.8rem; } } @media (max-width: 480px) { .solutions-hero h1 { - font-size: 1.8rem; + font-size: 2rem; } - .solutions-hero p { - font-size: 0.9rem; + .solution-card { + padding: 20px; } } \ No newline at end of file diff --git a/retoors/static/css/components/support.css b/retoors/static/css/components/support.css index 3a82c16..50bd802 100644 --- a/retoors/static/css/components/support.css +++ b/retoors/static/css/components/support.css @@ -1,17 +1,13 @@ -/* Styles for the Support Page */ +/* Styles for the Support Page (support.html) */ .support-hero { text-align: center; - padding: 60px 20px; - background-color: var(--card-background); - margin-bottom: 40px; - border-radius: 8px; - box-shadow: 0 6px 20px var(--shadow-color); + padding: 40px 20px; + margin-bottom: 60px; } .support-hero h1 { - font-size: 3.2rem; - font-weight: 700; + font-size: 3rem; color: var(--text-color); margin-bottom: 1rem; } @@ -20,168 +16,181 @@ font-size: 1.2rem; color: var(--light-text-color); max-width: 800px; + margin: 0 auto 30px auto; +} + +.search-support { + display: flex; + justify-content: center; + gap: 10px; + max-width: 600px; margin: 0 auto; } -.support-content-grid { +.search-support .search-input { + flex-grow: 1; + padding: 12px 20px; + border: 1px solid var(--border-color); + border-radius: 5px; + font-size: 1rem; +} + +.search-support .btn-primary { + padding: 12px 25px; + font-size: 1rem; +} + +.support-categories { + text-align: center; + margin-bottom: 60px; +} + +.support-categories h2 { + font-size: 2.5rem; + color: var(--text-color); + margin-bottom: 40px; +} + +.category-grid { display: grid; - grid-template-columns: 2fr 1fr; /* Knowledge Base wider than Contact Support */ + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 30px; max-width: 1200px; margin: 0 auto; padding: 0 20px; } -.knowledge-base-section { - padding: 30px; -} - -.knowledge-base-section h2 { - font-size: 2rem; - color: var(--text-color); - margin-bottom: 25px; -} - -.knowledge-base-section .search-input { - width: 100%; - max-width: none; /* Override base.css max-width */ - margin-bottom: 30px; -} - -.featured-articles { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 20px; -} - -.article-category { - background-color: var(--background-color); +.category-card { + background-color: var(--card-background); border-radius: 8px; - box-shadow: 0 2px 8px rgba(0,0,0,0.05); - padding: 20px; - text-align: left; -} - -.article-category img.icon { - width: 40px; - height: 40px; - margin-bottom: 15px; - color: var(--accent-color); -} - -.article-category h3 { - font-size: 1.3rem; - color: var(--text-color); - margin-bottom: 15px; -} - -.article-category ul { - list-style: none; - padding: 0; - margin: 0; -} - -.article-category ul li { - margin-bottom: 8px; -} - -.article-category ul li a { - color: var(--primary-color); - text-decoration: none; - font-size: 0.95rem; -} - -.article-category ul li a:hover { - text-decoration: underline; - color: var(--accent-color); -} - -.contact-support-section { + box-shadow: 0 4px 15px var(--shadow-color); padding: 30px; -} - -.contact-support-section h2 { - font-size: 2rem; - color: var(--text-color); - margin-bottom: 25px; -} - -.contact-option { - background-color: var(--background-color); - border-radius: 8px; - box-shadow: 0 2px 8px rgba(0,0,0,0.05); - padding: 20px; - margin-bottom: 20px; text-align: center; + transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out; } -.contact-option img.icon { - width: 50px; - height: 50px; - margin-bottom: 15px; - color: var(--accent-color); +.category-card:hover { + transform: translateY(-5px); + box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12); } -.contact-option h3 { - font-size: 1.4rem; +.category-card img.icon { + width: 70px; + height: 70px; + margin-bottom: 20px; +} + +.category-card h3 { + font-size: 1.5rem; color: var(--text-color); margin-bottom: 10px; } -.contact-option p { +.category-card p { font-size: 0.95rem; color: var(--light-text-color); - margin-bottom: 15px; + line-height: 1.5; + margin-bottom: 20px; } -.contact-option .btn-primary { - width: 100%; - padding: 0.8rem 1.5rem; +.category-card .btn-link { + color: var(--primary-color); + text-decoration: none; + font-weight: 500; +} + +.category-card .btn-link:hover { + text-decoration: underline; +} + +.contact-options { + text-align: center; + margin-bottom: 60px; +} + +.contact-options h2 { + font-size: 2.5rem; + color: var(--text-color); + margin-bottom: 40px; +} + +.contact-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + gap: 30px; + max-width: 1200px; + margin: 0 auto; + padding: 0 20px; +} + +.contact-card { + background-color: var(--card-background); + border-radius: 8px; + box-shadow: 0 4px 15px var(--shadow-color); + padding: 30px; + text-align: center; + transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out; +} + +.contact-card:hover { + transform: translateY(-5px); + box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12); +} + +.contact-card img.icon { + width: 70px; + height: 70px; + margin-bottom: 20px; +} + +.contact-card h3 { + font-size: 1.5rem; + color: var(--text-color); + margin-bottom: 10px; +} + +.contact-card p { + font-size: 0.95rem; + color: var(--light-text-color); + line-height: 1.5; + margin-bottom: 20px; +} + +.contact-card .btn-primary { + padding: 10px 20px; font-size: 1rem; } -.contact-option .phone-number { - font-size: 1.2rem; - font-weight: 700; - color: var(--accent-color); +.contact-card .phone-hours { + font-size: 0.85rem; + color: var(--light-text-color); + margin-top: -10px; } /* Responsive adjustments */ -@media (max-width: 992px) { - .support-content-grid { - grid-template-columns: 1fr; /* Stack columns on smaller screens */ - } - .knowledge-base-section, .contact-support-section { - padding: 20px; - } - .featured-articles { - grid-template-columns: 1fr; - } -} - @media (max-width: 768px) { - .support-hero h1 { + .support-hero h1, .support-categories h2, .contact-options h2 { font-size: 2.5rem; } - .support-hero p { - font-size: 1.1rem; - } - .knowledge-base-section h2, .contact-support-section h2 { - font-size: 1.8rem; - } -} - -@media (max-width: 480px) { - .support-hero h1 { - font-size: 2rem; - } .support-hero p { font-size: 1rem; } - .article-category h3 { - font-size: 1.2rem; + .search-support { + flex-direction: column; } - .contact-option h3 { - font-size: 1.3rem; + .search-support .btn-primary { + width: 100%; + } + .category-grid, .contact-grid { + grid-template-columns: 1fr; + } +} + +@media (max-width: 480px) { + .support-hero h1, .support-categories h2, .contact-options h2 { + font-size: 2rem; + } + .category-card, .contact-card { + padding: 20px; } } \ No newline at end of file diff --git a/retoors/static/css/components/use_cases.css b/retoors/static/css/components/use_cases.css index 085f33c..4cd6d9e 100644 --- a/retoors/static/css/components/use_cases.css +++ b/retoors/static/css/components/use_cases.css @@ -1,17 +1,13 @@ -/* Styles for the Use Cases Page */ +/* Styles for the Use Cases Page (use_cases.html) */ .use-cases-hero { text-align: center; - padding: 60px 20px; - background-color: var(--card-background); - margin-bottom: 40px; - border-radius: 8px; - box-shadow: 0 6px 20px var(--shadow-color); + padding: 40px 20px; + margin-bottom: 60px; } .use-cases-hero h1 { - font-size: 3.2rem; - font-weight: 700; + font-size: 3rem; color: var(--text-color); margin-bottom: 1rem; } @@ -23,91 +19,117 @@ margin: 0 auto; } -.use-cases-grid-section { - padding: 40px 20px; - background-color: var(--background-color); -} - -.use-cases-grid { +.use-case-scenarios { display: grid; - grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; max-width: 1200px; - margin: 0 auto; + margin: 0 auto 60px auto; + padding: 0 20px; } -.use-case-card { +.scenario-card { background-color: var(--card-background); - padding: 30px; border-radius: 8px; box-shadow: 0 4px 15px var(--shadow-color); - text-align: center; + padding: 30px; + text-align: left; + display: flex; + flex-direction: column; transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out; } -.use-case-card:hover { +.scenario-card:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12); } -.use-case-card img.icon { - width: 60px; - height: 60px; +.scenario-card img.icon { + width: 70px; + height: 70px; margin-bottom: 20px; - color: var(--accent-color); /* Assuming SVG icons can inherit color */ + align-self: center; /* Center the icon */ } -.use-case-card h3 { - font-size: 1.5rem; +.scenario-card h2 { + font-size: 1.8rem; color: var(--text-color); margin-bottom: 15px; + text-align: center; } -.use-case-card p { +.scenario-card p { font-size: 1rem; color: var(--light-text-color); line-height: 1.6; + margin-bottom: 15px; } -.cta-bottom { +.scenario-card ul { + list-style: none; + padding: 0; + margin-bottom: 20px; +} + +.scenario-card ul li { + margin-bottom: 8px; + color: var(--text-color); + font-size: 0.95rem; + display: flex; + align-items: flex-start; +} + +.scenario-card ul li::before { + content: '•'; /* Bullet point */ + color: var(--accent-color); + margin-right: 10px; + font-weight: bold; + font-size: 1.2em; + line-height: 1; +} + +.scenario-card .btn-primary { + margin-top: auto; /* Push button to the bottom */ + align-self: center; /* Center the button */ + padding: 10px 20px; + font-size: 1rem; +} + +.use-cases-cta { text-align: center; padding: 40px 20px; background-color: var(--background-color); + border-radius: 8px; + margin-bottom: 40px; +} + +.use-cases-cta h2 { + font-size: 2rem; + color: var(--text-color); + margin-bottom: 30px; } /* Responsive adjustments */ -@media (max-width: 992px) { - .use-cases-hero h1 { - font-size: 2.8rem; - } - .use-cases-hero p { - font-size: 1.1rem; - } -} - @media (max-width: 768px) { - .use-cases-hero { - padding: 40px 15px; - } .use-cases-hero h1 { - font-size: 2.2rem; + font-size: 2.5rem; } .use-cases-hero p { font-size: 1rem; } - .use-cases-grid { - grid-template-columns: 1fr; /* Stack cards on small screens */ + .use-case-scenarios { + grid-template-columns: 1fr; } - .use-case-card { - padding: 25px; + .use-cases-cta h2 { + font-size: 1.8rem; } } @media (max-width: 480px) { .use-cases-hero h1 { - font-size: 1.8rem; + font-size: 2rem; } - .use-cases-hero p { - font-size: 0.9rem; + .scenario-card { + padding: 20px; } } \ No newline at end of file diff --git a/retoors/templates/pages/pricing.html b/retoors/templates/pages/pricing.html index 256cb4c..4ae594a 100644 --- a/retoors/templates/pages/pricing.html +++ b/retoors/templates/pages/pricing.html @@ -2,60 +2,80 @@ {% block title %}Pricing - Retoor's Cloud Solutions{% endblock %} +{% block head %} + +{% endblock %} + {% block content %}
-
-

Flexible Pricing for Every Need

-

Find the perfect plan for your business, team, or individual use.

+
+

Simple, Transparent Pricing

+

Find the perfect plan for your needs.

+
+ + +
-
-
-

Basic Plan

-

$9.99/month

+
+
+

Free

+

$0/month

    -
  • 100 GB Storage
  • -
  • Basic File Sharing
  • -
  • Email Support
  • +
  • 1 GB Storage
  • +
  • Basic Sync & Share
  • +
  • Standard Support
Get Started
-
-
+

Frequently Asked Questions

-
-

What payment methods do you accept?

-

We accept all major credit cards, PayPal, and bank transfers for annual plans.

-

Can I change my plan later?

Yes, you can upgrade or downgrade your plan at any time from your dashboard.

+
+

What payment methods do you accept?

+

We accept all major credit cards, PayPal, and bank transfers for annual plans.

+
{% endblock %} \ No newline at end of file diff --git a/retoors/templates/pages/security.html b/retoors/templates/pages/security.html index 763fa61..e6e3be9 100644 --- a/retoors/templates/pages/security.html +++ b/retoors/templates/pages/security.html @@ -2,54 +2,60 @@ {% block title %}Security - Retoor's Cloud Solutions{% endblock %} +{% block head %} + +{% endblock %} + {% block content %}
-
-

Bank-Grade Security for Your Data

-

Protecting your valuable information with advanced measures and unwavering commitment.

+
+

Your Data, Our Priority. Uncompromising Security.

+

At Retoor's Cloud Solutions, we understand the critical importance of data security and privacy. We employ industry-leading measures to ensure your information is always protected.

-
-
- {# Placeholder for an encryption icon #} -

End-to-End Encryption

-

Your data is encrypted at rest and in transit using industry-leading AES-256 encryption protocols.

+
+
+ Encryption Icon +

Robust Encryption

+

All your data is encrypted both in transit (TLS 1.2+) and at rest (AES-256), ensuring maximum confidentiality and integrity.

- -
- {# Placeholder for an access control icon #} -

Granular Access Controls

-

Manage who has access to what with detailed permissions and user roles, ensuring data privacy.

+
+ Access Control Icon +

Advanced Access Control

+

Implement granular permissions, multi-factor authentication (MFA), and strict access policies to keep your data safe from unauthorized access.

- -
- {# Placeholder for a compliance icon #} -

Regulatory Compliance

-

We adhere to global compliance standards like GDPR, HIPAA, and ISO 27001 to meet your industry needs.

+
+ Privacy Icon +

Unwavering Privacy

+

We are committed to your privacy. Our policies are transparent, and we comply with global data protection regulations like GDPR and CCPA.

- -
- {# Placeholder for a backup icon #} -

Automated Backups & Recovery

-

Your data is continuously backed up and easily recoverable, protecting against data loss.

-
- -
- {# Placeholder for an monitoring icon #} -

24/7 Threat Monitoring

-

Our systems are constantly monitored for suspicious activity, ensuring rapid response to threats.

-
- -
- {# Placeholder for an audit icon #} -

Regular Security Audits

-

Independent third-party audits regularly verify the effectiveness of our security measures.

+
+ Infrastructure Icon +

Secure Infrastructure

+

Our data centers are physically secured, and our network is protected by advanced firewalls and intrusion detection systems, regularly audited for vulnerabilities.

-
-

Have More Security Questions?

-

Our team is ready to provide detailed answers and discuss your specific security requirements.

+
+

Trust & Compliance

+
+
+ +

ISO 27001 Certified

+
+
+ +

SOC 2 Compliant

+
+
+ +

GDPR Compliant

+
+
+
+ +
+

Have More Questions About Security?

Contact Support
diff --git a/retoors/templates/pages/solutions.html b/retoors/templates/pages/solutions.html index ad982fd..3929eb0 100644 --- a/retoors/templates/pages/solutions.html +++ b/retoors/templates/pages/solutions.html @@ -9,47 +9,67 @@ {% block content %}
-

Tailored for Every Business Need

-

Flexible cloud solutions for teams of all sizes.

+

Powerful Cloud Solutions for Modern Needs

+

Discover how Retoor's Cloud Solutions can empower your family, business, or academic pursuits with secure, accessible, and collaborative tools.

-
-
-
- Secure File Sharing Icon {# Placeholder icon #} -

Secure File Sharing

-

Collaborate on documents and large files with colleagues and clients securely.

-
-
- Automated Backup Icon {# Placeholder icon #} -

Automated Backup & Recovery

-

Protect critical business data with automated, daily easy-click recovery.

-
-
- Team Collaboration Icon {# Placeholder icon #} -

Team Collaboration Spaces

-

Organize important work documents, collaborate with teams, and access files from anywhere.

-
-
- Enterprise Security Icon {# Placeholder icon #} -

Enterprise-Grade Security

-

Benefit from advanced encryption and robust access controls.

-
-
- Compliance Certifications Icon {# Placeholder icon #} -

Compliance Certifications

-

Meet industry standards with compliance certifications and robust access controls.

-
-
- Scalable Storage Icon {# Placeholder icon #} -

Scalable Storage Plans

-

Easily upgrade and downgrade storage as storage and team needs evolve.

-
+
+
+ Family Storage Icon +

Secure Family Storage

+

Keep your family's precious memories safe and accessible. Securely store photos, videos, and important documents, and easily share them with loved ones.

+
    +
  • Private photo and video galleries
  • +
  • Shared family albums
  • +
  • Secure document vault for wills, deeds, etc.
  • +
  • Easy sharing with granular permissions
  • +
+ See Family Plans +
+ +
+ Business Collaboration Icon +

Business Collaboration & Productivity

+

Boost your team's efficiency with seamless collaboration tools. Share files, co-edit documents, and manage projects from anywhere, securely.

+
    +
  • Real-time document co-editing
  • +
  • Secure file sharing with external partners
  • +
  • Version control and recovery
  • +
  • Team workspaces and project folders
  • +
+ Explore Business Solutions +
+ +
+ Academic Storage Icon +

Academic & Student Resources

+

Organize your academic life with dedicated storage for projects, research, and notes. Access your study materials across all your devices.

+
    +
  • Centralized storage for assignments and research
  • +
  • Easy access from campus or home
  • +
  • Secure sharing for group projects
  • +
  • Integration with academic tools (coming soon)
  • +
+ View Student Plans +
+ +
+ Automated Backup & Recovery Icon +

Automated Backup & Recovery

+

Never lose a file again. Our automated backup solutions ensure your data is always safe, with easy recovery options for any scenario.

+
    +
  • Scheduled automatic backups
  • +
  • Point-in-time recovery
  • +
  • Disaster recovery planning
  • +
  • Secure, off-site data replication
  • +
+ Learn About Backup
-
- Find Your Business Plan +
+

Ready to Explore Our Plans?

+ View All Pricing
{% endblock %} \ No newline at end of file diff --git a/retoors/templates/pages/support.html b/retoors/templates/pages/support.html index bee93ba..edb699e 100644 --- a/retoors/templates/pages/support.html +++ b/retoors/templates/pages/support.html @@ -9,65 +9,64 @@ {% block content %}
-

We're Here to Help

-

Flexible cloud solutions for all teams with ease.

+

We're Here to Help You Succeed

+

Find answers to your questions, troubleshoot issues, or contact our support team for personalized assistance.

+
+ + +
-
-
-

Knowledge Base

- - -