Петр

Все об SVG анимации

p {
  text-indent: -25px;
  margin: 50px;
}

.publications-list .col-sm-4 {
  height: 400px;
  margin-top: 45px;
  position: relative;
}

.publications-list .col-sm-4 a{
   position: absolute;
   left: 50%
   bottom: 0;
  transform: translate(-50%, 0);
}

https://www.ibiblio.org/e-notes/webgl/polyhedra/ic...

https://css-tricks.com/scale-svg/

Понятия "модальное окно" в том смысле как оно применяется в windows в web-е еще нету.
У вас просто определенный блок отображается поверх других элементов страницы.
Поэтому логика следующая:
- Создали блок
- Показали
- Удалили.
Нужен новый блок - Опять создали.

" Я считаю хранить в базе mysql каждую картинку и вместе сней её размеры."
Плохо.
1. У MySQL есть проблемы с таблицами, где помимо blob есть и другие поля. (Сталкивался с этим)
2. Проблематичнее делать бекапы базы, т.к. она сильно разрастется.

Добавлю:
Хранить картинки еще лучше на диске, так как в этом случае можно задействовать кеширование web сервера.

SVG
Canvas

Так?