janis/teamspeak-obs-overlay
1
0
Fork 0
mirror of https://github.com/DerTyp7/teamspeak-obs-overlay.git synced 2025-10-30 05:07:12 +01:00
Code Issues Packages Projects Releases Wiki Activity

add responsive design

Browse Source
This commit is contained in:
Janis
2023-11-12 17:16:58 +01:00
parent ce7aee8481
commit 9870fdcdb4
4 changed files with 175 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
src/Generator.tsx
View File

@@ -62,50 +62,54 @@ export default function Generator() {
<div className="configurations">
<h2>Configurations</h2>
<div className="option">
<input
type="checkbox"
checked={showChannelName}
onChange={(e: ChangeEvent<HTMLInputElement>) => {
setShowChannelName(e.target.checked);
}}
/>
<label>Show channelname</label>
</div>
<div className="options">
<section>
<div
className="option"
onClick={() => {
setShowChannelName(!showChannelName);
}}
>
<input type="checkbox" checked={showChannelName} />
<label>Show channelname</label>
</div>
<div className="option">
<input
type="checkbox"
checked={hideNonTalking}
onChange={(e: ChangeEvent<HTMLInputElement>) => {
setHideNonTalking(e.target.checked);
}}
/>
<label>Hide non talking clients</label>
</div>
<div
className="option"
onClick={() => {
setHideNonTalking(!hideNonTalking);
}}
>
<input type="checkbox" checked={hideNonTalking} />
<label>Hide non talking clients</label>
</div>
</section>
<div className="option">
<input
type="number"
value={20}
min={0}
onChange={(e: ChangeEvent<HTMLInputElement>) => {
setClientLimit(parseInt(e.target.value));
}}
/>
<label>Client Limit</label>
</div>
<section>
<div className="option">
<input
type="number"
value={20}
min={0}
onChange={(e: ChangeEvent<HTMLInputElement>) => {
setClientLimit(parseInt(e.target.value));
}}
/>
<label>Client Limit</label>
</div>
<div className="option">
<input
type="number"
value={5899}
min={0}
onChange={(e: ChangeEvent<HTMLInputElement>) => {
setRemoteAppPort(parseInt(e.target.value));
}}
/>
<label>RemoteApp-Port</label>
<div className="option">
<input
type="number"
value={5899}
min={0}
onChange={(e: ChangeEvent<HTMLInputElement>) => {
setRemoteAppPort(parseInt(e.target.value));
}}
/>
<label>RemoteApp-Port</label>
</div>
</section>
</div>
</div>