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

Add current AFD links #1652

Merged
merged 8 commits into from
Aug 28, 2024
Merged

Add current AFD links #1652

merged 8 commits into from
Aug 28, 2024

Conversation

greg-does-weather
Copy link
Collaborator

What does this PR do? 🛠️

Adds a link to the current AFD on WFO info pages and point forecast pages.

@greg-does-weather
Copy link
Collaborator Author

@partly-igor The link on the forecast page is probably not styled properly at all, but I wasn't sure what to do with it. Can we chat about it tomorrow? For now it just shows above the daily forecast blocks, but I think it's supposed to have some kind of relationship with the weather story.

image

@partly-igor
Copy link
Collaborator

Yeah definitely, we can figure out how much styling to apply and if we want a temporary header here

@partly-igor
Copy link
Collaborator

@greg-does-weather I mocked up how the link can look on the current tab layout

Desktop
Without story
With Story

Mobile
Without Story
With Story

Let me know if anything is unclear, also happy to add the styling or pair.

@greg-does-weather
Copy link
Collaborator Author

@partly-igor I think I got it. I was struggling with how to get the weather story and AFD link not to be full-width at the mobile breakpoint, but then I realized I could ditch the grid layout for mobile and just toss some margin in there. It worked a treat!

Copy link
Collaborator

@partly-igor partly-igor left a comment

Choose a reason for hiding this comment

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

Small changes on the link itself, but otherwise looks great!

<use
xlink:href="/{{ directory }}/assets/images/uswds/sprite.svg#info_outline"
></use>
</svg><a href="/afd/{{ weather.grid.wfo }}">Current Area Forecast Discussion</a>
Copy link
Collaborator

Choose a reason for hiding this comment

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

Two small things on the link:

  1. We should add a "usa-link" class to the link so that it gets the right colors
  2. For this instance of the link text I used just "Area Forecast Discussion" without the word "Current". Noting because then it doesn't wrap on the smallest screens.

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

You know what's annoying about that second bullet? I did that, and I lost the change when I accidentally messed up something else and I guess I ctrl-z'ed too much.

@greg-does-weather greg-does-weather merged commit 2877dc8 into main Aug 28, 2024
17 checks passed
@greg-does-weather greg-does-weather deleted the mgwalker/afd-links-1568-1617 branch August 28, 2024 20:21
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.

Links to AFD pages Link the WFO page to the WFO's AFD page
2 participants