devproje/project-client
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: Screenshare UI for non-linux systems (#568)

Browse source
This commit is contained in:
Oleh Polisan 2024-05-05 05:14:08 +03:00 committed by GitHub
parent 0623a71271
commit ac35f81476
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 23 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
src/renderer/components/ScreenSharePicker.tsx
View file

@ -193,11 +193,15 @@ function StreamSettings({
); );
return ( return (
<div className="vcd-screen-picker-settings-grid"> <div className={isLinux ? "vcd-screen-picker-settings-grid" : ""}>
<div> <div>
<Forms.FormTitle>What you're streaming</Forms.FormTitle> <Forms.FormTitle>What you're streaming</Forms.FormTitle>
<Card className="vcd-screen-picker-card vcd-screen-picker-preview"> <Card className="vcd-screen-picker-card vcd-screen-picker-preview">
<img src={thumb} alt="" /> <img
src={thumb}
alt=""
className={isLinux ? "vcd-screen-picker-preview-img-linux" : "vcd-screen-picker-preview-img"}
/>
<Text variant="text-sm/normal">{source.name}</Text> <Text variant="text-sm/normal">{source.name}</Text>
</Card> </Card>
@ -283,23 +287,22 @@ function StreamSettings({
</p> </p>
</div> </div>
</div> </div>
{isWindows && (
<Switch
value={settings.audio}
onChange={checked => setSettings(s => ({ ...s, audio: checked }))}
hideBorder
className="vcd-screen-picker-audio"
>
Stream With Audio
</Switch>
)}
</section> </section>
</div> </div>
</Card> </Card>
</div> </div>
<div> <div>
{isWindows && (
<Switch
value={settings.audio}
onChange={checked => setSettings(s => ({ ...s, audio: checked }))}
hideBorder
className="vcd-screen-picker-audio"
>
Stream With Audio
</Switch>
)}
{isLinux && ( {isLinux && (
<AudioSourcePickerLinux <AudioSourcePickerLinux
audioSource={settings.audioSource} audioSource={settings.audioSource}

9
src/renderer/components/screenSharePicker.css
View file

@ -17,7 +17,7 @@
grid-template-columns: 1fr 1fr; grid-template-columns: 1fr 1fr;
} }
.vcd-screen-picker-settings-grid > div { .vcd-screen-picker-settings-grid>div {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
@ -67,11 +67,16 @@
box-sizing: border-box; box-sizing: border-box;
} }
.vcd-screen-picker-preview img { .vcd-screen-picker-preview-img-linux {
width: 100%; width: 100%;
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }
.vcd-screen-picker-preview-img {
width: 90%;
margin-bottom: 0.5em;
}
.vcd-screen-picker-preview { .vcd-screen-picker-preview {
display: flex; display: flex;
flex-direction: column; flex-direction: column;