PluginProbe ʕ •ᴥ•ʔ
Admin Help Docs / 2.0.3
Admin Help Docs v2.0.3
2.0.3 2.0.2 2.0.1.1 trunk 1.4.3.2 2.0.0 2.0.0.1 2.0.0.2 2.0.1
admin-help-docs / inc / css / docs.css
admin-help-docs / inc / css Last commit date
content.css 2 days ago docs.css 2 days ago header.css 2 days ago our-dashboard.css 2 days ago post-type-help-doc-imports.css 2 days ago post-type-help-docs.css 2 days ago post-types.css 2 days ago pt-tax.css 2 days ago taxonomies.css 2 days ago
docs.css
602 lines
1 /* ----------------------------------------- */
2 /* ---------------- Buttons ---------------- */
3 /* ----------------------------------------- */
4
5 .helpdocs-button,
6 #screen-options-apply,
7 #submit {
8 background: var(--helpdocs-color-button) !important;
9 color: var(--helpdocs-color-button-font) !important;
10 line-height: 1 !important;
11 padding: 8px 12px !important;
12 border: 1px solid transparent;
13 border-radius: 6px !important;
14 text-decoration: none;
15 font-size: 0.80rem !important;
16 font-weight: 500 !important;
17 transition: background 0.3s ease;
18 margin-bottom: 0 !important;
19 cursor: pointer;
20 display: inline-flex;
21 align-items: center;
22 }
23
24 .helpdocs-button:hover,
25 #screen-options-apply:hover,
26 #submit:hover {
27 background: var(--helpdocs-color-button-hover) !important;
28 }
29
30 .helpdocs-button.button-secondary {
31 background: #f6f7f7 !important;
32 color: #1d2327 !important;
33 min-height: 30px !important;
34 line-height: 1 !important;
35 }
36
37 .helpdocs-button.button-secondary:hover {
38 background: #e1e4e6 !important;
39 }
40
41 .helpdocs-button:disabled {
42 background: #ccc !important;
43 background: var(--helpdocs-color-button-disabled, #d5d5d5) !important;
44 color: #999 !important;
45 cursor: not-allowed !important;
46 opacity: 0.7;
47 border-color: rgba(0, 0, 0, 0.05) !important;
48 box-shadow: none !important;
49 }
50
51 .helpdocs-button:disabled:hover {
52 background: var(--helpdocs-color-button-disabled, #d5d5d5) !important;
53 }
54
55 .tablenav .button {
56 border-radius: 6px !important;
57 }
58
59 .helpdocs-button.button.updating-message {
60 padding: 8px 12px 5px !important;
61 }
62
63 .helpdocs-button.button.updating-message:before {
64 margin: 0px 5px 0 -2px !important;
65 color: var(--helpdocs-color-button-font) !important;
66 }
67
68
69 /* ----------------------------------------- */
70 /* ------------- Click to Copy ------------- */
71 /* ----------------------------------------- */
72
73 /* The container */
74 .helpdocs-click-to-copy {
75 cursor: pointer;
76 position: relative; /* Essential for absolute positioning of the tip */
77 display: inline-block;
78 transition: color 0.2s ease-in-out;
79 }
80
81 /* Optional: subtle hover effect to indicate it's interactive */
82 .helpdocs-click-to-copy:hover {
83 color: #2271b1; /* WordPress Blue */
84 }
85
86 /* The "Copied!" tip */
87 .helpdocs-click-to-copy .helpdocs-copied-tip {
88 position: absolute;
89 bottom: 125%; /* Position it above the text */
90 left: 50%;
91 transform: translateX( -50% );
92 background: #32373c; /* WordPress Dark Grey */
93 color: #fff;
94 padding: 4px 8px;
95 font-size: 11px;
96 line-height: 1;
97 border-radius: 3px;
98 white-space: nowrap;
99 pointer-events: none; /* Prevents the tip from interfering with clicks */
100 box-shadow: 0 2px 4px rgba( 0, 0, 0, 0.2 );
101 z-index: 100;
102 }
103
104 /* The small arrow pointing down from the tip */
105 .helpdocs-click-to-copy .helpdocs-copied-tip::after {
106 content: "";
107 position: absolute;
108 top: 100%;
109 left: 50%;
110 margin-left: -5px;
111 border-width: 5px;
112 border-style: solid;
113 border-color: #32373c transparent transparent transparent;
114 }
115
116
117 /* ----------------------------------------- */
118 /* ------------- Dashboard Menu ------------ */
119 /* ----------------------------------------- */
120
121 #menu-dashboard a[href*="page=admin-help-dashboard"] {
122 display: none !important;
123 }
124
125 /* Force the 'Home' link (the first item) to show the active color */
126 #menu-dashboard.wp-menu-open ul.wp-submenu li.wp-first-item a {
127 color: #fff !important;
128 font-weight: 600 !important;
129 }
130
131 /* Ensure the top-level Dashboard stays highlighted */
132 #menu-dashboard.menu-top > a.wp-menu-open {
133 background-color: var( --wp-admin-theme-color-darker, #2271b1 ) !important;
134 color: #fff !important;
135 }
136
137
138 /* ----------------------------------------- */
139 /* ----------- Dashboard Widgets ----------- */
140 /* ----------------------------------------- */
141
142 .index-php .helpdocs-dashboard-widget-link {
143 display: contents;
144 }
145
146 .index-php .helpdocs-dashboard-widget-link a {
147 text-decoration: none !important;
148 display: inline-flex;
149 align-items: center;
150 gap: 4px;
151 font-size: 0.875rem;
152 padding: 2px 6px;
153 border-radius: 4px;
154 transition: filter 0.15s, color 0.15s;
155 opacity: 0.5;
156 }
157
158 .index-php .helpdocs-dashboard-widget-link a:hover {
159 opacity: 1;
160 }
161
162 .index-php #admin-help-docs.postbox {
163 background: #F6F7F8 !important;
164 }
165
166 .index-php #admin-help-docs .helpdocs-dashboard-widget-link a:hover {
167 filter: brightness( 0.97 );
168 }
169
170 .index-php div[id^="helpdocs_"].postbox {
171 background: var( --helpdocs-color-doc-bg ) !important;
172 color: var( --helpdocs-color-doc-font ) !important;
173 }
174
175 .index-php div[id^="helpdocs_"] .helpdocs-dashboard-widget-link a {
176 color: var(--helpdocs-color-doc-title) !important;
177 }
178
179 .index-php div[id^="helpdocs_"] .order-higher-indicator,
180 .index-php div[id^="helpdocs_"] .order-lower-indicator,
181 .index-php div[id^="helpdocs_"] .toggle-indicator {
182 color: var(--helpdocs-color-doc-accent) !important;
183 }
184 .index-php div[id^="helpdocs_"] .postbox-header h2 {
185 color: var(--helpdocs-color-doc-title) !important;
186 }
187 .index-php div[id^="helpdocs_"] .postbox-header h2 span {
188 color: revert !important;
189 }
190 .index-php div[id^="helpdocs_"] a:not(.helpdocs-dashboard-widget-link a) {
191 color: var(--helpdocs-color-doc-link) !important;
192 }
193
194
195 /* ----------------------------------------- */
196 /* -------- Table of Contents Widget ------- */
197 /* ---------------------------------------- */
198
199 .index-php #admin-help-docs .toc-cont ul {
200 margin-bottom: 0;
201 }
202
203 .index-php #admin-help-docs .toc-cont ul li {
204 margin: 4px 0;
205 }
206
207 .index-php #admin-help-docs .toc-item {
208 display: block;
209 width: calc( 100% - 20px );
210 padding: 6px 10px;
211 border-radius: 8px;
212 text-decoration: none;
213 background: #ffffff;
214 color: #1d2327;
215 font-size: 13.5px;
216 border: 1px solid #e2e4e7;
217 transition: background 0.15s ease;
218 }
219
220 .index-php #admin-help-docs .toc-item:hover {
221 background: #f0f2f4;
222 }
223
224 .index-php #admin-help-docs .toc-item .dashicons {
225 font-size: 18px;
226 margin-right: 3px;
227 color: #999999;
228 }
229
230
231 /* ----------------------------------------- */
232 /* -------------- Docs General ------------- */
233 /* ----------------------------------------- */
234
235 :root {
236 --helpdocs-radius-large: 10px;
237 --helpdocs-radius-small: 8px;
238 --helpdocs-shadow: 0 1px 1px rgba(0,0,0,0.04);
239 }
240
241 .helpdocs-doc-wrapper {
242 display: flex;
243 flex-direction: column;
244 gap: 10px;
245 border-left: 4px solid var(--helpdocs-color-doc-accent) !important;
246 }
247
248 .helpdocs-doc-title {
249 display: flex;
250 gap: 10px;
251 align-items: center;
252 }
253
254 .helpdocs-doc-logo img {
255 height: 30px;
256 }
257
258 .helpdocs-doc-content p:first-child {
259 margin-top: 0;
260 }
261
262 .helpdocs-doc-content p:last-child {
263 margin-bottom: 0;
264 }
265
266 .helpdocs-doc-content img {
267 max-width: 100%;
268 height: auto;
269 }
270
271 .helpdocs-doc-content {
272 color: var(--helpdocs-color-doc-font) !important;
273 }
274
275 /* ----------------------------------------- */
276 /* -------- Standard (Top/Bottom/Manual) ---- */
277 /* ----------------------------------------- */
278
279 .helpdocs-top-doc,
280 .helpdocs-bottom-doc,
281 .helpdocs-manual-doc {
282 background: var(--helpdocs-color-doc-bg);
283 padding: 16px 20px;
284 margin-bottom: 20px;
285 box-shadow: var(--helpdocs-shadow);
286 border-radius: var(--helpdocs-radius-large);
287 border: 1px solid var(--helpdocs-color-doc-accent);
288 }
289
290 .helpdocs-top-doc:last-child,
291 .helpdocs-bottom-doc:last-child,
292 .helpdocs-manual-doc:last-child {
293 margin-bottom: 0;
294 }
295
296 .helpdocs-top-doc h2,
297 .helpdocs-bottom-doc h2,
298 .helpdocs-manual-doc h2 {
299 margin: 0;
300 font-size: 1.1rem;
301 font-weight: 600;
302 color: var(--helpdocs-color-doc-title);
303 display: flex;
304 align-items: center;
305 }
306
307 .helpdocs-top-content,
308 .helpdocs-bottom-content,
309 .helpdocs-manual-content {
310 font-size: 13px;
311 color: var(--helpdocs-color-doc-font);
312 line-height: 1.6;
313 }
314
315 .helpdocs-top-content a,
316 .helpdocs-bottom-content a,
317 .helpdocs-manual-content a {
318 color: var(--helpdocs-color-doc-link);
319 }
320
321 /* ----------------------------------------- */
322 /* -------------- Manual Only -------------- */
323 /* ----------------------------------------- */
324
325 .helpdocs-manual-wrapper {
326 clear: both;
327 margin: 20px 0;
328 width: 100%;
329 }
330
331 /* ----------------------------------------- */
332 /* -------------- Top Specific ------------- */
333 /* ----------------------------------------- */
334
335 .helpdocs-top-wrapper.helpdocs-admin-notices {
336 clear: both;
337 margin: 40px 20px 20px 0;
338 overflow: hidden;
339 }
340
341 .helpdocs-top-wrapper.helpdocs-gutenberg-top {
342 margin: 20px 20px;
343 }
344
345 .helpdocs-top-wrapper.helpdocs-in-admin-header {
346 margin: 0 0 0 -20px;
347 }
348
349 .helpdocs-top-wrapper.helpdocs-in-admin-header .helpdocs-doc-wrapper {
350 border-left-width: 0 !important;
351 }
352
353 .helpdocs-in-admin-header .helpdocs-top-doc {
354 border-bottom: 1px solid #c3c4c7;
355 border-radius: 0;
356 border-top: 0;
357 border-left: 0;
358 border-right: 0;
359 }
360
361 /* ----------------------------------------- */
362 /* ------------ Bottom Specific ------------ */
363 /* ----------------------------------------- */
364
365 .helpdocs-bottom-wrapper {
366 clear: both;
367 overflow: hidden;
368 }
369
370 .helpdocs-bottom-wrapper:not(.helpdocs-gutenberg-bottom) {
371 order: 999;
372 width: calc(100% - 20px);
373 margin: 40px 20px 20px 0;
374 }
375
376 .helpdocs-bottom-wrapper.helpdocs-gutenberg-bottom {
377 display: block !important;
378 position: relative !important;
379 z-index: 10;
380 flex: 1 1 100%;
381 align-self: flex-start;
382 margin: 20px 0;
383 padding: 0 20px;
384 width: 100%;
385 box-sizing: border-box;
386 }
387
388 /* ----------------------------------------- */
389 /* --------------- Side Docs --------------- */
390 /* ----------------------------------------- */
391
392 .helpdocs-side-wrapper {
393 clear: both;
394 width: 100%;
395 box-sizing: border-box;
396 }
397
398 .helpdocs-side-wrapper:not(.helpdocs-gutenberg-side) {
399 margin-bottom: 20px;
400 }
401
402 .helpdocs-side-wrapper.helpdocs-gutenberg-side {
403 padding: 16px;
404 border-bottom: 1px solid #e0e0e0;
405 background: #fff;
406 margin-bottom: 0;
407 }
408
409 #side-sortables .helpdocs-side-wrapper {
410 margin: 10px 0 20px 0;
411 }
412
413 .helpdocs-side-doc {
414 background: var(--helpdocs-color-doc-bg);
415 padding: 12px 15px;
416 margin-bottom: 15px;
417 box-shadow: var(--helpdocs-shadow);
418 border-radius: var(--helpdocs-radius-small);
419 border: 1px solid var(--helpdocs-color-doc-accent);
420 }
421
422 .helpdocs-side-doc h2 {
423 font-size: 0.95rem;
424 font-weight: 600;
425 color: var(--helpdocs-color-doc-title);
426 padding: 0 !important;
427 margin: 0;
428 display: flex;
429 align-items: center;
430 }
431
432 .helpdocs-side-doc .helpdocs-doc-logo img {
433 height: 22px;
434 }
435
436 .helpdocs-side-content {
437 font-size: 12px;
438 color: var(--helpdocs-color-doc-font);
439 line-height: 1.5;
440 margin-top: 8px;
441 }
442
443 .helpdocs-side-content p {
444 margin-bottom: 10px;
445 }
446
447 /* ----------------------------------------- */
448 /* ------------- Element Item -------------- */
449 /* ----------------------------------------- */
450
451 .helpdocs-element-item {
452 display: block;
453 margin: 8px 0;
454 padding: 12px 15px;
455 background: var(--helpdocs-color-doc-bg, #f9f9f9);
456 border: 1px solid var(--helpdocs-color-doc-accent, #2271b1);
457 border-left-width: 4px;
458 border-radius: 4px;
459 color: var(--helpdocs-color-doc-font, #3c434a);
460 font-size: 12px;
461 line-height: 1.5;
462 box-shadow: 0 1px 2px rgba(0,0,0,0.05);
463 width: fit-content;
464 max-width: 500px;
465 }
466
467 .helpdocs-element-item a {
468 text-decoration: underline;
469 color: var(--helpdocs-color-doc-link);
470 }
471
472 input + .helpdocs-element-item {
473 margin-top: 10px;
474 }
475
476 td > .helpdocs-element-item {
477 margin-left: 5px;
478 }
479
480
481 /* ----------------------------------------- */
482 /* -------------- Admin Bar ---------------- */
483 /* ----------------------------------------- */
484
485 .has-add-new-link #wp-admin-bar-helpdocs_admin_bar-default {
486 padding-bottom: 0 !important;
487 }
488
489 #wp-admin-bar-helpdocs_add_new .ab-item {
490 white-space: nowrap !important;
491 display: flex !important;
492 align-items: center !important;
493 padding-right: 15px !important; /* Extra breathing room on the right */
494 }
495
496 #wp-admin-bar-helpdocs_add_new {
497 margin-top: 6px !important;
498 background: #3C434A !important;
499 padding: 3px 0 !important;
500 }
501
502 #wp-admin-bar-helpdocs_add_new .ab-icon {
503 padding: 0 5px 0 0 !important;
504 }
505
506 #wp-admin-bar-helpdocs_add_new:hover,
507 #wp-admin-bar-helpdocs_add_new:hover .ab-item {
508 background: #4a525a !important;
509 }
510
511
512 /* ----------------------------------------- */
513 /* -------------- Stale Posts -------------- */
514 /* ----------------------------------------- */
515
516 .helpdocs-table {
517 width: 100%;
518 border-collapse: collapse;
519 font-size: 13px;
520 color: var(--helpdocs-color-doc-font, #3c434a);
521 box-shadow: var(--helpdocs-shadow);
522 border-radius: var(--helpdocs-radius-small);
523 overflow: hidden; /* Required for border-radius to clip the table edges */
524 }
525
526 .helpdocs-table thead tr {
527 background: var(--helpdocs-color-header-bg);
528 color: var(--helpdocs-color-header-font);
529 text-align: left;
530 }
531
532 .helpdocs-table thead th {
533 padding: 9px 14px;
534 font-weight: 600;
535 font-size: 0.80rem;
536 text-transform: uppercase;
537 letter-spacing: 0.04em;
538 }
539
540 .helpdocs-table-type,
541 .helpdocs-table-last-modified,
542 .helpdocs-table-age {
543 text-align: right;
544 width: 120px;
545 }
546
547 .helpdocs-table tbody tr {
548 border-bottom: 1px solid var(--helpdocs-color-border);
549 transition: background 0.15s ease;
550 }
551
552 .helpdocs-table tbody tr:last-child {
553 border-bottom: none;
554 }
555
556 .helpdocs-table tbody tr:nth-child(even) {
557 background: #f6f7f7;
558 }
559
560 .helpdocs-table tbody tr:hover {
561 background: #f0f2f4;
562 }
563
564 .helpdocs-table tbody td {
565 padding: 8px 14px;
566 vertical-align: middle;
567 }
568
569 .helpdocs-table tbody td:last-child {
570 white-space: nowrap;
571 font-size: 12px;
572 }
573
574 .helpdocs-table a {
575 color: var(--helpdocs-color-doc-link);
576 text-decoration: none;
577 }
578
579 .helpdocs-table a:hover {
580 text-decoration: underline;
581 }
582
583 .helpdocs-table-none,
584 .helpdocs-error {
585 font-size: 13px;
586 padding: 10px 14px;
587 border-radius: var(--helpdocs-radius-small);
588 border-left: 4px solid;
589 margin: 0;
590 }
591
592 .helpdocs-table-none {
593 background: #f6f7f7;
594 border-color: #c3c4c7;
595 color: #50575e;
596 }
597
598 .helpdocs-error {
599 background: #fcf0f1;
600 border-color: #d63638;
601 color: #d63638;
602 }