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

Fix footer styling. Addresses #1777 #1778

Merged
merged 1 commit into from Apr 2, 2024
Merged

Conversation

vnbaaij
Copy link
Collaborator

@vnbaaij vnbaaij commented Apr 2, 2024

Footer styling comes with a bad design decission made in the past. It uses a display: grid; together with flex-direction: column; which does not make any sense.

We are even overriding it in the demo site ourselves:
image

With this change we will change it to more sane defaults. Technically it might be considered a breaking change (albeit a small one for sure) but it be will changed in the next release to:

.footer {
    display: flex;
    z-index: 10;
    flex-direction: row;
    font-family: var(--body-font);
    font-weight: normal;
    font-size: var(--type-ramp-minus-1-font-size);
    line-height: var(--type-ramp-minus-1-line-height);
}

For the templates this means that a FluentSpacer is added to the footer so the texts will still align left an right. It also allows to remove some then redundant CSS for those links from the app.css (both Web App and WebAssembly templates

@vnbaaij vnbaaij merged commit df0a5d0 into dev Apr 2, 2024
3 checks passed
@vnbaaij vnbaaij deleted the users/vnbaaij/footer-styling branch April 2, 2024 08:57
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.

None yet

2 participants