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: [M3-7298] - Improve Footer Styles #9823

Merged

Conversation

bnussman-akamai
Copy link
Member

@bnussman-akamai bnussman-akamai commented Oct 20, 2023

Description 📝

  • Cleans up and fixes our Footer styles 🎨

Changes 🔄

  • Fixes footer for xs viewports
  • Uses less Grid
  • Cleans up unnecessarily complex styles
  • Added nice animation

Preview 📷

Before After
Screenshot 2023-10-20 at 12 37 54 PM Screenshot 2023-10-20 at 12 37 47 PM
Screenshot 2023-10-20 at 12 37 33 PM Screenshot 2023-10-20 at 12 37 20 PM

New Animation ✨

Screen.Recording.2023-10-20.at.12.43.36.PM.mov

How to test 🧪

Reproduction steps

  • On mobile viewport sizes, the Cloud Manager version was spaced differently than the other links ⁉️

Verification steps

  • Check out this PR
  • Verify that the footer looks better on mobile viewport sizes
  • Verify that the footer looks nearly identical to production on other screen sizes

As an Author I have considered 🤔

  • 👀 Doing a self review
  • ❔ Our contribution guidelines
  • 🤏 Splitting feature into small PRs
  • ➕ Adding a changeset
  • 🧪 Providing/Improving test coverage
  • 🔐 Removing all sensitive information from the code and PR description
  • 🚩 Using a feature flag to protect the release
  • 👣 Providing comprehensive reproduction steps
  • 📑 Providing or updating our documentation
  • 🕛 Scheduling a pair reviewing session
  • 📱 Providing mobile support
  • ♿ Providing accessibility support

@bnussman-akamai bnussman-akamai added Bug Fixes for regressions or bugs UX/UI Changes for UI/UX to review labels Oct 20, 2023
@bnussman-akamai bnussman-akamai self-assigned this Oct 20, 2023
@bnussman-akamai bnussman-akamai requested a review from a team as a code owner October 20, 2023 16:47
@bnussman-akamai bnussman-akamai requested review from dwiley-akamai and cliu-akamai and removed request for a team October 20, 2023 16:47
Copy link
Contributor

@jaalah-akamai jaalah-akamai left a comment

Choose a reason for hiding this comment

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

🧼 🧹

@bnussman-akamai bnussman-akamai added the Add'tl Approval Needed Waiting on another approval! label Oct 20, 2023
Copy link
Contributor

@dwiley-akamai dwiley-akamai left a comment

Choose a reason for hiding this comment

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

Nice improvement 👍

Version link still works ✅
Animation looks good ✅
Mobile view ✅

desktopMenuIsOpen: boolean;
}

const FEEDBACK_LINK = 'https://www.linode.com/feedback/';
Copy link
Contributor

Choose a reason for hiding this comment

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

Maybe we should move this to src/constants? Seems there's precedent there since the link for the Community site is in there too

Copy link
Contributor

Choose a reason for hiding this comment

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

seconded!

@bnussman-akamai bnussman-akamai added Approved Multiple approvals and ready to merge! and removed Add'tl Approval Needed Waiting on another approval! labels Oct 23, 2023
const StackScripts = React.lazy(() => import('src/features/StackScripts/StackScripts'));
const StackScripts = React.lazy(
() => import('src/features/StackScripts/StackScripts')
);
Copy link
Contributor

Choose a reason for hiding this comment

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

I've seen this one before 🤣

desktopMenuIsOpen: boolean;
}

const FEEDBACK_LINK = 'https://www.linode.com/feedback/';
Copy link
Contributor

Choose a reason for hiding this comment

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

seconded!

xs: 2,
},
paddingY: theme.spacing(2.5),
transition: 'all .1s linear', // match the sidebar transition speed
Copy link
Contributor

Choose a reason for hiding this comment

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

transition: 'all' can be expensive an unnecessary. Just transition the property you're interested in

Copy link
Member Author

Choose a reason for hiding this comment

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

Neat. I didn't know this! Thank you!

@bnussman-akamai bnussman-akamai merged commit cc8a9af into linode:develop Oct 23, 2023
11 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Approved Multiple approvals and ready to merge! Bug Fixes for regressions or bugs UX/UI Changes for UI/UX to review
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants