hypertrons-crx icon indicating copy to clipboard operation
hypertrons-crx copied to clipboard

[Refactor] Beautify the OSS-GPT interface style

Open Xsy41 opened this issue 1 year ago • 2 comments

Description

At present, there are plans to beautify the interface of OSS-GPT, and the following specific beautification proposals are proposed. We also welcome your comments.

  1. The font size of the page at the beginning of GPT is different from that of the page after GPT. Just entered the page found that the font is a little large, and then the font becomes smaller.

  2. Make the distinction of the bubble box more obvious, such as the color of the bubble box is gray for the question, and the color of the answer is black.

  3. The Q&A interface feels that the questioner's profile picture can be removed. Because the profile picture is a little slow to load, there is no questioner profile picture, can make the page more information? image

  4. Change the background color of the answer output code to the same color as the page.

  5. The OSS-GPT on the top can be made smaller because there are too many black edges to show more information.

  6. Can the background be made transparent? You can let some light in, blur the background, but it may not be as beautiful as it is now, so try it first.

  7. This return to the bottom button is a little simple, or put a button directly, a downward icon appears more intuitive. image

  8. Put both model switching and clearing the current session on OSS-GPT.

  9. When there are words in the input field, make a small animation and turn this arrow up. image

  10. Make the OSS-GPT interface more flexible, freely drag, zoom in and out on the page.

Xsy41 avatar Sep 30 '24 13:09 Xsy41

Previously, I uploaded a demo without detailed design for both font and page styles. My suggestion is that you first take a look at the current implementation code and the components used. Tracing back to the open-source components used, the functionality and callbacks of some components, and the difficulty level of your redevelopment. Draw an understanding and judgment.

wangyantong2000 avatar Sep 30 '24 13:09 wangyantong2000

My suggestion is that you first take a look at the current implementation code and the components used. Tracing back to the open-source components used, the functionality and callbacks of some components, and the difficulty level of your redevelopment. Draw an understanding and judgment.

Thanks for the heads-up. Okay, I'll check it out.

Xsy41 avatar Sep 30 '24 13:09 Xsy41