Improve CallingScreenSharingController for long text
This commit is contained in:
parent
65a1e82857
commit
93bc094342
3 changed files with 26 additions and 4 deletions
|
@ -15,7 +15,14 @@
|
|||
text-overflow: ellipsis;
|
||||
user-select: none;
|
||||
white-space: nowrap;
|
||||
width: 212px;
|
||||
width: 350px;
|
||||
}
|
||||
|
||||
&__button {
|
||||
max-width: 120px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__buttons {
|
||||
|
|
|
@ -15,11 +15,11 @@ import enMessages from '../../_locales/en/messages.json';
|
|||
|
||||
const i18n = setupI18n('en', enMessages);
|
||||
|
||||
const createProps = (): PropsType => ({
|
||||
const createProps = (overrideProps: Partial<PropsType> = {}): PropsType => ({
|
||||
i18n,
|
||||
onCloseController: action('on-close-controller'),
|
||||
onStopSharing: action('on-stop-sharing'),
|
||||
presentedSourceName: 'Application',
|
||||
presentedSourceName: overrideProps.presentedSourceName || 'Application',
|
||||
});
|
||||
|
||||
const story = storiesOf('Components/CallingScreenSharingController', module);
|
||||
|
@ -27,3 +27,14 @@ const story = storiesOf('Components/CallingScreenSharingController', module);
|
|||
story.add('Controller', () => {
|
||||
return <CallingScreenSharingController {...createProps()} />;
|
||||
});
|
||||
|
||||
story.add('Really long app name', () => {
|
||||
return (
|
||||
<CallingScreenSharingController
|
||||
{...createProps({
|
||||
presentedSourceName:
|
||||
'A really long application name that is super long',
|
||||
})}
|
||||
/>
|
||||
);
|
||||
});
|
||||
|
|
|
@ -24,7 +24,11 @@ export const CallingScreenSharingController = ({
|
|||
{i18n('calling__presenting--info', [presentedSourceName])}
|
||||
</div>
|
||||
<div className="module-CallingScreenSharingController__buttons">
|
||||
<Button onClick={onStopSharing} variant={ButtonVariant.Destructive}>
|
||||
<Button
|
||||
className="module-CallingScreenSharingController__button"
|
||||
onClick={onStopSharing}
|
||||
variant={ButtonVariant.Destructive}
|
||||
>
|
||||
{i18n('calling__presenting--stop')}
|
||||
</Button>
|
||||
<button
|
||||
|
|
Loading…
Add table
Reference in a new issue