I must remove layout's sep

Suite and Optimus Suite 5
#1

Now, I useing user Solution.

Dhtmlx is very powerful API.

But, I have some problem.

First. I want to remove layout’s separators area.

dhtmlx layout’s separators area is too big.

I see, your FAQ ‘It’s impossible to remove/hide cells’ separators’

But, My Client say it’s too much. So, I must hide or remove that area.

how can i edit dhtmlx.js? where is hardcoded?

#2

Hello
It’s impossible to remove/hide cells’ separators. Layout’s separators are hardcoded. They are inseparable visual and functional elements of layout’s structure.

You can try to use dhtmlxPortal: docs.dhtmlx.com/dhtmlxportal.html

#3

How can i download dhtmlxPortal???

#4

You can find a link to download here:
dhtmlx.com/blog/new-dhtmlx-component/

#5

I too have looked for a way to make to pad the layout and turn the separator white. I had hoped that the new Portal would make this an option and sadly it does not.

This evening while working on new screen, I went through the usual compensations for how to do this with layout:

  • Try to create windows and position each one so it looks nice – this does not work

  • Create a 1C layout and attach an html string which has divs nicely positioned and then put a layout in each div. – This works…it’s a pain and then when window is re-sized…good luck

  • Try using layout.setOffsets() to pad it a bit – this is tricky as it requires nested layout and also the separator still shows

After messing around a bit, I found something which is getting much close to the goal.

  .dhxlayout_base_dhx_skyblue div.dhxlayout_sep {
    background-color:white ;
  }

This turns the separators white. Just make sure the cells are fixed and cannot be resized.


If this is coupled with nested layouts and layout.setOffsets() then you can change the padding around each cell. And this is probably exactly what your looking to do.

After going through all these hoops, it would be great if dhtmlx could create 3 new layout methods:

  • layout.hideSeparator() - which turns the separator white and removes the cell resize handle

  • layout.showSeparator() - turns it back on

  • layout.cell(‘a’).pad( {top:10, right:10, bottom:10, left:10} - which pads cell(‘a’)

I would use these on 90% of the pages.

#6

Hello
Please, look at this link:
docs.dhtmlx.com/api__dhtmlxlayou … rsize.html

#7

Wow!!! 4.2 looks great. I need the sidebar too!!!

#8

:slight_smile:
You are welcome!

#9

You’re making thing too easy :slight_smile:

In v4.2 the css is:

.dhxlayout_base_dhx_skyblue {background-color:white ;}
.dhxlayout_base_dhx_skyblue .dhxlayout_cont div.dhxlayout_sep {background-color:white ;}

And this is working great:

  l = masterView.cells('a').attachLayout('2U');
  l.setSeparatorSize(0,15);

I am using this with views (thanks to the view improvement in v4.1) and this is exactly the look and feel I’ve been wanting to achieve. Way back when I posted a message in New Requests asking for a Portlet feel—this is it.

Also in v4.2 it looks like the layout separators are nicer looking as the gray is a bit softer – easy on the eyes.