Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TimelineContent is not taking theme styles when being in vertical mode #1196

Closed
2 tasks done
trocoli96 opened this issue Dec 21, 2023 · 3 comments
Closed
2 tasks done
Labels
🐛 bug Something isn't working confirmed This bug was confirmed good first issue Good for newcomers
Milestone

Comments

@trocoli96
Copy link

trocoli96 commented Dec 21, 2023

  • I have searched the Issues to see if this bug has already been reported
  • I have tested the latest version

Steps to reproduce

  1. Use the Timeline.Content component and configuring the theme to change the styling
  2. The style is applied only when horizontal prop is "true"

Current behavior

Currently, the Timeline.Content component, when passing the styles from the theme, is not taking properly the styles because they are only applied in horizontal.
image

Example:
This is an example of the same theme used on horizontal and in vertical

This is my theme object
image

Horizontal:
image

Vertical:
Captura de pantalla 2023-12-21 a las 17 09 45

As you can see, the border from the box is only applied when horizontal prop is true

Expected behavior

Both horizontal and vertical options apply the root base from content

Context

Right now, when using the Timeline component, you can add a child which is Timeline.Content which is basically the content inside each item, but this is only letting change the style when using it in horizontal.

@trocoli96 trocoli96 changed the title TimelineContent is not taking properly styles TimelineContent is not taking theme styles when being in vertical mode Dec 21, 2023
@victorfunes
Copy link

victorfunes commented Dec 21, 2023

Just to add information: we are using the to setup default theme for all our application and not setting the theme in the component itself.

@tulup-conner tulup-conner added 🐛 bug Something isn't working confirmed This bug was confirmed labels Jan 1, 2024
@tulup-conner tulup-conner added this to the 1.0.0 milestone Jan 1, 2024
@tulup-conner
Copy link
Collaborator

Thank you, that makes sense.

If anyone has time, we need to always include base theme in <Timeline> and add new props to the theme outside base called horizontal->on/off, or maybe just horizontal/vertical. Pull out the CSS from base that changes the orientation between the two.

@tulup-conner tulup-conner added the good first issue Good for newcomers label Jan 1, 2024
revuwem added a commit to revuwem/flowbite-react that referenced this issue Jan 9, 2024
make root.base independent from component orientation, introduce orientation-specific classes

fix themesberg#1196
@revuwem revuwem mentioned this issue Jan 9, 2024
1 task
SutuSebastian pushed a commit to revuwem/flowbite-react that referenced this issue Feb 5, 2024
make root.base independent from component orientation, introduce orientation-specific classes

fix themesberg#1196
@SutuSebastian
Copy link
Collaborator

Fixed in flowbite-react@0.10.0 release.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🐛 bug Something isn't working confirmed This bug was confirmed good first issue Good for newcomers
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants