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

Proof-of-concept: desktop navbar #260

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open

Conversation

angela-tran
Copy link
Member

@angela-tran angela-tran commented Mar 31, 2025

What this PR does

This is just a rough proof-of-concept for #200. We don't have to stick with anything in this PR; it's simply meant to spark conversation on:

  • what design / styling we want
  • code implementation.

Code

The approach here is to set d-lg-none on the existing modal so that it is not used on large screens. And then a different div is used to simply show the navbar links for large screens.

I referenced the second example in Bootstrap's "Navbar > Responsive behaviors > Toggler" docs.

The example had some code to style the link corresponding to the current page, so I incorporated that too.

Design

For styling, we're just getting whatever Bootstrap gives us. I imagine there might be some opinions about the font. Ultimately, it's up to product/design on that.

Preview

See the preview site for a more complete preview. Here are some screenshots too:

Home page with desktop navbar

Our Work page with desktop navbar

@angela-tran angela-tran self-assigned this Mar 31, 2025
@angela-tran angela-tran requested a review from a team as a code owner March 31, 2025 23:19
Copy link

netlify bot commented Mar 31, 2025

Deploy Preview for compilerla ready!

Name Link
🔨 Latest commit 1e3d49f
🔍 Latest deploy log https://app.netlify.com/sites/compilerla/deploys/67eb22f94e196e0008149600
😎 Deploy Preview https://deploy-preview-260--compilerla.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

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.

1 participant