@thiagormoreira/nightwind 1.3.1 → 1.3.3
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/helper.js +8 -5
- package/package.json +1 -1
- package/src/index.js +9 -1
package/helper.js
CHANGED
|
@@ -23,14 +23,17 @@ module.exports = {
|
|
|
23
23
|
|
|
24
24
|
beforeTransition: () => {
|
|
25
25
|
const doc = document.documentElement
|
|
26
|
-
const onTransitionDone = () => {
|
|
27
|
-
doc.classList.remove("nightwind")
|
|
28
|
-
doc.removeEventListener("transitionend", onTransitionDone)
|
|
29
|
-
}
|
|
30
|
-
doc.addEventListener("transitionend", onTransitionDone)
|
|
31
26
|
if (!doc.classList.contains("nightwind")) {
|
|
32
27
|
doc.classList.add("nightwind")
|
|
33
28
|
}
|
|
29
|
+
// Use timeout instead of transitionend to avoid premature removal
|
|
30
|
+
// when multiple properties transition at different speeds
|
|
31
|
+
const duration = parseFloat(
|
|
32
|
+
window.getComputedStyle(document.body).getPropertyValue("--nightwind-transition-duration") || "400"
|
|
33
|
+
)
|
|
34
|
+
window.setTimeout(() => {
|
|
35
|
+
doc.classList.remove("nightwind")
|
|
36
|
+
}, duration + 100) // Small buffer to ensure all transitions complete
|
|
34
37
|
},
|
|
35
38
|
|
|
36
39
|
toggle: () => {
|
package/package.json
CHANGED
package/src/index.js
CHANGED
|
@@ -224,7 +224,7 @@ const nightwind = plugin(
|
|
|
224
224
|
|
|
225
225
|
// Generate transition classes
|
|
226
226
|
|
|
227
|
-
let transitionDurationValue = "
|
|
227
|
+
let transitionDurationValue = "400ms"
|
|
228
228
|
if (
|
|
229
229
|
theme("nightwind.transitionDuration") === false ||
|
|
230
230
|
theme("transitionDuration.nightwind") === false
|
|
@@ -268,11 +268,13 @@ const nightwind = plugin(
|
|
|
268
268
|
}.nightwind .${prefix}-${color}`]: {
|
|
269
269
|
transitionDuration: transitionDurationValue,
|
|
270
270
|
transitionProperty: theme("transitionProperty.colors"),
|
|
271
|
+
transitionTimingFunction: "ease-in-out",
|
|
271
272
|
},
|
|
272
273
|
[`${config("important") ? importantSelector : ""
|
|
273
274
|
}.nightwind .dark\\:${prefix}-${color}`]: {
|
|
274
275
|
transitionDuration: transitionDurationValue,
|
|
275
276
|
transitionProperty: theme("transitionProperty.colors"),
|
|
277
|
+
transitionTimingFunction: "ease-in-out",
|
|
276
278
|
},
|
|
277
279
|
}
|
|
278
280
|
transitionClasses.push(transitionClass)
|
|
@@ -283,11 +285,13 @@ const nightwind = plugin(
|
|
|
283
285
|
}.nightwind .${prefix}-${color}-${weight}`]: {
|
|
284
286
|
transitionDuration: transitionDurationValue,
|
|
285
287
|
transitionProperty: theme("transitionProperty.colors"),
|
|
288
|
+
transitionTimingFunction: "ease-in-out",
|
|
286
289
|
},
|
|
287
290
|
[`${config("important") ? importantSelector : ""
|
|
288
291
|
}.nightwind .dark\\:${prefix}-${color}-${weight}`]: {
|
|
289
292
|
transitionDuration: transitionDurationValue,
|
|
290
293
|
transitionProperty: theme("transitionProperty.colors"),
|
|
294
|
+
transitionTimingFunction: "ease-in-out",
|
|
291
295
|
},
|
|
292
296
|
}
|
|
293
297
|
transitionClasses.push(transitionClass)
|
|
@@ -392,12 +396,14 @@ const nightwind = plugin(
|
|
|
392
396
|
}`]: {
|
|
393
397
|
transitionDuration: transitionDurationValue,
|
|
394
398
|
transitionProperty: theme("transitionProperty.colors"),
|
|
399
|
+
transitionTimingFunction: "ease-in-out",
|
|
395
400
|
},
|
|
396
401
|
[`${config("important") ? importantSelector : ""
|
|
397
402
|
}.nightwind .dark\\:prose${modifier !== "DEFAULT" ? `-${modifier}` : ""
|
|
398
403
|
}`]: {
|
|
399
404
|
transitionDuration: transitionDurationValue,
|
|
400
405
|
transitionProperty: theme("transitionProperty.colors"),
|
|
406
|
+
transitionTimingFunction: "ease-in-out",
|
|
401
407
|
},
|
|
402
408
|
}
|
|
403
409
|
transitionClasses.push(typographyTransitionClass)
|
|
@@ -456,12 +462,14 @@ const nightwind = plugin(
|
|
|
456
462
|
} ${classname}`]: {
|
|
457
463
|
transitionDuration: transitionDurationValue,
|
|
458
464
|
transitionProperty: theme("transitionProperty.colors"),
|
|
465
|
+
transitionTimingFunction: "ease-in-out",
|
|
459
466
|
},
|
|
460
467
|
[`${config("important") ? importantSelector : ""
|
|
461
468
|
}.nightwind .dark\\:prose${modifier !== "DEFAULT" ? `-${modifier}` : ""
|
|
462
469
|
} ${classname}`]: {
|
|
463
470
|
transitionDuration: transitionDurationValue,
|
|
464
471
|
transitionProperty: theme("transitionProperty.colors"),
|
|
472
|
+
transitionTimingFunction: "ease-in-out",
|
|
465
473
|
},
|
|
466
474
|
}
|
|
467
475
|
transitionClasses.push(typographyTransitionClass)
|