Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Improve log modal #1356

Open
bgrgicak opened this issue May 2, 2024 · 2 comments
Open

Improve log modal #1356

bgrgicak opened this issue May 2, 2024 · 2 comments
Assignees
@ironnysh
Labels
[Aspect] Browser [Package][@php-wasm] Logger
Milestone
User Experience

Comments

@bgrgicak
Copy link
Collaborator

bgrgicak commented May 2, 2024 •
edited

Let's:

  • 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
  • Maybe add a slight red background for severity error

#1319 (comment)
@bgrgicak bgrgicak self-assigned this May 2, 2024
@bgrgicak bgrgicak added this to the User Experience milestone May 2, 2024
@bgrgicak bgrgicak mentioned this issue May 2, 2024
Merged
@ironnysh
Copy link
Collaborator

ironnysh commented May 5, 2024 •
edited

Hi @bgrgicak, I have a semi-related question about this to-do: why not use native browser APIs and HTML elements for these components (modals and popups)?

Both the <dialog> element and the <popover> element are defined as Baseline (have cross-browser support) and offer a lot of functionality "for free".

@bgrgicak
Copy link
Collaborator Author

bgrgicak commented May 6, 2024

why not use native browser APIs and HTML elements for these components (modals and popups)?

Good point. I ended up reusing an existing modal that we had in the components folder and haven't even considered using these native HTML elements.

@ironnysh ironnysh mentioned this issue May 8, 2024
Merged
@bgrgicak bgrgicak assigned ironnysh and unassigned bgrgicak May 9, 2024
bgrgicak added a commit that referenced this issue May 16, 2024
@ironnysh @bgrgicak
Improve log modal styles, a11y, error message wording (#1369)
d72387c 
## 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?

> - [x] Remove the tabs from those and other log messages in Playground
> - [x] 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?

---------

Co-authored-by: Bero <berislav.grgicak@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@ironnysh ironnysh

Labels
[Aspect] Browser [Package][@php-wasm] Logger
Projects
Playground Project board
Status: No status
Milestone
User Experience
Development

No branches or pull requests
2 participants
@bgrgicak @ironnysh