barua-ui 0.11.0 → 0.11.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/css/components/marketing.css +17 -6
- package/package.json +1 -1
|
@@ -228,23 +228,34 @@
|
|
|
228
228
|
width: max-content;
|
|
229
229
|
animation: b-marquee var(--b-marquee-time, 40s) linear infinite;
|
|
230
230
|
}
|
|
231
|
-
.
|
|
231
|
+
/* Named twice on purpose. A group almost always carries a row class as well
|
|
232
|
+
(.b-logo-wall is the usual one), and those are defined later in this layer,
|
|
233
|
+
so at equal specificity they were winning: the wall's justify-content
|
|
234
|
+
centred each group inside its floored width and the two dead ends met at
|
|
235
|
+
the seam as one wide hole, which is the bug the group was added to fix.
|
|
236
|
+
The three properties that make a marquee a marquee are not the row's to
|
|
237
|
+
decide. The rhythm still is: set --b-marquee-gap. */
|
|
238
|
+
.b-marquee .b-marquee__group {
|
|
239
|
+
--b-marquee-gap: clamp(var(--b-space-6), 5vw, var(--b-space-12));
|
|
232
240
|
display: flex;
|
|
233
241
|
flex: none;
|
|
242
|
+
flex-wrap: nowrap;
|
|
234
243
|
align-items: center;
|
|
235
244
|
justify-content: space-around;
|
|
236
|
-
gap:
|
|
245
|
+
gap: var(--b-marquee-gap);
|
|
237
246
|
min-width: 100cqi;
|
|
238
|
-
/*
|
|
239
|
-
|
|
240
|
-
|
|
247
|
+
/* space-around leaves half a share at each end, so a seam is already half
|
|
248
|
+
plus half. The gap is a separate, fixed minimum that only applies BETWEEN
|
|
249
|
+
items, so without this the seam came up exactly one gap short of every
|
|
250
|
+
other space in the belt. Half at each end restores it. */
|
|
251
|
+
padding-inline: calc(var(--b-marquee-gap) / 2);
|
|
241
252
|
}
|
|
242
253
|
.b-marquee:hover .b-marquee__track { animation-play-state: paused; }
|
|
243
254
|
@keyframes b-marquee { to { translate: -50% 0; } }
|
|
244
255
|
@media (prefers-reduced-motion: reduce) {
|
|
245
256
|
.b-marquee { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
|
|
246
257
|
.b-marquee__track { animation: none; }
|
|
247
|
-
.b-marquee__group { min-width: 0; }
|
|
258
|
+
.b-marquee .b-marquee__group { min-width: 0; }
|
|
248
259
|
}
|
|
249
260
|
|
|
250
261
|
/* ---- Quote card: a number, a sentence, and who said it -------------------
|