feat: responsive header

This commit is contained in:
2026-07-24 14:50:59 +02:00
parent 4c146902e3
commit 3d7c0d2332
15 changed files with 364 additions and 610 deletions
@@ -1,7 +1,6 @@
// ConnectionPanel.tsx
import { DSP } from '../../../types/types';
import Button from '../../Button/Button';
import AutoScale from '../../AutoScale/AutoScale';
import './ConnectionSection.css';
const DESIGN_WIDTH = 340;
@@ -32,7 +31,6 @@ function ConnectionPanel({
className="connection-panel-frame"
style={{ '--panel-w': DESIGN_WIDTH, '--panel-h': DESIGN_HEIGHT } as React.CSSProperties}
>
<AutoScale designWidth={DESIGN_WIDTH} designHeight={DESIGN_HEIGHT}>
<div className="card panel" style={{ width: DESIGN_WIDTH, height: DESIGN_HEIGHT }}>
<div className="panel-header">
<div className="panel-header-text">
@@ -73,9 +71,6 @@ function ConnectionPanel({
{dsp.status === 'connected' ? (
<Button
variant="outline"
designWidth={BTN_W}
designHeight={BTN_H}
scale={false}
onClick={onDisconnect}
>
Disconnect
@@ -83,9 +78,6 @@ function ConnectionPanel({
) : (
<Button
variant="primary"
designWidth={BTN_W}
designHeight={BTN_H}
scale={false}
onClick={onConnect}
disabled={dsp.status === 'connecting'}
>
@@ -94,7 +86,6 @@ function ConnectionPanel({
)}
</div>
</div>
</AutoScale>
</div>
</div>
);
@@ -5,7 +5,6 @@ import { DSP } from '../../../types/types';
import { NotificationType } from '../../../types/types';
import { useState } from 'react';
import Button from '../../Button/Button';
import AutoScale from '../../AutoScale/AutoScale';
import ChannelGroup from '../ChannelGroup/ChannelGroup';
import './GainSection.css';