PluginProbe
Blockenberg — 600+ Advanced Gutenberg Blocks & AI Agent for WordPress Block Editor / 2.0.7
Blockenberg — 600+ Advanced Gutenberg Blocks & AI Agent for WordPress Block Editor v2.0.7
2.0.13 2.0.12 2.0.11 2.0.10 2.0.9 trunk 2.0.2 2.0.3 2.0.4 2.0.5 2.0.6 2.0.7 2.0.8
blockenberg / blocks / podcast-episode / style.css

style.css in Blockenberg — 600+ Advanced Gutenberg Blocks & AI Agent for WordPress Block Editor 2.0.7, at blocks/podcast-episode/style.css

268 lines 7.4 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .bkbg-podcast-episode-app { display: none; }
2
3 .bkbg-pe-block {
4 overflow: hidden;
5 }
6
7 /* ── Header ────────────────────────────────────────────────── */
8 .bkbg-pe-header {
9 padding: 24px 28px 20px;
10 }
11
12 .bkbg-pe-show-name {
13 font-size: 11px;
14 text-transform: uppercase;
15 letter-spacing: .1em;
16 margin-bottom: 8px;
17 opacity: .55;
18 }
19
20 .bkbg-pe-title {
21 margin: 0 0 12px;
22 line-height: 1.2;
23 }
24
25 .bkbg-pe-editor-wrap h2.bkbg-pe-title,
26 .bkbg-pe-block h2.bkbg-pe-title {
27 font-family: var(--bkbg-pe-tt-font-family, inherit);
28 font-size: var(--bkbg-pe-tt-font-size-d, 22px);
29 font-weight: var(--bkbg-pe-tt-font-weight, 700);
30 font-style: var(--bkbg-pe-tt-font-style, normal);
31 text-decoration: var(--bkbg-pe-tt-text-decoration, none);
32 text-transform: var(--bkbg-pe-tt-text-transform, none);
33 line-height: var(--bkbg-pe-tt-line-height-d, 1.2);
34 letter-spacing: var(--bkbg-pe-tt-letter-spacing-d, normal);
35 word-spacing: var(--bkbg-pe-tt-word-spacing-d, normal);
36 }
37
38 .bkbg-pe-info-row {
39 display: flex;
40 flex-wrap: wrap;
41 align-items: center;
42 gap: 10px;
43 }
44
45 .bkbg-pe-info-item {
46 font-size: 12px;
47 opacity: .65;
48 }
49
50 /* ── Listen buttons ─────────────────────────────────────────── */
51 .bkbg-pe-listen-links {
52 display: flex;
53 flex-wrap: wrap;
54 gap: 6px;
55 margin-top: 4px;
56 }
57
58 .bkbg-pe-listen-btn {
59 display: inline-block;
60 padding: 4px 12px;
61 border-radius: 100px;
62 font-size: 11px;
63 font-weight: 700;
64 text-decoration: none !important;
65 transition: opacity .15s;
66 }
67
68 .bkbg-pe-listen-btn:hover {
69 opacity: .85;
70 }
71
72 /* ── Body ───────────────────────────────────────────────────── */
73 .bkbg-pe-body {
74 padding: 20px 28px;
75 font-family: var(--bkbg-pe-bd-font-family, inherit);
76 font-size: var(--bkbg-pe-bd-font-size-d, 14px);
77 font-weight: var(--bkbg-pe-bd-font-weight, 400);
78 font-style: var(--bkbg-pe-bd-font-style, normal);
79 text-decoration: var(--bkbg-pe-bd-text-decoration, none);
80 text-transform: var(--bkbg-pe-bd-text-transform, none);
81 line-height: var(--bkbg-pe-bd-line-height-d, 1.68);
82 letter-spacing: var(--bkbg-pe-bd-letter-spacing-d, normal);
83 word-spacing: var(--bkbg-pe-bd-word-spacing-d, normal);
84 }
85
86 /* ── Section heading ───────────────────────────────────────── */
87 .bkbg-pe-section-head {
88 display: inline-block;
89 font-weight: 700;
90 font-size: 11px;
91 text-transform: uppercase;
92 letter-spacing: .07em;
93 margin-bottom: 12px;
94 padding-bottom: 5px;
95 border-bottom-width: 2px;
96 border-bottom-style: solid;
97 }
98
99 .bkbg-pe-section {
100 margin-bottom: 24px;
101 }
102
103 /* ── Guests ─────────────────────────────────────────────────── */
104 .bkbg-pe-guests-grid {
105 display: grid;
106 grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
107 gap: 12px;
108 }
109
110 .bkbg-pe-guest-card {
111 border-radius: 8px;
112 padding: 12px 14px;
113 border-style: solid;
114 border-width: 1px;
115 }
116
117 .bkbg-pe-guest-name {
118 font-weight: 700;
119 margin-bottom: 2px;
120 }
121
122 .bkbg-pe-guest-role {
123 font-size: 11px;
124 font-weight: 600;
125 margin-bottom: 6px;
126 }
127
128 .bkbg-pe-guest-bio {
129 margin: 0;
130 }
131
132 /* ── Chapter timestamps ─────────────────────────────────────── */
133 .bkbg-pe-chapters {
134 margin: 0;
135 padding: 0;
136 list-style: none;
137 }
138
139 .bkbg-pe-chapter {
140 display: flex;
141 align-items: center;
142 gap: 12px;
143 padding: 6px 0;
144 border-bottom-style: dashed;
145 border-bottom-width: 1px;
146 }
147
148 .bkbg-pe-chapter:last-child {
149 border-bottom: none !important;
150 }
151
152 .bkbg-pe-chapter-time {
153 font-family: ui-monospace, 'Cascadia Code', monospace;
154 font-size: 12px;
155 font-weight: 700;
156 padding: 2px 8px;
157 border-radius: 4px;
158 flex-shrink: 0;
159 min-width: 52px;
160 text-align: center;
161 }
162
163 /* ── Resources ──────────────────────────────────────────────── */
164 .bkbg-pe-resources {
165 list-style: none;
166 margin: 0;
167 padding: 0;
168 }
169
170 .bkbg-pe-resource {
171 display: flex;
172 align-items: center;
173 gap: 8px;
174 padding: 6px 0;
175 border-bottom-style: dashed;
176 border-bottom-width: 1px;
177 }
178
179 .bkbg-pe-resource:last-child {
180 border-bottom: none !important;
181 }
182
183 .bkbg-pe-resource-icon {
184 font-size: 15px;
185 flex-shrink: 0;
186 }
187
188 .bkbg-pe-resource-link {
189 font-weight: 500;
190 text-decoration: none !important;
191 transition: opacity .15s;
192 }
193
194 .bkbg-pe-resource-link:hover {
195 opacity: .75;
196 text-decoration: underline !important;
197 }
198
199 /* ── Quote / Transcript ─────────────────────────────────────── */
200 .bkbg-pe-quote {
201 margin: 0;
202 padding: 14px 18px;
203 border-left-width: 4px;
204 border-left-style: solid;
205 border-radius: 0 8px 8px 0;
206 font-style: italic;
207 white-space: pre-line;
208 }
209
210 /* ── Tags ───────────────────────────────────────────────────── */
211 .bkbg-pe-tags {
212 display: flex;
213 flex-wrap: wrap;
214 gap: 6px;
215 }
216
217 .bkbg-pe-tag {
218 display: inline-block;
219 padding: 3px 10px;
220 border-radius: 100px;
221 font-size: 12px;
222 font-weight: 600;
223 }
224
225 /* ── Typography responsive ──────────────────────────────────── */
226 @media (max-width: 1024px) {
227 .bkbg-pe-editor-wrap .bkbg-pe-title,
228 .bkbg-pe-block .bkbg-pe-title {
229 font-size: var(--bkbg-pe-tt-font-size-t, 22px);
230 line-height: var(--bkbg-pe-tt-line-height-t, 1.2);
231 letter-spacing: var(--bkbg-pe-tt-letter-spacing-t, normal);
232 word-spacing: var(--bkbg-pe-tt-word-spacing-t, normal);
233 }
234 .bkbg-pe-body {
235 font-size: var(--bkbg-pe-bd-font-size-t, 14px);
236 line-height: var(--bkbg-pe-bd-line-height-t, 1.68);
237 letter-spacing: var(--bkbg-pe-bd-letter-spacing-t, normal);
238 word-spacing: var(--bkbg-pe-bd-word-spacing-t, normal);
239 }
240 }
241 @media (max-width: 767px) {
242 .bkbg-pe-editor-wrap .bkbg-pe-title,
243 .bkbg-pe-block .bkbg-pe-title {
244 font-size: var(--bkbg-pe-tt-font-size-m, 22px);
245 line-height: var(--bkbg-pe-tt-line-height-m, 1.2);
246 letter-spacing: var(--bkbg-pe-tt-letter-spacing-m, normal);
247 word-spacing: var(--bkbg-pe-tt-word-spacing-m, normal);
248 }
249 .bkbg-pe-body {
250 font-size: var(--bkbg-pe-bd-font-size-m, 14px);
251 line-height: var(--bkbg-pe-bd-line-height-m, 1.68);
252 letter-spacing: var(--bkbg-pe-bd-letter-spacing-m, normal);
253 word-spacing: var(--bkbg-pe-bd-word-spacing-m, normal);
254 }
255 }
256
257 /* ── Responsive ─────────────────────────────────────────────── */
258 @media (max-width: 580px) {
259 .bkbg-pe-header,
260 .bkbg-pe-body {
261 padding-left: 16px;
262 padding-right: 16px;
263 }
264 .bkbg-pe-guests-grid {
265 grid-template-columns: 1fr;
266 }
267 }
268