Skip to content

Commit b0ee912

Browse files
authored
Merge branch 'develop' into filip/v19/improve-was-completed-check
2 parents 4d6f941 + e61ca98 commit b0ee912

87 files changed

Lines changed: 2298 additions & 1219 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

CHANGELOG.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,10 @@
11

2+
= 1.8.0 =
3+
4+
Enhancements:
5+
6+
* Redesign of the admin pages.
7+
28
= 1.7.2 =
39

410
* Backported some features from the Progress Planner Pro plugin.

assets/css/admin.css

Lines changed: 43 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -53,14 +53,34 @@
5353
--prpl-font-size-6xl: 4.5rem; /* 72px */
5454
}
5555

56+
/*------------------------------------*\
57+
Progress Planner dashboard page.
58+
\*------------------------------------*/
59+
/* stylelint-disable-next-line selector-class-pattern */
60+
body.toplevel_page_progress-planner {
61+
62+
#wpwrap {
63+
background-color: #f6f7f9;
64+
}
65+
66+
ul#adminmenu {
67+
68+
a.wp-has-current-submenu,
69+
>li.current > a.current {
70+
71+
&::after {
72+
border-right-color: #f6f7f9 !important;
73+
}
74+
}
75+
}
76+
}
77+
5678
/*------------------------------------*\
5779
Styles for the container of the page.
5880
\*------------------------------------*/
5981
.prpl-wrap {
60-
background: #fff;
61-
border: 1px solid var(--prpl-color-gray-2);
6282
border-radius: var(--prpl-border-radius);
63-
padding: var(--prpl-settings-page-gap) calc(var(--prpl-padding) * 2);
83+
padding: var(--prpl-settings-page-gap) var(--prpl-padding);
6484
max-width: var(--prpl-container-max-width);
6585
color: var(--prpl-color-text);
6686
font-size: var(--prpl-font-size-base);
@@ -100,6 +120,14 @@
100120
color: var(--prpl-color-link);
101121
}
102122

