Как изменить точку останова для slideNav в Docusaurus

У меня на сайте Docusaurus всего две ссылки на заголовки: Docs & GitHub. Я хотел бы, чтобы эти ссылки оставались в шапке, пока я не уменьшу браузер до 500px. К сожалению, ссылки уменьшаются, как только браузер уменьшается до 1024 пикселей. Как я могу предотвратить это?

Я нашел следующий код, отвечающий за поведение скользящей навигации:

@media only screen and (min-width: 1024px) {
  .navigationSlider .slidingNav ul {
    background: none;
    display: flex;
    flex-flow: row nowrap;
    margin: 0;
    padding: 0;
    width: auto;
  }
}

Однако, если я изменю минимальную ширину медиазапроса на 500 пикселей, макет изменится с большим разрывом под строкой заголовка:

Как правильно изменить эту точку останова?

1 ответ

Решение

Несколько изменений: 1. Измените медиазапрос для класса .navigationSlider на 500px. 2. Для дополнительного пробела после заголовка уберите padding-top: от 100 до 50 пикселей из .navPusher (для этого вам нужно добавить еще один медиа-запрос)

Другие вопросы по тегам