@bebranded/bb-contents 1.0.108 → 1.0.110

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.
Files changed (2) hide show
  1. package/bb-contents.js +44 -14
  2. package/package.json +1 -1
package/bb-contents.js CHANGED
@@ -1,7 +1,7 @@
1
1
  /**
2
2
  * BeBranded Contents
3
3
  * Contenus additionnels français pour Webflow
4
- * @version 1.0.108
4
+ * @version 1.0.110
5
5
  * @author BeBranded
6
6
  * @license MIT
7
7
  * @website https://www.bebranded.xyz
@@ -32,11 +32,11 @@
32
32
  window._bbContentsInitialized = true;
33
33
 
34
34
  // Log de démarrage simple (une seule fois)
35
- console.log('bb-contents | v1.0.108');
35
+ console.log('bb-contents | v1.0.110');
36
36
 
37
37
  // Configuration
38
38
  const config = {
39
- version: '1.0.108',
39
+ version: '1.0.110',
40
40
  debug: false, // Debug désactivé pour rendu propre
41
41
  prefix: 'bb-', // utilisé pour générer les sélecteurs (data-bb-*)
42
42
  youtubeEndpoint: null, // URL du worker YouTube (à définir par l'utilisateur)
@@ -475,21 +475,51 @@
475
475
  // pour éviter les images floues ou mal cadrées
476
476
  const allImages = scrollContainer.querySelectorAll('img');
477
477
  allImages.forEach(img => {
478
- // Vérifier si l'image a déjà des styles inline
479
- if (!img.style.objectFit) {
480
- const computedStyle = getComputedStyle(img);
481
- const objectFit = computedStyle.objectFit;
482
- const objectPosition = computedStyle.objectPosition;
478
+ // Détecter si c'est un SVG (par l'extension du src ou le type)
479
+ const isSVG = img.src && (img.src.toLowerCase().endsWith('.svg') || img.src.includes('data:image/svg+xml'));
480
+
481
+ // SOLUTION MOBILE SAFARI : Pour les SVG sur mobile, éviter object-fit qui cause du flou
482
+ if (isSVG && isMobile) {
483
+ // Sur mobile, NE PAS appliquer object-fit aux SVG (c'est ce qui cause le flou)
484
+ // Le SVG utilisera ses dimensions naturelles ou celles du conteneur
485
+ img.style.objectFit = 'none';
486
+ img.style.objectPosition = 'center';
487
+
488
+ // Forcer le GPU rendering
489
+ img.style.webkitTransform = 'translate3d(0, 0, 0)';
490
+ img.style.transform = 'translate3d(0, 0, 0)';
483
491
 
484
- // Appliquer object-fit si défini dans le CSS
485
- if (objectFit && objectFit !== 'none' && objectFit !== 'fill') {
486
- img.style.objectFit = objectFit;
492
+ // Améliorer le rendu des SVG
493
+ img.style.imageRendering = 'crisp-edges';
494
+
495
+ // S'assurer que le conteneur parent permet au SVG de s'afficher correctement
496
+ const parent = img.parentElement;
497
+ if (parent) {
498
+ parent.style.display = 'flex';
499
+ parent.style.alignItems = 'center';
500
+ parent.style.justifyContent = 'center';
487
501
  }
488
- // Appliquer object-position si défini dans le CSS
489
- if (objectPosition && objectPosition !== 'initial' && objectPosition !== '50% 50%') {
490
- img.style.objectPosition = objectPosition;
502
+ } else {
503
+ // Pour les images non-SVG ou sur desktop, appliquer les styles normaux
504
+ // Vérifier si l'image a déjà des styles inline
505
+ if (!img.style.objectFit) {
506
+ const computedStyle = getComputedStyle(img);
507
+ const objectFit = computedStyle.objectFit;
508
+ const objectPosition = computedStyle.objectPosition;
509
+
510
+ // Appliquer object-fit si défini dans le CSS
511
+ if (objectFit && objectFit !== 'none' && objectFit !== 'fill') {
512
+ img.style.objectFit = objectFit;
513
+ }
514
+ // Appliquer object-position si défini dans le CSS
515
+ if (objectPosition && objectPosition !== 'initial' && objectPosition !== '50% 50%') {
516
+ img.style.objectPosition = objectPosition;
517
+ }
491
518
  }
492
519
  }
520
+
521
+ // Forcer un reflow pour stabiliser le rendu
522
+ void img.offsetHeight;
493
523
  });
494
524
 
495
525
  // Vérifier que les images ont une taille visible
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bebranded/bb-contents",
3
- "version": "1.0.108",
3
+ "version": "1.0.110",
4
4
  "description": "Contenus additionnels français pour Webflow",
5
5
  "main": "bb-contents.js",
6
6
  "scripts": {