fix: pfe-jump-links offset & updates to demo file#974
Conversation
…aphs between panel headings.
| </div> | ||
| <div class="pfe-l-grid__item pfe-m-12-col pfe-m-9-col-on-lg"> | ||
| <pfe-jump-links-panel class="special" pfe-c-scrolltarget="jumplinks1"> | ||
| <pfe-jump-links-panel pfe-c-offset="20" class="special" pfe-c-scrolltarget="jumplinks1"> |
There was a problem hiding this comment.
This attribute actually does something, we should leave it. You can also put a css value on the panel --pfe-jump-links-panel--offset. It will read css if it's there, and if both are there it will use the attribute.
There was a problem hiding this comment.
not sure what you mean? I've added it here :)
It's also in the demo CSS; is that duplicative?
| <div style="margin: 0 auto 400px;grid-column-gap: 30px;max-width:1140px;" class="pfe-l-grid"> | ||
| <div class="sticky pfe-l-grid__item pfe-m-12-col pfe-m-3-col-on-lg"> | ||
| <pfe-jump-links-nav id="jumplinks1" sr-text="Page navigation"> | ||
| <pfe-jump-links-nav pfe-c-offset="100" id="jumplinks1" sr-text="Page navigation"> |
There was a problem hiding this comment.
pfe-c-offset here doesn't do anything.
Co-authored-by: [ Cassondra ] <castastrophe@users.noreply.github.com>
| display: block; | ||
| position: relative; | ||
| width: 0; | ||
| margin-top: calc( -1 * var(--pfe-jump-links-panel__section--spacer) ); |
There was a problem hiding this comment.
@starryeyez024 I'm having trouble getting the height and margin-top styles to tie into the custom properties from the demo.css file. Do lines 2, 8 & 9 look ok?
There was a problem hiding this comment.
added fix for line 2 (no interpolation needed)
|
@starryeyez024 Can you take a look at why the CI is failing? |
|
Lazarra good to merge |
Demo page