OpenSource/homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement disableCollapse feature per specific group

Browse Source
This commit is contained in:
Tyagunov Alexey 2025-01-13 03:03:26 +03:00
parent 1e556e105d
commit 8b883f1985
3 changed files with 17 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
docs/configs/settings.md
View File

@ -266,12 +266,22 @@ By default homepage will max out at 4 columns for services with `columns` style
### Collapsible sections
You can disable the collapsible feature of services & bookmarks by adding:
You can disable the collapsible feature of services & bookmarks by adding `disableCollapse` option to the layout group.
```yaml
layout:
Section A:
disableCollapse: true
```
This can also be set globaly using the `disableCollapse` option.
```yaml
disableCollapse: true
```
The value set on a group will overwrite the global setting.
By default the feature is enabled.
### Initially collapsed sections

5
src/components/bookmarks/group.jsx
View File

@ -19,6 +19,7 @@ export default function BookmarksGroup({
useEffect(() => {
if (layout?.initiallyCollapsed ?? groupsInitiallyCollapsed) panel.current.style.height = `0`;
}, [layout, groupsInitiallyCollapsed]);
const groupDisableCollapse = !!(layout?.disableCollapse ?? disableCollapse)
return (
<div
@ -33,7 +34,7 @@ export default function BookmarksGroup({
{({ open }) => (
<>
{layout?.header !== false && (
<Disclosure.Button disabled={disableCollapse} className="flex w-full select-none items-center group">
<Disclosure.Button disabled={groupDisableCollapse} className="flex w-full select-none items-center group">
{layout?.icon && (
<div className="flex-shrink-0 mr-2 w-7 h-7 bookmark-group-icon">
<ResolvedIcon icon={layout.icon} />
@ -44,7 +45,7 @@ export default function BookmarksGroup({
</h2>
<MdKeyboardArrowDown
className={classNames(
disableCollapse ? "hidden" : "",
groupDisableCollapse ? "hidden" : "",
"transition-all opacity-0 group-hover:opacity-100 ml-auto text-theme-800 dark:text-theme-300 text-xl",
open ? "" : "rotate-180",
)}

5
src/components/services/group.jsx
View File

@ -25,6 +25,7 @@ export default function ServicesGroup({
let groupPadding = layout?.header === false ? "px-1" : "p-1 pb-0";
if (isSubgroup) groupPadding = "";
const groupDisableCollapse = !!(layout?.disableCollapse ?? disableCollapse)
return (
<div
@ -41,7 +42,7 @@ export default function ServicesGroup({
{({ open }) => (
<>
{layout?.header !== false && (
<Disclosure.Button disabled={disableCollapse} className="flex w-full select-none items-center group">
<Disclosure.Button disabled={groupDisableCollapse} className="flex w-full select-none items-center group">
{layout?.icon && (
<div className="flex-shrink-0 mr-2 w-7 h-7 service-group-icon">
<ResolvedIcon icon={layout.icon} />
@ -52,7 +53,7 @@ export default function ServicesGroup({
</h2>
<MdKeyboardArrowDown
className={classNames(
disableCollapse ? "hidden" : "",
groupDisableCollapse ? "hidden" : "",
"transition-all opacity-0 group-hover:opacity-100 ml-auto text-theme-800 dark:text-theme-300 text-xl",
open ? "" : "rotate-180",
)}