Skip to content

Conversation

@devversion
Copy link
Member

Due to the fact that stroked buttons have a border that reduces the available space for child elements, the absolute positioned ripple container and focus overlay do not match the border-radius with the actual button element.

In order to fix this in a non-breaking way, we just use overflow: hidden for stroked buttons as compared to just using overflow: hidden in general for buttons (like it has been done with #9424)

image

Fixes #13738

* Due to the fact that stroked buttons have a border that reduces the available space for child elements, the absolute positioned ripple container and focus overlay do not match the `border-radius` with the actual button element. In order to fix this in a non-breaking way, we just use `overflow: hidden` for stroked buttons as compared to just using `overflow: hidden` in general for buttons (like it has been done with angular#9424)

Fixes angular#13738
@devversion devversion added the target: patch This PR is targeted for the next patch release label Oct 22, 2018
Copy link
Member

@josephperrott josephperrott left a comment

Choose a reason for hiding this comment

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

LGTM

@josephperrott josephperrott added pr: lgtm action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement labels Oct 22, 2018
@josephperrott
Copy link
Member

CLA manually confirmed.

@mmalerba mmalerba merged commit 4cdf5ba into angular:master Oct 23, 2018
mmalerba pushed a commit that referenced this pull request Oct 23, 2018
…13745)

Due to the fact that stroked buttons have a border that reduces the available space for child elements, the absolute positioned ripple container and focus overlay do not match the `border-radius` with the actual button element. 

In order to fix this in a non-breaking way, we just use `overflow: hidden` for stroked buttons as compared to just using `overflow: hidden` in general for buttons (like it has been done with #9424)

![image](https://user-images.githubusercontent.com/4987015/47302045-c5c32c00-d620-11e8-9d58-bc34b421943f.png)



Fixes #13738
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement target: patch This PR is targeted for the next patch release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Mat Stroked Button - Issue - Ripple Border Radius

4 participants