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(anchors) Use scroll-padding for headings anchoring #152

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

makishvili
Copy link

@makishvili makishvili commented Jul 25, 2023

Задача отчасти связанная с этим PR: diplodoc-platform/transform#254

Если в таблице отрендерить заголовок, то при клике в якорь этого заголовка страница подскроливается без учёта высоты стики-шапки. В этом PR предлагаю системно изменить решение для подскрола к любым заголовкам.

Есть CSS-свойство, предназначенное для этого: scroll-padding.

  1. Выставляю его по высоте шапки
  2. В миксине fixAnchorPosition убираю костылек с отрицательным марджином.
  3. Миксин fixAnchorPosition переименовываю в setHeadingPadding, потому что теперь он занимается лишь вычислением паддинга для заголовков

Теперь подскроливается нативно.

styles/yfm.scss Outdated
h4,
h5,
h6 {
// Непонятно, как нормально переопределить селектор с &:first-child
Copy link
Member

Choose a reason for hiding this comment

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

Replace with english or remove

Copy link
Author

Choose a reason for hiding this comment

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

done

@3y3
Copy link
Member

3y3 commented Jul 26, 2023

Please squash all to conventional commits

@makishvili
Copy link
Author

Please squash all to conventional commits

done

@makishvili makishvili requested a review from 3y3 September 4, 2023 08:43
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.

2 participants