🏗️ UHCONST - Admin Dashboard

Pioneering Construction Intelligence.

A premium, high-performance admin dashboard designed for managing construction calculators, user data, and SEO metadata with an elite UI experience.

View Live Demo • Report Bug • Request Feature

---

📋 Overview

UHCONST (Ultimate Construction Intelligence) is a comprehensive digital infrastructure designed to streamline construction analytics. This repository contains the Admin Panel, a robust front-end interface that allows administrators to oversee the platform's core functionalities, including calculator management, user tracking, media assets, and system settings.

The design philosophy focuses on Glassmorphism, Modern Typography, and Smooth Animations to provide a "Wow" user experience, moving beyond standard administrative interfaces to create something truly professional.

---

🚀 Key Features

📊 Core Dashboard

• Real-time Analytics: Visual data representation using Chart.js.
• Usage Tracking: Interactive widgets tracking weekly and daily usage of calculator tools.
• System Health: Instant view of user counts, active sessions, and key performance metrics.

🧮 Calculator Management

• Grid Architecture: Organized display of 8+ engineering tools (Conversion, Cost, Concrete, etc.).
• Visual Icons: Custom iconography for quick tool identification and better UX.
• Configuration Hub: Streamlined interface for updating calculator formulas and settings.

👥 User Administration

• Responsive Tables: Advanced user listings with avatars, emails, and status indicators.
• CRUD Operations: Direct access to view user details, edit profiles, or remove accounts.
• Smart Pagination: Built-in navigation for efficiently managing large datasets.

🎨 Elite UI/UX Design

• "Wow" About Page: Features a floating glass-morphism stats bar and parallax scrolling effects.
• Media Library: Gallery-style asset manager with hover effects and upload simulation.
• Responsive Sidebar: Collapsible navigation with active state highlighting and smooth transitions.
• Glassmorphism: Modern design language utilizing blur effects and translucent layers.

⚙️ System Utilities

• SEO Manager: Interface to edit meta titles, descriptions, and keywords for better ranking.
• FAQ Editor: Accordion-style management for help documentation.
• Legal Docs: Structured views for Privacy Policy and Terms.
• Secure Auth Flow: Professional Login and Logout confirmation screens with validation.

---

🛠️ Tech Stack

This project is built using pure, high-performance web technologies, ensuring maximum speed and zero dependencies on heavy frameworks.

Category	Technology	Description
Structure		Semantic markup and accessibility-focused layout.
Styling		Flexbox, Grid, CSS Variables, Animations, Glassmorphism.
Logic		DOM manipulation, Sidebar logic, Chart rendering.
Visualization	Chart.js	Responsive and interactive data visualization library.
Icons	Remix Icons	Professional, open-source icon set.
Typography	Google Fonts	'Poppins' typeface for a modern, clean aesthetic.

---

⚡ Getting Started

Since this is a static web application, getting started is incredibly simple.

Prerequisites

• A modern web browser (Chrome, Firefox, Edge, Safari).
• A code editor (VS Code recommended) if you wish to edit the source code.

Installation

1. Clone the repository

   git clone [https://github.com/aliza-dev/uhconst-admin-dashboard.git](https://github.com/aliza-dev/uhconst-admin-dashboard.git)

2. Navigate to the project directory

   cd uhconst-admin-dashboard

3. Launch the application

   • Option A: Simply double-click index.html to start from the login screen.
   • Option B (Recommended): Use the "Live Server" extension in VS Code to run a local development server.

---

📂 Project Structure

uhconst-admin-dashboard/
│
├── css/                   # Stylesheets
│   ├── style.css          # Global resets and typography
│   ├── dashboard.css      # Main layout and sidebar styles
│   ├── calculators.css    # Specific styles for grid cards
│   ├── users.css          # Table styles
│   └── faqs.css           # Accordion styles
│
├── js/                    # Scripts
│   ├── dashboard.js       # Sidebar logic and Chart.js config
│   └── main.js            # General interactions
│
├── index.html             # Entry Point (Login Page)
├── dashboard.html         # Main Analytics Hub
├── calculators.html       # Tools Management
├── users.html             # User Data Table
├── user-details.html      # Individual User View
├── seo-meta.html          # SEO Settings
├── media-library.html     # Image Gallery
├── faqs.html              # FAQ Accordion
├── about.html             # Elite "About Us" Page
├── privacy-policy.html    # Policy Documentation
├── settings.html          # Admin Settings
├── notifications.html     # System Alerts
├── contact.html           # Contact Support
├── logout.html            # Logout Confirmation
└── README.md              # Documentation

🤝 Contributing
Contributions are what make the open-source community such an amazing place to learn, inspire, and create. We welcome contributions from everyone.

Fork the Project

Create your Feature Branch (git checkout -b feature/AmazingFeature)

Commit your Changes (git commit -m 'Add some AmazingFeature')

Push to the Branch (git push origin feature/AmazingFeature)

Open a Pull Request

📞 Contact
Aliza Tariq - Lead Developer

Project Link: https://github.com/aliza-dev/uhconst-admin-dashboard

🙏 Acknowledgments
A special thanks to the resources and communities that made this project possible:

Icons: Remix Icon

Fonts: Google Fonts

Charts: Chart.js

Inspiration: Modern Glassmorphism Design Concepts

📄 License
Distributed under the MIT License. See LICENSE for more information.

<div align="center"> <br /> <strong>UHCONST</strong> — Setting the benchmark in construction analytics. <br /> Developed with ❤️ for Builders & Engineers. </div>