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

Fix: Moving header nav styling to header nav styling file instead of … #108

Merged
merged 1 commit into from
Feb 20, 2023

Conversation

HeleenSG
Copy link
Contributor

@HeleenSG HeleenSG commented Feb 17, 2023

Fix: Moving header nav styling to header nav styling file instead of navigation.

  • Added header navigation
  • Removed old navigation file
  • Cleared out the navigation file that will contain the basic nav styling
  • Fixed styling issues within the main nav element
  • Added styling options within the main nav element

BREAKING CHANGE: From now on use header-navigation to style the header-navigation instead of navigation.

@HeleenSG HeleenSG self-assigned this Feb 17, 2023
@HeleenSG HeleenSG marked this pull request as ready for review February 17, 2023 17:38
@HeleenSG HeleenSG requested review from a team and TwistMeister as code owners February 17, 2023 17:39
@TwistMeister
Copy link
Contributor

What's the reasoning behind having two seperated sass files. One with variables and their values and one with the actual styling, using those variables instead of the specific values? As far as I could tell the variables aren't reused, so what's the benefit of having this split up into two files?

@HeleenSG
Copy link
Contributor Author

HeleenSG commented Feb 20, 2023

The variable files contain the variables that can be used to override any of the specific values we want the user to be able to adjust.

  • Variables get defined within a separate file for readability.
  • Whenever a value should be available to set by the user a variable is added. Values that should not be changed, e.g they are needed for the component to work, are added as a value within the component .scss file directly.
  • Variable files can be shared between multiple variants of a component. Where the default values create the distinction between the variants. The adjustable variables can be the same and therefor re-used.

@TwistMeister
Copy link
Contributor

@HeleenSG good to know. Thanks for elaborating :)

@HeleenSG HeleenSG merged commit 2c9e783 into main Feb 20, 2023
@HeleenSG HeleenSG deleted the fix/navigation branch February 20, 2023 14:06
jpbruinsslot added a commit that referenced this pull request Mar 29, 2023
* main: (96 commits)
  Updated version number (#123)
  Updated nav styling options and fixed issues found. Added manon docs nav styling. (#121)
  fix: set border to 0 on focus-only class (#118)
  fix: form help styling
  Added width variable
  feat: header-navigation width variable
  fix: added and updated header-navigation  variables
  Updated version (#112)
  fix: fieldset checkbox alignment horizontal view. Align correctly with elements outside the fieldset. (#114)
  fix: update tabs variables linkage.  (#113)
  fix: Form help alignment. (#115)
  fix: removed empty link (#110)
  fix: call to action button linkage BREAKING CHANGE: Removed: --cta-background-color and --cta-text-color (#107)
  fix: pagination variable linkage and added styling to have pagination grow within the available space (#109)
  Fix: Moving header nav styling to header nav styling file instead of navigation. (#108)
  fix: ghost button variables linkage
  fix: message counter linkage
  chore: updating version
  fix: upgraded navigation styling options and fixing old linkage issues
  fix small typos (#96)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants