Сверстать блок со шкалой
400 UAHНужно сверстать блок со шкалой, десктоп и мобайл.
Приложен макет результата шкалы, и все вариации (пустая / полуполная / десктоп / мобайл).
Также приложен исходник для figma.
Условия такие:
1. Блок тянется на 100% по ширине родительского контейнера. В десктопе ширина родителя может быть произвольной, например, 750px. Ширина полоски шкалы = ширина родительского relative блока, без учета подписей
2. На макете в шкале 4 секции, но нужна возможность оставить 3 или 5 секций без изменения css
3. Нужна возможность задать/поменять ширину каждой секции отдельно. Вроде такого: <div class="lu-gauge-section" style="width: 20%">. В сумме все секции будут 100% ширины. Можно использовать другое свойство.
4. Для заполнения шкалы используем один блок, которому в html прописываем style="width: 50%", где 50% -- это визуальная заполненность шкалы. От 0 до 100%. Именно в html, потому что он будет формироваться бекендом.
5. Остальных инлайн-стилей быть не должно, все в css.
6. Нужно сделать общий родительский класс "lu-gauge-container", и в нем уже все верстать. Не задавать никаких правил для общих элементов body, div, итд, которые могут быть еще на странице, только для классов с префиксом lu-gauge-
7. Отсутпы и размеры элементов должны соотвествовать макету. html дожен быть валидным без незакрытых тегов.
8. Нужно обойтись без картинок и библиотек, 1 html и один css файл. Также желательно без javascript.
Шрифт в макете RotondaC, бесплатный https://nomail.com.ua/family/RotondaC
Просьба браться за задание, только если вы прочитали требования и уверены, что сделаете его, а также у вас сейчас есть на это время.
Приложения 3
-
Победившая ставка1 день400 UAH
1337 18 0 Победившая ставка1 день400 UAH
Здравствуйте. Внимательно изучил. Могу приступить сейчас.
https://sofg1.github.io/test/profile.html
Проекты:
https://sofg1.github.io/CHISH/
https://sofg1.github.io/test
https://sofg1.github.io/test/profile.html
https://lovegloves.art/
… https://sofg1.github.io/decor-page/
https://sofg1.github.io/CHISH/about.html
https://sofg1.github.io/studio/
https://sofg1.github.io/CHISH/education.html
https://sofg1.github.io/burger
https://sofg1.github.io/yoga/
-
1 день500 UAH
265 1 0 1 день500 UAH
Сделаю качественную верстку данного блока , опыт верстки 2+ года , есть профиль на другой бирже с 20+ отзывов , если нужно - скину .
За отзыв - скидка)
-
1 день350 UAH
1513 74 1 2 1 день350 UAH
Здравствуйте. Готов сделать данную шкалу со всеми классами на все случаи.
Вот мои последние работы:
1. Вёрстка с нуля большого интернет-магазина ювелирных украшений и деревянных изделий братьев Кочут:
https://kochut.org/ru/
2. Украинский магазин с ювелирными украшениями. Вёрстка контента страницы "Коллекции"
https://minimal.com.ua/ua/jewelry-collection/skazhi-tak/
3. Сайт с ролетами, рафшторами, москитными сетками. Примечателен сложными анимациями
https://result.cf/rollosvit/page_home.html
… 4. Лендинг по спилу деревьев с полным адаптивом и оптимизацией - https://teamwood.pro
Буду рад сотрудничать!
-
1 день500 UAH
205 6 0 1 день500 UAH
Ознакомился с проектом. Готов приступить прямо сейчас. Имею огромный опыт работы с HTML, CSS и JS. Быстро справлюсь с вашей задачей!
-
2 дня500 UAH
2994 9 0 2 дня500 UAH
Здравствуйте.
По ТЗ, качественно и валидно сверстаю шкалу по макету.
Заполняемость будет меняться из HTML, а так же будет растягиваться на всю ширину экрана динамически.
Мой опыт в вебе - более 4х лет.
Пример верстки: https://geografikapark.ru/
Актуальные фриланс-проекты в категории HTML и CSS верстка
Разработка карты семян Minecraft Java / просмотрщика семян для сайтаРазработка карты семян Minecraft Java / Seed Viewer для сайтаОписание проекта Необходимо разработать браузерный инструмент Minecraft Java Seed Map / Seed Viewer, который будет работать на нашем сайте и позволит пользователю ввести семя Minecraft Java Edition и просмотреть… C и C++, HTML и CSS верстка ∙ 5 часов 28 минут назад ∙ 10 ставок |
Перенос небольшого сайта визитки на 58 стр. с Joomla 1.5 на Joomla 6Есть небольшой сайт визитка сделан на Joomla 1.5 на 58 страниц (если считать на двух языках), на которых содержится небольшие тексты с фотографиями. На одной странице размещена таблица. На двух страницах размещены PDF файлы на всю страницу во фрейме. Сайт сделан на двух языках с… CMS, HTML и CSS верстка ∙ 13 часов 4 минуты назад ∙ 30 ставок |
Редизайн и перезапуск сайта стоматологической клиники Brovchak Family Dental CareРедизайн и перезапуск сайта стоматологической клиники Brovchak Family Dental Care http://brovchak-clinic.com.ua/ тз от сео-эксперта https://docs.google.com/spreadsheets/d/17_WyPf3XVpzbuBjpJ7MNFs12QUL-aHv7iIbKudY-IEw/edit?gid=0#gid=0 https://miro.com/app/board/uXjVHXxFvIE=/О… HTML и CSS верстка, Поисковое продвижение (SEO) ∙ 2 дня 4 часа назад ∙ 63 ставки |
Хочу научиться создавать сайты по КСГО/КС2Нужен ментор, который научит меня создать CS2/CS:GO сервер. Хочу через Discord/Zoom пошагово разобрать: хостинг/VPS, server.cfg, карты, плагины, админку, бан-систему, Discord, сайт и статистику. Язык: украинский или русский. HTML и CSS верстка, Веб-программирование ∙ 2 дня 6 часов назад ∙ 16 ставок |
Ищу программиста или вайб кодинг Автоматизация scraping данныхמחפש מתכנת או תומך בקידוד וייב. גירוד נתונים אוטומטי. https://drive.google.com/file/d/1Ogsx2iyahw79sleaDEUwMnSTPHhwF3Nu/view?usp=sharing HTML и CSS верстка, Веб-программирование ∙ 3 дня 5 часов назад ∙ 41 ставка |
Днепр