Как сделать инфо-бар без сокращений?

ЕСТЬ РЕШЕНИЕ ЗАКРЫТО InstantCMS 2.X
#1 23 декабря 2021 в 18:33

Прошу помощи (совета) от форумчан! Народ на сайте бухтит — не виден текст в инфо-баре. Увещевания, что надо делать текст покороче, не помогают. Вот так выглядит инфо-бар на мобильном. Собственно, почти так же смотрится и на мониторе. 

Изображение

Какие правки надо внести в код, чтобы надписи не сокращались в пределах отведенной области, а переходили на следующую строчку? Очень надо решить проблему, но в верстке практически не шарю… если трудоемко, черкните в личку, обсудим по цене. ICMS 2.14.3.

#2 23 декабря 2021 в 19:02

 Викторыч,  а вы порционально сообщайте народу:

— да, мы знаем

— да, мы решаем

— не может быть всё сразу

— всё, мы нашли виновника

— эти бестолковые разработчики... 

— а как посадить, если законы такие?

— потерпите, пришли трудные времена, надо немного затянуть пояса

— вы не должным образом любите наш сайт

— сколько раз нужно повторить, что не мы сотворили эту проблему?

Так легко можно протянуть 4-5лет. Потом плакальщики или забудут или найдут другие проблемы (в последнем случае тасуйте порядок ответов и легко получите ещё 5 лет).

Если, вдруг, некоторые будут стонать и дальше (крайне сомневаюсь), стучите в личку, попытаюсь помочь

#3 23 декабря 2021 в 22:21

 Викторыч,  а вы порционально сообщайте народу:

Олег Васильевич я

С тех пор, как открыл сайт, первые три тезиса — постоянно, каждый день! )) Вас понял, давайте обсудим...

Добавлено спустя 1 минуту

Проблема решена. Тема закрыта.

#4 23 декабря 2021 в 22:28

Проблема решена. Тема закрыта.

Викторыч

Имхо, поступая по человечески, мы должны делиться решением перед закрытием темы

#5 23 декабря 2021 в 22:53

Проблема решена. Тема закрыта.

Викторыч

Имхо, поступая по человечески, мы должны делиться решением перед закрытием темы

Олег Васильевич я

Очень согласен! Замотался тудым-сюдым… Значитца, так: в файл _custom.scss (шаблон Modern) дописываем (если у нас там уже что-то есть) или вносим следующий код:

  1. .info_bar {
  2. flex-wrap: wrap;
  3. }
  4.  
  5. .info_bar .bar_item {
  6. margin-top: .25rem;
  7. margin-bottom: .25rem;
  8. }
  9.  
  10. .info_bar .bar_item.text-truncate {
  11. white-space: initial;
  12. }

После этого — «Сохранить и скомпилировать SCSS», изменить значение счетчика. Все надписи в инфо-баре теперь без сокращений и, если названия длинные, просто переносятся на следующую строку.

Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.