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

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

1. Задать контейнеру блока ширину в процентах, например, 100% или другое значение в зависимости от макета.
2. Использовать относительные единицы измерения, такие как % или em, для задания размеров шрифтов, отступов и паддингов.
3. Использовать медиа-запросы для изменения стилей блока в зависимости от размера экрана устройства. Например, можно задать разные ширину или расположение элементов на маленьких экранах.

Что касается верстки блока с треугольными фигурами между элементами, можно использовать псевдоэлементы ::before и ::after для создания этих фигур. Например, для треугольника можно воспользоваться следующим кодом:

```css
.item::before {
  content: "";
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid black;
}
```

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

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

.triangle {
   width: 0px;
   height: 0px;
   border-style: solid;
   border-width: 0 90px 90px 90px;
   border-color: transparent transparent #005BFF transparent;
   transform: rotate(90deg);
}
 
 
 1) добавляем для синего треугольника after 
 2) добавляем для белого треугольника before

Примерно так