← All changes | blocks/data-table/style.css +58 -12 2.0.2 → 2.0.13 View file →

		@@ -142,10 +142,17 @@
142	142	}
143	143
144	144	.bkbg-dt-th {
145	145	padding: var(--bkbg-dt-cell-padding);
146		- font-size: var(--bkbg-dt-header-font-size);
147		- font-weight: var(--bkbg-dt-header-font-weight);
	146	+ font-family: var(--bkbg-dt-hdr-font-family, inherit);
	147	+ font-size: var(--bkbg-dt-hdr-font-size-d, var(--bkbg-dt-header-font-size));
	148	+ font-weight: var(--bkbg-dt-hdr-font-weight, var(--bkbg-dt-header-font-weight));
	149	+ line-height: var(--bkbg-dt-hdr-line-height-d, 1.4);
	150	+ letter-spacing: var(--bkbg-dt-hdr-letter-spacing-d, normal);
	151	+ word-spacing: var(--bkbg-dt-hdr-word-spacing-d, normal);
	152	+ text-transform: var(--bkbg-dt-hdr-text-transform, none);
	153	+ font-style: var(--bkbg-dt-hdr-font-style, normal);
	154	+ text-decoration: var(--bkbg-dt-hdr-text-decoration, none);
148	155	color: var(--bkbg-dt-header-color);
149	156	text-align: left;
150	157	border-bottom: var(--bkbg-dt-brd-w) solid var(--bkbg-dt-header-border);
151	158	white-space: nowrap;
		@@ -211,10 +218,17 @@
211	218	}
212	219
213	220	.bkbg-dt-td {
214	221	padding: var(--bkbg-dt-cell-padding);
215		- font-size: var(--bkbg-dt-cell-font-size);
216		- font-weight: var(--bkbg-dt-cell-font-weight);
	222	+ font-family: var(--bkbg-dt-cel-font-family, inherit);
	223	+ font-size: var(--bkbg-dt-cel-font-size-d, var(--bkbg-dt-cell-font-size));
	224	+ font-weight: var(--bkbg-dt-cel-font-weight, var(--bkbg-dt-cell-font-weight));
	225	+ line-height: var(--bkbg-dt-cel-line-height-d, 1.4);
	226	+ letter-spacing: var(--bkbg-dt-cel-letter-spacing-d, normal);
	227	+ word-spacing: var(--bkbg-dt-cel-word-spacing-d, normal);
	228	+ text-transform: var(--bkbg-dt-cel-text-transform, none);
	229	+ font-style: var(--bkbg-dt-cel-font-style, normal);
	230	+ text-decoration: var(--bkbg-dt-cel-text-decoration, none);
217	231	color: var(--bkbg-dt-cell-color);
218	232	background: var(--bkbg-dt-cell-bg);
219	233	border-bottom: var(--bkbg-dt-brd-w) solid var(--bkbg-dt-cell-border);
220	234	vertical-align: middle;
		@@ -321,8 +335,40 @@
321	335	.bkbg-dt-wrap[data-style="minimal"] .bkbg-dt-td {
322	336	background: transparent;
323	337	}
324	338
	339	+/* Responsive: Typography — Tablet */
	340	+@media (max-width: 1024px) {
	341	+ .bkbg-dt-th {
	342	+ font-size: var(--bkbg-dt-hdr-font-size-t, var(--bkbg-dt-hdr-font-size-d, var(--bkbg-dt-header-font-size)));
	343	+ line-height: var(--bkbg-dt-hdr-line-height-t, var(--bkbg-dt-hdr-line-height-d, 1.4));
	344	+ letter-spacing: var(--bkbg-dt-hdr-letter-spacing-t, var(--bkbg-dt-hdr-letter-spacing-d, normal));
	345	+ word-spacing: var(--bkbg-dt-hdr-word-spacing-t, var(--bkbg-dt-hdr-word-spacing-d, normal));
	346	+ }
	347	+ .bkbg-dt-td {
	348	+ font-size: var(--bkbg-dt-cel-font-size-t, var(--bkbg-dt-cel-font-size-d, var(--bkbg-dt-cell-font-size)));
	349	+ line-height: var(--bkbg-dt-cel-line-height-t, var(--bkbg-dt-cel-line-height-d, 1.4));
	350	+ letter-spacing: var(--bkbg-dt-cel-letter-spacing-t, var(--bkbg-dt-cel-letter-spacing-d, normal));
	351	+ word-spacing: var(--bkbg-dt-cel-word-spacing-t, var(--bkbg-dt-cel-word-spacing-d, normal));
	352	+ }
	353	+}
	354	+
	355	+/* Responsive: Typography — Mobile */
	356	+@media (max-width: 767px) {
	357	+ .bkbg-dt-th {
	358	+ font-size: var(--bkbg-dt-hdr-font-size-m, var(--bkbg-dt-hdr-font-size-t, var(--bkbg-dt-hdr-font-size-d, var(--bkbg-dt-header-font-size))));
	359	+ line-height: var(--bkbg-dt-hdr-line-height-m, var(--bkbg-dt-hdr-line-height-t, var(--bkbg-dt-hdr-line-height-d, 1.4)));
	360	+ letter-spacing: var(--bkbg-dt-hdr-letter-spacing-m, var(--bkbg-dt-hdr-letter-spacing-t, var(--bkbg-dt-hdr-letter-spacing-d, normal)));
	361	+ word-spacing: var(--bkbg-dt-hdr-word-spacing-m, var(--bkbg-dt-hdr-word-spacing-t, var(--bkbg-dt-hdr-word-spacing-d, normal)));
	362	+ }
	363	+ .bkbg-dt-td {
	364	+ font-size: var(--bkbg-dt-cel-font-size-m, var(--bkbg-dt-cel-font-size-t, var(--bkbg-dt-cel-font-size-d, var(--bkbg-dt-cell-font-size))));
	365	+ line-height: var(--bkbg-dt-cel-line-height-m, var(--bkbg-dt-cel-line-height-t, var(--bkbg-dt-cel-line-height-d, 1.4)));
	366	+ letter-spacing: var(--bkbg-dt-cel-letter-spacing-m, var(--bkbg-dt-cel-letter-spacing-t, var(--bkbg-dt-cel-letter-spacing-d, normal)));
	367	+ word-spacing: var(--bkbg-dt-cel-word-spacing-m, var(--bkbg-dt-cel-word-spacing-t, var(--bkbg-dt-cel-word-spacing-d, normal)));
	368	+ }
	369	+}
	370	+
325	371	/* Responsive: Stack on mobile */
326	372	@media (max-width: 768px) {
327	373	.bkbg-dt-wrap[data-responsive="stack"] .bkbg-dt-container {
328	374	border: none;
		@@ -403,18 +449,19 @@
403	449	background: rgba(59, 130, 246, 0.05);
404	450	}
405	451
406	452	.bkbg-dt-editor-th .bkbg-dt-editor-input {
407		- font-weight: var(--bkbg-dt-header-font-weight);
	453	+ font-weight: var(--bkbg-dt-hdr-font-weight, var(--bkbg-dt-header-font-weight));
408	454	color: var(--bkbg-dt-header-color);
	455	+ font: inherit;
	456	+ text-transform: inherit;
	457	+ font-style: inherit;
	458	+ text-decoration: inherit;
	459	+ letter-spacing: inherit;
	460	+ word-spacing: inherit;
409	461	}
410	462
411		-.bkbg-dt-editor-actions {
412		- display: flex;
413		- gap: 8px;
414		- margin-top: 12px;
415		- flex-wrap: wrap;
416		-}
	463	+/* Editor actions are standardized via assets/css/editor.css (.bkbg-editor-actions) */
417	464
418	465	.bkbg-dt-row-handle {
419	466	position: absolute;
420	467	left: -30px;
		@@ -500,6 +547,5 @@
500	547	.bkbg-dt-import-actions {
501	548	display: flex;
502	549	gap: 8px;
503	550	}
504		-
505	551