Bootstrap5 Fixes.

[CaMer0n]

Please comment with a task list below on anything in e107 that does not render correctly using Bootstrap 5. @Jimmi08

[Jimmi08]

Labels/Badges

this is code for displaying labels/badges for all bootstrap versions in tinymce:

bootstrap3 uses labels bootstrap4 uses badge badge- bootstrap5 uses badge bg- text-***

                {title: 'Bootstrap Inline', items: [
         {title: 'Label (Default)', inline: 'span', classes: 'label label-default'},
         {title: 'Label (Primary)', inline: 'span', classes: 'label label-primary'},
                 {title: 'Label (Success)', inline: 'span', classes: 'label label-success'},
                 {title: 'Label (Info)', inline: 'span', classes: 'label label-info'},
                 {title: 'Label (Warning)', inline: 'span', classes: 'label label-warning'},
                 {title: 'Label (Danger)', inline: 'span', classes: 'label label-danger'},
                 {title: 'Muted', inline: 'span', classes: 'text-muted'},
         {title: 'Badge (Primary)', inline: 'span', classes: 'badge badge-primary'},
                 {title: 'Badge (Secondary)', inline: 'span', classes: 'badge badge-secondary'},
                 {title: 'Badge (Success)', inline: 'span', classes: 'badge badge-success'},
                 {title: 'Badge (Info)', inline: 'span', classes: 'badge badge-info'},
                 {title: 'Badge (Warning)', inline: 'span', classes: 'badge badge-warning'},
                 {title: 'Badge (Danger)', inline: 'span', classes: 'badge badge-danger'},
                 {title: 'Badge (Light)', inline: 'span', classes: 'badge badge-light'},
                 {title: 'Badge (Dark)', inline: 'span', classes: 'badge badge-dark'},
                 {title: 'Badge (Primary + Light text)', inline: 'span', classes: 'badge bg-primary text-light'},
                 {title: 'Badge (Primary + Dark text)', inline: 'span', classes: 'badge bg-primary text-dark'},                  
                 {title: 'Badge (Secondary + Light text)', inline: 'span', classes: 'badge bg-secondary text-light'},
                 {title: 'Badge (Secondary + Dark text)', inline: 'span', classes: 'badge bg-secondary text-dark'},                     
                 {title: 'Badge (Success + Light text)', inline: 'span', classes: 'badge bg-success text-light'},
                 {title: 'Badge (Success + Dark text)', inline: 'span', classes: 'badge bg-success text-dark'},                 
                 {title: 'Badge (Info + Light text)', inline: 'span', classes: 'badge bg-info text-light'},
                 {title: 'Badge (Info + Dark text)', inline: 'span', classes: 'badge bg-info text-dark'},        
                 {title: 'Badge (Warning + Light text)', inline: 'span', classes: 'badge bg-warning text-light'},
                 {title: 'Badge (Warning + Dark text)', inline: 'span', classes: 'badge bg-warning text-dark'},                            
                 {title: 'Badge (Danger + Light text)', inline: 'span', classes: 'badge bg-danger text-light'},
                 {title: 'Badge (Danger + Dark text)', inline: 'span', classes: 'badge bg-danger text-dark'},                             
                 {title: 'Badge (Light + Light text)', inline: 'span', classes: 'badge bg-light text-light'},
                 {title: 'Badge (Light + Dark text)', inline: 'span', classes: 'badge bg-light text-dark'},
                 {title: 'Badge (Dark + Light text)', inline: 'span', classes: 'badge bg-dark text-light'},
                 {title: 'Badge (Dark + Dark text)', inline: 'span', classes: 'badge bg-dark text-dark'},
                ]},

This is example for MDB5: - all combination with texts are used only for test purposes

After combination (with alternatives):

                 {title: 'Bootstrap Inline', items: [
                 {title: 'Label (Primary) / Badge (Primary) ', inline: 'span', classes: 'label label-primary badge badge-primary bg-primary'},
                 {title: 'Label (Default) / Badge (Secondary)', inline: 'span', classes: 'label label-default badge badge-secondary bg-secondary'},
                 {title: 'Label (Success) / Badge (Success)', inline: 'span', classes: 'label label-success badge badge-success bg-success'},
                 {title: 'Label (Info) / Badge (Info)', inline: 'span', classes: 'label label-info badge badge-info bg-info text-dark'},
                 {title: 'Label (Warning) / Badge (Warning)', inline: 'span', classes: 'label label-warning badge badge-warning bg-warning text-dark'},
                 {title: 'Label (Danger) / Badge (Danger)', inline: 'span', classes: 'label label-danger badge badge-danger bg-danger'},
                 {title: 'Muted', inline: 'span', classes: 'text-muted'},
                 {title: 'Badge (Light)', inline: 'span', classes: 'badge badge-light bg-light text-dark'},
                 {title: 'Badge (Dark)', inline: 'span', classes: 'badge badge-dark bg-dark'},
                 {title: 'Badge (Primary + Dark text)', inline: 'span', classes: 'badge bg-primary text-dark'},                  
                 {title: 'Badge (Secondary + Dark text)', inline: 'span', classes: 'badge bg-secondary text-dark'},                     
                 {title: 'Badge (Success + Dark text)', inline: 'span', classes: 'badge bg-success text-dark'},                 
                 {title: 'Badge (Info + Light text)', inline: 'span', classes: 'badge bg-info text-light'},      
                 {title: 'Badge (Warning + Light text)', inline: 'span', classes: 'badge bg-warning text-light'},                         
                 {title: 'Badge (Danger + Light text)', inline: 'span', classes: 'badge bg-danger text-light'},
                 {title: 'Badge (Danger + Dark text)', inline: 'span', classes: 'badge bg-danger text-dark'},                             
                ]},

After for only official supported badges for bt5 (without alternatives)

                 {title: 'Bootstrap Inline', items: [
                 {title: 'Label (Primary) / Badge (Primary) ', inline: 'span', classes: 'label label-primary badge badge-primary bg-primary'},
         {title: 'Label (Default) / Badge (Secondary)', inline: 'span', classes: 'label label-default badge badge-secondary bg-secondary'},
                 {title: 'Label (Success) / Badge (Success)', inline: 'span', classes: 'label label-success badge badge-success bg-success'},
                 {title: 'Label (Info) / Badge (Info)', inline: 'span', classes: 'label label-info badge badge-info bg-info text-dark'},
                 {title: 'Label (Warning) / Badge (Warning)', inline: 'span', classes: 'label label-warning badge badge-warning bg-warning text-dark'},
                 {title: 'Label (Danger) / Badge (Danger)', inline: 'span', classes: 'label label-danger badge badge-danger bg-danger'},
                 {title: 'Muted', inline: 'span', classes: 'text-muted'},    
                ]},

Result for MDB5 (with alternatives):

Result for dark bootstrap4 theme:

@CaMer0n Use it as you want, I don't use the core TinyMCE4 plugin, so I don't mind any solution.

[Jimmi08]

Modal for forum attachment is not working with bootstrap5. The code is the same as for bootstrap3 theme, but it is not working - tested with core bootstrap5 theme

[Jimmi08]

{EMAILITEM} {PRINTITEM}

still uses glyphicons

if(deftrue('BOOTSTRAP'))
{
    $img = "<span class='glyphicon glyphicon-print' aria-hidden='true'></span>";
}