Адаптивная верстка
3 000 руб. за проект
Требуется сделать адаптивную верстку страницы каталога для дальнейшей передачи front-end разработчику https://www.figma.com/file/gDRXHwTeo20J0D2xev9L70/...
Только страница КАТАЛОГ
Так выглядит страница сейчас https://yummy-sneeze.surge.sh/goods
Три разрешения:
PC 1440x800+
iPad 1024x768
Moblie 320x..
Верстка в rem - 10px
Для всех экранов нужно создать media для указания font size (предварительные значения):
320 (1.4rem), 768 (1.4rem), 1024 (1.4rem), 1360(1.7rem), 1440(1.7rem), 1920(1.8rem), 2560(2rem)
Нужно использовать готовые решения (подробности расскажу исполнителю):
на select фильтров с доработкой - https://codepen.io/aaroniker/full/VGMwLd
на switch - https://codepen.io/aaroniker/full/LYGLoBE
на select модификации товара - https://codepen.io/aaroniker/full/MWgjERQ
на фоне градиент:
.css-selector {
background: linear-gradient(270deg, #CFDCE4
, #F6E6DC
, #FAF0E9
, #F5F5F1
, #C0D9C3
);
background-size: 1000% 1000%; -webkit-animation: AnimationName 49s ease infinite;
-moz-animation: AnimationName 49s ease infinite;
-o-animation: AnimationName 49s ease infinite;
animation: AnimationName 49s ease infinite;
}@-webkit-keyframes AnimationName {
0%{background-position:0% 7%}
50%{background-position:100% 94%}
100%{background-position:0% 7%}
}
@-moz-keyframes AnimationName {
0%{background-position:0% 7%}
50%{background-position:100% 94%}
100%{background-position:0% 7%}
}
@-o-keyframes AnimationName {
0%{background-position:0% 7%}
50%{background-position:100% 94%}
100%{background-position:0% 7%}
}
@keyframes AnimationName {
0%{background-position:0% 7%}
50%{background-position:100% 94%}
100%{background-position:0% 7%}
}
Страницы будут еще, надеюсь на длительное сотрудничество.
Только страница КАТАЛОГ
Так выглядит страница сейчас https://yummy-sneeze.surge.sh/goods
Три разрешения:
PC 1440x800+
iPad 1024x768
Moblie 320x..
Верстка в rem - 10px
Для всех экранов нужно создать media для указания font size (предварительные значения):
320 (1.4rem), 768 (1.4rem), 1024 (1.4rem), 1360(1.7rem), 1440(1.7rem), 1920(1.8rem), 2560(2rem)
Нужно использовать готовые решения (подробности расскажу исполнителю):
на select фильтров с доработкой - https://codepen.io/aaroniker/full/VGMwLd
на switch - https://codepen.io/aaroniker/full/LYGLoBE
на select модификации товара - https://codepen.io/aaroniker/full/MWgjERQ
на фоне градиент:
.css-selector {
background: linear-gradient(270deg, #CFDCE4
, #F6E6DC
, #FAF0E9
, #F5F5F1
, #C0D9C3
);
background-size: 1000% 1000%; -webkit-animation: AnimationName 49s ease infinite;
-moz-animation: AnimationName 49s ease infinite;
-o-animation: AnimationName 49s ease infinite;
animation: AnimationName 49s ease infinite;
}@-webkit-keyframes AnimationName {
0%{background-position:0% 7%}
50%{background-position:100% 94%}
100%{background-position:0% 7%}
}
@-moz-keyframes AnimationName {
0%{background-position:0% 7%}
50%{background-position:100% 94%}
100%{background-position:0% 7%}
}
@-o-keyframes AnimationName {
0%{background-position:0% 7%}
50%{background-position:100% 94%}
100%{background-position:0% 7%}
}
@keyframes AnimationName {
0%{background-position:0% 7%}
50%{background-position:100% 94%}
100%{background-position:0% 7%}
}
Страницы будут еще, надеюсь на длительное сотрудничество.
В заказе есть исполнитель
При переводе заказа из архивного в актуальный, текущий исполнитель будет снят с задачи.
Выберите тип сделки
С безопасной сделкой вы всегда сможете вернуть средства, если что-то пойдет не так. С простой сделкой вы самостоятельно договариваетесь с исполнителем об оплате и берете на себя решение конфликтов.