Skip to content

Commit 8906d78

Browse files
joshbrucejoshbruce
committed
add: The 5 Ps
1 parent 67ba156 commit 8906d78

7 files changed

Lines changed: 253 additions & 94 deletions

File tree

‎site-root/public/css/main.css‎

Lines changed: 99 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,43 @@
11
@charset "UTF-8";
22
@font-face {
3-
font-family: "hyper-reg";
4-
font-weight: 400;
5-
font-style: normal;
6-
src: url(/fonts/Atkinson-Hyperlegible-Regular-102a.woff2);
7-
font-display:block
3+
font-family: "hyper-reg";
4+
font-weight: 400;
5+
font-style: normal;
6+
src: url(/fonts/Atkinson-Hyperlegible-Regular-102a.woff2);
7+
font-display:block
88
}git
99

1010
@font-face {
11-
font-family: "hyper-bold";
12-
font-weight: 700;
13-
font-style: normal;
14-
src: url(/fonts/Atkinson-Hyperlegible-Bold-102a.woff2);
15-
font-display:block
11+
font-family: "hyper-bold";
12+
font-weight: 700;
13+
font-style: normal;
14+
src: url(/fonts/Atkinson-Hyperlegible-Bold-102a.woff2);
15+
font-display:block
1616
}
1717

1818
:root {
19-
--header-font: "hyper-bold", Verdana, Geneva, sans-serif;
20-
--body-font: "hyper-reg", Verdana, Geneva, sans-serif;
19+
--header-font: "hyper-bold", Verdana, Geneva, sans-serif;
20+
--body-font: "hyper-reg", Verdana, Geneva, sans-serif;
2121

22-
--color-black: hsla(0, 0%, 0%, 1);
23-
--color-white: hsla(10, 100%, 100%, 1);
24-
--color-theme: hsla(10, 98%, 26%, 1);
22+
--color-black: hsla(0, 0%, 0%, 1);
23+
--color-white: hsla(10, 100%, 100%, 1);
24+
--color-theme: hsla(10, 98%, 26%, 1);
2525

26-
--icon-new-window: "⧉";
26+
--icon-new-window: "⧉";
2727
}
2828

2929
* {
30-
font-family: var(--body-font);
30+
font-family: var(--body-font);
3131
}
3232

3333
h1,
3434
h2,
3535
h3 {
36-
font-family: var(--header-font);
36+
font-family: var(--header-font);
3737
}
3838

3939
li {
40-
padding: 0.5rem 0rem;
40+
padding: 0.5rem 0rem;
4141
}
4242

