custom1/dashboard.html
2025-07-08 11:22:37 +00:00

121 lines
7.1 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dashboard</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="page-wrapper">
<div class="nav-1-wrapper"><nav class="nav-1-navbar"><div class="nav-1-logo">IDPro</div><ul class="nav-1-nav-links"><li><a href="home.html">Home</a></li><li><a href="about.html">About Us</a></li><li><a href="contact.html">Contact</a></li><li><a href="services.html">Solutions</a></li><li><a href="faq.html">FAQs</a></li><li class="nav-1-dropdown"><a href="#">More<i class="fas fa-chevron-down"><i class="fas fa-chevron-down">🔽</i></i></a></li></ul><div class="nav-1-nav-actions"><button class="nav-1-btn nav-1-outline">Sign Up</button><button class="nav-1-btn nav-1-solid">Login</button></div></nav></div>
<div class="text-1-wrapper"><section class="text-1-section"><p class="text-1-tagline">Revolutionize Your ID Card Creation</p><h2 class="text-1-heading">Effortlessly Design &amp; Generate Professional ID Cards</h2><p class="text-1-description">Our intuitive platform streamlines the entire ID card process. Upload student data from Excel, select from customizable templates, and instantly generate personalized, high-quality ID cards for your institution.</p><div class="text-1-button-group"><button class="text-1-btn text-1-solid">Start Creating Today</button><button class="text-1-btn text-1-outline">Discover Features</button></div></section></div>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ICard Projects List</title>
<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=Inter:wght@400;600;700&amp;display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css" />
<section class="icard-projects-section">
<div class="container">
<header class="section-header">
<h2>Your ICard Projects</h2>
<a href="#add-new-icard" class="button">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"></path></svg>
Create New ICard Project
</a>
</header>
<div class="project-grid">
<!-- Project Card 1 -->
<article class="project-card">
<div class="card-content">
<h3>University Student ICard</h3>
<p>Manages student ID cards for the university, including name, ID number, and department details. Ready for data import.</p>
</div>
<div class="card-actions">
<a href="#project-detail-1" class="card-action-button">View Details</a>
<a href="#upload-data-1" class="card-action-button">Upload Data</a>
<a href="#download-template-1" class="card-action-button">Download Template</a>
</div>
</article>
<!-- Project Card 2 -->
<article class="project-card">
<div class="card-content">
<h3>Employee Access Card</h3>
<p>Configured for employee access cards with company logo, employee photo, name, and designation. Template pre-designed.</p>
</div>
<div class="card-actions">
<a href="#project-detail-2" class="card-action-button">View Details</a>
<a href="#upload-data-2" class="card-action-button">Upload Data</a>
<a href="#download-template-2" class="card-action-button">Download Template</a>
</div>
</article>
<!-- Project Card 3 -->
<article class="project-card">
<div class="card-content">
<h3>Conference Attendee Badge</h3>
<p>Generates badges for conference attendees, capturing their name, organization, and attendee type for events.</p>
</div>
<div class="card-actions">
<a href="#project-detail-3" class="card-action-button">View Details</a>
<a href="#upload-data-3" class="card-action-button">Upload Data</a>
<a href="#download-template-3" class="card-action-button">Download Template</a>
</div>
</article>
<!-- Project Card 4 -->
<article class="project-card">
<div class="card-content">
<h3>School ID Card (K-12)</h3>
<p>Basic ID cards for K-12 students. Includes student name, grade, school year, and a placeholder for photo.</p>
</div>
<div class="card-actions">
<a href="#project-detail-4" class="card-action-button">View Details</a>
<a href="#upload-data-4" class="card-action-button">Upload Data</a>
<a href="#download-template-4" class="card-action-button">Download Template</a>
</div>
</article>
<!-- Project Card 5 (Example of a project in progress) -->
<article class="project-card">
<div class="card-content">
<h3>Volunteer Service Pass</h3>
<p>Designed for volunteers, showing their name, volunteer ID, and an expiry date. Template needs finalization.</p>
</div>
<div class="card-actions">
<a href="#project-detail-5" class="card-action-button">View Details</a>
<a href="#upload-data-5" class="card-action-button">Upload Data</a>
<a href="#download-template-5" class="card-action-button">Download Template</a>
</div>
</article>
<!-- Project Card 6 (Example of a new project) -->
<article class="project-card">
<div class="card-content">
<h3>Membership Card Template</h3>
<p>A generic template for club or organization membership cards. Customizable fields for member name and join date.</p>
</div>
<div class="card-actions">
<a href="#project-detail-6" class="card-action-button">View Details</a>
<a href="#upload-data-6" class="card-action-button">Upload Data</a>
<a href="#download-template-6" class="card-action-button">Download Template</a>
</div>
</article>
</div>
</div>
</section>
</div>
</body>
</html>