Variable names overlap the description field

[EleanorHyde-UMCG]

What version of EMX2 are you using (see footer) Software version: v10.37.1. Database version: 16.

Describe the bug Variables with a long name end up leaking into the description column in the variable explorer.

To Reproduce Steps to reproduce the behavior:

1. Go to https://data-catalogue-acc.molgeniscloud.org/catalogue/ssr-catalogue/all/variables
2. Scroll down to variable ath_ndvi100_mean_preg
3. See that the end of the variable name leaks into the description field next door

Expected behavior The variable name column should be wide enough for this not to happen.

Screenshots

Desktop (please complete the following information):

• OS: windows 10
• Browser chrome
• Version 121.0.6167.185 (Officiële build) (64-bits)

[connoratrug]

The variable name column should be wide enough for this not to happen. but then what happens when a variable has a really long name ? What happens to the second column ( the description) , we could use a different card type for this , instead of two cols , have two rows , row1: the variable name cut off if longer then max card width, and row two the description ( multi line word wrap ) . down side; it makes harder to scan the left edge.

realy need visiual examples for this , as it gets hard to describe with words

[EleanorHyde-UMCG]

Is it possible to wrap the variable name in col 1 so that it runs over to the next line(s) if it's too long for one line?

[connoratrug]

Is it possible to wrap the variable name in col 1 so that it runs over to the next line(s) if it's too long for one line?

this example has var names that are a single word ( combining multiple parts with a _)

[EleanorHyde-UMCG]

I think variable names are always a single word (albeit several words held together with dashes or underscores). Is there the possibility to split single words up (like in text editors)?

[EleanorHyde-UMCG]

Solution? Display the variable name above the description so that it can be shown full-length

[YpeZ]

Was thinking this when looking at it:

----------------------------------------------------------------------------
ath_ndvi100_mean_preg
    5-years moving average (YYYY-4 to YYYY) of NDVI within a 100 meter 
    buffer around geocode using all available images during the greenest 
    period (from May to August) at pregnancy
----------------------------------------------------------------------------
ath_ndvi300_mean_0
    5-years moving average (YYYY-4 to YYYY) of NDVI within a 300 meter 
    buffer around geocode using all available images during the greenest 
    period (from May to August) at birth
----------------------------------------------------------------------------

with the variable names in blue, as they are. The added benefit is that this creates more horizontal space for the description, which in cases may reduce the number of lines required, making the blocks more compact

[EleanorHyde-UMCG]

This looks good, Ype

[connoratrug]

closed by https://github.com/molgenis/molgenis-emx2/pull/3482