nidus-sync/htmlpage/sync/template/setting-mock.html

{{template "base.html" .}}

{{define "title"}}Dash{{end}}
{{define "extraheader"}}
<style>
.settings-card {
	transition: transform 0.2s, box-shadow 0.2s;
	height: 100%;
}
.settings-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.settings-icon {
	font-size: 2.5rem;
	width: 80px;
	height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	margin-bottom: 1.5rem;
}
.icon-users {
	color: #6f42c1;
	background-color: rgba(111, 66, 193, 0.1);
}
.icon-pesticides {
	color: #198754;
	background-color: rgba(25, 135, 84, 0.1);
}
.icon-integrations {
	color: #0d6efd;
	background-color: rgba(13, 110, 253, 0.1);
}
.icon-notifications {
	color: #fd7e14;
	background-color: rgba(253, 126, 20, 0.1);
}
.icon-general {
	color: #6c757d;
	background-color: rgba(108, 117, 125, 0.1);
}
.icon-equipment {
	color: #dc3545;
	background-color: rgba(220, 53, 69, 0.1);
}
.last-updated {
	font-size: 0.8rem;
	color: #6c757d;
}
</style>
{{end}}
{{define "content"}}
<div class="container py-5">
	<div class="row mb-4">
		<div class="col">
			<h1 class="display-5 mb-3">Settings</h1>
			<p class="text-muted lead">Configure your organization's preferences and integrations</p>
		</div>
	</div>
	
	<div class="row g-4">
		<!-- User Management Card -->
		<div class="col-12 col-md-6 col-lg-4">
			<div class="card settings-card border-0 shadow-sm">
				<div class="card-body p-4">
					<div class="settings-icon icon-users">
						<i class="bi bi-people-fill"></i>
					</div>
					<h2 class="h4 mb-2">User Management</h2>
					<p class="text-muted mb-4">Manage staff accounts, roles, and permissions for your organization.</p>
					<div class="d-flex justify-content-between align-items-center">
						<a href="{{ .URLs.SettingUser }}" class="btn btn-outline-primary">
							Manage Users
							<i class="bi bi-arrow-right ms-1"></i>
						</a>
						<span class="last-updated">23 users</span>
					</div>
				</div>
			</div>
		</div>
		
		<!-- Pesticide Products Card -->
		<div class="col-12 col-md-6 col-lg-4">
			<div class="card settings-card border-0 shadow-sm">
				<div class="card-body p-4">
					<div class="settings-icon icon-pesticides">
						<i class="bi bi-droplet-fill"></i>
					</div>
					<h2 class="h4 mb-2">Pesticide Products</h2>
					<p class="text-muted mb-4">Configure products, application rates, and field recommendations.</p>
					<div class="d-flex justify-content-between align-items-center">
						<a href="{{ .URLs.SettingPesticide }}" class="btn btn-outline-success">
							Manage Products
							<i class="bi bi-arrow-right ms-1"></i>
						</a>
						<span class="last-updated">12 active products</span>
					</div>
				</div>
			</div>
		</div>
		
		<!-- Integrations Card -->
		<div class="col-12 col-md-6 col-lg-4">
			<div class="card settings-card border-0 shadow-sm">
				<div class="card-body p-4">
					<div class="settings-icon icon-integrations">
						<i class="bi bi-gear-wide-connected"></i>
					</div>
					<h2 class="h4 mb-2">Integrations</h2>
					<p class="text-muted mb-4">Configure connections with FieldSeeker, VectorSurv, and other services.</p>
					<div class="d-flex justify-content-between align-items-center">
						<a href="{{ .URLs.SettingIntegration }}" class="btn btn-outline-primary">
							Manage Integrations
							<i class="bi bi-arrow-right ms-1"></i>
						</a>
						<span class="last-updated">3 active connections</span>
					</div>
				</div>
			</div>
		</div>
		
		<!-- Equipment Card -->
		<div class="col-12 col-md-6 col-lg-4">
			<div class="card settings-card border-0 shadow-sm">
				<div class="card-body p-4">
					<div class="settings-icon icon-equipment">
						<i class="bi bi-tools"></i>
					</div>
					<h2 class="h4 mb-2">Equipment</h2>
					<p class="text-muted mb-4">Manage your field equipment inventory, calibration, and maintenance.</p>
					<div class="d-flex justify-content-between align-items-center">
						<a href="equipment.html" class="btn btn-outline-danger">
							Manage Equipment
							<i class="bi bi-arrow-right ms-1"></i>
						</a>
						<span class="last-updated">Updated 5 days ago</span>
					</div>
				</div>
			</div>
		</div>
		
		<!-- Notifications Card -->
		<div class="col-12 col-md-6 col-lg-4">
			<div class="card settings-card border-0 shadow-sm">
				<div class="card-body p-4">
					<div class="settings-icon icon-notifications">
						<i class="bi bi-bell-fill"></i>
					</div>
					<h2 class="h4 mb-2">Notifications</h2>
					<p class="text-muted mb-4">Configure email alerts, SMS notifications, and reporting preferences.</p>
					<div class="d-flex justify-content-between align-items-center">
						<a href="notifications.html" class="btn btn-outline-warning">
							Manage Notifications
							<i class="bi bi-arrow-right ms-1"></i>
						</a>
						<span class="last-updated">5 active alerts</span>
					</div>
				</div>
			</div>
		</div>
		
		<!-- General Settings Card -->
		<div class="col-12 col-md-6 col-lg-4">
			<div class="card settings-card border-0 shadow-sm">
				<div class="card-body p-4">
					<div class="settings-icon icon-general">
						<i class="bi bi-sliders"></i>
					</div>
					<h2 class="h4 mb-2">General Settings</h2>
					<p class="text-muted mb-4">Configure organization details, branding, and system preferences.</p>
					<div class="d-flex justify-content-between align-items-center">
						<a href="general-settings.html" class="btn btn-outline-secondary">
							Manage Settings
							<i class="bi bi-arrow-right ms-1"></i>
						</a>
						<span class="last-updated">Updated yesterday</span>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	<div class="mt-5 text-center text-muted">
		<p class="small">
			<i class="bi bi-shield-lock me-1"></i>
			All changes made in settings are logged for audit purposes
		</p>
	</div>
</div>
{{end}}