Problem/Motivation

Steps to reproduce

Proposed resolution

Remaining tasks

User interface changes

API changes

Data model changes

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

AaronChristian created an issue. See original summary.

AaronChristian’s picture

Title: Clean up UI for 1x branch » 🎨 Clean up UI for 1x branch
chike’s picture

The MR patch wouldn't apply with Composer and the module wouldn't download from the branch using Composer.

AaronChristian’s picture

In Drupal 9/10, our beautiful UI is not so beautiful anymore. 😔

Rajab Natshah’s picture

Try to do the following
which I learned to make use of that from Gin Layout Builder
doing that in https://git.drupalcode.org/project/varbase_layout_builder/-/blob/10.1.x/...
which works

/**
 * Implements hook_css_alter().
 */
function bootstrap_styles_css_alter(&$css, AttachedAssetsInterface $assets) {

    if (_is_layout_builder_route()) {
    if (\Drupal::service('theme_handler')->themeExists('stable9')) {
      $stable_theme_css = \Drupal::service('extension.list.theme')->getPath('stable9') . '/css';
      unset($css[$stable_theme_css . '/layout_builder/layout-builder.css']);
      unset($css[$stable_theme_css . '/core/dialog/off-canvas.theme.css']);
      unset($css[$stable_theme_css . '/core/dialog/off-canvas.details.css']);
      unset($css[$stable_theme_css . '/core/dialog/off-canvas.reset.css']);
      unset($css[$stable_theme_css . '/core/dialog/off-canvas.base.css']);
      unset($css[$stable_theme_css . '/core/dialog/off-canvas.table.css']);
      unset($css[$stable_theme_css . '/core/dialog/off-canvas.tabledrag.css']);
      unset($css[$stable_theme_css . '/core/dialog/off-canvas.form.css']);
      unset($css[$stable_theme_css . '/core/dialog/off-canvas.button.css']);
    }

    unset($css['core/misc/dialog/off-canvas/css/reset.css']);
    unset($css['core/misc/dialog/off-canvas/css/wrapper.css']);
    unset($css['core/misc/dialog/off-canvas/css/titlebar.css']);
    unset($css['core/misc/dialog/off-canvas/css/dropbutton.css']);
    unset($css['core/misc/dialog/off-canvas/css/messages.css']);
    unset($css['core/misc/dialog/off-canvas/css/details.css']);
    unset($css['core/misc/dialog/off-canvas/css/form.css']);
    unset($css['core/misc/dialog/off-canvas/css/button.css']);
    unset($css['core/misc/dialog/off-canvas/css/base.css']);
    unset($css['core/misc/dialog/off-canvas/css/table.css']);
    unset($css['core/misc/dialog/off-canvas/css/utility.css']);
    unset($css['core/misc/dialog/off-canvas/css/drupal.css']);
    // unset($css['core/misc/dialog/off-canvas/css/tabledrag.css']);
    // unset($css['core/misc/dialog/off-canvas/css/throbber.css']);

    if (\Drupal::service('theme.manager')->getActiveTheme()->getName() !== \Drupal::config('system.theme')->get('admin')) {
      unset($css['core/modules/layout_builder/css/off-canvas.css']);
    }
 
  }
}

/**
 * Returns true if the current route is a layout builder route.
 *
 * @return bool
 *   Returns true for layout builder routes.
 */
function _is_layout_builder_route() {
  $layout_builder_route = drupal_static(__FUNCTION__);
  if ($layout_builder_route !== NULL) {
    return $layout_builder_route;
  }

  $route_name = \Drupal::routeMatch()->getRouteName();
  $layout_builder_route = FALSE;

  if ($route_name !== NULL && preg_match('/^(layout_builder\.([^.]+\.)?)/', $route_name)) {
    $layout_builder_route = TRUE;
  }

  $context = null;
  \Drupal::moduleHandler()->alter('_is_layout_builder_route', $layout_builder_route, $context);
  unset($context);
  return $layout_builder_route;
}


AaronChristian’s picture

Status: Active » Needs review
AaronChristian’s picture

@chike from what I can see if you're using D10 you will need a few extra patches;

"drupal/bootstrap_layout_builder": {
                "3335356: Fix Module does not work in D10": "https://www.drupal.org/files/issues/2023-01-25/issue_3335356_drupal10.patch",
                "3335356: Clean up UI for 2x branch": "https://git.drupalcode.org/project/bootstrap_layout_builder/-/merge_requests/24.diff",
                "3279492: Remove no-gutters class from templates.": "patches/bootstrap_layout_builder-remove-no-gutters-class-from-templates-3279492-18.patch"
            },
            "drupal/bootstrap_styles": {
                "3315218: Fix not loading bootstrap_styles/aos.local or bootstrap_styles/aos.remote library.": "https://www.drupal.org/files/issues/2023-01-25/3315218-17--1-0-x.patch",
                "3330458: [Drupal 10] Change of JS jquery/once to drupal core/once, migrate JS API.": "https://www.drupal.org/files/issues/2023-03-07/bootstrap_styles-3330458-8.patch",
                "3282082: Support Bootstrap 5 on bootstrap_styles module.": "https://www.drupal.org/files/issues/2022-06-14/Fix-support-bootstrap-5-on-bootstrap-styles-3282082-%233.patch",
                "3361091: Clean up UI for 1x branch.": "https://git.drupalcode.org/project/bootstrap_styles/-/merge_requests/57.diff"
            },

Hope that helps!

If you're using D9, please give some more specifics on your setup and I'll see if I can assist you further. Please ping me in Slack if you would like quicker support!

chike’s picture

@AaronChristian Thanks I will be checking this out tomorrow.

In D9, I have 'media_library_theme_reset', 'layout_builder_modal' and the regulars. I am using the 'boostrap' Bootstrap 3 theme. The Bootstrap Styles are not looking good at all.

AaronChristian’s picture

Ah okay thanks @chike, we no longer support bootstrap 3, are you able to upgrade to bootstrap 4 or 5?

chike’s picture

The collection of patches cleaned up the UI nicely.

This patch is not online,

 "3279492: Remove no-gutters class from templates.": "patches/bootstrap_layout_builder-remove-no-gutters-class-from-templates-3279492-18.patch"
            },

That's for the D10 site. As for the D9 site using 'bootstrap' theme I think I may have to change the theme to one of the Bootstrap 5 themes as I am not sure 'bootstrap' will be adopting newer Bootstrap versions anytime soon.

pfeiffer’s picture

After applying this patch in a Drupal 9.4 all options of any block or section have a white background color.

carolpettirossi’s picture

Attached the patch from MR to use in composer

andre.bonon made their first commit to this issue’s fork.

andre.bonon’s picture

@aaron, we have more issues with the z-index and modals when LB is enabled for other entity types such as Blocks.
I updated the ui-dialog's z-index so as to be the same as Claro's (1260) and pushed it to the MR.
Also, I'm attaching the patch from MR to use in composer.

flyke’s picture

Can this be updated or a new issue fork be created that applies to bootstrap_styles 1.1.5 ?

sim_1’s picture

Status: Needs review » Reviewed & tested by the community

Marking RTBC. Things are pretty broken without this. I'm sure more improvements are needed, but better to have something than keep living with things being broken.

AaronChristian’s picture

Version: 1.1.0 » 1.1.5

@flyke this has been updated with the latest tagged release 1.1.5 now.

carolpettirossi’s picture

Uploading a patch from MR#57.

I tested it on my projects, and it worked as expected.

carolpettirossi’s picture

Forgot to click "Upload". Sorry about that