WIP

[Sak1012]

Fixes #1365, #1364

Summary by Sourcery

Improve color picker UX and locale switching UI while ensuring CSS regeneration tasks run only after successful transactions commit.

New Features:

• Add inline color preview and contrast feedback for color picker fields in the organizer control interface.
• Replace language link list with a dropdown-based locale switcher in the presale event header and login box.

Bug Fixes:

• Prevent contrast ratio calculation in the color picker from using a constant ratio value that could not be updated.

Enhancements:

• Refine styles for locale switch dropdowns to maintain readability against themed backgrounds and in header contexts.
• Adjust color picker layout and styling, including RTL support, to better integrate previews with form controls.
• Ensure CSS regeneration tasks for events and organizers are scheduled on transaction commit instead of immediately.

[sourcery-ai]

Reviewer's Guide

Refactors color picker handling to add a visible color preview and more robust contrast messaging, introduces a styled locale switch dropdown in the presale header, tweaks styles to keep dropdown items legible, and defers CSS regeneration tasks until after DB transactions commit for events and organizers.

Sequence diagram for enhanced color picker preview and contrast update

sequenceDiagram
    actor User
    participant Browser
    participant ColorInput as Colorpickerfield_input
    participant PreviewHelper as updateColorPreview
    participant ContrastHelper as updateContrastState

    User->>Browser: Type/select color
    Browser->>ColorInput: input/changeColor/create event

    rect rgb(245,245,245)
        note over ColorInput: Ensure preview wrapper exists
        ColorInput->>PreviewHelper: updateColorPreview(input, colorString)
        PreviewHelper->>PreviewHelper: ensureColorPreview(input)
        PreviewHelper->>ColorInput: Update preview element and host
    end

    alt changeColor or create from plugin
        ColorInput->>ContrastHelper: updateContrastState(input, rgb)
        ContrastHelper->>ContrastHelper: getColorFieldHost(input)
        ContrastHelper->>ContrastHelper: Compute contrast(rgb, white)
        ContrastHelper->>ColorInput: Update .contrast-state message and classes
    else plain input event
        ColorInput->>PreviewHelper: updateColorPreview(input)
        PreviewHelper-->>ColorInput: Preview updated only
    end

Loading

Sequence diagram for deferred CSS regeneration after settings save

sequenceDiagram
    actor User
    participant View as DjangoView_form_valid
    participant DB as DatabaseTransaction
    participant Hook as transaction_on_commit
    participant Task as CeleryTask_regenerate_css

    User->>View: Submit settings form
    View->>DB: Save settings

    alt CSS-affecting settings changed
        View->>Hook: on_commit(callback to regenerate_css.apply)
        Hook-->>View: Callback registered
    else No CSS changes
        View-->>User: Redirect with success (no task)
    end

    DB-->>Hook: Transaction committed
    Hook->>Task: regenerate_css.apply(event_pk)
    Task-->>View: Task enqueued for worker
    View-->>User: Redirect with success

Loading

File-Level Changes

Change	Details	Files
Enhance color picker UX with a preview swatch and more robust contrast state handling, including RTL support.	Introduce helper functions to locate the color field host, ensure a preview wrapper/span exists, and update the preview and contrast note based on the current color value. Initialize all colorpicker fields by rendering their preview state and update both preview and contrast state on colorpicker plugin events. Add input event handling so manual typing in color fields updates the preview immediately. Add SCSS for the color preview container and swatch, including an empty-state checkerboard pattern, and adjust border radii and flex layout for LTR and RTL directions.	app/eventyay/static/pretixcontrol/js/ui/main.js app/eventyay/static/pretixcontrol/scss/_forms.scss app/eventyay/static/pretixcontrol/scss/_rtl.scss app/eventyay/static/orga/js/colorpicker.js
Replace language link list with a themed locale dropdown switcher in presale templates and ensure styling keeps items readable against themed headers.	Replace the header language links with a Bootstrap dropdown that shows the current language and lists all locales, marking the active one. Replace the loginbox language links with a dropdown skeleton structure intended to be wired similarly, conditioned on theme/background settings. Add SCSS rules to style the locale switch trigger and dropdown menu, including active/hover states, and adjust header link selectors so dropdown items are not forced white. Tidy presale main SCSS and add a comment to clarify readability intent for locale dropdown items.	app/eventyay/presale/templates/pretixpresale/event/base.html app/eventyay/static/pretixpresale/scss/_theme.scss app/eventyay/static/pretixpresale/scss/custom.scss app/eventyay/static/pretixpresale/scss/main.scss
Ensure CSS regeneration tasks for events and organizers run only after successful database transaction commit instead of immediately via async calls.	Wrap event CSS regeneration task invocation in transaction.on_commit so it runs after the event settings transaction is committed. Wrap organizer CSS regeneration task invocation in transaction.on_commit so it runs after organizer settings are committed. Update the common event view to schedule CSS regeneration on transaction commit when relevant settings change.	app/eventyay/control/views/event.py app/eventyay/control/views/organizer_views/organizer_view.py app/eventyay/eventyay_common/views/event.py

---

Tips and commands

Interacting with Sourcery

• Trigger a new review: Comment @sourcery-ai review on the pull request.
• Continue discussions: Reply directly to Sourcery's review comments.
• Generate a GitHub issue from a review comment: Ask Sourcery to create an
  issue from a review comment by replying to it. You can also reply to a
  review comment with @sourcery-ai issue to create an issue from it.
• Generate a pull request title: Write @sourcery-ai anywhere in the pull
  request title to generate a title at any time. You can also comment
  @sourcery-ai title on the pull request to (re-)generate the title at any time.
• Generate a pull request summary: Write @sourcery-ai summary anywhere in
  the pull request body to generate a PR summary at any time exactly where you
  want it. You can also comment @sourcery-ai summary on the pull request to
  (re-)generate the summary at any time.
• Generate reviewer's guide: Comment @sourcery-ai guide on the pull
  request to (re-)generate the reviewer's guide at any time.
• Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
  pull request to resolve all Sourcery comments. Useful if you've already
  addressed all the comments and don't want to see them anymore.
• Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
  request to dismiss all existing Sourcery reviews. Especially useful if you
  want to start fresh with a new review - don't forget to comment
  @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

• Enable or disable review features such as the Sourcery-generated pull request
  summary, the reviewer's guide, and others.
• Change the review language.
• Add, remove or edit custom review instructions.
• Adjust other review settings.

Getting Help

• Contact our support team for questions or feedback.
• Visit our documentation for detailed guides and information.
• Keep in touch with the Sourcery team by following us on X/Twitter, LinkedIn or GitHub.