541 lines
30 KiB
HTML
541 lines
30 KiB
HTML
<div class="row">
|
|
<div class="col-lg-8">
|
|
<!-- Overview Section -->
|
|
<div class="mb-5">
|
|
<h5 style="color: var(--primary-color);" class="mb-3">Notifications & Events Overview</h5>
|
|
<p class="text-muted lead">
|
|
DocuPulse features a comprehensive notification and event logging system that provides real-time
|
|
alerts, email notifications, and detailed audit trails. The system combines in-app notifications
|
|
with email delivery, offering users multiple ways to stay informed about important activities
|
|
and system events. Built with security and compliance in mind, it provides complete visibility
|
|
into user actions and system activities.
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Notification System -->
|
|
<div class="mb-5">
|
|
<h5 style="color: var(--primary-color);" class="mb-4">Notification System</h5>
|
|
|
|
<!-- Notification Types -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-bell me-2"></i>Notification Types
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">User Management</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>account_created</code> - New user account created</li>
|
|
<li class="mb-1"><code>password_reset</code> - Password reset requested</li>
|
|
<li class="mb-1"><code>account_deleted</code> - User account deleted</li>
|
|
<li class="mb-1"><code>account_updated</code> - User profile updated</li>
|
|
<li class="mb-1"><code>password_changed</code> - Password successfully changed</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Collaboration</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>room_invite</code> - Invited to join room</li>
|
|
<li class="mb-1"><code>room_invite_removed</code> - Removed from room</li>
|
|
<li class="mb-1"><code>conversation_invite</code> - Invited to conversation</li>
|
|
<li class="mb-1"><code>conversation_invite_removed</code> - Removed from conversation</li>
|
|
<li class="mb-1"><code>conversation_message</code> - New message received</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Notification Creation -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-plus-circle me-2"></i>Notification Creation
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Creation Process</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>1.</code> Event triggers notification</li>
|
|
<li class="mb-1"><code>2.</code> System validates notification type</li>
|
|
<li class="mb-1"><code>3.</code> Creates notification record</li>
|
|
<li class="mb-1"><code>4.</code> Generates email template</li>
|
|
<li class="mb-1"><code>5.</code> Sends email via SMTP</li>
|
|
<li class="mb-1"><code>6.</code> Updates notification status</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Required Parameters</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>notif_type</code> - Type of notification</li>
|
|
<li class="mb-1"><code>user_id</code> - Target user ID</li>
|
|
<li class="mb-1"><code>sender_id</code> - Optional sender ID</li>
|
|
<li class="mb-1"><code>details</code> - Additional data</li>
|
|
<li class="mb-1"><code>generate_mail</code> - Email flag</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Email Integration -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-envelope me-2"></i>Email Integration
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">SMTP Configuration</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>smtp_server</code> - SMTP server address</li>
|
|
<li class="mb-1"><code>smtp_port</code> - SMTP port number</li>
|
|
<li class="mb-1"><code>use_tls</code> - TLS encryption flag</li>
|
|
<li class="mb-1"><code>username</code> - SMTP username</li>
|
|
<li class="mb-1"><code>password</code> - SMTP password</li>
|
|
<li class="mb-1"><code>sender_email</code> - From email address</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Email Templates</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>Account Created</code> - New user welcome</li>
|
|
<li class="mb-1"><code>Password Reset</code> - Reset instructions</li>
|
|
<li class="mb-1"><code>Room Invite</code> - Room invitation</li>
|
|
<li class="mb-1"><code>Conversation Invite</code> - Chat invitation</li>
|
|
<li class="mb-1"><code>Conversation Message</code> - Message alerts</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Event Logging System -->
|
|
<div class="mb-5">
|
|
<h5 style="color: var(--primary-color);" class="mb-4">Event Logging System</h5>
|
|
|
|
<!-- Event Types -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-history me-2"></i>Event Types
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">User Events</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>user_login</code> - User authentication</li>
|
|
<li class="mb-1"><code>user_logout</code> - User logout</li>
|
|
<li class="mb-1"><code>user_create</code> - Account creation</li>
|
|
<li class="mb-1"><code>user_update</code> - Profile updates</li>
|
|
<li class="mb-1"><code>user_delete</code> - Account deletion</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Room Events</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>room_create</code> - Room creation</li>
|
|
<li class="mb-1"><code>room_update</code> - Room modifications</li>
|
|
<li class="mb-1"><code>room_delete</code> - Room deletion</li>
|
|
<li class="mb-1"><code>room_member_add</code> - Member addition</li>
|
|
<li class="mb-1"><code>room_member_remove</code> - Member removal</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">File Events</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>file_upload</code> - File uploads</li>
|
|
<li class="mb-1"><code>file_download</code> - File downloads</li>
|
|
<li class="mb-1"><code>file_delete</code> - File deletions</li>
|
|
<li class="mb-1"><code>file_rename</code> - File renaming</li>
|
|
<li class="mb-1"><code>file_move</code> - File moving</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Conversation Events</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>conversation_create</code> - Chat creation</li>
|
|
<li class="mb-1"><code>conversation_update</code> - Chat updates</li>
|
|
<li class="mb-1"><code>conversation_delete</code> - Chat deletion</li>
|
|
<li class="mb-1"><code>message_create</code> - Message sending</li>
|
|
<li class="mb-1"><code>conversation_open</code> - Chat access</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Event Logging Process -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-database me-2"></i>Event Logging Process
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Logging Steps</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>1.</code> Event occurs in system</li>
|
|
<li class="mb-1"><code>2.</code> log_event() function called</li>
|
|
<li class="mb-1"><code>3.</code> Validates event type</li>
|
|
<li class="mb-1"><code>4.</code> Captures user context</li>
|
|
<li class="mb-1"><code>5.</code> Records IP and user agent</li>
|
|
<li class="mb-1"><code>6.</code> Stores in database</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Event Data</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>event_type</code> - Type of event</li>
|
|
<li class="mb-1"><code>user_id</code> - User who triggered</li>
|
|
<li class="mb-1"><code>timestamp</code> - Event time</li>
|
|
<li class="mb-1"><code>details</code> - Event-specific data</li>
|
|
<li class="mb-1"><code>ip_address</code> - User IP address</li>
|
|
<li class="mb-1"><code>user_agent</code> - Browser/client info</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Notification Management -->
|
|
<div class="mb-5">
|
|
<h5 style="color: var(--primary-color);" class="mb-4">Notification Management</h5>
|
|
|
|
<!-- Notification Operations -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-cogs me-2"></i>Notification Operations
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">User Operations</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>get_user_notifications</code> - Fetch user notifications</li>
|
|
<li class="mb-1"><code>mark_notification_read</code> - Mark as read</li>
|
|
<li class="mb-1"><code>mark_all_notifications_read</code> - Mark all read</li>
|
|
<li class="mb-1"><code>get_unread_count</code> - Count unread</li>
|
|
<li class="mb-1"><code>delete_notification</code> - Delete notification</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">System Operations</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>delete_old_notifications</code> - Cleanup old notifications</li>
|
|
<li class="mb-1"><code>generate_mail_from_notification</code> - Create email</li>
|
|
<li class="mb-1"><code>send_email_via_smtp</code> - Send email</li>
|
|
<li class="mb-1"><code>get_smtp_settings</code> - Get email config</li>
|
|
<li class="mb-1"><code>create_notification</code> - Create new notification</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Event Queries -->
|
|
<div class="card border-0 shadow-sm">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-search me-2"></i>Event Queries
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Event Retrieval</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>get_user_events</code> - User-specific events</li>
|
|
<li class="mb-1"><code>get_room_events</code> - Room-specific events</li>
|
|
<li class="mb-1"><code>get_recent_events</code> - Recent system events</li>
|
|
<li class="mb-1"><code>get_events_by_type</code> - Filter by event type</li>
|
|
<li class="mb-1"><code>get_events_by_date_range</code> - Date range filter</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Query Parameters</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>user_id</code> - Filter by user</li>
|
|
<li class="mb-1"><code>event_type</code> - Filter by type</li>
|
|
<li class="mb-1"><code>start_date</code> - Start date</li>
|
|
<li class="mb-1"><code>end_date</code> - End date</li>
|
|
<li class="mb-1"><code>limit</code> - Result limit</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Template System -->
|
|
<div class="mb-5">
|
|
<h5 style="color: var(--primary-color);" class="mb-4">Email Template System</h5>
|
|
|
|
<!-- Template Variables -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-code me-2"></i>Template Variables
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">User Variables</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>{{ '{{ user.username }}' }}</code> - User's full name</li>
|
|
<li class="mb-1"><code>{{ '{{ user.email }}' }}</code> - User's email</li>
|
|
<li class="mb-1"><code>{{ '{{ user.company }}' }}</code> - User's company</li>
|
|
<li class="mb-1"><code>{{ '{{ user.position }}' }}</code> - User's position</li>
|
|
<li class="mb-1"><code>{{ '{{ sender.username }}' }}</code> - Sender's name</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">System Variables</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>{{ '{{ site.company_name }}' }}</code> - Company name</li>
|
|
<li class="mb-1"><code>{{ '{{ site.company_website }}' }}</code> - Website</li>
|
|
<li class="mb-1"><code>{{ '{{ setup_link }}' }}</code> - Setup URL</li>
|
|
<li class="mb-1"><code>{{ '{{ reset_link }}' }}</code> - Reset URL</li>
|
|
<li class="mb-1"><code>{{ '{{ created_at }}' }}</code> - Creation time</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Content Variables</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>{{ '{{ conversation.name }}' }}</code> - Chat name</li>
|
|
<li class="mb-1"><code>{{ '{{ message.content }}' }}</code> - Message text</li>
|
|
<li class="mb-1"><code>{{ '{{ room_link }}' }}</code> - Room URL</li>
|
|
<li class="mb-1"><code>{{ '{{ conversation_link }}' }}</code> - Chat URL</li>
|
|
<li class="mb-1"><code>{{ '{{ updated_fields }}' }}</code> - Changed fields</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<h6 class="text-muted mb-2">Time Variables</h6>
|
|
<ul class="list-unstyled small">
|
|
<li class="mb-1"><code>{{ '{{ created_at }}' }}</code> - Creation timestamp</li>
|
|
<li class="mb-1"><code>{{ '{{ updated_at }}' }}</code> - Update timestamp</li>
|
|
<li class="mb-1"><code>{{ '{{ deleted_at }}' }}</code> - Deletion timestamp</li>
|
|
<li class="mb-1"><code>{{ '{{ removed_at }}' }}</code> - Removal timestamp</li>
|
|
<li class="mb-1"><code>{{ '{{ expiry_time }}' }}</code> - Expiration time</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-4">
|
|
<!-- Quick Reference -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-info-circle me-2"></i>Quick Reference
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="mb-3">
|
|
<h6 class="text-muted mb-2">Notification Status</h6>
|
|
<div class="d-flex justify-content-between mb-1">
|
|
<span class="small">Unread</span>
|
|
<span class="badge bg-warning">Pending</span>
|
|
</div>
|
|
<div class="d-flex justify-content-between mb-1">
|
|
<span class="small">Read</span>
|
|
<span class="badge bg-success">Processed</span>
|
|
</div>
|
|
<div class="d-flex justify-content-between mb-1">
|
|
<span class="small">Email Sent</span>
|
|
<span class="badge bg-info">Delivered</span>
|
|
</div>
|
|
<div class="d-flex justify-content-between mb-1">
|
|
<span class="small">Email Failed</span>
|
|
<span class="badge bg-danger">Error</span>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<h6 class="text-muted mb-2">System Limits</h6>
|
|
<div class="d-flex justify-content-between mb-1">
|
|
<span class="small">Notification Retention</span>
|
|
<span class="badge bg-info">30 days</span>
|
|
</div>
|
|
<div class="d-flex justify-content-between mb-1">
|
|
<span class="small">Event Retention</span>
|
|
<span class="badge bg-info">90 days</span>
|
|
</div>
|
|
<div class="d-flex justify-content-between mb-1">
|
|
<span class="small">Email Queue</span>
|
|
<span class="badge bg-success">Real-time</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Notification Features -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-bell me-2"></i>Notification Features
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<ul class="list-unstyled mb-0">
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Real-time in-app notifications
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Email notification delivery
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Template-based email system
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Notification filtering and search
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Bulk notification management
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Notification preferences
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Event Logging Features -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-history me-2"></i>Event Logging Features
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<ul class="list-unstyled mb-0">
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Comprehensive audit trails
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
IP address tracking
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
User agent logging
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Event categorization
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Time-based filtering
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Export capabilities
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Security Features -->
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-shield-alt me-2"></i>Security Features
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<ul class="list-unstyled mb-0">
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Secure SMTP configuration
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
TLS encryption support
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
IP address logging
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
User authentication tracking
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Access control validation
|
|
</li>
|
|
<li class="mb-2 small">
|
|
<i class="fas fa-check text-success me-2"></i>
|
|
Data retention policies
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Technical Stack -->
|
|
<div class="card border-0 shadow-sm">
|
|
<div class="card-header bg-white">
|
|
<h6 class="mb-0" style="color: var(--primary-color);">
|
|
<i class="fas fa-code me-2"></i>Technical Stack
|
|
</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="mb-3">
|
|
<h6 class="text-muted mb-2">Backend</h6>
|
|
<div class="p-2" style="background-color: var(--primary-bg-light); border-radius: 6px;">
|
|
<div class="fw-bold" style="color: var(--primary-color);">Flask + SQLAlchemy</div>
|
|
<small class="text-muted">Notification processing</small>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<h6 class="text-muted mb-2">Email</h6>
|
|
<div class="p-2" style="background-color: var(--secondary-bg-light); border-radius: 6px;">
|
|
<div class="fw-bold" style="color: var(--secondary-color);">SMTP + Jinja2</div>
|
|
<small class="text-muted">Email templates</small>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<h6 class="text-muted mb-2">Database</h6>
|
|
<div class="p-2" style="background-color: var(--primary-bg-light); border-radius: 6px;">
|
|
<div class="fw-bold" style="color: var(--primary-color);">PostgreSQL</div>
|
|
<small class="text-muted">Event storage</small>
|
|
</div>
|
|
</div>
|
|
<div class="mb-3">
|
|
<h6 class="text-muted mb-2">Frontend</h6>
|
|
<div class="p-2" style="background-color: var(--secondary-bg-light); border-radius: 6px;">
|
|
<div class="fw-bold" style="color: var(--secondary-color);">JavaScript + AJAX</div>
|
|
<small class="text-muted">Real-time updates</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|