Use of Bold in Arcade Expressions

[JennHat]

Hello,

I'm displaying a number of attributes in a list. I want to bold the attribute titles like so:

Location ID: 110611
Description: Yorktown Shops 
Facility Status: Operating
Asset Code: 7100

Because there's 20+ attributes that will be displayed, I don't want to use HTML codes in a text box and create 20+ expressions. I'm also producing it for someone else to copy and paste the code, so I can't just make it in Pro. 

I tried to use the following that I saw in another post, but it kept thinking it was a dictionary and it made a table, with the bold tags displaying as text. Any ideas?

var Location = $feature.LOCATION;
var Description = $feature.DESCRIPTION;
var Facility_Status= Proper($feature.STATUS);
var Asset_Code = $feature.ASSET_CODE;


return {
  type : "text",
  text : `<b>Location ID:</b> ${Location}`
}

[jcarlson · Accepted solution]

This seems to work just fine over here.

You could try using inline style tags, see if that works? I like using <style> anyway, because you can modify the text a lot more.

If you want to keep the code concise, and you're just making certain text bold, you could try a custom function, too. Maybe overkill just for bolding the text, but if you are doing something with a lot of custom style tagging, it's helpful to put the styling in a function or a variable so that you can adjust everything all at once.

function makeItBold(label, attribute){
  return `<span style="font-weight:bold">${label}</span>: ${attribute}`
}

return {
  type: 'text',
  text: `${makeItBold('Location ID', $feature['LOCATION'])}<br>
${makeItBold('Description', $feature['DESCRIPTION'])}`
}

[JennHat]

Thanks! Turns out, I was putting it in the wrong spot-- I was using the Attribute Expressions instead of just adding Arcade code as content to the pop up. It worked once I did that. Thanks for providing options!