Add Styling to popup - Githubissues

deepgram-devs / dg-translation-chrome-ext

A TypeScript chrome extension that uses Deepgram to provide live transcription and translation

MIT License

9 stars 8 forks source link

Closed BekahHW closed 1 year ago

BekahHW commented 1 year ago

In popup.html, add a style element inside the head section.

Create a wider body for the popup.
Set the width of the buttons and display them in the same row. (In total, we'll have four buttons: start, stop, clear, and translate)
Add style to the paragraph element where the transcript appears. Consider line-height, text size, and padding.

For more information and an example, check out the "Internal CSS" section of "CSS How To" from W3 schools.

rmirville commented 1 year ago

I'd like to tackle this issue! Can you assign it to me?

BekahHW commented 1 year ago

It's all you, @rmirville! Let me know if you need any help.

rmirville commented 1 year ago

@BekahHW I have a couple questions:

Do you want the PR to include adding the clear and translate buttons?
Does the button-name attribute on Start need to be added to the other buttons, too? https://github.com/deepgram-devs/dg-translation-chrome-ext/blob/c3b33c38f5f0d30ba02d394fe10156badabda1be/src/popup.html#L10

BekahHW commented 1 year ago