Проблема переполнения длинного заголовка изображения в новом лайтбоксе

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

4 лайка

Привет :waving_hand:

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

В него включено исправление размеров изображений в карусели и заголовка.

.d-lightbox {
   &__carousel-item { 
     object-fit: cover;
   } 
   .d-lightbox__main-title { 
     margin-left: 0.5rem; 
     max-width: 100%; 
   } 
   &.has-expanded-title { 
     .d-lightbox { 
       &__content { 
         gap: 2em 0; 
       } 
       &__main-title { 
         max-height: 100px; 
         overflow-y: auto; 
         overflow-wrap: break-word; 
         word-wrap: break-word; 
         word-break: break-all; 
         word-break: break-word; 
         -webkit-hyphens: auto; 
         hyphens: auto;
       } 
     } 
   } 
   &:not(.has-expanded-title) { 
     .d-lightbox { 
       &__main-title { 
         @include line-clamp(1); 
       } 
     } 
   } 
 }
4 лайка