Improve log modal styles, a11y, error message wording

[ironnysh]

What is this PR doing?

• Removes the tabs from log messages
• Adds a separation line between log messages
• Modifies the CORS log message (copy polishes)
• Replaces the title attribute with an aria-label (accessibility)

What problem is it solving?

• Remove the tabs from those and other log messages in Playground
• Add a grey line between log messages to make it easier to distinguish between different entries

See #1356

Fixes the inaccessible Search field.

How is the problem addressed?

• Updated the styles in the CSS file.
• Edited the error message in resources.ts
• Updated the component code in index.tsx

To-do

• Maybe add a slight red background for severity error

@bgrgicak, How are severity levels determined?

[bgrgicak]

Thank you! This looks much better.

[bgrgicak]

@bgrgicak, How are severity levels determined?

It's all stored as raw strings in the logger. We initially wanted to use objects, but because PHP logs were raw strings we decided to not parse PHP logs into our format and keep everything raw. Longterm it would be nice to use the OpenTelemetry standard.

The easiest way to get the severity level would be by using a regex to determine the level. A variation of this regex could work here.
Here is how the messages are constructed.

[ironnysh]

Thanks for the explanation and the references, @bgrgicak!

I've put together a much less sophisticated solution here :-) What do you think?

Feel free to reject it, of course

[bgrgicak]

Thank you for working on this @ironnysh!