cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Frequent Visitor

actionButton Power BI JSON Theme

 
 
I am trying to put together a theme for the action button, but have not figured out the right syntax to set the Default State, On Hover, and On Press outline theme.  Below is what I have so far.  Anybody have an example?  Thanks.
 
        "actionButton": {
            "*": {
                "visualHeader": [{
                    "show": true
                }],
                "border": [{
                    "show": false
                }],
                "fill": [{
                    "show": true
                }],
                "outline": [
                    {
                        "show":true
                    }
                ]
            }
        }
13 REPLIES 13
Highlighted

@tmckenzie  could you elaborate on this please and submit a .json file that can be imported to a desktop file so I can see the structure of the file. My JSON skills aren't the best and I've been struggling to get this working even with your example. Thanks

Highlighted

{"name":"Theme Example of Action Buttons",
"background":"#333333",
"foreground":"#FFFFFF",
"tableAccent":"#4A8DDC",
"dataColors":["#4A8DDC", "#F3C911", "#DC5B57","#33AE81","#8D6FD1","#FE6DB6","#4C5D8A","#95C8F0"],
"visualStyles":{
	"*": {
             "*": {
                 
                 
             }
         },

"actionButton":{"*":
	{
	"border":
		[{
			"show":false
		}],
	"visualHeader":
		[{
			"show":false
		}],
	"background":
		[{
			"show":false
		}],
	"title":
		[{
			"show":false
		}],
	"outline":
		[
			{
				"show":true
			},
			{
				"$id": "default",
				"weight":0
			},
			{
				"$id": "hover",
				"weight":0
			},
			{
				"$id": "selected",
				"weight":0
			}
		],
	"fill":
		[
			{
				"show":true
			},
			{
				"$id": "default",
				"transparency": 0,
				"fillColor": {"solid":{"color":"#25476E"}}
			},
			{
				"$id": "hover",
				"transparency": 0,
				"fillColor": {"solid":{"color":"#386AA5"}}
			},
			{
				"$id": "selected",
				"transparency": 0,
				"fillColor": {"solid":{"color":"#4A8DDC"}}
			}
		],
	"icon":
		[
			{
			"show":true
			},
			{
				"$id": "default",
				"lineColor":{"solid":{"color":"#FFFFFF"}}
			},
			{
				"$id": "hover",
				"lineColor":{"solid":{"color":"#FFFFFF"}}
			},
			{
				"$id": "selected",
				"lineColor":{"solid":{"color":"#FFFFFF"}}
			}
		
		]
	}},

"*":{"*":
	{
	"outspacePane": [{
                     "backgroundColor": {"solid": {"color": "#4A8DDC"}},
                     "foregroundColor": {"solid": {"color": "#FFFFFF"}},
                     "transparency": 15,
                     "titleSize": 24,
                     "headerSize": 12,
                     "fontFamily": "Arial",
                     "border": true,
					 "width":240,
                     "borderColor": {"solid": {"color": "#374649"}}
                 }],
	"filterCard": [
                     {
                     "$id": "Applied",
                     "transparency": 0,
                     "backgroundColor": {"solid": {"color": "#25476E"}},
                     "foregroundColor": {"solid": {"color": "#FFFFFF"}},
                     "textSize": 12,
                     "border": true,
                     "borderColor": {"solid": {"color": "#ffffff"}},
                     "inputBoxColor": {"solid": {"color": "#333333"}}
                     },
                     {
                     "$id": "Available",
                     "transparency": 40,
                     "backgroundColor": {"solid": {"color": "#4A8DDC"}},
                     "foregroundColor": {"solid": {"color": "#333333"}},
                     "textSize": 12,
                     "border": true,
                     "borderColor": {"solid": {"color": "#123456"}},
                     "inputBoxColor": {"solid": {"color": "#E6E6E6"}}
                 }] 

	}}
	}}
Highlighted

@jcarville 

The above post will show you how to apply this to both Action Buttons and the Filter Pane & Cards.

Any questions then give me a shout.

Highlighted

@tmckenziethats brilliant, thanks very much and for the quick reply Smiley Very Happy

Helpful resources

Announcements
Community Conference

Power Platform Community Conference

Check out the on demand sessions that are available now!

Community Conference

Microsoft Power Platform Communities

Check out the Winners!

secondImage

Create an end-to-end data and analytics solution

Learn how Power BI works with the latest Azure data and analytics innovations at the digital event with Microsoft CEO Satya Nadella.