Прогрессирую - делаю сайт не только для компа, но и

Question

Прогрессирую - делаю сайт не только для компа, но и

для Мобилок. ПВА

В стилях медиа запросами могу шрифты менять, отступы там всякие..
Как правильно принято иконки выбирать?
print_on@1x.png
print_on@2x.png
print_on@3x.png

Ранее картинку вставлял так
import cancelImg from '@/shared/style/icons/control/cancel.png'
<img :src="cancelImg" alt="" />

какой трушный путь подгрузки и выбора картинки нужного размера?

#frontend #javascript #programming #russian #vue.js

0

11.09.2023

8 ответов

21 просмотр

Alexey Turdakin Автор вопроса

Мне кажется, что я делаю какую-то дичь. Как правильно / компактно организовать такой код? <script setup> import logOutImg1x from '@/shared/style/icons/log-out/android/log-out@1x.png' import logOutImg2x from '@/shared/style/icons/log-out/android/log-out@2x.png' import logOutImg3x from '@/shared/style/icons/log-out/android/log-out@3x.png' import logOutImg4x from '@/shared/style/icons/log-out/android/log-out@4x.png' </script> <template> <div class="flex space-x-1"> <picture> <img :src="logOutImg1x" :srcset="logOutImg2x + ' 2x, ' + logOutImg3x + ' 3x, ' + logOutImg4x + ' 4x'" alt="" /> </picture> <span>Выйти из аккаунта</span> </div> </template>

0

11.09.2023

Xezard

Alexey Turdakin
Мне кажется, что я делаю какую-то дичь. Как правил...

src-set для иконки? Зачем?)

0

11.09.2023

Grigorii K. Shartsev

Alexey Turdakin
Мне кажется, что я делаю какую-то дичь. Как правил...

const set = [1, 2, 3, 4] const images = set.map((size) => new URL(`../path/to/log-out@{size}x.png`).href + ` ${size}x`) const srcset = images.join(', ')

0

11.09.2023

Alexey Turdakin Автор вопроса

Grigorii K. Shartsev
const set = [1, 2, 3, 4] const images = set.map((s...

я правильно понимаю, что в данном случае картинки надо сохранить в папке паблик а не в src? вообще в каком месте лучше их хранить? какие критерии?

0

11.09.2023

Alexey Turdakin Автор вопроса

Xezard
src-set для иконки? Зачем?)

Наверное потому, что мы с дизайнером сегодня узнали про srcset/retina, и еще не осознали что это и нафига оно надо )))

0

11.09.2023