4343
a[rel~=noreferrer]:after{
@@ -50,59 +50,59 @@ a[rel~=noreferrer]:after{
5050
}
5151

5252
h1 > a {
53-
display: block;
54-
height: 50px;
55-
width: auto;
56-
background-image: url('/ui/mark.svg');
57-
background-repeat: no-repeat;
58-
background-position: center center;
53+
display: block;
54+
height: 50px;
55+
width: auto;
56+
background-image: url('/ui/mark.svg');
57+
background-repeat: no-repeat;
58+
background-position: center center;
5959
}
6060

6161
dt {
62-
font-weight: bold;
62+
font-weight: bold;
6363
}
6464

6565
article p, article ul {
6666
line-height: 1.5rem;
6767
}
6868

6969
[is="sr-only"] {
70-
position: absolute;
71-
left: -999em;
72-
right: auto;
70+
position: absolute;
71+
left: -999em;
72+
right: auto;
7373
}
7474

7575
blockquote {
76-
margin-top: 2rem;
77-
margin-bottom: 4rem;
78-
text-align: center;
79-
font-style: italic;
80-
font-size: 1.5rem;
76+
margin-top: 2rem;
77+
margin-bottom: 4rem;
78+
text-align: center;
79+
font-style: italic;
80+
font-size: 1.5rem;
8181
}
8282

8383
article[is="home"] > section {
84-
margin-top: 4rem;
85-
padding: 2rem;
86-
padding-top: 75px;
87-
background-repeat: no-repeat;
88-
background-size: 100px auto;
89-
background-position: top center;
84+
margin-top: 4rem;
85+
padding: 2rem;
86+
padding-top: 75px;
87+
background-repeat: no-repeat;
88+
background-size: 100px auto;
89+
background-position: top center;
9090
}
9191

9292
article[is="home"] > section:first-of-type {
93-
background-image: url('/ui/icon-time.svg');
93+
background-image: url('/ui/icon-time.svg');
9494
}
9595

9696
article[is="home"] > section:nth-of-type(2) {
97-
background-image: url('/ui/icon-space.svg');
97+
background-image: url('/ui/icon-space.svg');
9898
}
9999

100100
article[is="home"] > section:last-of-type {
101-
background-image: url('/ui/icon-money.svg');
101+
background-image: url('/ui/icon-money.svg');
102102
}
103103

104104
section > h2 {
105-
text-align: center;
105+
text-align: center;
106106
}
107107

108108
section a,
@@ -111,8 +111,8 @@ nav a {
111111
text-decoration-color: var(--color-theme);
112112
text-decoration-thickness: 0.1rem;
113113
text-underline-offset: 0.1rem;
114-
transition:
115-
text-decoration-thickness 0.3s;
114+
transition:
115+
text-decoration-thickness 0.3s;
116116
}
117117

118118
section a:hover,
@@ -122,21 +122,26 @@ nav a:hover {
122122

123123
article[is="home"] > section a {
124124
display: block;
125-
padding: 1rem 0.2rem;
126-
border-radius: 5px;
125+
padding: 1rem 0.2rem;
126+
border-radius: 5px;
127127
background-color: var(--color-theme);
128128
color: var(--color-white);
129129
text-decoration: none;
130130
text-align: center;
131131
font-weight: bold;
132-
transition:
133-
background-color 0.3s,
134-
color 0.3s;
132+
transition:
133+
background-color 0.3s,
134+
color 0.3s;
135135
}
136136

137137
article[is="home"] > section a:hover {
138-
background-color: hsla(10, 74%, 90%, 1);
139-
color: hsla(10, 0%, 0%, 1);
138+
background-color: hsla(10, 74%, 90%, 1);
139+
color: hsla(10, 0%, 0%, 1);
140+
}
141+
142+
article[is="article"] {
143+
margin: 0 auto;
144+
max-width: 70ch;
140145
}
141146

142147
figure > img {
@@ -152,56 +157,56 @@ figure > figcaption {
152157
}
153158

154159
footer {
155-
margin-top: 4rem;
160+
margin-top: 4rem;
156161
}
157162

158163
footer > p {
159-
text-align: center;
164+
text-align: center;
160165
}
161166

162167
@media screen and (min-width: 700pt) {
163-
body {
164-
max-width: 800pt;
165-
margin: 0 auto;
166-
}
167-
168-
article[is="home"] {
169-
display: grid;
170-
column-gap: 2rem;
171-
min-height: 100vh;
172-
grid-template-columns: auto auto auto;
173-
}
174-
175-
article[is="home"] > section {
176-
padding-top: 100px;
177-
}
168+
body {
169+
max-width: 800pt;
170+
margin: 0 auto;
171+
}
172+
173+
article[is="home"] {
174+
display: grid;
175+
column-gap: 2rem;
176+
min-height: 100vh;
177+
grid-template-columns: auto auto auto;
178+
}
179+
180+
article[is="home"] > section {
181+
padding-top: 100px;
182+
}
178183

179184
article[is="book-details"] {
180185
grid-template-columns: auto auto;
181186
}
182187

183-
nav {
184-
text-align: center;
185-
}
186-
187-
nav > ul {
188-
margin: 0 auto;
189-
padding: 0;
190-
display: flex;
191-
list-style: none;
192-
}
193-
194-
nav > ul > li:after {
195-
content: '|';
196-
}
197-
198-
nav > ul > li:last-of-type:after {
199-
content: '';
200-
}
201-
202-
nav a,
203-
nav span {
204-
display: inline-block;
205-
padding: 1rem;
206-
}
188+
nav {
189+
text-align: center;
190+
}
191+
192+
nav > ul {
193+
margin: 0 auto;
194+
padding: 0;
195+
display: flex;
196+
list-style: none;
197+
}
198+
199+
nav > ul > li:after {
200+
content: '|';
201+
}
202+
203+
nav > ul > li:last-of-type:after {
204+
content: '';
205+
}
206+
207+
nav a,
208+
nav span {
209+
display: inline-block;
210+
padding: 1rem;
211+
}
207212
}

‎site-root/public/tools-and-resources/index.php‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<?php
2+
$relativeToRoot = '../';
3+
4+
require_once($relativeToRoot . 'constants.php');
5+
6+
$pageTitle = "Time | Mastering the Mundane";
7+
8+
$description = 'Josh Bruce is a self-proclaimed productivity super-freak and understands what itʼs like to feel like time is actively working against you. Over the years he has worked with individuals and organizations in making work suck less and increase joy in how folks spend their time.';
9+
10+
$poster = $url . '/media/poster.png';
11+
12+
require_once($relativeToRoot . 'head.php');
13+
require_once($relativeToRoot . 'header.php');
14+
?>
15+
<article is="article">
16+
<h1>Tools and Resources</h1>
17+
<ul>
18+
<li><a href="/tools-and-resources/the-5-ps/">The 5 Ps</a></li>
19+
</ul>
20+
</article>
21+
<?php require_once($relativeToRoot . 'foot.php'); ?>

‎site-root/public/tools-and-resources/the-5-ps/article.html‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<script type="application/ld+json">
2+
{
3+
"@context": "https://schema.org",
4+
"@type": "Article",
5+
"headline": "The 5 Ps by Josh Bruce",
6+
"datePublished": "2018-09-20",
7+
"dateModified": "2026-05-11",
8+
"author": {
9+
"@type": "Person",
10+
"name": "Josh Bruce"
11+
},
12+
"publisher": {
13+
"@type": "Organization",
14+
"name": "Mastering the Mundane",
15+
"logo": {
16+
"@type": "ImageObject",
17+
"url": "https://mastering-the-mundane.com/ui/mark.svg"
18+
}
19+
},
20+
"url": "https://mastering-the-mundane.com/articles/the-5-ps/"
21+
}
22+
</script>

‎site-root/public/tools-and-resources/the-5-ps/content.html‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
<h1>The 5 Ps exercise by Josh Bruce</h1>
2+
3+
<p><b>Updated:</b> May 11, 2026<br>
4+
<b>Original:</b> September 8, 2018</p>
5+
6+
<p>Fair warning, this can be a difficult exercise.</p>
7+
8+
<p>To front-load things, the 5 Ps are:</p>
9+
10+
<ul>
11+
<li>Passions: Things you do with no form of coercion or motivation; the thing itself is the reward.</li>
12+
<li>Pensives: Things you will do but usually require a bit of outside influence.</li>
13+
<li>Prohibitions: Things you won&#8217;t do regardless of coercion or outside influence.</li>
14+
<li>Peeves: Things others do that bother you.</li>
15+
<li>Pedagogies: Things you want to learn or are willing or able to teach others.</li>
16+
</ul>
17+
18+
<p>The goal is to list at least three things that fit into each of these categories for you.</p>
19+
20+
<p>Quick example for me:</p>
21+
22+
<ul>
23+
<li>Passions: Helping others make peace with time and space.</li>
24+
<li>Pensives: Software development.</li>
25+
<li>Prohibitions: Lying - specifically, speaking what I know to be counter to reality; I may be wrong about something, but it&#8217;s because I&#8217;m coming from a place of ignorance.</li>
26+
<li>Peeves: When people assume to know my &#8220;why&#8221; or speak on my behalf without my consent.</li>
27+
<li>Pedagogies: Learn to become a better storyteller and teach others how to design their lives.</li>
28+
</ul>
29+
30+
<p>People often ask me whether to limit this to work, life, or both. I lean toward both by default because I follow the spirit of Henry Rollins, that there is no such thing as work time, spare time, free time, or downtime, only lifetime. Go!</p>
31+
32+
<p>Having said that, I’ve run people through this exercise in settings where they didn’t feel comfortable sharing with, say, their coworkers. Regardless, when we talk about designing your life, there is no area that is off-limits.</p>
33+
34+
<h2>For groups</h2>
35+
36+
<p>As a group exercise, the 5 Ps can go a long way toward creating an intentional culture, or be an effective icebreaker; family or corporate.</p>
37+
38+
<ol>
39+
<li>Ask everyone to do the exercise individually.</li>
40+
<li>I typically go around the group, starting with passions and then moving to the next category.</li>
41+
</ol>
42+
43+
<p>These are the only two steps needed to use the exercise as an icebreaker. When using it to create an intentional team culture, I’ll capture themes or higher-order concepts from what the individuals come up with.</p>
44+
45+
<p>I worked with a software development team once, wherein everyone was pensive about software development. So, that became a team-level pensive for the team, and an entire discussion about career choices for everyone in the room, which was funny. And, to be fair, a non-trivial number of us get jobs in something we’re pensive about to earn enough to fund our passions; software developers passionate about travel or playing music.</p>

0 commit comments

Comments
 (0)