← All changes | blocks/countdown/style.css +69 -10 2.0.3 → 2.0.14 View file →

		@@ -29,10 +29,17 @@
29	29	}
30	30
31	31	/* Title */
32	32	.bkbg-cd-title {
33		- font-size: var(--bkbg-cd-title-size);
34		- font-weight: 600;
	33	+ font-family: var(--bkbg-cd-ttl-font-family, inherit);
	34	+ font-size: var(--bkbg-cd-ttl-font-size-d, var(--bkbg-cd-title-size));
	35	+ font-weight: var(--bkbg-cd-ttl-font-weight, 600);
	36	+ font-style: var(--bkbg-cd-ttl-font-style, normal);
	37	+ text-transform: var(--bkbg-cd-ttl-text-transform, none);
	38	+ text-decoration: var(--bkbg-cd-ttl-text-decoration, none);
	39	+ line-height: var(--bkbg-cd-ttl-line-height-d, 1.2);
	40	+ letter-spacing: var(--bkbg-cd-ttl-letter-spacing-d, normal);
	41	+ word-spacing: var(--bkbg-cd-ttl-word-spacing-d, normal);
35	42	color: var(--bkbg-cd-title-color);
36	43	margin-bottom: var(--bkbg-cd-gap);
37	44	}
38	45
		@@ -63,22 +70,32 @@