123+
.prpl-widget-width-2 {
124+
grid-column: span 2;
125+
126+
.prpl-widget-description {
127+
max-width: 640px;
128+
}
129+
}
130+
103131
.prpl-widget-title {
104132
margin-top: 0;
105133
font-size: 1.375rem;
@@ -193,6 +221,7 @@ button.prpl-info-icon {
193221
padding: 0.4em;
194222

195223
/* color: var(--prpl-color-gray-2); */
224+
background-color: #fff;
196225
border: 1px solid var(--prpl-color-gray-2);
197226
border-radius: var(--prpl-border-radius);
198227

@@ -221,6 +250,7 @@ button.prpl-info-icon {
221250
grid-template-columns: repeat(auto-fit, minmax(var(--prpl-column-min-width), 1fr));
222251
column-gap: var(--prpl-gap);
223252
grid-auto-rows: var(--prpl-gap);
253+
grid-auto-flow: dense;
224254

225255
img {
226256
max-width: 100%;
@@ -237,6 +267,7 @@ button.prpl-info-icon {
237267
Generic styles for individual widgets.
238268
\*------------------------------------*/
239269
.prpl-widget-wrapper {
270+
background-color: #fff;
240271
border: 1px solid var(--prpl-color-gray-2);
241272
border-radius: var(--prpl-border-radius);
242273
padding: var(--prpl-padding);
@@ -250,6 +281,11 @@ button.prpl-info-icon {
250281
margin-bottom: 1.25rem;
251282
border-top-color: var(--prpl-color-gray-2);
252283
}
284+
285+
/* Force the last column to be the last column. */
286+
&[data-force-last-column="1"] {
287+
grid-column: -2 / -1;
288+
}
253289
}
254290

255291
/*------------------------------------*\
@@ -422,6 +458,10 @@ button.prpl-info-icon {
422458
.prpl-welcome .inner-content .right {
423459
display: none !important;
424460
}
461+
462+
.prpl-widget-width-2 {
463+
grid-column: span 1;
464+
}
425465
}
426466

427467
/*------------------------------------*\

assets/css/page-widgets/badge-streak.css

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -76,3 +76,48 @@
7676
.string-freeze-explain {
7777
max-width: 42em;
7878
}
79+
80+
.prpl-widget-wrapper.prpl-badge-streak,
81+
.prpl-widget-wrapper.prpl-badge-streak-content,
82+
.prpl-widget-wrapper.prpl-badge-streak-maintenance {
83+
display: flex;
84+
flex-direction: column;
85+
justify-content: space-between;
86+
87+
.progress-label {
88+
display: inline-block;
89+
}
90+
91+
.progress-wrapper {
92+
display: grid;
93+
grid-template-columns: 1fr 1fr 1fr;
94+
gap: calc(var(--prpl-gap) / 2);
95+
96+
&:not(:first-child) {
97+
margin-top: var(--prpl-padding);
98+
}
99+
100+
.prpl-badge {
101+
display: flex;
102+
flex-direction: column;
103+
align-items: center;
104+
flex-wrap: wrap;
105+
min-width: 0;
106+
}
107+
108+
p {
109+
margin: 0;
110+
font-size: var(--prpl-font-size-small);
111+
text-align: center;
112+
line-height: 1.2;
113+
}
114+
}
115+
116+
.prpl-widget-content {
117+
margin-bottom: 1em;
118+
}
119+
120+
.badge-group-monthly {
121+
background-color: transparent;
122+
}
123+
}
Lines changed: 168 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,168 @@
1+
/**
2+
* Suggested tasks widget.
3+
*
4+
* Dependencies: progress-planner/web-components/prpl-badge
5+
*/
6+
7+
@media all and (min-width: 1400px) {
8+
9+
.prpl-widget-wrapper.prpl-monthly-badges {
10+
grid-row-start: 1;
11+
grid-column-start: 3;
12+
}
13+
}
14+
15+
.prpl-widget-wrapper.prpl-monthly-badges {
16+
17+
/* Remove styling from the widget wrapper (but not in popover view). */
18+
& > .widget-inner-container .prpl-widget-content > .prpl-widget-wrapper:has(.badge-group-monthly) {
19+
padding: 0;
20+
border: none;
21+
box-shadow: none;
22+
margin-bottom: 0;
23+
}
24+
25+
.badge-group-monthly {
26+
27+
28+
.prpl-badge-row-wrapper {
29+
30+
display: grid;
31+
grid-template-columns: 1fr 1fr 1fr;
32+
gap: calc(var(--prpl-gap) / 2);
33+
}
34+
35+
p {
36+
margin: 0;
37+
font-size: var(--prpl-font-size-small);
38+
text-align: center;
39+
line-height: 1.2;
40+
}
41+
}
42+
43+
.prpl-widget-content {
44+
margin-bottom: 1em;
45+
46+
&:last-child {
47+
margin-bottom: 0;
48+
}
49+
}
50+
51+
.prpl-widget-content-points {
52+
display: flex;
53+
justify-content: space-between;
54+
align-items: center;
55+
56+
.prpl-widget-content-points-number {
57+
font-size: var(--prpl-font-size-3xl);
58+
font-weight: 600;
59+
}
60+
}
61+
}
62+
63+
/*------------------------------------*\
64+
Popover styles.
65+
\*------------------------------------*/
66+
#prpl-popover-monthly-badges {
67+
68+
.prpl-widgets-container {
69+
display: grid;
70+
grid-template-columns: repeat(auto-fit, minmax(var(--prpl-column-min-width), 1fr));
71+
grid-gap: var(--prpl-gap);
72+
grid-auto-rows: auto;
73+
}
74+
75+
.prpl-widget-title {
76+
padding: 0.5rem 1rem;
77+
border-radius: 0.5rem;
78+
background: var(--prpl-background-orange);
79+
}
80+
81+
.badge-group-monthly {
82+
background-color: transparent;
83+
}
84+
85+
.prpl-widget-wrapper-content {
86+
87+
.prpl-widget-title {
88+
background: var(--prpl-background-blue);
89+
}
90+
91+
.badge-group-content {
92+
background-color: transparent;
93+
}
94+
}
95+
96+
.prpl-widget-wrapper-maintenance {
97+
98+
.prpl-widget-title {
99+
background: var(--prpl-background-red);
100+
}
101+
102+
.badge-group-maintenance {
103+
background-color: transparent;
104+
}
105+
}
106+
}
107+
108+
/* This is the badge streak widget. */
109+
.prpl-widget-wrapper.prpl-badge-streak {
110+
display: flex;
111+
flex-direction: column;
112+
justify-content: space-between;
113+
114+
.progress-label {
115+
display: inline-block;
116+
}
117+
118+
.progress-wrapper {
119+
display: grid;
120+
grid-template-columns: 1fr 1fr 1fr;
121+
gap: calc(var(--prpl-gap) / 4);
122+
padding: calc(var(--prpl-padding) / 2);
123+
border-radius: var(--prpl-border-radius-big);
124+
125+
&:not(:first-child) {
126+
margin-top: var(--prpl-padding);
127+
}
128+
129+
&.badge-group-content {
130+
background: var(--prpl-background-blue);
131+
}
132+
133+
&.badge-group-maintenance {
134+
background: var(--prpl-background-red);
135+
}
136+
137+
.prpl-badge {
138+
display: flex;
139+
flex-direction: column;
140+
align-items: center;
141+
justify-content: flex-start;
142+
flex-wrap: wrap;
143+
min-width: 0;
144+
}
145+
146+
p {
147+
margin: 0;
148+
font-size: var(--prpl-font-size-small);
149+
text-align: center;
150+
line-height: 1.2;
151+
}
152+
}
153+
154+
.prpl-widget-content {
155+
margin-bottom: 1em;
156+
}
157+
158+
.badge-group-monthly {
159+
background-color: transparent;
160+
}
161+
}
162+
163+
#prpl-popover-monthly-badges-trigger {
164+
font-size: var(--prpl-font-size-base);
165+
color: var(--prpl-color-link);
166+
text-decoration: underline;
167+
margin-top: 1.25rem;
168+
}

0 commit comments

Comments
 (0)