Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Grow your Fabric skills and prepare for the DP-600 certification exam by completing the latest Microsoft Fabric challenge.

Reply
Anonymous
Not applicable

How to control OnHover JSON Theme values for action buttons

How do I go about controlling the values for the 'On Hover' seciont for Fill within a Action Button?

 

I have experimented with this (and close derivatives around this), however this doesn't seem to work.

Would be quite nice to know how to control the 'Default State', 'On Hover' and 'On Press' 

 

"actionButton":{"*":
	{
	"fill":
		[{
			"show":true,
			"onHover":
				{
				"fillColor":{"solid":{"color":"#25476E"}},
				"transparency":0
				}	
		}],

	}},
1 ACCEPTED SOLUTION
Anonymous
Not applicable

In case others stumble on this... The solution is....

 

"fill":
		[
			{
				"show":true
			},
			{
				"$id": "default",
				"transparency": 20,
				"fillColor": {"solid":{"color":"#111111"}}
			},
			{
				"$id": "hover",
				"transparency": 70,
				"fillColor": {"solid":{"color":"#555556"}}
			},
			{
				"$id": "selected",
				"transparency": 30,
				"fillColor": {"solid":{"color":"#ddd556"}}
			}
		]

View solution in original post

2 REPLIES 2
Anonymous
Not applicable

In case others stumble on this... The solution is....

 

"fill":
		[
			{
				"show":true
			},
			{
				"$id": "default",
				"transparency": 20,
				"fillColor": {"solid":{"color":"#111111"}}
			},
			{
				"$id": "hover",
				"transparency": 70,
				"fillColor": {"solid":{"color":"#555556"}}
			},
			{
				"$id": "selected",
				"transparency": 30,
				"fillColor": {"solid":{"color":"#ddd556"}}
			}
		]
Anonymous
Not applicable

Hi Guys.

 

I'm no theme expert and are also learning.  However, below I have unlocked some magic regarding the action button theme.  Don't judge the colors used.  I was just trying to expose as much of the visual as I could.  Hopefully this will help some of you.

 

"actionButton": {

"*" : {
"outline": [
{
"show":true
},
{
"$id": "default",
"transparency": 0,
"weight": 15,
"roundEdge": 15,
"lineColor": {"solid":{"color":"#41A4FF"}}
},
{
"$id": "hover",
"transparency": 0,
"weight": 20,
"lineColor":{"solid":{"color":"#41A4FF"}}
},
{
"$id": "selected",
"transparency": 0,
"weight": 30,
"lineColor":{"solid":{"color":"#41A4FF"}}
}
],
"text":
[
{
"show":true
},
{
"$id": "default",
"fontSize": 10,
"fontColor":{"solid":{"color":"#ffffff"}},
"text": "The Default"
},
{
"$id": "hover",
"fontSize": 15,
"fontColor":{"solid":{"color":"#000000"}},
"text": "The Hover"
},
{
"$id": "selected",
"fontSize": 10,
"fontColor":{"solid":{"color":"#ffffff"}},
"text": "The Click/Select"
}
],
"title":
[
{"show": true},
{"text": "The Title"},

{
"fontSize":12,
"fontFamily":"Arial",
"fontColor":{"solid":{"color":"#41A4FF"}}
},
{"background":{"solid":{"color":"#DEEFFF"}}}
],
"fill":
[
{
"show":true
},
{
"$id": "default",
"transparency": 0,
"fillColor": {"solid":{"color":"#000000"}}
},
{
"$id": "hover",
"transparency": 0,
"fillColor": {"solid":{"color":"#67DCDC"}}
},
{
"$id": "selected",
"transparency": 0,
"fillColor": {"solid":{"color":"#C72783"}}
}
]
}
}

Helpful resources

Announcements
Europe Fabric Conference

Europe’s largest Microsoft Fabric Community Conference

Join the community in Stockholm for expert Microsoft Fabric learning including a very exciting keynote from Arun Ulag, Corporate Vice President, Azure Data.

RTI Forums Carousel3

New forum boards available in Real-Time Intelligence.

Ask questions in Eventhouse and KQL, Eventstream, and Reflex.

MayPowerBICarousel1

Power BI Monthly Update - May 2024

Check out the May 2024 Power BI update to learn about new features.

Top Solution Authors