Как исправить проблему с url картинки на GitHub Pages?

Есть проблема с url картинок. Для маршрутизации сайта я использую react-router-dom. При переходе на страну название репозитории cat-foot-landing заменяется на название в ссылки, по-этому и картинки нету.

Корректный путь к картинке: https://alexanderokhotnichenko.github.io/cat-foot-landing/img/catallog/catalog_1_500.webp

Путь который получаю я: https://alexanderokhotnichenko.github.io/img/catallog/catalog_1_500.webp

репозиторий GitHub

Я пробовал изменить путь, но все эти варианты не помогли мне.

<Link to="/catallog">каталог продукции</Link>
<Link to="./catallog">каталог продукции</Link>
<Link to="../catallog">каталог продукции</Link>
<Link to="./cat-foot-landing/catallog">каталог продукции</Link>

Роутер

<Routes>
   <Route exact path="/" element={<PageHome />}></Route>
   <Route path="/catallog" element={<PageCatallog />}></Route>
   <Route path="/form" element={<PageForm />}></Route>
</Routes>

<nav className={`${styles.content__menu} ${styles.menu} ${isToggle ? styles.open : ''}`}>
   <ul className={ styles.menu__list }>
      <li className={ styles.menu__item }><Link onClick={onCloseMenu} to="./">главная</Link></li>
      <li className={ styles.menu__item }><Link onClick={onCloseMenu} to="./catallog">каталог продукции</Link></li>
      <li className={ styles.menu__item }><Link onClick={onCloseMenu} to="./form">подбор программы</Link></li>
   </ul>
</nav>