search

ZORALab / Hestia

One Peaceful Frontend+Backend Software Library Suite.
https://hestia.zoralab.com
Other
19 stars 1 forks source link

Style the Debug Console for a Friendlier User Experience #77

Closed corygalyna closed 1 year ago

corygalyna commented 1 year ago

Description

Please provide a short description of what feature you're looking forward to
enhance below. Please include the story behind your idea as well to give a
better visualization of your idea.

The Hestia Debug Console in hestiaHUGO is left untouched and presented in the ugliest possible manner of all things. Please style it so that it makes content development experience a lot less painful and easier to use.

Expected Behavior

Please specify the expected behavior of your requested enhancement. Some great
and helpful pointers are your expected interface (e.g. command patterns,
simple sketches of the user interface, etc).

The Debug Console is no longer harassing the body layout. User does not need to inspect and delete the Debug Console every single time.

Current Behavior

Please specify the current behavior (e.g. workaround, blockage, etc).

The Debug Console is harassing the output body layout. User has to manually inspect the page and remove the console every single time.

Like this is bad for a blank page:

06-check-rendered-website-400x460

Attachment

Please drag and drop the necessary data files (e.g. screenshot, logs, etc)
below.
hollowaykeanho commented 1 year ago

Completed redesigning the interface with dialog here: dc0cb958b76ef792bd27bf3aad4405f084387d33

hollowaykeanho commented 1 year ago

On the page, a button is available at the bottom right: 2023-05-03-16-54-54

Clicking on it shall display a dialog: 2023-05-03-16-54-29

corygalyna commented 1 year ago

Much better. Approved. Please proceed to develop the contents and we can close the case.

hollowaykeanho commented 1 year ago

Thumbnails renderer redesigned at 5d65498e99320ef9abe5a1bfd3b17628045dea02

2023-05-03-19-51-37

hollowaykeanho commented 1 year ago

Re-styled data debugger console at commit: 5d65498e99320ef9abe5a1bfd3b17628045dea02

2023-05-04-06-44-07

corygalyna commented 1 year ago

100% approved. Marked as completed. No further engineering efforts for this task.

hollowaykeanho commented 1 year ago

Transformed the entire thing into a styling resistant component and facilitated a config field for setting any debugger type (default to zoralab version) in commit dbc388965b4dd0c7622fc558c037d63168216dc2.

Existing solution crushed Google Chrome's tab's memory with overloading inline CSS codes and makes view-source completely unusable.

hollowaykeanho commented 1 year ago

Released in version v.1.2.0.