2
0

🐛 Fix TextBubble 'Edit Link' background color in dark mode (#653)

TextBubble's "Edit link" card had a white background in dark mode,
making it impossible to read the content. I was studying React with your
project so I already took the opportunity to implement this small
correction for you lol.

Before:
![Captura de tela de 2023-07-27
21-34-09](https://github.com/baptisteArno/typebot.io/assets/48826783/09473f5e-635d-4e65-afdf-04230f05fd79)

After:
![Captura de tela de 2023-07-27
21-33-44](https://github.com/baptisteArno/typebot.io/assets/48826783/1971edae-b453-49eb-a01a-7e5fabc57c6b)

Note: I also added some direct links to project files cited in the
CONTRIBUTING.md file. They help to find these files more easily.
This commit is contained in:
Lucas Moraes
2023-07-31 02:30:45 -03:00
committed by GitHub
parent 3df81a3cb9
commit f8af76d347
2 changed files with 19 additions and 16 deletions

View File

@@ -103,12 +103,15 @@ const TextBubbleEditorContent = ({
'.slate-ToolbarButton-active': {
color: useColorModeValue('blue.500', 'blue.300') + ' !important',
},
'.PlateFloatingLink___StyledFloatingLinkInsertRoot-sc-1bralnd-8': {
'[class^="PlateFloatingLink___Styled"]': {
'--tw-bg-opacity': useColorModeValue('1', '.1') + '!important',
backgroundColor: useColorModeValue('white', 'gray.800'),
borderWidth: 1,
borderRadius: 'md',
transitionProperty: 'background-color',
transitionDuration: 'normal'
},
'.PlateFloatingLink___StyledDiv2-sc-1bralnd-2': {
backgroundColor: useColorModeValue('gray.200', 'gray.600'),
'[class^="FloatingVerticalDivider___"]': {
'--tw-bg-opacity': useColorModeValue('1', '.4') + '!important',
},
'.slate-a': {
color: useColorModeValue('blue.500', 'blue.300'),