question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Implement redesigned Footer

See original GitHub issue

Feature

Why is this feature being added?

✨ There’s a new design coming to OperationCode.org and we have to implement it ✨

What should your feature do?

  • Please use the <Button> component as is. We’ll redesign it later.

  • Please use a simple unconnected input for the newsletter form. We’ll implement it later.

  • On tablet (below 769px screen width), content should shape vertically in this order:

    • Logo and social media icons
    • 4 columns of links
    • Newsletter form
    • Copyright + Legal links
  • On mobile (below 577px screen width), content should shape vertically in this order:

    • Logo and social media icons
    • 2 columns of links
    • 2 columns of links
    • Newsletter form
    • Copyright + Legal links

Mock

screen shot 2018-10-09 at 5 42 28 pm

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:6 (6 by maintainers)

github_iconTop GitHub Comments

1reaction
angtlincommented, Oct 14, 2018

Got it. Adding “Copyright 2018 Operation Code™. Operation Code is a 501©(3) nonprofit, EIN 47-4247572.” instead of the “2018 Operation Code”. Since this is kind of long, it might be placed on its own separate line (vs the mockup design where it’s on the same line as the legal links).

1reaction
chrismgonzalezcommented, Oct 10, 2018

This is exciting! I’m looking forward to contributing to other newly mocked pages.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Footer Design – Best Practices Together with 6 Examples
Zorro Design – Agency Footer Design. Agencies generally use their websites for two purposes: Showcase their work; Generate new leads. US-based ...
Read more >
Website Footer Design Best Practices: 27 Things to Put at the ...
Website footer design is about choosing what to include, with the intention of helping visitors. Here are 27 website footer design best practices...
Read more >
Web Page Footers 101: Design Patterns and When to Use Each
Footers can be found at the bottom of almost every web page, and often take many forms, depending on the type of content...
Read more >
Website Footer Design Best Practices + 7 Real-world Examples
The truth is, your website footer is pretty important. People use them at a really high rate to get information they need quickly....
Read more >
Website Footer Design: 7 Best Practices to Follow | HostGator
The website footer is often overlooked, but it's an important piece ... a bunch of new internal links, so use the space you've...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found