Code from github to self hosted with git tea in AWS

2026-03-20 12:01:02 +05:30
commit cf79af8f65
349 changed files with 4761 additions and 0 deletions
--- a/mini-dropbox/CODE/app/templates/base.html
+++ b/mini-dropbox/CODE/app/templates/base.html
@@ -0,0 +1,97 @@
+<!-- === FILE: app/templates/base.html === -->
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{% block title %}Cloud Drive{% endblock %}</title>
+    
+    <!-- Tailwind CSS -->
+    <script src="https://cdn.tailwindcss.com"></script>
+    
+    <!-- Google Fonts -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&family=Space+Grotesk:wght@500;700&display=swap" rel="stylesheet">
+    
+    <!-- Custom CSS -->
+    <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
+    
+    <style>
+        body {
+            font-family: 'DM Sans', sans-serif;
+            background-color: #0f1117;
+            color: #f1f5f9;
+        }
+        
+        h1, h2, h3, h4, h5, h6 {
+            font-family: 'Space Grotesk', sans-serif;
+        }
+    </style>
+</head>
+<body class="min-h-screen">
+    <!-- Navbar -->
+    {% if session.user %}
+    <nav class="bg-[#1a1d27] border-b border-[#2a2d3e]">
+        <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+            <div class="flex justify-between items-center h-16">
+                <!-- Left: Logo and Brand -->
+                <div class="flex items-center space-x-3">
+                    <svg class="w-8 h-8 text-[#6366f1]" fill="currentColor" viewBox="0 0 20 20">
+                        <path d="M5.5 16a3.5 3.5 0 01-.369-6.98 4 4 0 117.753-1.977A4.5 4.5 0 1113.5 16h-8z"/>
+                    </svg>
+                    <span class="text-xl font-bold text-white">Cloud Drive</span>
+                </div>
+                
+                <!-- Right: User info and logout -->
+                <div class="flex items-center space-x-4">
+                    <img src="{{ session.user.profile_picture }}" alt="{{ session.user.name }}" class="w-8 h-8 rounded-full border-2 border-[#6366f1]">
+                    <span class="text-sm text-[#94a3b8]">{{ session.user.name }}</span>
+                    <a href="{{ url_for('auth.logout') }}" class="text-sm text-[#ef4444] hover:text-[#dc2626] transition-colors">
+                        Sign out
+                    </a>
+                </div>
+            </div>
+        </div>
+    </nav>
+    {% endif %}
+    
+    <!-- Flash Messages -->
+    {% with messages = get_flashed_messages(with_categories=true) %}
+        {% if messages %}
+            <div id="flash-messages" class="fixed top-4 right-4 z-50 space-y-2">
+                {% for category, message in messages %}
+                    <div class="flash-message px-6 py-3 rounded-lg shadow-lg {% if category == 'success' %}bg-[#22c55e]{% elif category == 'error' %}bg-[#ef4444]{% else %}bg-[#6366f1]{% endif %} text-white">
+                        {{ message }}
+                    </div>
+                {% endfor %}
+            </div>
+        {% endif %}
+    {% endwith %}
+    
+    <!-- Main Content -->
+    <main>
+        {% block content %}{% endblock %}
+    </main>
+    
+    <!-- JavaScript -->
+    <script>
+        // Auto-dismiss flash messages after 4 seconds
+        document.addEventListener('DOMContentLoaded', function() {
+            const flashMessages = document.querySelectorAll('.flash-message');
+            flashMessages.forEach(function(message) {
+                setTimeout(function() {
+                    message.style.opacity = '0';
+                    message.style.transform = 'translateX(100%)';
+                    message.style.transition = 'all 0.3s ease-out';
+                    setTimeout(function() {
+                        message.remove();
+                    }, 300);
+                }, 4000);
+            });
+        });
+    </script>
+    
+    {% block scripts %}{% endblock %}
+</body>
+</html>