Added a scrollbar to the network and bluetooth menu. (#593)
* Added a scrollbar to the network and bluetooth menu. * Update themes * Adjust height of network menu scroller.
This commit is contained in:
@@ -33,9 +33,11 @@ export const BluetoothDevices = (): JSX.Element => {
|
||||
deviceListBinding.drop();
|
||||
}}
|
||||
>
|
||||
<box className={'menu-content'} vertical>
|
||||
{deviceListBinding()}
|
||||
</box>
|
||||
<scrollable className={'menu-scroller bluetooth'}>
|
||||
<box className={'menu-content'} vertical>
|
||||
{deviceListBinding()}
|
||||
</box>
|
||||
</scrollable>
|
||||
</box>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -15,33 +15,35 @@ export const WirelessAPs = (): JSX.Element => {
|
||||
if (filteredWAPs.length <= 0 && staging.get() === undefined) {
|
||||
return (
|
||||
<label
|
||||
className="waps-not-found dim"
|
||||
className={'waps-not-found dim'}
|
||||
expand
|
||||
halign={Gtk.Align.CENTER}
|
||||
valign={Gtk.Align.CENTER}
|
||||
label="No Wi-Fi Networks Found"
|
||||
label={'No Wi-Fi Networks Found'}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<box className="available-waps-list" vertical>
|
||||
{filteredWAPs.map((ap: AstalNetwork.AccessPoint) => {
|
||||
return (
|
||||
<box className="network-element-item">
|
||||
<AccessPoint connecting={connecting} accessPoint={ap} />
|
||||
<Controls connecting={connecting} accessPoint={ap} />
|
||||
</box>
|
||||
);
|
||||
})}
|
||||
</box>
|
||||
<scrollable className={'menu-scroller wap'}>
|
||||
<box className={'available-waps-list'} vertical>
|
||||
{filteredWAPs.map((ap: AstalNetwork.AccessPoint) => {
|
||||
return (
|
||||
<box className={'network-element-item'}>
|
||||
<AccessPoint connecting={connecting} accessPoint={ap} />
|
||||
<Controls connecting={connecting} accessPoint={ap} />
|
||||
</box>
|
||||
);
|
||||
})}
|
||||
</box>
|
||||
</scrollable>
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
return (
|
||||
<box
|
||||
className="available-waps"
|
||||
className={'available-waps'}
|
||||
vertical
|
||||
onDestroy={() => {
|
||||
wapBinding.drop();
|
||||
|
||||
@@ -57,6 +57,10 @@ export const BluetoothMenuTheme = (): JSX.Element => {
|
||||
<Option opt={options.theme.bar.menus.menu.bluetooth.iconbutton.active} title="Active" type="color" />
|
||||
<Option opt={options.theme.bar.menus.menu.bluetooth.iconbutton.passive} title="Passive" type="color" />
|
||||
|
||||
{/* Scroller Section */}
|
||||
<Header title="Scroller" />
|
||||
<Option opt={options.theme.bar.menus.menu.bluetooth.scroller.color} title="Color" type="color" />
|
||||
|
||||
{/* Switch Section */}
|
||||
<Header title="Switch" />
|
||||
<Option opt={options.theme.bar.menus.menu.bluetooth.switch.enabled} title="Enabled" type="color" />
|
||||
|
||||
@@ -139,6 +139,11 @@ export const MenuTheme = (): JSX.Element => {
|
||||
/>
|
||||
<Option opt={options.theme.bar.menus.slider.puck} title="Puck" type="color" />
|
||||
|
||||
{/* Scroller Section */}
|
||||
<Header title="Scroller" />
|
||||
<Option opt={options.theme.bar.menus.scroller.radius} title="Radius" type="string" />
|
||||
<Option opt={options.theme.bar.menus.scroller.width} title="Width" type="string" />
|
||||
|
||||
{/* Dropdown Menu Section */}
|
||||
<Header title="Dropdown Menu" />
|
||||
<Option opt={options.theme.bar.menus.dropdownmenu.background} title="Background" type="color" />
|
||||
|
||||
@@ -58,6 +58,10 @@ export const NetworkMenuTheme = (): JSX.Element => {
|
||||
<Option opt={options.theme.bar.menus.menu.network.icons.active} title="Active" type="color" />
|
||||
<Option opt={options.theme.bar.menus.menu.network.icons.passive} title="Passive" type="color" />
|
||||
|
||||
{/* Scroller Section */}
|
||||
<Header title="Scroller" />
|
||||
<Option opt={options.theme.bar.menus.menu.network.scroller.color} title="Color" type="color" />
|
||||
|
||||
{/* Icon Buttons Section */}
|
||||
<Header title="Icon Buttons" />
|
||||
<Option opt={options.theme.bar.menus.menu.network.iconbuttons.active} title="Active" type="color" />
|
||||
|
||||
Reference in New Issue
Block a user