diff --git a/packages/feedback/src/constants.ts b/packages/feedback/src/constants.ts index 42129ae79838..4a74dc5064a8 100644 --- a/packages/feedback/src/constants.ts +++ b/packages/feedback/src/constants.ts @@ -16,7 +16,7 @@ const LIGHT_THEME = { backgroundHover: '#f6f6f7', foreground: '#2b2233', border: '1.5px solid rgba(41, 35, 47, 0.13)', - borderRadius: '12px', + borderRadius: '25px', boxShadow: '0px 4px 24px 0px rgba(43, 34, 51, 0.12)', success: '#268d75', diff --git a/packages/feedback/src/widget/Actor.css.ts b/packages/feedback/src/widget/Actor.css.ts index 1ac264d7e07f..4455b0c5c912 100644 --- a/packages/feedback/src/widget/Actor.css.ts +++ b/packages/feedback/src/widget/Actor.css.ts @@ -5,7 +5,14 @@ export function createActorStyles(d: Document): HTMLStyleElement { const style = d.createElement('style'); style.textContent = ` .widget__actor { - line-height: 25px; + position: fixed; + left: var(--left); + right: var(--right); + bottom: var(--bottom); + top: var(--top); + z-index: var(--z-index); + + line-height: 16px; display: flex; align-items: center; @@ -16,7 +23,7 @@ export function createActorStyles(d: Document): HTMLStyleElement { font-family: inherit; font-size: var(--font-size); font-weight: 600; - padding: 12px 16px; + padding: 16px; text-decoration: none; z-index: 9000; @@ -46,6 +53,12 @@ export function createActorStyles(d: Document): HTMLStyleElement { .widget__actor__text { } +@media (max-width: 600px) { + .widget__actor__text { + display: none; + } +} + .feedback-icon path { fill: var(--foreground); }