63070fd90c
- Added stats cards to display active, completed, overdue, and due-today tasks on the dashboard. - Implemented search functionality to filter tasks in real-time based on user input. - Introduced quick-pick date buttons for easier task date selection. - Updated task rendering logic to handle empty states for task lists. - Improved overall user interface with new CSS styles for stat cards and buttons. chore: Update environment variables and backend error handling - Fixed formatting in the .env file for consistency. - Enhanced error handling in the backend API for better debugging. feat: Revamp frontend pages with new features and pricing sections - Redesigned the index.html page to include a hero section and feature highlights. - Created a new features page with dynamic loading of features from JSON. - Implemented a pricing page that loads plans from JSON and highlights the featured plan. - Added support and FAQ sections with dynamic content loading and contact form functionality. - Introduced JSON files for FAQs, features, and pricing to allow easy updates without code changes.
49 lines
1.5 KiB
JavaScript
49 lines
1.5 KiB
JavaScript
/**
|
|
* features.js
|
|
*
|
|
* Powers the Features page.
|
|
*
|
|
* Features:
|
|
* - Loads the feature list from `./data/features.json` via fetch().
|
|
* - Dynamically renders each feature as a Bootstrap card (icon,
|
|
* title, description) inside the #featuresContainer grid.
|
|
* - Shows an error message if the JSON file cannot be loaded.
|
|
*
|
|
* The feature list lives in JSON so that marketing can add, remove
|
|
* or reorder features without the page template changing.
|
|
*/
|
|
|
|
const featuresContainer = document.getElementById('featuresContainer');
|
|
|
|
async function loadFeatures() {
|
|
try {
|
|
const response = await fetch('./data/features.json');
|
|
if (!response.ok) {
|
|
throw new Error(`Failed to load features: ${response.status}`);
|
|
}
|
|
const data = await response.json();
|
|
renderFeatures(data.features);
|
|
} catch (error) {
|
|
console.error('Error:', error);
|
|
featuresContainer.innerHTML = `<p class="text-white text-center">Unable to load features.</p>`;
|
|
}
|
|
}
|
|
|
|
function renderFeatures(features) {
|
|
featuresContainer.innerHTML = '';
|
|
features.forEach(f => {
|
|
const col = document.createElement('div');
|
|
col.className = 'col-12 col-md-6 col-lg-4 mb-4';
|
|
col.innerHTML = `
|
|
<div class="rounded shadow bg-translucent p-4 h-100 text-white">
|
|
<img src="${f.icon}" alt="" height="48" width="auto" class="mb-3">
|
|
<h3 class="h5">${f.title}</h3>
|
|
<p class="text-white-50 mb-0">${f.description}</p>
|
|
</div>
|
|
`;
|
|
featuresContainer.appendChild(col);
|
|
});
|
|
}
|
|
|
|
window.addEventListener('DOMContentLoaded', loadFeatures);
|