🇷🇸Serbia @majmunbog

majmunbog → made their first commit to this issue’s fork.

@niki v the code is updated, I've added a utility class to "bold" the labels.

majmunbog → created an issue.

Thanks for testing, @niki v! The issue is currently in review, so the fix isn’t available in the latest release yet. You can test this by cloning git@git.drupal.org:issue/belgrade-3357294.git.

@docevl I’ve opened up an MR to address this issue. Let me know if it works.

majmunbog → made their first commit to this issue’s fork.

This issue seems to be resolved in the latest dev version.

majmunbog → created an issue.

I can create a custom hook belgrade_button_classes that we could use to override the button classes like this:

/**
 * Implements hook_belgrade_button_classes_alter().
 */
function YOUR_MODULE_NAME_belgrade_button_classes_alter(&$button_classes, $string, $variables) {
  if ($string === t('Add to cart')->render()) {
    $button_classes = [
      'btn',
      'btn-primary',
      'bi-btn-basket'
    ];
  }
}

Hi @denizserhat, this seems more like a support question rather than an issue related to Drupal Belgrade. I’d recommend asking in the Drupal Slack #support or #frontend channel, where you’ll get more visibility and a wider range of answers.

That said, you can do this by adding a block (such as the Search Form block) to the Top Bar region via Structure → Block layout. From there, you can style it as needed with CSS to position it next to the cart and make it expandable.

Hope that helps!

majmunbog → made their first commit to this issue’s fork.

majmunbog → made their first commit to this issue’s fork.

Belgrade is built on Bootstrap 5 and includes the Bootstrap CSS and JS by default in the belgrade/global library.
Bootstrap SCSS files are included in main.scss from the node_modules directory and compiled into main.css.
Bootstrap JS is delivered from CDN: //cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.min.js

The issues you may have are due to the overrides made to Bootstrap in order to achieve the Belgrade design. Some SCSS/CSS work might be required.

The footer menu should not be aligned. That spacing is required.

The approach to add specific styling to all article lists is no good.
This should be fixed/improved with a utility class.

No need for extra SCSS or CSS here, a utility class should be sufficient.

I've removed the extra lines from the CSS. This needs review.

The MR has been updated and needs thorough review. I've also updated the standard Commerce icon (drupal cart) to be used as a mask image.

@aylis the patch works, but we than have repeatable code, we can just remove this code:

  /* When the layout has vertical tabs */
  .layout-region--commerce-main:has(.vertical-tabs),
  .layout-region--commerce-main:has(.vertical-tabs)
    ~ .layout-region--commerce-footer {
    width: calc(var(--commerce-layout-content-width) + 8rem);
  }

commerce.admin-layout.css from line 46 to line 53. and have the same effect.

This should work:

.toolbar-tray .toolbar-icon.toolbar-icon-entity-commerce-order-collection::before {
    mask-image: var(--commerce-icon--clipboard-check-fill);
    background-color: #787878;
    mask-repeat: no-repeat;
    mask-position: center;
}

And then for active just change the background color.

It would be great if we had a class for all commerce toolbar items.
The existing icon should also be moved to a variable at some point.

I was not able to use mask to set the color because that requires an actual dom element to function properly and modifying the structure of the toolbar isn't really a good idea if it's even possible.

@rhovland I prefer we use a mask image. Can you explain how this is not functioning properly?

majmunbog → made their first commit to this issue’s fork.

Here's a patch that adds the missing dependency to the copy link library.

I think we can remove that whole preprocess function. The active trail class should work without it and we don't even use it in the theme CSS. With the :has() CSS selectors there's no real need to complicate and add a class to

majmunbog → made their first commit to this issue’s fork.

@tBKoT I think we should not reference variation in CSS, libraries, or data attributes. That way we can reuse this link and styles elsewhere.

majmunbog → made their first commit to this issue’s fork.

Patch #2 is fine for now.
We should consider changing the markup in a major release and start using CSS grid and variables here.

majmunbog → made their first commit to this issue’s fork.

The third menu level has significant usability issues and is not 100% supported. It should be handled with care.

majmunbog → made their first commit to this issue’s fork.

Thanks @alicacwb for providing the correct method to incorporate new fonts into the theme settings. This issue could be a good reference, and the process should be added to the documentation.

Sure @alicacwb, you can manually make those changes.
You can also clone the fork git clone git@git.drupal.org:issue/belgrade-3424189.git and then checkout the branch git checkout 3424189-subtheme-error-region.

majmunbog → created an issue.

majmunbog → created an issue.

Thanks @djween for bringing up this issue.
I don't think that Popper.js was ever included in core. The Belgrade CSS is responsible for displaying the dropdowns on hover.

I agree that the dropdowns should be opening on click. However, according to the Belgrade design, the main menu is intended to open on hover.

I'm currently considering two options:

1. Specifying hover-based dropdown CSS exclusively for this menu.
2. Implementing theme settings to toggle the global dropdown behavior between hover and click.

Thanks @alicacwb for opening up this issue. The issue should be fixed in my MR, can you please review it?

majmunbog → made their first commit to this issue’s fork.

This works great, thanks.
The template suggestions need to be better ordered but that's another issue.

majmunbog → created an issue.

I'm just a bit late to respond to this one, but thanks a bunch @webengr for the positive feedback! If you have any feedback or suggestions for improvements, please feel free to share them in the issue queue.

This code is not present in the 2.0.x version of Belgrade.
Can you update the issue metadata with the version you are using?

Icon added, sprite generated and styles updated.

Results:

Part of the command was missing from the example.

majmunbog → created an issue.

The wrong patch, this one is much better.

Here's a quick patch to fix the white text on the white background issue in CKEditor.

majmunbog → made their first commit to this issue’s fork.

Here's a patch.

majmunbog → created an issue.

Patch updated.

Here's the patch that fixes the styles for both themes.

majmunbog → created an issue.

majmunbog → created an issue.

Here's a patch with all CSS violations fixed.