Add outlines for MessageAudio buttons
This commit is contained in:
parent
7fa730531a
commit
8fa5ea6b2b
2 changed files with 29 additions and 2 deletions
|
@ -161,6 +161,30 @@
|
|||
outline: 0;
|
||||
}
|
||||
|
||||
.module-message__audio-attachment__button,
|
||||
.module-message__audio-attachment__spinner,
|
||||
.module-message__audio-attachment__waveform {
|
||||
&:focus {
|
||||
@include keyboard-mode {
|
||||
outline: 2px solid $color-white-alpha-60;
|
||||
}
|
||||
@include ios-keyboard-mode {
|
||||
outline: 2px solid $ultramarine-ui-light;
|
||||
}
|
||||
}
|
||||
|
||||
.module-message__audio-attachment--outgoing & {
|
||||
&:focus {
|
||||
@include keyboard-mode {
|
||||
outline: 2px solid $ultramarine-ui-light;
|
||||
}
|
||||
@include ios-keyboard-mode {
|
||||
outline: 2px solid $color-white-alpha-60;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.module-message__audio-attachment__waveform__bar {
|
||||
display: inline-block;
|
||||
|
||||
|
|
|
@ -5,7 +5,7 @@ import * as React from 'react';
|
|||
import { isBoolean } from 'lodash';
|
||||
|
||||
import { action } from '@storybook/addon-actions';
|
||||
import { boolean, number, text } from '@storybook/addon-knobs';
|
||||
import { boolean, number, select, text } from '@storybook/addon-knobs';
|
||||
import { storiesOf } from '@storybook/react';
|
||||
|
||||
import { SignalService } from '../../protobuf';
|
||||
|
@ -70,7 +70,10 @@ const renderAudioAttachment: Props['renderAudioAttachment'] = props => (
|
|||
|
||||
const createProps = (overrideProps: Partial<Props> = {}): Props => ({
|
||||
attachments: overrideProps.attachments,
|
||||
author: overrideProps.author || getDefaultConversation(),
|
||||
author: overrideProps.author || {
|
||||
...getDefaultConversation(),
|
||||
color: select('authorColor', Colors, 'red'),
|
||||
},
|
||||
reducedMotion: boolean('reducedMotion', false),
|
||||
bodyRanges: overrideProps.bodyRanges,
|
||||
canReply: true,
|
||||
|
|
Loading…
Reference in a new issue