[EuiDescriptionList] Update inline styles

[andreadelrio]

Summary

• Updated EuiDescriptionListTitle inline type styles by removing the border, increasing font weight, and adjusting the background color for better readibility.
• Before, the compressed version of the inline type in Amsterdam didn't have enough space between lines, and that's been fixed

Checklist

• Check against all themes for compatibility in both light and dark modes
• Checked in mobile
• Checked in Chrome, Safari, Edge, and Firefox
  - [ ] Props have proper autodocs and **[playground toggles](https://github.com/elastic/eui/blob/main/wiki/documentation-guidelines.md#adding-playground-toggles)**
  - [ ] Added documentation
  - [ ] Checked Code Sandbox works for any docs examples
• Added or updated jest and cypress tests
  - [ ] Checked for breaking changes and labeled appropriately
  - [ ] Checked for accessibility including keyboard-only and screenreader modes
• A changelog entry exists and is marked appropriately

[kibanamachine]

Preview documentation changes for this PR: https://eui.elastic.co/pr_5534/

[snide]

Don't tell my mom about my Quake 2 addiction being the reason for dropping out. This visually looks much cleaner and will help in Discover!

[cchaos]

🙌 This is already a marked improvement, thank you for initiating this!

I have a few suggestions, some very nit-picky code stuffs, and I found some old style issues that would be great to fix in this PR.

Suggestions

While this was so in the legacy theme, I think we can actually improve on the inline styles by keeping (not overriding) some of the inherent EuiBadge styles. For instance, the regular description list really enhances the title using bold, dark text like our typical titles. However, in the inline, it so much more subtle to find the differences between the title and description since the text display is exactly the same just with a very light background.

I suggest removing the overrides for font-weight, color, and possibly border (I think the extra space it adds helps space it out for better readability.

This way is still much more aligned visually with the non-inline version by keeping the boldness of the title text.

---

Old bugs

We should remove the following property:

eui/src/components/description_list/_description_list.scss

Line 204 in 82b14dd

word-break: break-all;

Because it causes unnecessary breaks in words like:

This was from very very long ago when EUI was KUI and before we had better ways to fix word-wrapping. If we think we need to enforce breaking words like this, instead of just deleting we could swap it out for the euiTextBreakWord mixin.

And on that note of word-wrapping, EuiBadge is set to truncate where the old version of the title would wrap. How do you think we want to handle this situation? Let it truncate or force wrapping?

[kibanamachine]

Preview documentation changes for this PR: https://eui.elastic.co/pr_5534/

[kibanamachine]

Preview documentation changes for this PR: https://eui.elastic.co/pr_5534/

[kibanamachine]

Preview documentation changes for this PR: https://eui.elastic.co/pr_5534/

[cchaos]

🙌 LGTM (with one more tiny suggestion on variable usage).

Sorry for the run around on how to resolve this one. This is definitely the simplest necessary approach. Thank you!

[cchaos]

One last suggestion that I just caught. This variable will work for both themes and result as 4px and 2px.

Suggested change

	border-radius: $euiBorderRadius / 2;
	border-radius: $euiBorderRadiusSmall;

[kibanamachine]

Preview documentation changes for this PR: https://eui.elastic.co/pr_5534/