Merge borders for multiple widgets

[abhinavt]

Hello, 

I'm trying to merge borders for multiple widgets. Lets say if I have two widgets I know I can customize each widget's border style using the below script ,but is there a way to only have 4 borders for 2 widgets instead of 8. TIA

dashboard.on('widgetready', function(sender, ev){
	widgetlist = ['5sd2c75601eafb7y02d4bce89', '61r4d1fb65c615646ee3t523']
	
	$.each(widgetlist, function(index, value){
		widgetelement = $('[widgetid = "' + value + '"]', element)
		widgetelement.css('border', '10px solid #000')
		widgetelement.css('border-radius', '15px')
	})
})

[DRay]

Hello @abhinavt.

Hello ,

Thank you for your question. I see that this hasn't had a response yet, so I am reaching out internally to try and get you an answer. 

[TriAnthony · Accepted solution]

Hi @abhinavt,

You can modify the top/bottom/left/right border configurations to achieve that.

Here's the updated script for one border surrounding two widgets:

dashboard.on('widgetready', function(sender, ev){

	widgetlist = ['5sd2c75601eafb7y02d4bce89', '61r4d1fb65c615646ee3t523']

	//widget border configurations
	$.each(widgetlist, function(index, value){
		
		widgetelement = $('[widgetid = "' + value + '"]', element)
		widgetelement.css('border-top', '10px solid #000')
		widgetelement.css('border-bottom', '10px solid #000')
		
		//left widget
		if(index == 0) {
			widgetelement.css('border-left', '10px solid #000')
			widgetelement.css('border-top-left-radius', '15px')
			widgetelement.css('border-bottom-left-radius', '15px')
		}

		//right widget
		else if(index == 1) {
			widgetelement.css('border-right', '10px solid #000')
			widgetelement.css('border-top-right-radius', '15px')
			widgetelement.css('border-bottom-right-radius', '15px')
		}

	})
})

[abhinavt]

Thank you so much TriAnthony and DRay. The script worked for me!

[DRay]

Thank you for the update. I'm glad it worked!