Сверстать блок со шкалой
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 верстка
Расширение админ-панели: добавление SEO-страниц услугСайт разработан на: Backend: Java + Spring Boot База данных: MySQL Frontend: JavaScript, HTML, CSS Шаблонизатор: Thymeleaf Сервер: VPS (Linux Ubuntu) Reverse Proxy: Apache2 Архитектура: Монолитное приложение На данный момент на сайте реализован: Блог с административной… HTML и CSS верстка, Базы данных и SQL ∙ 34 минуты назад ∙ 4 ставки |
Настройка интернет-магазина тканей на WordPress + WooCommerce по шаблону Astra
14 825 UAH
Необходимо настроить и подготовить к работе интернет-магазин мебельных тканей для рынка Норвегии. Домен, хостинг и WordPress уже установлены: eximtextilnordiq.com Сайт нужно сделать не с нуля и без индивидуального программирования, а на готовом бесплатном шаблоне Astra,… CMS, HTML и CSS верстка ∙ 3 часа 55 минут назад ∙ 43 ставки |
Сайт реберня-піцеріяКлиентская часть — динамическое меню с Firebase, категории с вкладками, карточки блюд с фото и ценами, поддержка двух размеров (пицца 30/40 см), адаптивный мобильный дизайн, боковое меню с контактами и локацией. Админ-панель — авторизация, управление категориями и блюдами… HTML и CSS верстка ∙ 7 часов 46 минут назад ∙ 68 ставок |
Необходимо сделать доработку на сайте Modx Evolution CMS 3.1.7
1000 UAH
Разрабатывается доработка дизайна и верстка сайта, нужно будет внедрить эти работы на сайт. Также внедрить некоторые доработки на сайте. HTML и CSS верстка, PHP ∙ 8 часов 27 минут назад ∙ 21 ставка |
Разработка карты семян Minecraft Java / просмотрщика семян для сайтаРазработка карты семян Minecraft Java / Seed Viewer для сайтаОписание проекта Необходимо разработать браузерный инструмент Minecraft Java Seed Map / Seed Viewer, который будет работать на нашем сайте и позволит пользователю ввести семя Minecraft Java Edition и просмотреть… C и C++, HTML и CSS верстка ∙ 1 день 1 час назад ∙ 13 ставок |
Днепр