@govnepal/css 0.4.0 → 0.5.0

package/dist/civic-calm.css

@@ -1,7 +1,7 @@
 /*!
  * Civic Calm — @govnepal/css
  * The framework-agnostic visual layer. Semantic HTML plus .gov-* classes; no JavaScript.
- * Built against design-guidelines 0.2.0-dev (43560eec).
+ * Built against design-guidelines 0.2.0-dev (8c2cd94f).
  *
  * This stylesheet holds ALL of Civic Calm's visual decisions. @govnepal/ui adds only behavior
  * (ARIA, keyboard, focus management) on top of these classes — so a plain-HTML site or a CMS
@@ -1830,6 +1830,146 @@ a:visited,
   color: var(--gov-color-text-secondary);
 }
 
+/* Officer + citizen navigation and government display components (batch C). */
+
+/* Bottom navigation — mobile primary nav, fixed, labels always shown. */
+.gov-bottom-nav {
+  display: flex;
+  border-block-start: var(--gov-border-width-sm) solid var(--gov-color-border-default);
+  background: var(--gov-color-background-surface);
+}
+
+.gov-bottom-nav__item {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--gov-space-1);
+  min-block-size: var(--gov-target-recommended-size);
+  padding: var(--gov-space-2);
+  text-decoration: none;
+  color: var(--gov-color-text-secondary);
+  font-size: var(--gov-type-caption-font-size);
+}
+
+.gov-bottom-nav__item[aria-current="page"] {
+  color: var(--gov-color-interactive-selected-indicator);
+  font-weight: var(--gov-font-weight-semibold);
+}
+
+/* Sidebar — officer left rail. */
+.gov-sidebar {
+  display: flex;
+  flex-direction: column;
+  gap: var(--gov-space-1);
+  padding: var(--gov-space-3);
+  background: var(--gov-color-background-secondary);
+  border-inline-end: var(--gov-border-width-sm) solid var(--gov-color-border-default);
+}
+
+.gov-sidebar__link {
+  display: block;
+  padding: var(--gov-space-2) var(--gov-space-3);
+  border-radius: var(--gov-radius-sm);
+  text-decoration: none;
+  color: var(--gov-color-text-primary);
+  min-block-size: var(--gov-target-min-size);
+}
+
+.gov-sidebar__link[aria-current="page"] {
+  background: var(--gov-color-interactive-selected-background);
+  font-weight: var(--gov-font-weight-semibold);
+}
+
+/* Status tracker — vertical list of taxonomy statuses. */
+.gov-status-tracker {
+  list-style: none;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: var(--gov-space-4);
+}
+
+.gov-status-tracker__step {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--gov-space-3);
+  color: var(--gov-color-text-secondary);
+}
+
+.gov-status-tracker__step--complete { color: var(--gov-color-status-success-text); }
+.gov-status-tracker__step--current {
+  color: var(--gov-color-text-primary);
+  font-weight: var(--gov-font-weight-semibold);
+}
+
+.gov-status-tracker__marker {
+  inline-size: 24px;
+  block-size: 24px;
+  flex-shrink: 0;
+  border-radius: var(--gov-radius-full);
+  border: var(--gov-border-width-md) solid currentColor;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  font-size: var(--gov-type-small-font-size);
+}
+
+/* Audit log item — an immutable record row. */
+.gov-audit-item {
+  padding-block: var(--gov-space-3);
+  border-block-end: var(--gov-border-width-sm) solid var(--gov-color-border-default);
+}
+
+.gov-audit-item__meta {
+  color: var(--gov-color-text-secondary);
+  font-size: var(--gov-type-small-font-size);
+}
+
+.gov-audit-item__ref { font-family: var(--gov-font-family-mono); }
+
+/* Feedback widget — "was this page useful?" plus a report link. */
+.gov-feedback {
+  border-block-start: var(--gov-border-width-sm) solid var(--gov-color-border-default);
+  padding-block: var(--gov-space-4);
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: var(--gov-space-3);
+}
+
+/* Biometric capture status indicators (batch C, NID). Status by icon + text + colour, never
+ * colour alone (§4.1); the raw biometric sample is NEVER rendered (§9.1). */
+.gov-capture-status {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--gov-space-2);
+  padding: var(--gov-space-3);
+  border: var(--gov-border-width-md) solid var(--gov-color-border-default);
+  border-radius: var(--gov-radius-md);
+}
+
+.gov-capture-status__icon {
+  inline-size: var(--gov-icon-size-lg, 24px);
+  block-size: var(--gov-icon-size-lg, 24px);
+  flex-shrink: 0;
+}
+
+.gov-capture-status--pass { border-color: var(--gov-color-status-success-border); color: var(--gov-color-status-success-text); }
+.gov-capture-status--retry { border-color: var(--gov-color-status-warning-border); color: var(--gov-color-status-warning-text); }
+.gov-capture-status--error { border-color: var(--gov-color-status-error-border); color: var(--gov-color-status-error-text); }
+
+.gov-capture-frame {
+  aspect-ratio: 4 / 3;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: var(--gov-color-background-inverse);
+  color: var(--gov-color-text-inverse);
+  border-radius: var(--gov-radius-md);
+  border: var(--gov-border-width-lg) dashed var(--gov-color-border-strong);
+}
+
 /* National identity marks — the emblem and flag (identity/emblem, identity/flag).
  *
  * Base sizing only. Both are <img> of verified masters; neither is boxed, recoloured, or given a

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@govnepal/css",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Civic Calm — the framework-agnostic stylesheet. Semantic HTML plus .gov-* classes, no JavaScript.",
   "license": "MIT",
   "type": "module",