Blocs ondersteunt nu meerdere versies van het Bootstrap-framework en bevat ook extra ingebouwde functionaliteit om eenvoudig een project naar de nieuwste versie te migreren.
Hoe te migreren
Om een project naar Bootstrap 5 te migreren, opent u het main Projectinstellingen en stel de kader vervolgkeuzelijst naar Bootstrap 5. Het migratieproces zal dan beginnen en u informeren wanneer het voltooid is.
Belangrijke wijzigingen
De Blocs geautomatiseerde migratiefunctie migreert alleen code dat Blocs heeft gemaakt, zal het geen aangepaste code migreren die is toegevoegd aan een project via toebehoren Code-editor of Codewidget Om eventuele problemen op te lossen, raden we u aan om uzelf vertrouwd te maken met de functionaris Bootstrap 5-migratiedocumenten.
Styling
Er zijn een aantal kleine verschillen in visuele stijl in Bootstrap 5, maar het meest opvallende is het feit dat alle links nu standaard onderstreept zijn om de toegankelijkheid van de site te helpen verbeteren.
Structuur
Alle navigatiebalken hebben nu een container erin. Dit vereenvoudigt de afstandsvereisten drastisch en maakt uitgebreide CSS-overrides overbodig.
Javascript
Bootstrap 5 vereist of gebruikt niet langer jQuery Dit betekent dat Jquery niet standaard is opgenomen in Bootstrap 5-sites. Deze wijziging kan mogelijk aangepast javascript breken dat aan een project is toegevoegd.
Bij export Blocs scant alle javascript-bijlagen en inspecteert ze op duidelijke verwijzingen naar Jquery. Als er referenties worden gevonden, Blocs zal JQuery automatisch aan de site toevoegen.
Houd er rekening mee dat elke JQuery-code die via de code-editor aan een project wordt toegevoegd, de automatische opname van Jquery niet zal activeren.
Gegevensattributen
Gegevensattributen voor alle JavaScript (modals, carrousels, tooltips enz.) Hebben nu een naamruimte gekregen om de Bootstrap-functionaliteit te onderscheiden van die van derden. Bootstrap 5 gebruikt bijvoorbeeld data-bs-toggle in plaats van gegevens-schakelaar Hieronder vindt u een lijst met de meest voorkomende gegevensattributen die zijn gewijzigd.Raadpleeg het Bootstrap 5-migratiedocumenten voor een uitgebreide lijst.
- gegevens-schakelaar > data-bs-toggle
- data-plaatsing > data-bs-plaatsing
- data-ouder > data-bs-ouder
- data-disiss > data-bs-negeren
- data-rit > data-bs-rit
- gegevensdia > data-bs-dia
- data-slide-naar > data-bs-slide-naar
Klassen
Er zijn een aantal wijzigingen in de klassenamen in Bootstrap 5, hieronder staat een lijst met de meest voorkomende klassen die zijn gewijzigd. Raadpleeg de Bootstrap 5-migratiedocumenten voor een uitgebreide lijst.
Formulieren
- aangepaste controle > formulier-check
- aangepaste schakelaar > vorm-schakelaar
- aangepaste controle-invoer > formulier-check-input
- aangepast controlelabel > formulier-check-label
Responsieve insluitingen
- insluiten-responsief > verhouding
- embed-responsive-16by9 > verhouding-16 × 9
- embed-responsive-4by3 > verhouding-4 × 3
- embed-responsive-4by4 > verhouding-4 × 4
- embed-responsive-9by16 > verhouding-9 × 16
Marge en opvulling
- ml-0 > ms-0
- ml-1 > ms-1
- ml-2 > ms-2
- ml-3 > ms-3
- ml-4 > ms-4
- ml-5 > ms-5
- ml-auto > ms-auto
- mr-0 > me-0
- mr-1 > me-1
- mr-2 > me-2
- mr-3 > me-3
- mr-4 > me-4
- mr-5 > me-5
- dhr-auto > ik-auto
- pl-0 > PS-0
- pl-1 > PS-1
- pl-2 > PS-2
- pl-3 > PS-3
- pl-4 > PS-4
- pl-5 > PS-5
- pl-auto > ps-auto
- pr-0 > pr-0
- pr-1 > pe-1
- pr-2 > pe-2
- pr-3 > pe-3
- pr-4 > pe-4
- pr-5 > pe-5
- pr-auto > pe-auto
Uitlijning
- zweven naar links > vlotter-start
- zweven-rechts > vlotter-einde
- tekst-links > tekst-start
- tekst-rechts > tekst-end
Popovers en tooltips
- pijl > tooltip-pijl
- pijl > popover-pijl
Diversen
- alleen sr > visueel verborgen
- no-goten > G-0
- btn-block > w-100