Hello
As you can see on this screenshot, the space allowed to collection types is small compared to the whole available height and other sections
Is there a way to dock on bottom sections “General” “Plugins” “Single types” and define “Collection types” height to occupy 100% of the remaining space?
For my project I have about 25 collection types and always have to scroll or search
@soupette @HichamELBSI I forget exactly where the file was to apply this change at a per project level.
@maeva @Aurelsicoko Now that we are starting to remove some stuff from the left menu and placing it into settings, I think it might be good to at least expand this.
We do have a better UX solution in our mind, but until we integrate the new design, we could definitely increase the height of the CT & ST section in the left menu! @Jab
Hello @JGallapont,
In order to increase the left menu sections, you just need to customize the LeftMenuListLink file max-height. (Doc: Customize the admin panel)
In the example below, I will show you how to customize the max-height of the collection types section.
1 - Copy the entire content of this file : LeftMenuLinkSection
2 - Create a new file in your project and paste the content of the github file in: your_project/admin/src/components/LeftMenu/LeftMenuLinkSection/index.js
3 - Replace the line 38 with this line :
<LeftMenuListLink section={section} shrink={shrink}>
4 - Copy the entire content of this file : LeftMenuListLink
5 - Create a new file in your project and paste the content of the github file in: your_project/admin/src/components/LeftMenu/LeftMenuLinkSection/LeftMenuListLink.js
6 - Replace the line 4 with this line:
max-height: ${({ section }) => (section === 'collectionType' ? '400px' : '180px')};
400px max-height value is just an example.Hope this helps.
Thanks for the detailed instructions. I agree that max-height: 180px is a ridiculously small area and really needs to be increased (or removed altogether). I just wish your solution worked…
Unfortunately, the “admin/…” path you (and the docs) mentioned does not exist in my project root folder. There is “.cache/admin/…” with the same files, which I updated instead. However, this did not work.
I also tried creating the “admin/src/components/LeftMenu/LeftMenuLinkSection/” folder myself, but again, adding the updated files to this directory changes nothing on the frontend.
What am I doing wrong and how can I change this style rule?
You have to create the path, this system works similar to the React ejection system.