Page 1 of 1

5.20 Improvement Request

Posted: 01 Nov 2013, 12:47
by WilliaFr
Dear Ahmad, I'm loving the new release and am really happy with my testing of the new version.

I have already given someone advice in this forum about how to wrap text in responsive tables (via css) which could be an added as an option when defining the field (see viewtopic.php?f=2&t=830).

I have now discovered my own requirement / request.

Would it be possible when defining a field in a table that will have a url (usually very long) as it's content to request that the field have the css property word-break:break-all; so that the long url text is "wrapped" when displayed on narrow phone / tablet displays thus preserving the responsiveness of the design.

I have temporarily achieved this by adding


to the Slate css file


modifying the template so that the long url text appears between <p class="url"> .... </p> and will be split when the screen width reduces.

For example: very_long_url_textstring.html

would appear like
ive/this_is_a very_long_url_textstring.html

using the above method. Presently the field would not be split and would force the display width to remain at the length of the text.



Re: 5.20 Improvement Request

Posted: 17 Nov 2013, 23:38
by a.gneady
Thanks Fred. Will implement your suggestion in the next release.

Re: 5.20 Improvement Request

Posted: 09 Jan 2014, 12:41
by sosapr

Hi Ahmad -

I just downloaded and installed 5.22 just hoping maybe the fields in the table view might wrap now.

I'm not comfortable enough with CSS to go in an play with it myself -- I would need detailed instructions ... put exactly what exactly where.

Looking forward, will this have to wait for a version 6 to be implemented? Is there a way I could make it happen?

Thanks, Mike

Re: 5.20 Improvement Request

Posted: 09 Jan 2014, 12:48
by sosapr
Ahmad -

I've discovered the following post. I'll try it when I get home tonight. Meantime, does this look correct to you? Thanks.


Re: r 5.20
Unread postby WilliaFr ยป 29 Oct 2013, 09:01

Think I have found the solution.

The bootstrap css for responsive tables has the following:

@media (max-width: 768px) {
.table-responsive {
width: 100%;
margin-bottom: 15px;
overflow-x: scroll;
overflow-y: hidden;
border: 1px solid #dddddd;
.table-responsive > .table {
margin-bottom: 0;
background-color: #fff;
.table-responsive > .table > thead > tr > th,
.table-responsive > .table > tbody > tr > th,
.table-responsive > .table > tfoot > tr > th,
.table-responsive > .table > thead > tr > td,
.table-responsive > .table > tbody > tr > td,
.table-responsive > .table > tfoot > tr > td {
white-space: nowrap;

If you change "white-space: nowrap" to "white-space: wrap" I think you'll find that it does what you want.

Re: 5.20 Improvement Request

Posted: 09 Jan 2014, 13:36
by sosapr
One more note --

I'm very hopeful I can have word wrap in tables with this edit, but I can't find the file that contains this code.

What folder / file is this in?

Thanks, Mike

Re: 5.20 Improvement Request

Posted: 09 Jan 2014, 14:23
by sosapr
Okay, Found it! Will try it tonight!