# 89: Настройка панели галереи - CSS-хитрости

Anonim

В этом видео мы вносим ряд изменений в панель, которую мы настроили для большинства функций галереи. Дизайн - это все о настройке, не так ли?

Мы корректируем отступы, чтобы все было лучше. Мы стилизуем раскрывающийся список, чтобы открывшееся меню выглядело немного лучше. Настраивая это, мы следим за тем, чтобы у них была достаточно большая интерактивная / нажимаемая область ( display: blockссылки). Это прекрасный пример того, как внедрение стиля из CodeKit очень полезно. Мы обеспечиваем визуальное отображение сильного ролловера, чтобы было понятно, что вы выбираете. Очень важно в таком макете, где все выглядит одинаково.

Мы проделываем небольшую уловку WordPress, когда удаляем атрибут title из ссылок тегов (что в данном случае хуже, чем бесполезно), используя функцию фильтрации и ничего не возвращая.

Мы добавляем кнопку отправки, размещаем ее справа от панели и создаем стиль кнопки, который работает в контексте панели галереи.

Галерея на этом сайте немного уникальна тем, что есть несколько совершенно разных шаблонов, которые должны выглядеть очень похожими. Например, домашняя страница галереи и страница таксономии галереи. Мы замечаем эту проблему и вносим изменения, необходимые для того, чтобы они остались прежними. Мы используем некоторые приемы, которые мы использовали снова и снова в этой серии, например, добавление включения в оба шаблона, чтобы не повторяться.

Мы, вероятно, тратим слишком много времени на то, чтобы быть в тупике, но странная вещь, когда мы пытаемся либо повторить текущий тег, либо уникальную строку - в зависимости от того, на какой странице вы находитесь. Самые глупые мелочи всегда занимают больше всего времени.

Мы также боремся с небольшой глупой особенностью, когда мы хотим, чтобы ссылки и кнопки в заголовке немного отличались. В этом проекте у нас очень легкий подход к селекторам. Обычно это здорово, никаких неприятных войн за специфичность, но также иногда бывает больно, когда другие очень легкие (с низкой специфичностью) селекторы перекрывают другие, и вам нужно действовать сильнее, чем вы хотели бы исправить. Такова жизнь.