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

CSS-Only Tooltip Component #278

Merged
merged 13 commits into from
Dec 5, 2024
Merged

CSS-Only Tooltip Component #278

merged 13 commits into from
Dec 5, 2024

Conversation

GODrums
Copy link
Collaborator

@GODrums GODrums commented Dec 2, 2024

Motivation

Closes #276.

Description

This PR introduces a new Tooltip-Component:

  • Uses hint.css (unminified, with animations + themes, ~8KB) with custom styling imitating Steam's tooltips
  • Inputs for the tooltip class (useful for hint.css's classes) and the rendered label text
  • Adds a first sample tooltip for a description of the floatbar:
    • Equivalent to the one on CSFloat including the float ranges
    • Works in inventory + market
    • Inventory: let the selectedItem-container overflow for the tooltip
  • Move the Floatbar-component in the /common/ui-folder

Screenshots

Example tooltip from Steam:
image
New Floatbar tooltip using the Tooltip-component (Inventory):
image2
New Floatbar tooltip using the Tooltip-component (Market):
image3

@GODrums GODrums added the feature label Dec 2, 2024
@GODrums GODrums requested a review from Step7750 December 2, 2024 03:12
@GODrums GODrums self-assigned this Dec 2, 2024
@GODrums GODrums linked an issue Dec 2, 2024 that may be closed by this pull request
@GODrums GODrums requested a review from Step7750 December 5, 2024 00:48
Copy link
Member

@Step7750 Step7750 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

@GODrums GODrums merged commit 749c4c6 into master Dec 5, 2024
2 checks passed
@GODrums GODrums deleted the add-tooltip-system branch December 5, 2024 01:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

Create Reusable Tooltip / Popover System
2 participants