diff --git a/src/components/settings/Config.tsx b/src/components/settings/Config.tsx
index ca41938..562f20d 100644
--- a/src/components/settings/Config.tsx
+++ b/src/components/settings/Config.tsx
@@ -222,20 +222,20 @@ const Config = () => {
>
{(config.active.tab === 'playback' || '') && (
<>
-
-
+
+
>
)}
- {config.active.tab === 'lookandfeel' && }
+ {config.active.tab === 'lookandfeel' && }
{config.active.tab === 'other' && (
<>
-
-
- {!showWindowConfig && }
-
-
+
+
+ {!showWindowConfig && }
+
+
>
)}
diff --git a/src/components/settings/ConfigPanels/AdvancedConfig.tsx b/src/components/settings/ConfigPanels/AdvancedConfig.tsx
index 3178780..559767a 100644
--- a/src/components/settings/ConfigPanels/AdvancedConfig.tsx
+++ b/src/components/settings/ConfigPanels/AdvancedConfig.tsx
@@ -8,7 +8,7 @@ import { useAppDispatch } from '../../../redux/hooks';
import { setPlaybackSetting } from '../../../redux/playQueueSlice';
import ConfigOption from '../ConfigOption';
-const AdvancedConfig = () => {
+const AdvancedConfig = ({ bordered }: any) => {
const dispatch = useAppDispatch();
const [showDebugWindow, setShowDebugWindow] = useState(
Boolean(settings.getSync('showDebugWindow'))
@@ -16,7 +16,7 @@ const AdvancedConfig = () => {
const [autoUpdate, setAutoUpdate] = useState(Boolean(settings.getSync('autoUpdate')));
return (
-
+
{
+const CacheConfig = ({ bordered }: any) => {
const dispatch = useAppDispatch();
const [imgCacheSize, setImgCacheSize] = useState(0);
const [songCacheSize, setSongCacheSize] = useState(0);
@@ -104,7 +104,7 @@ const CacheConfig = () => {
};
return (
-
+
{errorMessage !== '' && (
<>
diff --git a/src/components/settings/ConfigPanels/ExternalConfig.tsx b/src/components/settings/ConfigPanels/ExternalConfig.tsx
index 6d37026..895bbba 100644
--- a/src/components/settings/ConfigPanels/ExternalConfig.tsx
+++ b/src/components/settings/ConfigPanels/ExternalConfig.tsx
@@ -18,12 +18,12 @@ import ConfigOption from '../ConfigOption';
const dialog: any = process.env.NODE_ENV === 'test' ? '' : require('electron').remote.dialog;
-const ExternalConfig = () => {
+const ExternalConfig = ({ bordered }: any) => {
const dispatch = useAppDispatch();
const config = useAppSelector((state) => state.config);
return (
-
+
Config for integration with external programs.
diff --git a/src/components/settings/ConfigPanels/LookAndFeelConfig.tsx b/src/components/settings/ConfigPanels/LookAndFeelConfig.tsx
index 61acff4..0e10c44 100644
--- a/src/components/settings/ConfigPanels/LookAndFeelConfig.tsx
+++ b/src/components/settings/ConfigPanels/LookAndFeelConfig.tsx
@@ -504,12 +504,12 @@ export const ThemeConfigPanel = ({ bordered }: any) => {
);
};
-const LookAndFeelConfig = () => {
+const LookAndFeelConfig = ({ bordered }: any) => {
return (
<>
-
-
-
+
+
+
>
);
};
diff --git a/src/components/settings/ConfigPanels/PlaybackConfig.tsx b/src/components/settings/ConfigPanels/PlaybackConfig.tsx
index 822d556..82d3153 100644
--- a/src/components/settings/ConfigPanels/PlaybackConfig.tsx
+++ b/src/components/settings/ConfigPanels/PlaybackConfig.tsx
@@ -13,7 +13,7 @@ import { useAppDispatch } from '../../../redux/hooks';
import { setPlaybackSetting } from '../../../redux/playQueueSlice';
import ConfigOption from '../ConfigOption';
-const PlaybackConfig = () => {
+const PlaybackConfig = ({ bordered }: any) => {
const dispatch = useAppDispatch();
const [crossfadeDuration, setCrossfadeDuration] = useState(
Number(settings.getSync('fadeDuration'))
@@ -54,7 +54,7 @@ const PlaybackConfig = () => {
return (
<>
-
+
{
+const PlayerConfig = ({ bordered }: any) => {
const dispatch = useAppDispatch();
const playQueue = useAppSelector((state) => state.playQueue);
const multiSelect = useAppSelector((state) => state.multiSelect);
@@ -98,7 +98,7 @@ const PlayerConfig = () => {
}, []);
return (
-
+
{
+const ServerConfig = ({ bordered }: any) => {
const dispatch = useAppDispatch();
const folder = useAppSelector((state) => state.folder);
const config = useAppSelector((state) => state.config);
@@ -25,7 +25,7 @@ const ServerConfig = () => {
}
return (
-
+
{
>
Search
+ {config.serverType === Server.Jellyfin && (
+ {
+ dispatch(setAppliedFolderViews({ ...folder.applied, music: e }));
+ settings.setSync('musicFolder.music', e);
+ }}
+ >
+ Songs
+
+ )}
diff --git a/src/components/settings/ConfigPanels/WindowConfig.tsx b/src/components/settings/ConfigPanels/WindowConfig.tsx
index b105e28..e5d3453 100644
--- a/src/components/settings/ConfigPanels/WindowConfig.tsx
+++ b/src/components/settings/ConfigPanels/WindowConfig.tsx
@@ -4,11 +4,11 @@ import { ConfigOptionDescription, ConfigPanel } from '../styled';
import { StyledToggle } from '../../shared/styled';
import ConfigOption from '../ConfigOption';
-const WindowConfig = () => {
+const WindowConfig = ({ bordered }: any) => {
const [minimizeToTray, setMinimizeToTray] = useState(Boolean(settings.getSync('minimizeToTray')));
const [exitToTray, setExitToTray] = useState(Boolean(settings.getSync('exitToTray')));
return (
-
+
Note: These settings may not function correctly depending on your desktop environment.
diff --git a/src/components/settings/styled.tsx b/src/components/settings/styled.tsx
index ae626f2..aae19a2 100644
--- a/src/components/settings/styled.tsx
+++ b/src/components/settings/styled.tsx
@@ -15,12 +15,12 @@ export const ConfigPanel = styled(Panel)<{ $noBackground: boolean }>`
margin: ${(props) => (props.collapsible ? 'none' : '15px auto 15px auto')};
padding: 15px;
- background: ${(props) => (props.$noBackground ? 'none' : 'rgba(0, 0, 0, 0.1)')};
+ background: ${(props) =>
+ props.$noBackground || !props.bordered ? 'none' : 'rgba(0, 0, 0, 0.1)'};
border-radius: 15px;
.rs-panel-heading {
font-size: ${(props) => props.theme.fonts.size.panelTitle};
- font-weight: bold;
}
.rs-panel-collapsible > .rs-panel-heading::before {