@bebranded/bb-contents 1.0.0 → 1.0.2-beta
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/bb-contents.js +27 -5
- 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.
|
|
4
|
+
* @version 1.0.2-beta
|
|
5
5
|
* @author BeBranded
|
|
6
6
|
* @license MIT
|
|
7
7
|
* @website https://www.bebranded.xyz
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
|
|
18
18
|
// Configuration
|
|
19
19
|
const config = {
|
|
20
|
-
version: '1.0.
|
|
20
|
+
version: '1.0.2-beta',
|
|
21
21
|
debug: window.location.hostname === 'localhost' || window.location.hostname.includes('webflow.io'),
|
|
22
22
|
prefix: 'bb-', // utilisé pour générer les sélecteurs (data-bb-*)
|
|
23
23
|
i18n: {
|
|
@@ -588,19 +588,23 @@
|
|
|
588
588
|
const gap = bbContents._getAttr(element, 'bb-marquee-gap') || '50';
|
|
589
589
|
const orientation = bbContents._getAttr(element, 'bb-marquee-orientation') || 'horizontal';
|
|
590
590
|
const height = bbContents._getAttr(element, 'bb-marquee-height') || '300';
|
|
591
|
+
const isVertical = orientation === 'vertical';
|
|
592
|
+
const minHeight = bbContents._getAttr(element, 'bb-marquee-min-height') || (isVertical ? '100px' : 'auto');
|
|
591
593
|
|
|
592
594
|
// Sauvegarder le contenu original
|
|
593
595
|
const originalHTML = element.innerHTML;
|
|
594
596
|
|
|
595
597
|
// Créer le conteneur principal
|
|
596
598
|
const mainContainer = document.createElement('div');
|
|
597
|
-
|
|
599
|
+
// Pour le marquee horizontal, on va détecter automatiquement la hauteur des logos
|
|
600
|
+
const autoHeight = !isVertical && !bbContents._getAttr(element, 'bb-marquee-height');
|
|
601
|
+
|
|
598
602
|
mainContainer.style.cssText = `
|
|
599
603
|
position: relative;
|
|
600
604
|
width: 100%;
|
|
601
|
-
height: ${isVertical ? height + 'px' : 'auto'};
|
|
605
|
+
height: ${isVertical ? height + 'px' : (autoHeight ? 'auto' : height + 'px')};
|
|
602
606
|
overflow: hidden;
|
|
603
|
-
min-height: ${
|
|
607
|
+
min-height: ${minHeight};
|
|
604
608
|
`;
|
|
605
609
|
|
|
606
610
|
// Créer le conteneur de défilement
|
|
@@ -655,6 +659,24 @@
|
|
|
655
659
|
const contentWidth = mainBlock.offsetWidth;
|
|
656
660
|
const contentHeight = mainBlock.offsetHeight;
|
|
657
661
|
|
|
662
|
+
// Si auto-height est activé, ajuster la hauteur du conteneur
|
|
663
|
+
if (autoHeight && !isVertical) {
|
|
664
|
+
const logoElements = mainBlock.querySelectorAll('.bb-marquee_logo, img, svg');
|
|
665
|
+
let maxHeight = 0;
|
|
666
|
+
|
|
667
|
+
logoElements.forEach(logo => {
|
|
668
|
+
const logoHeight = logo.offsetHeight || logo.getBoundingClientRect().height;
|
|
669
|
+
if (logoHeight > maxHeight) {
|
|
670
|
+
maxHeight = logoHeight;
|
|
671
|
+
}
|
|
672
|
+
});
|
|
673
|
+
|
|
674
|
+
if (maxHeight > 0) {
|
|
675
|
+
mainContainer.style.height = maxHeight + 'px';
|
|
676
|
+
bbContents.utils.log('Auto-height détecté:', maxHeight + 'px');
|
|
677
|
+
}
|
|
678
|
+
}
|
|
679
|
+
|
|
658
680
|
// Debug
|
|
659
681
|
bbContents.utils.log('Debug - Largeur du contenu:', contentWidth, 'px', 'Hauteur:', contentHeight, 'px', 'Enfants:', mainBlock.children.length, 'Vertical:', isVertical, 'Direction:', direction);
|
|
660
682
|
|