|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Welcome - Mental Health Assistant</title> |
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='stylehome.css') }}"> |
|
|
<style> |
|
|
body { |
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); |
|
|
min-height: 100vh; |
|
|
display: flex; |
|
|
align-items: center; |
|
|
justify-content: center; |
|
|
font-family: 'Roboto', sans-serif; |
|
|
} |
|
|
|
|
|
.dashboard-container { |
|
|
max-width: 600px; |
|
|
width: 90%; |
|
|
padding: 40px; |
|
|
background: white; |
|
|
border-radius: 15px; |
|
|
box-shadow: 0 10px 30px rgba(0,0,0,0.1); |
|
|
text-align: center; |
|
|
} |
|
|
|
|
|
.welcome-header { |
|
|
margin-bottom: 40px; |
|
|
} |
|
|
|
|
|
.welcome-header h1 { |
|
|
color: #333; |
|
|
margin-bottom: 10px; |
|
|
} |
|
|
|
|
|
.welcome-header p { |
|
|
color: #666; |
|
|
font-size: 18px; |
|
|
} |
|
|
|
|
|
.new-user-message { |
|
|
background: #e8f4fd; |
|
|
border: 1px solid #bee5eb; |
|
|
color: #0c5460; |
|
|
padding: 15px; |
|
|
border-radius: 8px; |
|
|
margin-bottom: 30px; |
|
|
} |
|
|
|
|
|
.options-grid { |
|
|
display: grid; |
|
|
grid-template-columns: 1fr 1fr; |
|
|
gap: 20px; |
|
|
margin-top: 30px; |
|
|
} |
|
|
|
|
|
.option-card { |
|
|
padding: 30px 20px; |
|
|
border: 2px solid #eee; |
|
|
border-radius: 10px; |
|
|
cursor: pointer; |
|
|
transition: all 0.3s; |
|
|
text-decoration: none; |
|
|
color: #333; |
|
|
} |
|
|
|
|
|
.option-card:hover { |
|
|
border-color: #667eea; |
|
|
transform: translateY(-5px); |
|
|
box-shadow: 0 5px 20px rgba(102, 126, 234, 0.2); |
|
|
} |
|
|
|
|
|
.option-card.recommended { |
|
|
border-color: #667eea; |
|
|
background: #f6f8ff; |
|
|
} |
|
|
|
|
|
.option-icon { |
|
|
font-size: 48px; |
|
|
margin-bottom: 15px; |
|
|
} |
|
|
|
|
|
.option-title { |
|
|
font-size: 20px; |
|
|
font-weight: 600; |
|
|
margin-bottom: 10px; |
|
|
} |
|
|
|
|
|
.option-desc { |
|
|
color: #666; |
|
|
font-size: 14px; |
|
|
} |
|
|
|
|
|
.recommended-badge { |
|
|
background: #667eea; |
|
|
color: white; |
|
|
font-size: 12px; |
|
|
padding: 4px 8px; |
|
|
border-radius: 4px; |
|
|
margin-top: 10px; |
|
|
display: inline-block; |
|
|
} |
|
|
|
|
|
.last-assessment { |
|
|
margin-top: 30px; |
|
|
padding: 20px; |
|
|
background: #f8f9fa; |
|
|
border-radius: 10px; |
|
|
} |
|
|
|
|
|
.logout-link { |
|
|
margin-top: 30px; |
|
|
display: inline-block; |
|
|
color: #666; |
|
|
text-decoration: none; |
|
|
font-size: 14px; |
|
|
} |
|
|
|
|
|
.logout-link:hover { |
|
|
color: #333; |
|
|
text-decoration: underline; |
|
|
} |
|
|
|
|
|
@media (max-width: 600px) { |
|
|
.options-grid { |
|
|
grid-template-columns: 1fr; |
|
|
} |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="dashboard-container"> |
|
|
<div class="welcome-header"> |
|
|
<h1>Welcome{% if not session.user_data.has_completed_survey %} to GreenLife{% else %} back{% endif %}, {{ session.user_data.name }}!</h1> |
|
|
<p>What would you like to do today?</p> |
|
|
</div> |
|
|
|
|
|
{% if not session.user_data.has_completed_survey %} |
|
|
<div class="new-user-message"> |
|
|
<strong>Welcome aboard!</strong> We recommend starting with a mental health assessment |
|
|
to help personalize your experience. |
|
|
</div> |
|
|
{% endif %} |
|
|
|
|
|
<div class="options-grid"> |
|
|
<a href="{{ url_for('assessment') }}" class="option-card {% if not session.user_data.has_completed_survey %}recommended{% endif %}"> |
|
|
<div class="option-icon">📋</div> |
|
|
<div class="option-title">Take Assessment</div> |
|
|
<div class="option-desc">Complete a mental health assessment to track your progress</div> |
|
|
{% if not session.user_data.has_completed_survey %} |
|
|
<div class="recommended-badge">Recommended</div> |
|
|
{% endif %} |
|
|
</a> |
|
|
|
|
|
<a href="{{ url_for('chatbot') }}" class="option-card"> |
|
|
<div class="option-icon">💬</div> |
|
|
<div class="option-title">Chat with Assistant</div> |
|
|
<div class="option-desc">Get support and guidance from our AI assistant</div> |
|
|
</a> |
|
|
</div> |
|
|
|
|
|
{% if session.user_data.has_completed_survey %} |
|
|
<div class="last-assessment"> |
|
|
<p><strong>Previous Assessment:</strong> You've completed an assessment before.</p> |
|
|
<p>Taking regular assessments helps track your mental health journey.</p> |
|
|
</div> |
|
|
{% else %} |
|
|
<div class="last-assessment"> |
|
|
<p><strong>Note:</strong> You haven't completed an assessment yet.</p> |
|
|
<p>We recommend taking one to get personalized insights.</p> |
|
|
</div> |
|
|
{% endif %} |
|
|
|
|
|
<a href="{{ url_for('logout') }}" class="logout-link">Logout</a> |
|
|
</div> |
|
|
</body> |
|
|
</html> |
