mirror of
https://github.com/material-components/material-web.git
synced 2024-08-17 01:20:23 +03:00
fix: ripple and focus ring not centered in Safari
PiperOrigin-RevId: 559826221
This commit is contained in:
parent
9694191ec0
commit
0e8afc0175
@ -113,7 +113,7 @@ $_checkmark-bottom-left: 7px, -14px;
|
||||
|
||||
.container {
|
||||
border-radius: inherit;
|
||||
display: grid;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
place-content: center;
|
||||
place-items: center;
|
||||
|
@ -61,7 +61,7 @@ $_md-sys-motion: tokens.md-sys-motion-values();
|
||||
}
|
||||
|
||||
.container {
|
||||
display: grid;
|
||||
display: flex;
|
||||
height: 100%;
|
||||
place-content: center;
|
||||
place-items: center;
|
||||
|
@ -263,7 +263,8 @@ $_md-sys-shape: tokens.md-sys-shape-values();
|
||||
block-size: var(--_state-layer-size);
|
||||
inline-size: var(--_state-layer-size);
|
||||
border-radius: var(--_handle-shape);
|
||||
display: grid;
|
||||
display: flex;
|
||||
place-content: center;
|
||||
place-items: center;
|
||||
}
|
||||
|
||||
@ -316,8 +317,9 @@ $_md-sys-shape: tokens.md-sys-shape-values();
|
||||
.label {
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
display: grid;
|
||||
display: flex;
|
||||
padding: 4px;
|
||||
place-content: center;
|
||||
place-items: center;
|
||||
border-radius: map.get($_md-sys-shape, 'corner-full');
|
||||
|
||||
|
@ -16,7 +16,8 @@ $_easing-standard: map.get($_md-sys-motion, 'easing-standard');
|
||||
|
||||
@mixin styles() {
|
||||
.handle-container {
|
||||
display: grid;
|
||||
display: flex;
|
||||
place-content: center;
|
||||
place-items: center;
|
||||
position: relative;
|
||||
// this easing is custom to perform the "overshoot" animation
|
||||
|
Loading…
Reference in New Issue
Block a user