diff --git a/src/material/slide-toggle/slide-toggle.scss b/src/material/slide-toggle/slide-toggle.scss index 2626d0f068cf..6c58b068adec 100644 --- a/src/material/slide-toggle/slide-toggle.scss +++ b/src/material/slide-toggle/slide-toggle.scss @@ -21,6 +21,27 @@ $fallbacks: m3-slide-toggle.get-tokens(); padding: 0; position: relative; + &::after { + $_touch-target-size: 48px; + $_ripple-size: 24px; + $offset: 5px; + + content: ''; + opacity: 0; + display: block; + position: absolute; + top: 0 - $offset; + bottom: 0 - $offset; + left: $offset; + right: $offset; + border-radius: 50%; + box-sizing: border-box; + padding: calc(($_touch-target-size - $_ripple-size)/2); + margin: calc((($_touch-target-size - $_ripple-size)/2) * -1); + // stylelint-disable material/no-prefixes + background-clip: content-box; + } + width: token-utils.slot(slide-toggle-track-width, $fallbacks); &.mdc-switch--disabled {