PluginProbe
Code Block Pro – Beautiful Syntax Highlighting / 1.13.0
Code Block Pro – Beautiful Syntax Highlighting v1.13.0
1.27.1 1.27.2 1.27.3 1.27.4 1.27.5 1.27.6 1.27.7 1.28.0 1.3.0 1.4.0 1.5.0 1.5.1 1.5.2 1.6.0 1.7.0 1.8.0 1.9.0 1.9.1 1.9.2 1.9.3 trunk 1.1.0 1.10.0 1.11.0 1.11.1 All 63 releases
← All changes | src/front/style.css +46 -7 1.7.01.13.0 View file →
@@ -15,14 +15,18 @@
15 15 .wp-block-kevinbatdorf-code-block-pro:not(.code-block-pro-editor) pre {
16 16 border: 0;
17 17 overflow-wrap:normal;
18 18 padding: 16px;
19 + padding-right: 0;
19 20 font-family: inherit;
20 21 @apply overflow-auto text-inherit text-left m-0 whitespace-pre bg-none border-none border-0 rounded-none shadow-none;
21 22 }
22 -.wp-block-kevinbatdorf-code-block-pro.padding-disabled pre {
23 - padding: 0;
23 +.wp-block-kevinbatdorf-code-block-pro.padding-disabled:not(.code-block-pro-editor) pre {
24 + @apply p-0;
24 25 }
26 +.wp-block-kevinbatdorf-code-block-pro.padding-bottom-disabled pre {
27 + @apply pb-0;
28 +}
25 29 .wp-block-kevinbatdorf-code-block-pro:not(.code-block-pro-editor) pre code {
26 30 border: 0;
27 31 background: none;
28 32 overflow-wrap:normal;
@@ -35,10 +39,18 @@
35 39 .wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers:not(.code-block-pro-editor) pre code {
36 40 counter-reset: step;
37 41 counter-increment: step calc(var(--cbp-line-number-start, 1) - 1);
38 42 }
39 -.wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers:not(.code-block-pro-editor) pre code .line::before {
40 - @apply inline-block text-right opacity-30 transition-opacity duration-500;
43 +
44 +.wp-block-kevinbatdorf-code-block-pro pre code .line {
45 + @apply relative;
46 +}
47 +.wp-block-kevinbatdorf-code-block-pro:not(.code-block-pro-editor) pre code .line::before {
48 + content: '';
49 + @apply inline-block;
50 +}
51 +.wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers:not(.code-block-pro-editor) pre code .line:not(.cbp-line-number-disabled)::before {
52 + @apply inline-block text-right opacity-50 transition-opacity duration-500;
41 53 margin-right: 12px;
42 54 content: counter(step);
43 55 color: var(--cbp-line-number-color, #999);
44 56 width: var(--cbp-line-number-width, auto);
@@ -44,14 +56,38 @@
44 56 width: var(--cbp-line-number-width, auto);
45 57 user-select: none;
46 58 counter-increment: step;
47 59 }
48 -.wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers:not(.code-block-pro-editor) pre code .line:hover::before {
49 - @apply opacity-70;
60 +/* Temporary removed until I can make this an option */
61 +/* .wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers:not(.code-block-pro-editor) pre code .line:hover::before {
62 + @apply opacity-100;
63 +} */
64 +.wp-block-kevinbatdorf-code-block-pro pre .line.cbp-line-highlight .cbp-line-highlighter {
65 + background: var(--cbp-line-highlight-color, rgb(14 165 233/.2));
66 + width: 100%;
67 + min-width: calc(var(--cbp-block-width, 100%));
68 + left: -16px;
69 + @apply absolute top-0 h-full;
50 70 }
71 +.wp-block-kevinbatdorf-code-block-pro:not(.code-block-pro-editor).padding-disabled pre .line.cbp-line-highlight::after {
72 + @apply left-0 w-full;
73 +}
74 +.wp-block-kevinbatdorf-code-block-pro.cbp-blur-enabled pre .line:not(.cbp-no-blur) {
75 + filter: blur(1px);
76 + @apply opacity-40 transition-all duration-200;
77 +}
78 +.wp-block-kevinbatdorf-code-block-pro.cbp-blur-enabled.cbp-unblur-on-hover:hover pre .line:not(.cbp-no-blur) {
79 + @apply blur-none opacity-100;
80 +}
51 81 .wp-block-kevinbatdorf-code-block-pro:not(.code-block-pro-editor) pre * {
52 82 font-family: inherit;
53 83 }
84 +.cbp-see-more-simple-btn-hover {
85 + @apply transition-none;
86 +}
87 +.cbp-see-more-simple-btn-hover:hover {
88 + box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.1);
89 +}
54 90 .code-block-pro-copy-button {
55 91 border: 0;
56 92 background: none;
57 93 padding: 6px;
@@ -60,9 +96,9 @@
60 96 .wp-block-kevinbatdorf-code-block-pro.padding-disabled .code-block-pro-copy-button {
61 97 padding: 0;
62 98 }
63 99 .wp-block-kevinbatdorf-code-block-pro:hover .code-block-pro-copy-button {
64 - @apply opacity-40;
100 + @apply opacity-50;
65 101 }
66 102 /* .wp-block-kevinbatdorf-code-block-pro .code-block-pro-copy-button:active, */
67 103 .wp-block-kevinbatdorf-code-block-pro .code-block-pro-copy-button:hover {
68 104 @apply opacity-90;
@@ -77,5 +113,8 @@
77 113 @apply hidden;
78 114 }
79 115 .code-block-pro-copy-button.copying .with-check {
80 116 @apply block;
117 +}
118 +.cbp-footer-link {
119 + @apply hover:underline;
81 120 }