Original issue brought up by LiquidCMS:
Somewhat based on this: #3212225: Remove Panelizer completely for 4.1.x line
Since Layout Builder has sort of been decided to be the go-to layout option for WxT and since Bootstrap 3 is not entirely compatible with Layout Builder (numerous open issues on this but main one that seems to have carried over to WxT is that the tabs/breadcrumb blocks are broken in LB; also some more minor styling and js ones); wondering if much movement on this?
I have tested LB on a vanilla d9 site with base BS3 theme and i see the same issues as with a vanilla wxt site (4.1.x). Testing the vD9 site with BS4 and it works correctly. Also tested with BS5 and it works as well.
install drupal 9 core
install drupal.org/project/bootstrap
OR
install wxt 4.1.0
use the layout_builder , if the default theme is wxt_bootstrap or some theme based on it ( a sub theme ) or the parent theme drupal.org/project/bootstrap, there will be issues
try using the layout builder, javascript errors and weird things happen, switch then to another theme, and no issues. The issue is in the bootstrap theme.
Find a solution, try to fix this or find an existing patch that fixes it, or a set of patches.
Isolate the issues, enumerate them, break them into several child tickets if necessary or just put them all in this ticket or link them to this ticket.
Fix the layout builder when using drupal.org/project/bootstrap based themes
N/A (yet)
Comments
Comment #2
joseph.olstadNote: other bootstrap 3 based themes are probably compatible afaik, we should test that.
which other drupal.org/project bs3 based themes are there that we can test? Lets debunk this theory or prove it.
Comment #3
joseph.olstadComment #4
joseph.olstadComment #5
joseph.olstadsomething to test
perhaps we need both media_library_theme_reset module installed AND this patch?
not sure though I haven't yet tested this possible solution yet.
Comment #6
joseph.olstadthere's also a seemingly related patch
https://www.drupal.org/files/issues/2021-06-30/1551534-80.patch
from #1551534: Submit buttons themed as <button> element fail to trigger ajax in Views exposed forms
and an upstream core issue that media_library_theme_reset attempts to resolve
#3050508: Media library loads front-end theme when invoked from settings tray
so what I understand is, if you have media_library_theme_reset installed it is supposed to deal with the unresolved #3050508
Comment #7
joseph.olstadComment #8
joseph.olstad#3102977-23: Bootstrap 4
#3212225: Remove Panelizer completely for 4.1.x line
Comment #9
liquidcms commentedHey Joseph, trying to follow all of this and see if some testing i need to be doing.
At the moment this has taken a bit of a back burner and our current state is:
- BS3 messes up CSS for LB and i have overridden css enough to work with
- the tabs and breadcrumbs blocks are still broken (unplaceable, don't show as placeholders in non-preview mode, etc) - ugly hack of switching to a non-BS theme to adjust and then switch back to WxT theme. Obviously this is not a solution we can launch with; but back burner for now.
Comment #10
sylus commentedWas thinking about how to resolve issues with Layout Builder and so far have been looking at deprecating bootstrap_layouts in favor of:
https://www.drupal.org/project/bootstrap_layout_builder (2.0.1)
https://www.drupal.org/project/bootstrap_styles (1.0.3)
https://www.drupal.org/project/media_library_form_element
https://www.drupal.org/project/media_library_theme_reset
https://www.drupal.org/project/media_library_theme_reset/issues/3100124 (claro support)
However still looks like missing some things? We would need to have a full upgrade path so people using existing layouts from bootstrap_layouts have no issues and everything works as expected. I know a full sites that use page manager with bootstrap_layouts so need to be careful no break in functionality for them.
Comment #11
sylus commentedComment #12
liquidcms commentedOf course the best fix is to use BS5. :)
I suppose as this is based on wet-boew and, as a GC thing, no plan, roadmap, etc. :( Is it not possible to simply override in WxT to use BS5? or would that break wet widgets? (i dont use a lot of them but suspect it would). Independent of a fix in WxT; is it possible to override this externally? Sort of as we always do with Drupal core perhaps?
Failing that.. any way to push WET to get up to date? Or maybe that's a mouse trying to push a boulder kinda thing?
On the plus side, our ugly "hack" of switching to a different theme if we need to move around the tabs is now somewhat mitigated by the fact that all that is defined in a custom "header" block (which uses LB) and placed everywhere.. so at least only 1 place that this is ever touched, and rarely.
Comment #13
sylus commentedI know there has been ongoing work on a bootstrap 5 updated theme for wet-boew more around a component based design but I haven't heard any recent updates about it for a fair bit.
At the moment wet-boew v4.x.x and GCWeb are the current GoC standards and sadly are still based on Bootstrap 3. Until TBS et al release a new standard and departments start to follow we will have to align with that. Though when / if this new theme ever comes out we might still have to support departments using the older theme as well. So best to try to take a further look at a good way to mitigate this or make less frustrating.
We could start the ground work for a Bootstrap 5 theme on the side though knowing that eventually something should be coming but I'll try to ask what the current status from since I'm not clear.
Comment #14
joseph.olstadComment #15
joseph.olstadComment #16
liquidcms commentedNot sure i see the connection between Core Context/Layout Library issue and BS3/Layout Builder issues - are you suggesting that my BS3 issues are caused by Core Context? Possible i guess, although would be very surprised.
Comment #17
joseph.olstadPerhaps I misunderstood the related issue, so its not related?
Comment #18
liquidcms commented@joseph.olstad, 2 separate issues:
1. BS3 is not compatible with Layout Builder (mostly makes some block like tabs, breadcrumbs unplaceable) - this issue
2. Core Context (not sure what it is used for) breaks Layout Library (throws error when trying to place any block). - the newer one.
Comment #19
joseph.olstad#3042907: Use admin theme for forms
There appears to be an option to use the admin theme for configuring the layouts using this module. Might help.
Comment #20
liquidcms commentedI guess if your admin theme was BS5 based (likely isn't); otherwise it doesn't show things laid out in columns etc; just everything stacked. Which is fine as a work-around; but honestly not much different than just switching theme to do changes as a work around.
Ideally the work in that patch wouldn't be so limited as to allow LB to use admin theme; but allow LB to pick its own theme. That way you could have the admin theme you want to have on your site and just set a BS5 theme for use with LB.
Comment #21
joseph.olstadpatch for core_contexts is available
#3263703-3: Core Context breaks Layout Library
Comment #22
liquidcms commentedre #21.. great, but nothing to do with this case :)
Comment #23
joseph.olstad@liquidcms, not sure if you've dug into this any more but I did find a mention of this module which seems to improve upon a core patch wxt is using.
The module is called layout_builder_overrides.
https://www.drupal.org/project/layout_builder_overrides
spun from core issue:
#2907413: Consider supporting Layout Builder Overrides for other view modes
Comment #24
joseph.olstadPossible solution for all this, integrate this module:
https://www.drupal.org/project/layout_builder_admin_theme
it allows using a compatible theme for layout_builder setup/drag and drop.
#3195687-3: Uncaught TypeError: orig is undefined
Comment #25
liquidcms commentedThanks for posting. Will try it out soon. At least for current project, really don't care if LB uses the site theme. So any BS4/5 theme would be good.
Comment #26
joseph.olstadI tested out https://www.drupal.org/project/layout_builder_admin_theme and it works well, it works best with Drupal 9.4.7, due to a security fix in twig you'd otherwise get stuck on a bug needing a core patch for Drupal 9.3.x.
Using 9.3.x you'll get this error:
Twig\Error\LoaderError: Template "@claro/../images/src/hamburger-menu.svg" is not defined in "core/themes/claro/templates/navigation/menu-local-task.html.twig" at line 22.patch to fix the core regression is to apply this patch to core:
https://www.drupal.org/files/issues/2022-09-28/3312270-claro-menu-twig-f...
Related to a security advisory fix in twig, the regression is fixed by upgrading to Drupal 9.4.7
OR, instead of patching, upgrade to Drupal 9.4.7
#3312270: Twig LoaderError after upgrading Twig to 2.15.3
Comment #27
joseph.olstadthere is a regression in the twig library related to the security advisory and the fix is to upgrade to Drupal 9.4.7
It's unlikely that this will get fixed in 9.3.x but there is a patch available.
Comment #28
joseph.olstadComment #29
joseph.olstadok correcting myself. I've got wxt 4.3.0 and was overriding core 9.3.21 as 9.3.16
To fix the glitch with twig/twig using that workaround solution for layout_builder installing the layout_builder_admin_theme I recommend upgrading to 9.3.22 , so in our case we're now overriding 9.3.22 as 9.3.16 and this fixes the twig/twig v2.15.3 compatibility issue.
To use the layout builder correctly without bugs require and install layout_builder_admin_theme
provided you're on the latest 9.3.22 or 9.4.7 core the issue I mentioned with the twig/twig v2.15.3 is resolved.
Comment #30
joseph.olstadI suggest somewone write a patch for wxt that requires layout_builder_admin_theme and a hook_install that installs it by default and a hook_update for wxt_core.install that installs it if layout_builder is enabled/installed. This way since it's not listed as a *.info.yml dependency it can be uninstalled without patching.
To get really fancy we could do a wxt hook requirements check for the status reports and add a warning should the layout_builder be installed and for some reason layout_builder_admin_theme is not. This way we do a helpful warning that people can ignore if they've already implemented some other solution.
Comment #31
joseph.olstadlayout_builder_admin_theme provides a convenient solution (workaround?) to this problem and a D10 version of this module was published today:
https://www.drupal.org/project/layout_builder_admin_theme
We might consider adding this/enabling/configuring it by default for the wxt distro.
Reasons for:
Reasons against:
Comment #32
liquidcms commentedWithout looking at this yet; my guess is this allows setting a LB theme independent of the site theme? So what would the LB admin theme of choice be?
Claro isn't BS so nothing using BS layouts will display correctly (will they even load?); but might be able to muddle through.
Some BS5 based admin theme? Would have same issues i would think?
I am sure I must be missing something here; will give it a shot tomorrow.
Comment #33
joseph.olstad@liquidcms, BS4/BS5 do not have the same compatibility issue with layout builder so ya one of those.
With that said, I see your point, there's no wysiwyg with claro however it is functional and unfortunately there is no known wysiwyg way with BS3 because layout_builder is incompatible with BS3
we're tied to BS3 by wet-boew 4
moving to BS5 is likely on the horizon.
Until then, the https://www.drupal.org/project/layout_builder_admin_theme is the best alternative I know of .
I personally use Claro.
Comment #34
joseph.olstad@LiquidCMS, I looked at one of your sites and I seem to notice that Layout Builder appears to be functioning with Bootstrap 3. Are my eyes playing tricks on me?
Comment #35
joseph.olstadThis appears to be fixed in the latest WxT build, I'm able to manage the display with layout builder using a subtheme based on the wxt_bootstrap theme, no
js exceptions, no errors.
contrib must have fixed this upstream
Comment #36
liam morlandIs this fixed? Can this issue be closed?
Comment #37
smulvih2Yep think it's safe to close this one, opened against D9/WxT 4.1.0. We can open a new issue for latest version if required.