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

Dynamic guide layout and hero #3836

Open
wants to merge 10 commits into
base: feature-IGUK-839-dynamic-guide
Choose a base branch
from

Conversation

peterhudec
Copy link
Contributor

@peterhudec peterhudec commented Feb 21, 2025

What

Implements the responsive layout and the hero section for the EYB dynamic guide page to be later filled with other markup. Note that:

  • I have used CSS grid for the layout as the GDS grid is not fit for this purpose: it's not designed for gaps between rows and columns and it is impossible to position and scale the region-map to fit into the available space as it's still based on float with clearfix.
  • I added a new constant for the ubiquitous value of 1025px hardcoded in many media queries to styles/sizes/sizes.scss but I couldn't figure out the meaning of that size so I temporarily named it $donknowhowtonameit-size hoping that reviewers of this PR will come with some meeningfull name suggestions
  • I added new SVG files, one for each the UK regions. We can however most likely only use a single SVG and highlight concrete regions with CSS, but that's out of the scope of this PR.
  • The sections in left and right panels below the top panel have zero padding as they will need to accomodate content with bleeding horizontal lines

How to test

  1. Navigate to /international/expand-your-business-in-the-uk/guide/?dynamic
  2. The layout and the top panel should look as designed here

Screenshot

IGUK-840-841.mov

Workflow

Reviewing help

  • Explains how to test locally, including how to set up appropriate data
  • Includes screenshot(s) - ideally before and after, but at least after
  • Documentation has been updated as necessary
  • Where a PR contains code changes developed or maintained by multiple squads a representative from those squads should review the PR.

Housekeeping

  • Added all new environment variables to Vault.
  • Cleaned up old feature flags
  • Upgraded any vulnerable dependencies.
  • I have updated security dependencies
  • Python requirements have been re-compiled.
  • I have checked that my PR is using the latest package versions of: great-components, directory-constants, directory-healthcheck, directory-validators, directory-components, directory-api-client, directory-ch-client, django-staff-sso-client, directory-forms-api-client, directory-sso-api-client, sigauth

Security

  • Frontend assets have been re-compiled
  • Checked for potential security vulnerabilities
  • Ensured any sensitive data is handled appropriately

Performance

  • Evaluated the performance impact of the changes
  • Ensured that changes do not negatively affect application scalability.

Merging

  • This PR can be merged by reviewers. (If unticked, please leave for the author to merge)

@peterhudec peterhudec requested a review from a team as a code owner February 21, 2025 15:54
@peterhudec peterhudec mentioned this pull request Feb 21, 2025
19 tasks
@peterhudec peterhudec force-pushed the feature-IGUK-840-841-dynamic-guide-layout-and-hero branch from 164b238 to 5f106a7 Compare February 21, 2025 16:06
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