angular-gridster2 icon indicating copy to clipboard operation
angular-gridster2 copied to clipboard

How to fill the margin lines between cells

Open shyambhiogade opened this issue 6 years ago • 7 comments

hi @tiberiuzuld , how to fill the lines between cells with different color, right now it just show the background color of grid.

shyambhiogade avatar Jun 18 '18 20:06 shyambhiogade

@tiberiuzuld can you please reply if its possible easily. gridstermargin

shyambhiogade avatar Jun 21 '18 17:06 shyambhiogade

Hi @shyambhiogade , You can't at the moment, will consider adding this feature.

tiberiuzuld avatar Nov 17 '18 09:11 tiberiuzuld

please add also a possibility to change the grid lines color. for now I can use :host gridster /deep/ .gridster-column but deep is deprecated.

https://angular.io/guide/component-styles#deprecated-deep--and-ng-deep

admir86 avatar Dec 06 '18 10:12 admir86

That should work without deep since the grid is using encapsulation: ViewEncapsulation.None

tiberiuzuld avatar Dec 06 '18 14:12 tiberiuzuld

without deep it works only if the style definition is in the global css. but not if the style is defined in the css of my dashboard component.

admir86 avatar Dec 06 '18 15:12 admir86

True, but I don't think is worth it to make an api for all the css values properties out there. Those values should be changed from css not from JS api. This initial issues is about the structure of how the grid lines are formed to enable to color the lines between widgets. As a mater of fact got an idea on how do it from css without any change in the library. hey @shyambhiogade , You can use this css to make your lines a different color

gridster .gridster-column {
    border-left: 1px solid red;
    border-right: 1px solid red;
    outline: 10px solid red;
}
gridster .gridster-row {
    border-top: 1px solid red;
    border-bottom: 1px solid red;
    outline: 10px solid red;
}

image

Let me know if this works for your use case.

tiberiuzuld avatar Dec 06 '18 16:12 tiberiuzuld

@tiberiuzuld Although an old post, it looks like this is still not possible. I want to change the grid line color but am unable to do it. Tried your CSS but didn't work. Any idea how to acomplish this?

tomazk8 avatar Sep 08 '21 08:09 tomazk8