User Attributes

Permalink 1 user found helpful
I have a user attribute with 50+ possible values. When editing the user's profile to select one, the interface will not scroll to allow access to the entire list.

1 Attachment

jolson
 
webpresso replied on at Permalink Reply
webpresso
Two ideas.
Can you manipulate your list with css? then you could try to do the following:

1) try with max-height: 100% and overflow-y: scroll
2) or try to make a 2 column view by using multi-columns (http://www.w3schools.com/css/css3_multiple_columns.asp)

You can place this css in your theme or provide an extra css only when you are logged in.

Hope this helps for finding a solution.
jolson replied on at Permalink Reply
jolson
Custom template for the dashboard user's page?
jolson replied on at Permalink Reply
jolson
From the page source I'm not finding any id's or classes in the markup for the list.
webpresso replied on at Permalink Reply
webpresso
I didnt't understand that you are in dashboard. So the css files for theme won't load in that place.
So my idea will not work.
jolson replied on at Permalink Reply
jolson
Thanks anyway.
mnakalay replied on at Permalink Best Answer Reply
mnakalay
There is a solution.

Create a css file and call it editable-fields.css (actually you can call it anything you want I'm just calling it that because it is the name of the file we want to override.

Inside it put
@import url("../../../concrete/css/editable-fields.css");
.editable-container.editable-popup {
    max-height: 350px;
    overflow-y: auto;
    overflow-x: hidden;
}

Modify the max-height to whatever you want or play with the css. That will apply to the popup

Put it in application/files/css You will have to create the css folder as it doesn't exist

Then open your file application/bootstrap/app.php. At the bottom add
use \Concrete\Core\Asset\AssetList;
use \Concrete\Core\Asset\Asset;
$al = AssetList::getInstance()
->getAsset('css', 'core/app/editable-fields')
->setAssetURL('/application/files/css/editable-fields.css');


And that's it. Now when you try to edit your filed it will have a max-height and a vertical scroll bar.

Hope it helps
jolson replied on at Permalink Reply
jolson
Works like a charm - many thanks.
OKDnet replied on at Permalink Reply
OKDnet
So my question is...
How did you know this? </grin>
mnakalay replied on at Permalink Reply
mnakalay
Well first I looked at how to do what was needed from a CSS point of view. I did that simply in Chrome's developer tools.

Doing that I figured out what CSS file was responsible for styling that popup.

I then did a search in the concrete folder to see where that css file was called from. I discovered it was registered as an asset.

I then looked in the docs here and I found this page:http://documentation.concrete5.org/developers/assets/registering-an...

Thaks to the information there I went to look into the bootstrap/app.php file and it is full of comments explaining how to do different things including replacing a core asset.

I didn't want to totally replace the asset as the core team modifies their core styling from time to time so that is why I just created a simple css file that imports the original to make sure the original is still loaded.

See, not complicated...

Naahhh! I'm kiding... I'm a genius :)
Gondwana replied on at Permalink Reply
Gondwana
Well, I'm impressed! :)
OKDnet replied on at Permalink Reply
OKDnet
+1
webpresso replied on at Permalink Reply
webpresso
I vote this for most helpful answer of the week :-)
Learned a lot!
mnakalay replied on at Permalink Reply
mnakalay
In case anybody is interested I made it an official tutorial with added information
http://documentation.concrete5.org/tutorials/customize-attributes-e...
OKDnet replied on at Permalink Reply
OKDnet
I was thinking about suggesting you do this. That's great, thanks.
Gondwana replied on at Permalink Reply
Gondwana
Bookmarked. Many thanks!