Code to enable splits in Paperform + Bulma.css

paperform_splits.html

<!-- Add Bulma for Columns (best way is to add this to the theme, but adding it here
     so it can be easily re-used) -->

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.3/css/bulma.min.css" integrity="sha512-IgmDkwzs96t4SrChW29No3NXBIBv8baW490zk5aXvhCD8vuZM3yUSkbyTBcXohkySecyzIrUwiF/qV0cuPcL3Q==" crossorigin="anonymous" referrerpolicy="no-referrer" />

<script>
    // assign elements
    const editorRoot = document.getElementsByClassName("DraftEditor-root")[0]
    const editorContainer = document.getElementsByClassName("DraftEditor-editorContainer")[0]
    var splitImageColumn = document.getElementById('splitImageColumn')
    var splitImage = document.getElementById('splitImage')
    
    if (splitImageColumn != null) {
        splitImageColumn.remove()
    }
    
    splitImageColumn = document.createElement('div')
    splitImageColumn.setAttribute('id', 'splitImageColumn')
    splitImageColumn.classList.add('column')
    splitImageColumn.classList.add('is-half')
    
    if (! editorRoot.classList.contains('columns')) {
        // Add columns classes
        editorRoot.classList.add('columns')
        editorContainer.classList.add('column')
        editorContainer.classList.add('is-half')
    }
    
    // Add splitImageColumn to editorRoot
    // Move this line before adding column and is-half classes 
    // to editorContainer to make this a left split
    editorRoot.appendChild(splitImageColumn)
    
    if (splitImage != null) {
        splitImage.remove()
    }
    splitImage = document.createElement('img')
    splitImage.setAttribute('id', 'splitImage')
    splitImage.src = "https://mytwofront.com/wp-content/themes/two-front/assets/images/index/why-3.svg"
    splitImageColumn.appendChild(splitImage)
</script>

<style>
    /* Disable scroll */
    html, body {margin: 0; height: 100%; overflow: hidden}
    #splitImage {width: 100%}
</style>