Skip to content

Add d-contents display class, Fix missing gap between MessageBox action buttons#11391

Merged
ScarletKuro merged 1 commit intoMudBlazor:devfrom
danielchalmers:messagebox-actions-gap
May 23, 2025
Merged

Add d-contents display class, Fix missing gap between MessageBox action buttons#11391
ScarletKuro merged 1 commit intoMudBlazor:devfrom
danielchalmers:messagebox-actions-gap

Conversation

@danielchalmers
Copy link
Member

@danielchalmers danielchalmers commented May 22, 2025

Description

We were missing a class for display: contents and the gap in the message box action buttons was not the same as the dialog because of the extra div in the way. Adding d-contents lets the style pass through.

I also replaced the inline margin implementation with a cleaner use of gap since it was already a flex display. It's unlikely that many people are relying on the old behaviour.

How Has This Been Tested?

visually

Type of Changes

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Documentation (fix or improvement to the website or code docs)

Before

image

After

image

Checklist

  • The PR is submitted to the correct branch (dev).
  • My code follows the code style of this project.
  • I've added relevant tests.

@danielchalmers danielchalmers requested a review from Copilot May 22, 2025 21:29
@github-actions github-actions bot added bug Unexpected behavior or functionality not working as intended PR: needs review labels May 22, 2025
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR adds a new d-contents utility class to enable display: contents and replaces inline margins in dialog actions with a gap property to unify spacing.

  • Introduces .d-contents in the display utilities
  • Switches from per-child margins to gap: 8px in dialog actions
  • Applies d-contents to MudMessageBox action wrapper

Reviewed Changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 2 comments.

File Description
_display.scss Adds .d-contents display utility
_dialog.scss Replaces manual margins with gap: 8px
MudMessageBox.razor Wraps action buttons in a div with d-contents
Comments suppressed due to low confidence (1)

src/MudBlazor/Components/MessageBox/MudMessageBox.razor:31

  • Add or update a unit or snapshot test to cover the new d-contents wrapper in MudMessageBox actions, verifying that the display style propagates correctly.
<div tabindex="-1" class="d-contents">

@sonarqubecloud
Copy link

@codecov
Copy link

codecov bot commented May 22, 2025

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 91.10%. Comparing base (5ecef4c) to head (5aaeffa).
Report is 9 commits behind head on dev.

Additional details and impacted files
@@            Coverage Diff             @@
##              dev   #11391      +/-   ##
==========================================
- Coverage   91.11%   91.10%   -0.01%     
==========================================
  Files         465      465              
  Lines       14401    14407       +6     
  Branches     2785     2788       +3     
==========================================
+ Hits        13121    13126       +5     
+ Misses        643      642       -1     
- Partials      637      639       +2     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@danielchalmers danielchalmers added the enhancement Adds a new feature or enhances existing functionality (not fixing a defect) in the main library label May 23, 2025
@ScarletKuro ScarletKuro merged commit 17f3e3e into MudBlazor:dev May 23, 2025
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Unexpected behavior or functionality not working as intended enhancement Adds a new feature or enhances existing functionality (not fixing a defect) in the main library

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants