[APM] DT Span flyout design fixes

[jasonrhodes]

Clicking on a span in the waterfall timeline view should open a flyout with that span's details. This flyout currently exists but needs some work to clean up.

• Use EUI for headers;
• Fix margin for sticky properties;
• Move Discover button and change copy (should it also change style?)
• Add separator lines above and below sticky props
• Add service and transaction name (including links)

Copy fixes:

• “Stacktraces” -> “Stack traces”
• “DB Statement” -> “Database statement”

InVision prototype

Note: This ticket continues work from #22763

[elasticmachine]

Pinging @elastic/apm-ui

[jasonrhodes]

@formgeist if you can pull up the apm/dt branch, it would be nice if you could outline specifics of what if anything needs to be addressed for design clean up in the following places:

• here in the span flyout
• in the transaction flyout
• on the transaction group page in the sample section

If it makes sense we can just change the title of this issue to include all of those and knock them all out at once or if they are small enough, inside of another ticket. If folks think we need multiple issues for this work, that's fine too, just don't want the other places to get lost.

[sorenlouv]

I've updated the outstanding tasks for this issue, and will start working on them.

@jasonrhodes It probably makes sense for you to do the same for the transaction flyout on https://zube.io/elastic/apm/c/38913

[sorenlouv]

@formgeist Let me know if you have any additions to the above tasks.

[formgeist]

@jasonrhodes The list looks fine, I think the most important stuff is getting the service and transaction name displayed with links so you can navigate between your APM services etc. That makes the navigation path easier for the user. In regards to style polish let's leave that for later. I'll do a redline run through when we're a bit closer to catch them all, and then we can see how much we implement before FF.