eAPD icon indicating copy to clipboard operation
eAPD copied to clipboard

[Dev] Add tooltips on hover to grayed out buttons

Open mirano-darren opened this issue 2 years ago • 0 comments

Describe the task here and link or add dependencies to any applicable issues...

We are adding a tooltip on hover for grayed out buttons that appear throughout eAPD. This will give the user more information on why a button cannot be clicked. For example, subform save buttons are grayed out when there are still required fields left.

Original design ticket: https://app.zenhub.com/workspaces/cms-eapd-5a3823ad3659e94d8ee569be/issues/cmsgov/eapd/4216

Figma Links: MMIS Create a New APD Activity Schedule and Milestones HITECH Key State Personnel State Costs Outcomes Private Contractor Costs

Test Cases:

Given When Then
MMIS APD - Activity Schedule and Milestones page Save button is grayed out On hover, there should be a tooltip with the language: “All fields are required before saving”
HITECH APD - Key State Personnel page Save button is grayed out On hover, there should be a tooltip with the language: “All fields are required before saving”
HITECH APD - State staff subform Save button is grayed out On hover, there should be a tooltip with the language: “All fields are required before saving”
HITECH APD - Other state expenses subform Save button is grayed out On hover, there should be a tooltip with the language: “All fields are required before saving”
HITECH APD - Private Contractor subform Save button is grayed out On hover, there should be a tooltip with the language: “All fields are required before saving”
HITECH APD - Outcomes page Save button is grayed out On hover, there should be a tooltip with the language: “At least one outcome is required before saving”

This task is done when...

  • [ ] Added tooltip to Create New APD page
  • [ ] Added tooltip to the Save button on the Schedule form for MMIS APDs
  • [ ] Added tooltip to the Save button on the Milestones form for MMIS APDs
  • [ ] Added tooltip to the Save button on the Key State Personnel form for HITECH APDs
  • [ ] Added tooltip to the Save button on the State State form for HITECH APDs
  • [ ] Added tooltip to the Save button on the State Expense form for HITECH APDs
  • [ ] Added tooltip to the Save button on the Private Contractor form for HITECH APDs
  • [ ] Added tooltip to the Save button on the Outcome form for HITECH APDs

mirano-darren avatar Sep 07 '22 20:09 mirano-darren