Freecodecamp: Стиль выпадающего списка сообщества в ночном режиме

Хм, а как насчет обратного? оставить темно-серый, а для самого текста использовать светлый?
Я помогу @systimotic QA, если кто-то

Согласовано с Джастином, конкретные цветовые коды можно взять отсюда.
https://www.freecodecamp.com/design-style-guide/

@systimotic @raisedadead @hallaathrad
Привет, ребята, а как насчет этого:

Собирался открыть для него отдельную тему, но это кажется разумным местом для вставки ...

Я не могу сказать, сказал ли кто-то, что он будет работать над этим - если нет, я возьму на себя это, если мы согласимся, что оба должны быть исправлены!

Ага .. Я согласился, что оба должны быть исправлены. Но имейте в виду, что это модальное окно больше не доступно при постановке.

@ no-stack-dub-sack Вы можете продолжить исправление раскрывающегося списка 👍
Возможно, лучше всего оставить модальное окно, так как оно все равно удаляется.

😕 Я только что проверил, модальное окно доступно на стадии постановки. Я думаю, это было отменено. Я не уверен, каков статус этого, вернулся ли он временно или навсегда.
Он был отменен в https://github.com/freeCodeCamp/freeCodeCamp/pull/11253. Насколько я могу судить, он возвращается навсегда, но я не уверен.

@systimotic @raisedadead Хорошо, я могу продолжить и исправить оба - и если он будет удален - ничего страшного!

Также заметил, что если вы нажмете кнопку сообщества в раскрывающемся списке, а затем выйдете из раскрывающегося списка, он останется белым, а не снова станет зеленым:

Предполагая, что это непреднамеренно, постараюсь также взглянуть на это.

@raisedadead @systimotic

Согласовано с Джастином, конкретные цветовые коды можно взять отсюда.
https://www.freecodecamp.com/design-style-guide/

Это фактически поднимает два хороших момента:

1. Многие цвета ночного режима не включены в это руководство по стилю.
2. И в этом руководстве по стилю есть несколько экземпляров "Free Code Camp", которые следует изменить в соответствии с выпуском № 12472.

Однако я не могу найти это в кодовой базе, кто-нибудь знает, где это живет?

Хорошо, поэтому у меня есть кое-что, что, на мой взгляд, выглядит красиво и использует цвета ночного режима / бренда, включая исправление проблемы стиля фокусировки кнопок на панели навигации:

И вот выпадающий список:

НО, когда я начал щелкать, например, идя в магазин, а затем возвращаясь к карте, стиль снова возвращается к светлым цветам. Страница на мгновение возвращается в «дневной режим», а затем, когда она возвращается в ночной режим, стили выпадающего списка возвращаются. Есть идеи, почему это может быть?

Вот мой код, вставьте его в строку 1073 файла main.less:

.hamburger-dropdown {
    .dropdown .dropdown-menu,
    .open a {
      background-color: @gray;
      a {
        color: @night-text-color;
        &:hover {
          background-color: #666;
          color: @brand-primary;
        }
      }
    }
    a:focus,
    a:active {
      background-color: #666 !important;
      color: @brand-primary !important;
    }
  }

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

В этом руководстве по стилю есть несколько примеров "Free Code Camp".

У меня есть PR в ожидании слияния. Ссылка https://github.com/freeCodeCamp/design-style-guide/pull/7

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

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

Выбор ночного режима не сохраняется на сайте - это отдельная проблема и
нужно будет поднять один, если бы кто-то мог его поднять, я был бы очень признателен. я
у меня сейчас нет доступа к GitHub

В понедельник, 16 января 2017 г., mrugesh mohapatra [email protected]
написал:

В этом руководстве по стилю есть несколько примеров "Free Code Camp".

У меня есть PR в ожидании слияния. Ссылка freeCodeCamp / design-style-guide # 7
https://github.com/freeCodeCamp/design-style-guide/pull/7

Мне нравится то, что вы сделали с раскрывающимся списком, возможно, текста нужно больше
контрастный (более белый), но смотрится круто!

-
Вы получаете это, потому что входите в упомянутую команду.
Ответьте на это письмо напрямую, просмотрите его на GitHub
https://github.com/freeCodeCamp/freeCodeCamp/issues/12538#issuecomment-272837258 ,
или отключить поток
https://github.com/notifications/unsubscribe-auth/ARtk5hIk55x-gDVJsymtMwSfkxmlxp8Wks5rS1TPgaJpZM4Lj7u0
.

@ no-stack-dub-sack не уверен, что я копаю зеленый текст поверх серого при наведении / активном. Кажется, не хватает контраста, чтобы его можно было прочитать. Как насчет светло-серого фона с темно-серым текстом?

@systimotic @raisedadead @hallaathrad Итак, я думаю, что это выглядит немного лучше, согласно комментарию Джастина и Мругеша относительно большей контрастности, я использовал @link-hover-color var, который на @brand-primary затемнен на 15%, поэтому он все еще сохраняет намек на фирменный зеленый цвет, но обеспечивает значительно лучший контраст. Он находится в раскрывающемся списке и для наведения, активного, фокуса навигационных ссылок.

И я думаю, что открою отдельный вопрос, касающийся модальных окон, и объясню трудности с ними.

Мне это нравится.

Шикарность !!! У нас уже есть запрос на вытягивание! 😉

В теме!