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.

Sign up for GitHub

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

Jump to bottom

Datepicker selectable header 1.5rem on line-height while font is 1rem #1166

Open
3 tasks done
omniith opened this issue Feb 23, 2025 · 2 comments
Open
3 tasks done

Datepicker selectable header 1.5rem on line-height while font is 1rem #1166

omniith opened this issue Feb 23, 2025 · 2 comments
Assignees
@joshhanley

Comments

@omniith
Copy link

omniith commented Feb 23, 2025

Flux version

v2.02

Livewire version

v3.5.20

Tailwind version

v4.0.7

Browser and Operating System

macOS chrome

What is the problem?

Datepicker selectable header has a 1.5rem while font is 1rem, causing the text to be cut off half way.

Code snippets

<!DOCTYPE html>
<html x-init="$flux.appearance = 'light|dark|system'" lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>{{ $title ?? 'App' }}</title>
    
    @vite(['resources/css/app.css', 'resources/js/app.js'])
    @fluxAppearance
</head>
<body class="min-h-screen bg-gray-100 dark:bg-gray-800 antialiased">
    <flux:date-picker selectable-header />
    {{ $slot }}
    @persist('toast')
        <flux:toast />
    @endpersist
    @fluxScripts
</body>
</html>

How do you expect it to work?

Line rem should be same with font rem so the text does not get cut, I understand there is a whole lot of css wizardry ongoing, I'm also not the CSS pro. Pardon me if this is genuinely a newbie mistake.

Please confirm (incomplete submissions will not be addressed)

  • I have provided easy and step-by-step instructions to reproduce the bug.
  • I have provided code samples as text and NOT images.
  • I understand my bug report will be closed if I haven't met the criteria above.
@joshhanley
Copy link
Member

@omniith thanks for reporting! We were looking at this in Discord yesterday, here is a screenshot of the issue.

Image

@joshhanley
Copy link
Member

@omniith worked out that it was Tailwind forms changing the styles of the selects. I've submitted a PR with a fix.

@joshhanley joshhanley self-assigned this Feb 24, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@joshhanley joshhanley

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@joshhanley @omniith