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

Feat: Adds outline jump nav #365

Draft
wants to merge 8 commits into
base: next
Choose a base branch
from
Draft

Feat: Adds outline jump nav #365

wants to merge 8 commits into from

Conversation

LeeMellon
Copy link

@LeeMellon LeeMellon commented Dec 14, 2022

Description

Adds lightly styled <outline-jump-nav> component.
Auto-detects target elements and auto-generates menu names based on ids that follow a specified pattern of slug--link-name. `Example:` outline-jump-nav--light-green

fixes (https://airtable.com/appZbFK7jD0OQGNPe/tblnC8l7Z28zh8qB3/viwBJz60xnVxdDw6J/recusmp08JFGUtBoa?blocks=hide)

Props:

  • slug (`string`) Required: ID prefix for required for targeted sections. Must end with `--`. Example: `outline-jump-nav--`
  • nav (`string`): ID or class name query selector of navigation or any kind of sticky element the jump nav may need to remain positioned below. Example: `.header-class`
  • hero (`string`): ID or class name query selector of hero or any scrolling element jump nav may need to remain below when scrolled into view. Example: `#hero-id`

Cursor_and_navigation-jumpnav--jump-nav-no-jumps

Mobile now becomes select dropdown.

Cursor_and_Navigation___JumpNav_-_Jump_Nav_⋅_Storybook

Type of change

  • New feature (non-breaking change which adds functionality)

How Has This Been Tested?

  • Visual Testing
  • Accessibility Testing

Checklist

  • My code follows the style guidelines of this project
  • I have performed a self-review of my own code
  • I have commented my code, particularly in hard-to-understand areas
  • My changes generate no new warnings

@changeset-bot
Copy link

changeset-bot bot commented Dec 14, 2022

⚠️ No Changeset found

Latest commit: efd2bc4

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@LeeMellon LeeMellon changed the title Feat/outline jump nav Feat: Adds outline jump nav Dec 14, 2022
@himerus himerus added For Review An issue awaiting classification. Codebase Update Needed Type: Component Suggestion Use this label for any issue that is a recommendation for a specific type of component. labels May 22, 2023
@netlify
Copy link

netlify bot commented May 22, 2023

Deploy Preview for outlinejs ready!

Name Link
🔨 Latest commit efd2bc4
🔍 Latest deploy log https://app.netlify.com/sites/outlinejs/deploys/646bb07631fbf000086fe474
😎 Deploy Preview https://deploy-preview-365--outlinejs.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 settings.

@glitchgirl glitchgirl marked this pull request as draft February 6, 2024 15:04
@himerus himerus added the Held for Review Held for review. Considered as a Draft/POC. label Feb 6, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
For Review An issue awaiting classification. Held for Review Held for review. Considered as a Draft/POC. Type: Component Suggestion Use this label for any issue that is a recommendation for a specific type of component.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants