diff --git a/res/css/views/audio_messages/_SeekBar.scss b/res/css/views/audio_messages/_SeekBar.scss index ca3f7aa562..602ce94916 100644 --- a/res/css/views/audio_messages/_SeekBar.scss +++ b/res/css/views/audio_messages/_SeekBar.scss @@ -29,7 +29,7 @@ limitations under the License. height: 1px; background: $quaternary-fg-color; outline: none; // remove blue selection border - position: relative; // for progress bar support later on + position: relative; // for before+after pseudo elements later on cursor: pointer; @@ -88,4 +88,16 @@ limitations under the License. &:disabled { opacity: 0.5; } + + // Increase clickable area for the slider (approximately same size as browser default) + // We do it this way to keep the same padding and margins of the element, avoiding margin math. + // Source: https://front-back.com/expand-clickable-areas-for-a-better-touch-experience/ + &:after { + content: ''; + position: absolute; + top: -6px; + bottom: -6px; + left: 0; + right: 0; + } }