Thanks to visit codestin.com
Credit goes to github.com

Skip to content

USWDS - Bug: Links styled as buttons break in forms #5066

@scottkellum

Description

@scottkellum

Describe the bug

This commit seems to break button styling in forms: 8b57c7b

Button and link styling seem to be working fine without this line. I’m not sure what bug it was meant to solve in the first place but maybe it doesn’t need to be there anymore? If it does need to be there, increasing the specificity of buttons will work by doubling the class on _usa-button.scss to .usa-button.usa-button. This is, of coarse, not very elegant. This is a specificity bug though.

Steps to reproduce the bug

Use the following code on a USWDS page:

<form class="usa-form">
	<a class="usa-button" href="#">This button text will be invisible</a>
	<input class="usa-button" type="submit" value="This text is visible" />
</form>

Expected Behavior

The text in the button should be visible

Related code

<form class="usa-form">
	<a class="usa-button" href="#test">This button text will be invisible</a>
	<input class="usa-button" type="submit" value="This text is visible" />
</form>

Screenshots

Screenshot 2022-12-09 at 4 16 06 PM

System setup

  • USWDS 3.3.0
  • Mac Mini M1
  • Mac OS 13.0.1
  • Chromium based browser (Arc 0.80.0)

Additional context

No response

Code of Conduct

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

Status

Done

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions