Enhancing Portfolio Stats with Themed Badges in Landing

This post details the recent enhancements made to the landing project, specifically focusing on displaying badges on portfolio stats views across all available themes.

The Feature

The primary goal was to ensure that badges, which were already integrated into index views, are now consistently displayed on the statistics pages. This involved querying and passing badge data to the relevant stats views and implementing theme-specific styling to maintain visual coherence across all eight theme variants.

Implementation Details

To achieve this, the tenantStatsData() function was extended to include the badge query. A new stats-badges partial was created, incorporating theme-specific styling to ensure seamless integration across all theme variations. This approach provides a flexible and maintainable solution for displaying badges in a visually consistent manner.

Consider a simplified example of how badge data might be structured and passed to the view in PHP:

<?php

$statsData = [
    'totalProjects' => 42,
    'activeProjects' => 12,
    'completedProjects' => 30,
    'badges' => [
        ['name' => 'Top Performer', 'color' => 'green'],
        ['name' => 'Most Active', 'color' => 'blue']
    ]
];

// Pass $statsData to the view
?>

In this example, the $statsData array contains statistical information about the portfolio, including an array of badges with their respective names and colors. This data can then be used within the stats-badges partial to render the badges with appropriate styling based on the selected theme.

Benefits

By consistently displaying badges across all portfolio views, users gain a more comprehensive understanding of their achievements and performance. The theme-specific styling ensures a visually appealing and cohesive user experience, regardless of the chosen theme. This enhancement contributes to a more engaging and informative portfolio presentation.