Skip to content

Commit eb31d2a

Browse files
aristatharistath
committed
Yet another UX improvement
1 parent 3f03373 commit eb31d2a

2 files changed

Lines changed: 42 additions & 27 deletions

File tree

‎assets/js/web-components/prpl-gauge.js‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -270,5 +270,18 @@ const prplUpdatePreviousMonthBadgeProgressBar = ( pointsDiff ) => {
270270
`.prpl-previous-month-badge-progress-bar-wrapper[data-badge-id="${ badgeId }"]`
271271
)
272272
?.remove();
273+
274+
// If there are no more progress bars, remove the previous month badge progress bar wrapper.
275+
if (
276+
! document.querySelector(
277+
'.prpl-previous-month-badge-progress-bar-wrapper'
278+
)
279+
) {
280+
document
281+
.querySelector(
282+
'.prpl-previous-month-badge-progress-bars-wrapper'
283+
)
284+
?.remove();
285+
}
273286
}
274287
};

‎views/page-widgets/suggested-tasks.php‎

Lines changed: 29 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -62,36 +62,38 @@
6262
</div>
6363

6464
<?php if ( ! empty( $prpl_widget->get_previous_incomplete_months_badges() ) ) : ?>
65-
<h3><?php \esc_html_e( 'Oh no! You missed the previous monthly badge!', 'progress-planner' ); ?></h3>
66-
<p><?php echo \wp_kses( __( 'No worries though! <strong>Collect the surplus of points</strong> you earn, and get your badge!', 'progress-planner' ), [ 'strong' => [] ] ); ?></p>
67-
<?php foreach ( $prpl_widget->get_previous_incomplete_months_badges() as $prpl_previous_incomplete_month_badge ) : ?>
68-
<div
69-
class="prpl-previous-month-badge-progress-bar-wrapper"
70-
style="padding: 1rem 0; background-color: var(--prpl-background-orange); border-radius: 0.5rem; padding: 1rem;"
71-
data-badge-id="<?php echo esc_attr( $prpl_previous_incomplete_month_badge->get_id() ); ?>"
72-
>
73-
<prpl-badge-progress-bar
65+
<div class="prpl-previous-month-badge-progress-bars-wrapper">
66+
<h3><?php \esc_html_e( 'Oh no! You missed the previous monthly badge!', 'progress-planner' ); ?></h3>
67+
<p><?php echo \wp_kses( __( 'No worries though! <strong>Collect the surplus of points</strong> you earn, and get your badge!', 'progress-planner' ), [ 'strong' => [] ] ); ?></p>
68+
<?php foreach ( $prpl_widget->get_previous_incomplete_months_badges() as $prpl_previous_incomplete_month_badge ) : ?>
69+
<div
70+
class="prpl-previous-month-badge-progress-bar-wrapper"
71+
style="padding: 1rem 0; background-color: var(--prpl-background-orange); border-radius: 0.5rem; padding: 1rem;"
7472
data-badge-id="<?php echo esc_attr( $prpl_previous_incomplete_month_badge->get_id() ); ?>"
75-
data-points="<?php echo (int) $prpl_previous_incomplete_month_badge->progress_callback()['points']; ?>"
76-
data-max-points="<?php echo (int) Monthly::TARGET_POINTS; ?>"
77-
></prpl-badge-progress-bar>
73+
>
74+
<prpl-badge-progress-bar
75+
data-badge-id="<?php echo esc_attr( $prpl_previous_incomplete_month_badge->get_id() ); ?>"
76+
data-points="<?php echo (int) $prpl_previous_incomplete_month_badge->progress_callback()['points']; ?>"
77+
data-max-points="<?php echo (int) Monthly::TARGET_POINTS; ?>"
78+
></prpl-badge-progress-bar>
7879

79-
<div class="prpl-widget-content-points">
80-
<span class="prpl-widget-previous-ravi-points-number" class="prpl-widget-content-points-number">
81-
<?php echo (int) $prpl_previous_incomplete_month_badge->progress_callback()['points']; ?>pt
82-
</span>
83-
<span class="prpl-previous-month-badge-progress-bar-remaining" data-remaining="<?php echo (int) $prpl_previous_incomplete_month_badge->progress_callback()['remaining']; ?>">
84-
<?php
85-
printf(
86-
/* translators: %d: The number of points. */
87-
\esc_html__( 'Only %d more points to go', 'progress-planner' ),
88-
(int) $prpl_previous_incomplete_month_badge->progress_callback()['remaining']
89-
);
90-
?>
91-
</span>
80+
<div class="prpl-widget-content-points">
81+
<span class="prpl-widget-previous-ravi-points-number" class="prpl-widget-content-points-number">
82+
<?php echo (int) $prpl_previous_incomplete_month_badge->progress_callback()['points']; ?>pt
83+
</span>
84+
<span class="prpl-previous-month-badge-progress-bar-remaining" data-remaining="<?php echo (int) $prpl_previous_incomplete_month_badge->progress_callback()['remaining']; ?>">
85+
<?php
86+
printf(
87+
/* translators: %d: The number of points. */
88+
\esc_html__( 'Only %d more points to go', 'progress-planner' ),
89+
(int) $prpl_previous_incomplete_month_badge->progress_callback()['remaining']
90+
);
91+
?>
92+
</span>
93+
</div>
9294
</div>
93-
</div>
94-
<?php endforeach; ?>
95+
<?php endforeach; ?>
96+
</div>
9597
<?php endif; ?>
9698

9799
<hr>

0 commit comments

Comments
 (0)