PluginProbe
Code Block Pro – Beautiful Syntax Highlighting / 1.18.0
Code Block Pro – Beautiful Syntax Highlighting v1.18.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
code-block-pro / src / front / style.css

style.css in Code Block Pro – Beautiful Syntax Highlighting 1.18.0, at src/front/style.css

161 lines 4.7 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /*! purgecss start ignore */
2 .wp-block-kevinbatdorf-code-block-pro {
3 font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
4 monospace; /* no !important */
5 direction: ltr;
6 @apply relative box-border;
7 }
8 .wp-block-kevinbatdorf-code-block-pro * {
9 @apply box-border;
10 }
11 .wp-block-kevinbatdorf-code-block-pro pre,
12 .wp-block-kevinbatdorf-code-block-pro pre * {
13 font-size: inherit;
14 line-height: inherit;
15 }
16 .wp-block-kevinbatdorf-code-block-pro:not(.code-block-pro-editor) pre {
17 border: 0;
18 overflow-wrap: normal;
19 padding: 16px;
20 padding-right: 0;
21 font-family: inherit;
22 @apply overflow-auto text-inherit text-left m-0 whitespace-pre bg-none border-none border-0 rounded-none shadow-none;
23 }
24 .wp-block-kevinbatdorf-code-block-pro.padding-disabled:not(
25 .code-block-pro-editor
26 )
27 pre {
28 @apply p-0;
29 }
30 .wp-block-kevinbatdorf-code-block-pro.padding-bottom-disabled pre {
31 @apply pb-0;
32 }
33 .wp-block-kevinbatdorf-code-block-pro:not(.code-block-pro-editor) pre code {
34 border: 0;
35 background: none;
36 overflow-wrap: normal;
37 font-family: inherit;
38 @apply block w-full m-0 p-0 bg-transparent text-inherit text-left whitespace-pre border-none border-0 rounded-none shadow-none;
39 }
40 .wp-block-kevinbatdorf-code-block-pro:not(.code-block-pro-editor)
41 pre
42 code
43 .line {
44 @apply inline-block w-full;
45 }
46 .wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers:not(
47 .code-block-pro-editor
48 )
49 pre
50 code {
51 counter-reset: step;
52 counter-increment: step calc(var(--cbp-line-number-start, 1) - 1);
53 }
54
55 .wp-block-kevinbatdorf-code-block-pro pre code .line {
56 @apply relative;
57 }
58 .wp-block-kevinbatdorf-code-block-pro:not(.code-block-pro-editor)
59 pre
60 code
61 .line::before {
62 content: '';
63 @apply inline-block;
64 }
65 .wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers:not(
66 .code-block-pro-editor
67 )
68 pre
69 code
70 .line:not(.cbp-line-number-disabled)::before {
71 @apply inline-block text-right opacity-50 transition-opacity duration-500;
72 margin-right: 12px;
73 content: counter(step);
74 color: var(--cbp-line-number-color, #999);
75 width: var(--cbp-line-number-width, auto);
76 user-select: none;
77 counter-increment: step;
78 }
79 /* Temporary removed until I can make this an option */
80 /* .wp-block-kevinbatdorf-code-block-pro.cbp-has-line-numbers:not(.code-block-pro-editor) pre code .line:hover::before {
81 @apply opacity-100;
82 } */
83 .wp-block-kevinbatdorf-code-block-pro:not(
84 .cbp-blur-enabled:not(.cbp-unblur-on-hover)
85 )
86 pre
87 .line:hover
88 .cbp-line-highlighter,
89 .wp-block-kevinbatdorf-code-block-pro.cbp-highlight-hover
90 pre
91 .line.cbp-no-blur:hover
92 .cbp-line-highlighter,
93 .wp-block-kevinbatdorf-code-block-pro
94 pre
95 .line.cbp-line-highlight
96 .cbp-line-highlighter {
97 @apply w-full pointer-events-none absolute top-0 h-full;
98 background: var(--cbp-line-highlight-color, rgb(14 165 233/0.2));
99 min-width: calc(var(--cbp-block-width, 100%));
100 left: -16px;
101 }
102 .wp-block-kevinbatdorf-code-block-pro:not(
103 .code-block-pro-editor
104 ).padding-disabled
105 pre
106 .line.cbp-line-highlight::after {
107 @apply left-0 w-full;
108 }
109 .wp-block-kevinbatdorf-code-block-pro.cbp-blur-enabled
110 pre
111 .line:not(.cbp-no-blur) {
112 filter: blur(1px);
113 @apply opacity-40 transition-all duration-200;
114 }
115 .wp-block-kevinbatdorf-code-block-pro.cbp-blur-enabled.cbp-unblur-on-hover:hover
116 pre
117 .line:not(.cbp-no-blur) {
118 @apply blur-none opacity-100;
119 }
120 .wp-block-kevinbatdorf-code-block-pro:not(.code-block-pro-editor) pre * {
121 font-family: inherit;
122 }
123 .cbp-see-more-simple-btn-hover {
124 @apply transition-none;
125 }
126 .cbp-see-more-simple-btn-hover:hover {
127 box-shadow: inset 0 0 100px 100px rgba(255, 255, 255, 0.1);
128 }
129 .code-block-pro-copy-button {
130 border: 0;
131 background: none;
132 padding: 6px;
133 @apply absolute top-0 right-0 left-auto bg-transparent border-none border-0 cursor-pointer opacity-10 focus:opacity-40 transition-opacity duration-200 ease-in-out leading-none z-10;
134 }
135 .wp-block-kevinbatdorf-code-block-pro.padding-disabled
136 .code-block-pro-copy-button {
137 padding: 0;
138 }
139 .wp-block-kevinbatdorf-code-block-pro:hover .code-block-pro-copy-button {
140 @apply opacity-50;
141 }
142 /* .wp-block-kevinbatdorf-code-block-pro .code-block-pro-copy-button:active, */
143 .wp-block-kevinbatdorf-code-block-pro .code-block-pro-copy-button:hover {
144 @apply opacity-90;
145 }
146 .code-block-pro-copy-button .without-check {
147 @apply block;
148 }
149 .code-block-pro-copy-button .with-check {
150 @apply hidden;
151 }
152 .code-block-pro-copy-button.cbp-copying .without-check {
153 @apply hidden;
154 }
155 .code-block-pro-copy-button.cbp-copying .with-check {
156 @apply block;
157 }
158 .cbp-footer-link {
159 @apply hover:underline;
160 }
161