Skip to content

Refactor button styles#2878

Open
TomWoodward wants to merge 4 commits into
mainfrom
refactor-button-styles
Open

Refactor button styles#2878
TomWoodward wants to merge 4 commits into
mainfrom
refactor-button-styles

Conversation

@TomWoodward
Copy link
Copy Markdown
Member

removes global .btn,button styles and re-applies them locally where necessary, also keeps them in any raw cms content.

pushes common focus indicator styling down to the pattern-library, and bumps the underlying flex-page-renderer pattern library so everything is all consistent

the global .btn,button styles were not actually the same as the button macro ones, i preferred the pattern-library styles and removed the divergent ones so everything is aligned

pattern library pr is openstax/pattern-library#77, this is included here already

Comment thread src/app/pages/research/research.scss Outdated
@TomWoodward TomWoodward requested a review from RoyEJohnson May 29, 2026 20:14
Copy link
Copy Markdown
Contributor

@RoyEJohnson RoyEJohnson left a comment

Choose a reason for hiding this comment

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

There are two places where I noticed design changes.

.put-away {
@include body-font(3.6rem);
@include button-reset();

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

The next two lines can be removed, as they're redundant with button-reset now, right?


button {
@include button-reset();

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

again the next two lines could be removed

// CTA buttons are large and uppercased.
.btn {
padding: 1.5rem 2rem;
text-transform: uppercase;
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

The "Let us know" button was previously not uppercase. Is this a design change or the Assignable page?

padding: 0.5rem 0 0.5rem 1rem;
}

button {
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

These (/ally-logos, the copy buttons) lost padding and foreground/background color.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants