add some classes for nicer scrolling, update lib

This commit is contained in:
AAGaming
2022-08-15 13:22:38 -04:00
parent 0a735886c9
commit 3b1b6d28d6
4 changed files with 37 additions and 22 deletions
+1 -1
View File
@@ -37,7 +37,7 @@
} }
}, },
"dependencies": { "dependencies": {
"decky-frontend-lib": "^1.5.1", "decky-frontend-lib": "^1.6.2",
"react-icons": "^4.4.0" "react-icons": "^4.4.0"
} }
} }
+4 -4
View File
@@ -9,7 +9,7 @@ specifiers:
'@types/react': 16.14.0 '@types/react': 16.14.0
'@types/react-router': 5.1.18 '@types/react-router': 5.1.18
'@types/webpack': ^5.28.0 '@types/webpack': ^5.28.0
decky-frontend-lib: ^1.5.1 decky-frontend-lib: ^1.6.2
husky: ^8.0.1 husky: ^8.0.1
import-sort-style-module: ^6.0.0 import-sort-style-module: ^6.0.0
inquirer: ^8.2.4 inquirer: ^8.2.4
@@ -23,7 +23,7 @@ specifiers:
typescript: ^4.7.4 typescript: ^4.7.4
dependencies: dependencies:
decky-frontend-lib: 1.5.1 decky-frontend-lib: 1.6.2
react-icons: 4.4.0_react@16.14.0 react-icons: 4.4.0_react@16.14.0
devDependencies: devDependencies:
@@ -806,8 +806,8 @@ packages:
ms: 2.1.2 ms: 2.1.2
dev: true dev: true
/decky-frontend-lib/1.5.1: /decky-frontend-lib/1.6.2:
resolution: {integrity: sha512-XrcMNxqdXJFyuJYJX4Wmo7DvFVkwBsl8aWU5wfLdPQmcPz3drafyEgqIdO4AxpFuTsHTf1qaHBiYYw349vYpgw==} resolution: {integrity: sha512-O34rHg6BWYP99jxlosAl0hUfo+SmOyjN+TtcyutdIjvPkg/FgHwahTd+SMujTpZemV31c4JX8hdGnN/Z7tjL9g==}
dependencies: dependencies:
minimist: 1.2.6 minimist: 1.2.6
dev: false dev: false
+32 -16
View File
@@ -1,4 +1,11 @@
import { ButtonItem, PanelSection, PanelSectionRow } from 'decky-frontend-lib'; import {
ButtonItem,
PanelSection,
PanelSectionRow,
joinClassNames,
scrollClasses,
staticClasses,
} from 'decky-frontend-lib';
import { VFC } from 'react'; import { VFC } from 'react';
import { useDeckyState } from './DeckyState'; import { useDeckyState } from './DeckyState';
@@ -7,24 +14,33 @@ const PluginView: VFC = () => {
const { plugins, activePlugin, setActivePlugin } = useDeckyState(); const { plugins, activePlugin, setActivePlugin } = useDeckyState();
if (activePlugin) { if (activePlugin) {
return <div style={{ height: '100%' }}>{activePlugin.content}</div>; return (
<div
className={joinClassNames(staticClasses.TabGroupPanel, scrollClasses.ScrollPanel, scrollClasses.ScrollY)}
style={{ height: '100%' }}
>
{activePlugin.content}
</div>
);
} }
return ( return (
<PanelSection> <div className={joinClassNames(staticClasses.TabGroupPanel, scrollClasses.ScrollPanel, scrollClasses.ScrollY)}>
{plugins <PanelSection>
.filter((p) => p.content) {plugins
.map(({ name, icon }) => ( .filter((p) => p.content)
<PanelSectionRow key={name}> .map(({ name, icon }) => (
<ButtonItem layout="below" onClick={() => setActivePlugin(name)}> <PanelSectionRow key={name}>
<div style={{ display: 'flex', justifyContent: 'space-between' }}> <ButtonItem layout="below" onClick={() => setActivePlugin(name)}>
<div>{icon}</div> <div style={{ display: 'flex', justifyContent: 'space-between' }}>
<div>{name}</div> <div>{icon}</div>
</div> <div>{name}</div>
</ButtonItem> </div>
</PanelSectionRow> </ButtonItem>
))} </PanelSectionRow>
</PanelSection> ))}
</PanelSection>
</div>
); );
}; };
-1
View File
@@ -7,7 +7,6 @@ import { useDeckyState } from './DeckyState';
const titleStyles: CSSProperties = { const titleStyles: CSSProperties = {
display: 'flex', display: 'flex',
paddingTop: '3px', paddingTop: '3px',
paddingBottom: '14px',
paddingRight: '16px', paddingRight: '16px',
boxShadow: 'unset', boxShadow: 'unset',
}; };