Skip to content

Commit

Permalink
more tweaks for the popup
Browse files Browse the repository at this point in the history
  • Loading branch information
@aristath
aristath committed Apr 9, 2024
1 parent 5e8b629 commit 9ccb92b
Show file tree
Hide file tree
Showing 2 changed files with 56 additions and 39 deletions.
16 changes: 13 additions & 3 deletions assets/css/admin.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -526,7 +526,7 @@ button.prpl-info-icon {
border-radius: var(--prpl-border-radius);
padding: var(--prpl-padding);
z-index: 1001;
min-width: 300px;
min-width: 80%;
min-height: 200px;
}

Expand All @@ -552,7 +552,7 @@ body.prpl-popup-open.prpl-popup-badges-details #prpl-popup-badges-details {
#popup-badges-content {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: var(--prpl-gap);
grid-gap: var(--prpl-padding);
}

#popup-badges-content .inner {
Expand All @@ -579,7 +579,7 @@ body.prpl-popup-open.prpl-popup-badges-details #prpl-popup-badges-details {
#prpl-popup-badges-details .indicators-maintenance {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: var(--prpl-gap);
grid-gap: var(--prpl-padding);
}

#prpl-popup-badges-details .indicators-maintenance .indicator {
Expand All @@ -593,3 +593,13 @@ body.prpl-popup-open.prpl-popup-badges-details #prpl-popup-badges-details {
font-weight: 500;
display: block;
}

#prpl-popup-badges-details .prpl-widgets-container {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(var(--prpl-column-min-width), 1fr));
grid-gap: var(--prpl-gap);
}

.string-freeze-explain {
max-width: 42em;
}
79 changes: 43 additions & 36 deletions classes/popups/class-badges.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,50 +46,57 @@ final class Badges extends Popup {
*/
protected function the_content() {
?>
<h2><?php esc_html_e( 'You are on the right track!', 'progress-planner' ); ?></h2>
<p><?php esc_html_e( 'Find out what you can do next, to collect all the badges and become a Progress Planner Professional!', 'progress-planner' ); ?></p>
<h2><?php \esc_html_e( 'You are on the right track!', 'progress-planner' ); ?></h2>
<p><?php \esc_html_e( 'Find out what you can do next, to collect all the badges and become a Progress Planner Professional!', 'progress-planner' ); ?></p>

<div class="prpl-widgets-container">
<div class="prpl-column-container">
<div class="prpl-column">
<div class="prpl-widget-wrapper">
<h3><?php esc_html_e( 'Don’t break your streak by missing a week!', 'progress-planner' ); ?></h3>
<p><?php esc_html_e( 'Do at least one activity on your website every week. That could be publishing or adding content and updating a post or updating a plugin. Not able to work on your site? Use your streak freeze.', 'progress-planner' ); ?></p>
<div id="popup-badges-content">
<?php $this->print_badges( 'maintenance' ); ?>
</div>
<div class="progress-badges">
<span class="badges-popup-progress-total">
<span style="width: <?php echo (int) Root_Badges::get_badge_progress( 'super-site-specialist' )['progress']; ?>%"></span>
</span>
<div class="indicators-maintenance">
<?php foreach ( self::BADGES['maintenance'] as $badge ) : ?>
<div class="indicator">
<?php $badge_progress = Root_Badges::get_badge_progress( $badge ); ?>
<span class="indicator-label">
<?php if ( 0 === (int) $badge_progress['remaining'] ) : ?>
✔️
<?php else : ?>
<?php
printf(
/* translators: The number of weeks remaining to complete the badge. */
esc_html__( '%s weeks to go', 'progress-planner' ),
'<span class="number">' . (int) $badge_progress['remaining'] . '</span>'
);
?>
<?php endif; ?>
</span>
</div>
<?php endforeach; ?>
<div class="prpl-widget-wrapper">
<h3><?php \esc_html_e( 'Don’t break your streak by missing a week!', 'progress-planner' ); ?></h3>
<p><?php \esc_html_e( 'Do at least one activity on your website every week. That could be publishing or adding content and updating a post or updating a plugin. Not able to work on your site? Use your streak freeze.', 'progress-planner' ); ?></p>
<div id="popup-badges-content">
<?php $this->print_badges( 'maintenance' ); ?>
</div>
<div class="progress-badges">
<span class="badges-popup-progress-total">
<span style="width: <?php echo (int) Root_Badges::get_badge_progress( 'super-site-specialist' )['progress']; ?>%"></span>
</span>
<div class="indicators-maintenance">
<?php foreach ( self::BADGES['maintenance'] as $badge ) : ?>
<div class="indicator">
<?php $badge_progress = Root_Badges::get_badge_progress( $badge ); ?>
<span class="indicator-label">
<?php if ( 0 === (int) $badge_progress['remaining'] ) : ?>
✔️
<?php else : ?>
<?php
printf(
/* translators: The number of weeks remaining to complete the badge. */
\esc_html__( '%s weeks to go', 'progress-planner' ),
'<span class="number">' . (int) $badge_progress['remaining'] . '</span>'
);
?>
<?php endif; ?>
</span>
</div>
</div>
<?php endforeach; ?>
</div>
</div>
</div>

<h2><?php esc_html_e( 'Streak freeze', 'progress-planner' ); ?></h2>
<p><?php esc_html_e( 'Going on a holiday? Don\'t have time to work on your site? You can skip your website maintenance for a maximum of one weeks. Your streak will continue afterward.', 'progress-planner' ); ?></p>
<div class="prpl-widget-wrapper">
<h3><?php \esc_html_e( 'Keep adding post and pages', 'progress-planner' ); ?></h3>
<p><?php \esc_html_e( 'The more you write, the closer you come to winning your badges. You can earn level 1 of this badge immediately after installing the plugin if you have written more than 200 posts.', 'progress-planner' ); ?></p>
<div id="popup-badges-content">
<?php $this->print_badges( 'content' ); ?>
</div>
</div>
</div>
<div class="footer">
<div class="string-freeze-explain">
<h2><?php \esc_html_e( 'Streak freeze', 'progress-planner' ); ?></h2>
<p><?php \esc_html_e( 'Going on a holiday? Don\'t have time to work on your site? You can skip your website maintenance for a maximum of one weeks. Your streak will continue afterward.', 'progress-planner' ); ?></p>
</div>
</div>
<?php
}

Expand Down

0 comments on commit 9ccb92b

Please sign in to comment.