63	70	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
64	71	}
65	72
66	73	.bkbg-cd-number {
67		- font-size: var(--bkbg-cd-digit-size);
68		- font-weight: var(--bkbg-cd-digit-weight);
69		- line-height: 1;
	74	+ font-family: var(--bkbg-cd-dig-font-family, inherit);
	75	+ font-size: var(--bkbg-cd-dig-font-size-d, var(--bkbg-cd-digit-size));
	76	+ font-weight: var(--bkbg-cd-dig-font-weight, var(--bkbg-cd-digit-weight));
	77	+ font-style: var(--bkbg-cd-dig-font-style, normal);
	78	+ text-transform: var(--bkbg-cd-dig-text-transform, none);
	79	+ text-decoration: var(--bkbg-cd-dig-text-decoration, none);
	80	+ line-height: var(--bkbg-cd-dig-line-height-d, 1);
	81	+ letter-spacing: var(--bkbg-cd-dig-letter-spacing-d, -0.02em);
	82	+ word-spacing: var(--bkbg-cd-dig-word-spacing-d, normal);
70	83	font-variant-numeric: tabular-nums;
71		- letter-spacing: -0.02em;
72	84	}
73	85
74	86	/* Label */
75	87	.bkbg-cd-label {
76		- font-size: var(--bkbg-cd-label-size);
77		- font-weight: var(--bkbg-cd-label-weight);
	88	+ font-family: var(--bkbg-cd-lbl-font-family, inherit);
	89	+ font-size: var(--bkbg-cd-lbl-font-size-d, var(--bkbg-cd-label-size));
	90	+ font-weight: var(--bkbg-cd-lbl-font-weight, var(--bkbg-cd-label-weight));
	91	+ font-style: var(--bkbg-cd-lbl-font-style, normal);
	92	+ text-transform: var(--bkbg-cd-lbl-text-transform, uppercase);
	93	+ text-decoration: var(--bkbg-cd-lbl-text-decoration, none);
	94	+ line-height: var(--bkbg-cd-lbl-line-height-d, 1.2);
	95	+ letter-spacing: var(--bkbg-cd-lbl-letter-spacing-d, 0.05em);
	96	+ word-spacing: var(--bkbg-cd-lbl-word-spacing-d, normal);
78	97	color: var(--bkbg-cd-label-color);
79		- text-transform: uppercase;
80		- letter-spacing: 0.05em;
81	98	}
82	99
83	100	/* Separator */
84	101	.bkbg-cd-separator {
		@@ -258,6 +275,48 @@
258	275	}
259	276
260	277	.bkbg-cd-separator {
261	278	padding: 8px 2px;
	279	+ }
	280	+}
	281	+
	282	+/* Typography responsive */
	283	+@media (max-width: 1024px) {
	284	+ .bkbg-cd-number {
	285	+ font-size: var(--bkbg-cd-dig-font-size-t, var(--bkbg-cd-dig-font-size-d, var(--bkbg-cd-digit-size)));
	286	+ line-height: var(--bkbg-cd-dig-line-height-t, var(--bkbg-cd-dig-line-height-d, 1));
	287	+ letter-spacing: var(--bkbg-cd-dig-letter-spacing-t, var(--bkbg-cd-dig-letter-spacing-d, -0.02em));
	288	+ word-spacing: var(--bkbg-cd-dig-word-spacing-t, var(--bkbg-cd-dig-word-spacing-d, normal));
	289	+ }
	290	+ .bkbg-cd-label {
	291	+ font-size: var(--bkbg-cd-lbl-font-size-t, var(--bkbg-cd-lbl-font-size-d, var(--bkbg-cd-label-size)));
	292	+ line-height: var(--bkbg-cd-lbl-line-height-t, var(--bkbg-cd-lbl-line-height-d, 1.2));
	293	+ letter-spacing: var(--bkbg-cd-lbl-letter-spacing-t, var(--bkbg-cd-lbl-letter-spacing-d, 0.05em));
	294	+ word-spacing: var(--bkbg-cd-lbl-word-spacing-t, var(--bkbg-cd-lbl-word-spacing-d, normal));
	295	+ }
	296	+ .bkbg-cd-title {
	297	+ font-size: var(--bkbg-cd-ttl-font-size-t, var(--bkbg-cd-ttl-font-size-d, var(--bkbg-cd-title-size)));
	298	+ line-height: var(--bkbg-cd-ttl-line-height-t, var(--bkbg-cd-ttl-line-height-d, 1.2));
	299	+ letter-spacing: var(--bkbg-cd-ttl-letter-spacing-t, var(--bkbg-cd-ttl-letter-spacing-d, normal));
	300	+ word-spacing: var(--bkbg-cd-ttl-word-spacing-t, var(--bkbg-cd-ttl-word-spacing-d, normal));
	301	+ }
	302	+}
	303	+@media (max-width: 767px) {
	304	+ .bkbg-cd-number {
	305	+ font-size: var(--bkbg-cd-dig-font-size-m, var(--bkbg-cd-dig-font-size-t, var(--bkbg-cd-dig-font-size-d, var(--bkbg-cd-digit-size))));
	306	+ line-height: var(--bkbg-cd-dig-line-height-m, var(--bkbg-cd-dig-line-height-t, var(--bkbg-cd-dig-line-height-d, 1)));
	307	+ letter-spacing: var(--bkbg-cd-dig-letter-spacing-m, var(--bkbg-cd-dig-letter-spacing-t, var(--bkbg-cd-dig-letter-spacing-d, -0.02em)));
	308	+ word-spacing: var(--bkbg-cd-dig-word-spacing-m, var(--bkbg-cd-dig-word-spacing-t, var(--bkbg-cd-dig-word-spacing-d, normal)));
	309	+ }
	310	+ .bkbg-cd-label {
	311	+ font-size: var(--bkbg-cd-lbl-font-size-m, var(--bkbg-cd-lbl-font-size-t, var(--bkbg-cd-lbl-font-size-d, var(--bkbg-cd-label-size))));
	312	+ line-height: var(--bkbg-cd-lbl-line-height-m, var(--bkbg-cd-lbl-line-height-t, var(--bkbg-cd-lbl-line-height-d, 1.2)));
	313	+ letter-spacing: var(--bkbg-cd-lbl-letter-spacing-m, var(--bkbg-cd-lbl-letter-spacing-t, var(--bkbg-cd-lbl-letter-spacing-d, 0.05em)));
	314	+ word-spacing: var(--bkbg-cd-lbl-word-spacing-m, var(--bkbg-cd-lbl-word-spacing-t, var(--bkbg-cd-lbl-word-spacing-d, normal)));
	315	+ }
	316	+ .bkbg-cd-title {
	317	+ font-size: var(--bkbg-cd-ttl-font-size-m, var(--bkbg-cd-ttl-font-size-t, var(--bkbg-cd-ttl-font-size-d, var(--bkbg-cd-title-size))));
	318	+ line-height: var(--bkbg-cd-ttl-line-height-m, var(--bkbg-cd-ttl-line-height-t, var(--bkbg-cd-ttl-line-height-d, 1.2)));
	319	+ letter-spacing: var(--bkbg-cd-ttl-letter-spacing-m, var(--bkbg-cd-ttl-letter-spacing-t, var(--bkbg-cd-ttl-letter-spacing-d, normal)));
	320	+ word-spacing: var(--bkbg-cd-ttl-word-spacing-m, var(--bkbg-cd-ttl-word-spacing-t, var(--bkbg-cd-ttl-word-spacing-d, normal)));
262	321	}
263	322	}