Default width for Dropmenu Items

A small CSS improvement for french language (and other long characters ones) :

It should be increased at least to 160px, but maybe a little bit more :

Hi @Spheerys,

I’m not sure this change-request will be accepted, and also not if it should be.
There are maybe languages with even longer words, but making that field too wide could break it in many places and on smaller screen-sizes.

What I’d recommend to you is adding your own custom CSS to the manager and overwrite the CSS-rules that you want.

If you have a lot of changes/adaptions,
you should directly go and create your own manager-theme.

If you only have some overwrites, then you can follow these instructions:

  • Create a plugin (“CustomManagerFiles” for example)
  • Set the plugin to listen to OnManagerPageBeforeRender and OnManagerPageInit
  • Upload your manager.css file somewhere on your server (“/assets/manager.css”)
  • Add the following code:
<?php
$eventName = $modx->event->name;
switch($eventName) {
    case 'OnBeforeManagerPageInit':
    case 'OnManagerPageBeforeRender':
    case 'OnManagerPageInit':
        
            // Manager fixes
            $modx->regClientCSS('/assets/manager.css'); 
            
        break;
}

Now inside the manager it will always load your custom manager.css.

I use this a lot for little fixes in the UI, for customizing some CB-fields (like setting them flex and re-ordering) or a lot for customizing the CB-field-settings in the popup (like for example making the radio-buttons inline, so they don’t take up too much place).

I hope this helps :slight_smile:

1 Like

Definitely feel free to use your own custom stylesheet, but I’ll make it a little wider in the next release. :slight_smile:

1 Like

I understand, even if the adaptation is very small.
Thanks for the tip to create my own CSS manager file.
I will do this and it will be very useful for me !

1 Like

I’m working localy and the base_url is not /
So I have a small issue with the manager CSS path : how can I get it where there is the *********** $modx->regClientCSS('*******/assets/css/manager.css'); ?

Because on the manager html code I get this :

...
<link rel="stylesheet" href="/websites/mywebsite.tld/assets/components/collections/css/mgr.css" type="text/css" />
<link rel="stylesheet" href="/assets/css/manager.css" type="text/css" />
...

I have this plungin code for now but I don’t know how to use the $base_url variable :

<?php
$eventName = $modx->event->name;
$base_url = $modx->getOption('base_url');
switch($eventName) {
    case 'OnBeforeManagerPageInit':
    case 'OnManagerPageBeforeRender':
    case 'OnManagerPageInit':
        
            // Manager fixes
            $modx->regClientCSS('/assets/css/manager.css'); 
            
        break;
}
<link rel="stylesheet" href="/assets/css/manager.css" type="text/css" />

That looks alright to me, doesn’t it? As long as your url starts with / that should work?

To use that $base_url would be:

$modx->regClientCSS($base_url . 'assets/css/manager.css'); 

… but given the end result is the same I don’ tknow what you expect it to change :smiley:

1 Like

No, it seems he has different $base_url settings depending on his environment, so locally on his machine that would say something like “/websites/mywebsite.tld/” (at least that’s how I understood).

It work well with this code (your wrote a space before assets) :

$modx->regClientCSS($base_url . 'assets/css/manager.css'); 

Thanks !

1 Like