← All changes | src/editor/editor.css +84 -23 1.9.2 → 1.26.7 View file →

		@@ -14,9 +14,9 @@
14	14	.code-block-pro-editor *,
15	15	.code-block-pro-editor *:after,
16	16	.code-block-pro-editor *:before {
17	17	box-sizing: border-box;
18		- border: 0 solid #e5e7eb;
	18	+ /* border: 0 solid #e5e7eb; */
19	19	}
20	20	@tailwind base;
21	21	@tailwind components;
22	22	@tailwind utilities;
		@@ -31,9 +31,10 @@
31	31	line-height: inherit !important;
32	32	}
33	33	.code-block-pro-editor textarea,
34	34	.code-block-pro-editor pre {
35		- @apply m-0 text-left;
	35	+ @apply m-0 text-left focus:outline-none;
	36	+ min-height: 36px;
36	37	direction: ltr !important;
37	38	}
38	39	.code-block-pro-editor.cbp-has-line-numbers pre {
39	40	counter-reset: step;
		@@ -42,15 +43,19 @@
42	43	}
43	44	.code-block-pro-editor pre .line {
44	45	@apply relative inline-block w-full;
45	46	}
46		-.code-block-pro-editor:not(.padding-disabled) pre .line:empty {
47		- @apply block;
	47	+.code-block-pro-editor pre {
	48	+ .line:empty {
	49	+ @apply block;
	50	+ }
	51	+ .line span:empty {
	52	+ @apply inline-block;
	53	+ }
48	54	}
49		-.code-block-pro-editor.padding-disabled.cbp-has-line-numbers pre .line:empty {
50		- @apply block;
51		-}
52		-.code-block-pro-editor.cbp-has-line-numbers pre .line:not(.cbp-line-number-disabled)::before {
	55	+.code-block-pro-editor.cbp-has-line-numbers
	56	+ pre
	57	+ .line:not(.cbp-line-number-disabled)::before {
53	58	@apply inline-block text-right opacity-50 absolute;
54	59	margin-right: 12px;
55	60	content: counter(step);
56	61	color: var(--cbp-line-number-color, #999);
		@@ -65,17 +70,8 @@
65	70	}
66	71	.code-block-pro-editor.padding-disabled.cbp-has-line-numbers pre {
67	72	@apply py-0;
68	73	}
69		-/* Will make sure the line numbers are full width before calculating */
70		-.code-block-pro-editor.cbp-has-line-numbers pre .line.cbp-line-number-width-forced,
71		-.code-block-pro-editor.cbp-has-line-numbers pre .line.cbp-line-number-disabled {
72		- @apply inline;
73		-}
74		-.code-block-pro-editor.cbp-has-line-numbers pre .line.cbp-line-number-width-forced::before {
75		- width: auto !important;
76		- position: initial;
77		-}
78	74	.code-block-pro-editor .cbp-footer-link {
79	75	@apply pointer-events-none no-underline;
80	76	}
81	77
		@@ -81,12 +77,12 @@
81	77
82	78	/* Just to make it look similar to the front end */
83	79	.code-block-pro-editor pre .line.cbp-line-highlight::after {
84	80	content: '';
85		- background: var(--cbp-line-highlight-color, rgb(14 165 233/.2));
	81	+ background: var(--cbp-line-highlight-color, rgb(14 165 233/0.2));
86	82	@apply absolute top-0 h-full;
87	83	left: -100% !important;
88		- width: 1000%!important;
	84	+ width: 1000% !important;
89	85	min-height: var(--cbp-line-height) !important;
90	86	}
91	87
92	88	.code-block-pro-editor code {
		@@ -95,12 +91,15 @@
95	91	}
96	92
97	93	.cbp-input-error {
98	94	--tw-ring-color: rgb(239 68 68);
99		- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
100		- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
	95	+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0
	96	+ var(--tw-ring-offset-width) var(--tw-ring-offset-color);
	97	+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0
	98	+ calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
101	99	border-color: rgb(239 68 68) !important;
102		- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)!important;
	100	+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow),
	101	+ var(--tw-shadow, 0 0 #0000) !important;
103	102	}
104	103
105	104	.code-block-pro-editor .code-block-pro-copy-button {
106	105	display: block !important;
		@@ -105,9 +104,19 @@
105	104	.code-block-pro-editor .code-block-pro-copy-button {
106	105	display: block !important;
107	106	@apply pointer-events-none;
108	107	}
109		-
	108	+.code-block-pro-editor .sidebar-copy-button svg {
	109	+ @apply block;
	110	+}
	111	+.code-block-pro-editor .sidebar-copy-button .with-check {
	112	+ @apply hidden;
	113	+}
	114	+.cbp-theme-preview {
	115	+ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
	116	+ monospace; /* no !important */
	117	+ direction: ltr;
	118	+}
110	119	@font-face {
111	120	font-family: 'Code-Pro-Fira-Code';
112	121	src: url('../fonts/Code-Pro-Fira-Code.woff2') format('woff2');
113	122	}
		@@ -113,5 +122,57 @@
113	122	}
114	123	@font-face {
115	124	font-family: 'Code-Pro-JetBrains-Mono';
116	125	src: url('../fonts/Code-Pro-JetBrains-Mono.woff2') format('woff2');
	126	+}
	127	+@font-face {
	128	+ font-family: 'Code-Pro-JetBrains-Mono-NL';
	129	+ src: url('../fonts/Code-Pro-JetBrains-Mono-NL.ttf') format('truetype');
	130	+}
	131	+@font-face {
	132	+ font-family: 'Code-Pro-Comic-Mono';
	133	+ src: url('../fonts/Code-Pro-Comic-Mono.ttf') format('truetype');
	134	+}
	135	+@font-face {
	136	+ font-family: 'Code-Pro-Roboto-Mono';
	137	+ src: url('../fonts/Code-Pro-Roboto-Mono.ttf') format('truetype');
	138	+}
	139	+@font-face {
	140	+ font-family: 'Code-Pro-Fantasque-Sans-Mono';
	141	+ src: url('../fonts/Code-Pro-Fantasque-Sans-Mono.woff2') format('woff2');
	142	+}
	143	+@font-face {
	144	+ font-family: 'Code-Pro-Cozette';
	145	+ src: url('../fonts/Code-Pro-Cozette.woff2') format('woff2');
	146	+}
	147	+@font-face {
	148	+ font-family: 'Code-Pro-Deja-Vu-Mono';
	149	+ src: url('../fonts/Code-Pro-Deja-Vu-Mono.ttf') format('truetype');
	150	+}
	151	+@font-face {
	152	+ font-family: 'Code-Pro-Monaspace-Argon';
	153	+ src: url('../fonts/Code-Pro-Monaspace-Argon.woff') format('woff');
	154	+}
	155	+@font-face {
	156	+ font-family: 'Code-Pro-Monaspace-Krypton';
	157	+ src: url('../fonts/Code-Pro-Monaspace-Krypton.woff') format('woff');
	158	+}
	159	+@font-face {
	160	+ font-family: 'Code-Pro-Monaspace-Neon';
	161	+ src: url('../fonts/Code-Pro-Monaspace-Neon.woff') format('woff');
	162	+}
	163	+@font-face {
	164	+ font-family: 'Code-Pro-Monaspace-Radon';
	165	+ src: url('../fonts/Code-Pro-Monaspace-Radon.woff') format('woff');
	166	+}
	167	+@font-face {
	168	+ font-family: 'Code-Pro-Monaspace-Xenon';
	169	+ src: url('../fonts/Code-Pro-Monaspace-Xenon.woff') format('woff');
	170	+}
	171	+@font-face {
	172	+ font-family: 'Code-Pro-Geist-Mono';
	173	+ src: url('../fonts/Code-Pro-Geist-Mono.woff2') format('woff2');
	174	+}
	175	+@font-face {
	176	+ font-family: 'Code-Pro-Hack';
	177	+ src: url('../fonts/Code-Pro-Hack.woff2') format('woff2');
117	178	}