Здравствуйте, помогите реализовать следующее:
В у меня карточке товара под кратким описанием есть ряд характеристик, нужно что бы значения характеристики было прижато вправо, а между названием и значением были точки на всю ширину. Важно что бы в мобильной версии функционал сохранялся, методом сокращения длины строчки с точками.
скрины сайта примера, моей карточки товара и сами точки во вложении. спасибо
Сайт пример: https://tropohod.ru/...in_gpsmap_66st/
Точки если не прикрепились вот ссылка на них: https://tropohod.ru/...images/dott.png
Спасибо!
1
Линия Из Точек Между Характеристиками
Автор Антон 5554, 12 июля 2019 15:26
Сообщений в теме: 6
#1
Отправлено 12 Июль 2019 - 15:26
#2
Отправлено 12 Июль 2019 - 16:50
Здравствуйте, перейдите в редактор шаблонов > main.css и вставьте в конец
.table-features-min {width: 100%;border-collapse: collapse;margin-bottom: 20px;margin-left: -10px} .table-features-min td {padding: 8px 10px 0;overflow: hidden;} .table-features-min .cell1 {position: relative;} .table-features-min .cell1:after {content: '';position: absolute;right: -5px;bottom: 4px;left: 10px;border-bottom: 1px dotted #b1bfc8} .table-features-min .features-name {position: relative;z-index: 1;padding-right: 5px;background-color: #fff}
#3
Отправлено 15 Июль 2019 - 12:51
Vugar (12 Июль 2019 - 16:50) писал:
Здравствуйте, перейдите в редактор шаблонов > main.css и вставьте в конец
.table-features-min {width: 100%;border-collapse: collapse;margin-bottom: 20px;margin-left: -10px} .table-features-min td {padding: 8px 10px 0;overflow: hidden;} .table-features-min .cell1 {position: relative;} .table-features-min .cell1:after {content: '';position: absolute;right: -5px;bottom: 4px;left: 10px;border-bottom: 1px dotted #b1bfc8} .table-features-min .features-name {position: relative;z-index: 1;padding-right: 5px;background-color: #fff}
Здравствуйте, не плохо получилось, но вы скрыли мой список характеристики и вывели те? что во вкладке "характеристики", можно сделать по списку?, там нужны определенные были
И у меня не получается прижать свойства по правой стенке, скрин во вложении.
Спасибо
#4
Отправлено 16 Июль 2019 - 11:37
Антон 5554 (15 Июль 2019 - 12:51) писал:
Здравствуйте, не плохо получилось, но вы скрыли мой список характеристики и вывели те? что во вкладке "характеристики", можно сделать по списку?, там нужны определенные были
И у меня не получается прижать свойства по правой стенке, скрин во вложении.
Спасибо
И у меня не получается прижать свойства по правой стенке, скрин во вложении.
Спасибо
Здравствуйте. Зайдите в раздел Сайт---Редактор шаблонов---Товар и найдите код:
<!-- {% IFNOT goods_features_empty %}--> <!-- <div>--> <!-- {% FOR goods_features%}--> <!-- {% IF goods_features.NAME = Производитель || goods_features.NAME = Гарантия || goods_features.NAME = Время работы || goods_features.NAME = Установленные карты || goods_features.NAME = Барометрический альтиметр || goods_features.NAME = Компас || goods_features.NAME = Сенсорный экран || goods_features.NAME = Стекло SAPPHIRE || goods_features.NAME = Время работы || goods_features.NAME = Garmin Pay || goods_features.NAME = Музыкальный плеер || goods_features.NAME = Материал || goods_features.NAME = Ширина || goods_features.NAME = Серия || goods_features.NAME = Частота трансдьюсера || goods_features.NAME = Мощность || goods_features.NAME = Серия || goods_features.NAME = Длина клинка || goods_features.NAME = Закалка || goods_features.NAME = Сталь || goods_features.NAME = Вес || goods_features.NAME = Тип замка || goods_features.NAME = Кол-во инструментов %}--> <!-- <div>{goods_features.NAME} : <strong>{goods_features.VALUE}</strong></div>--> <!-- {% ENDIF %}--> <!-- {% ENDFOR %}--> <!-- </div>--> <!--{% ENDIF %}--> {% IFNOT goods_features_empty %} <table class="table-features-min"> <tbody> {% FOR goods_features %} <tr> <td class="cell1"><span class="features-name">{goods_features.NAME}</span></td> <td class="cell2">{goods_features.VALUE}</td> </tr> {% IF goods_features.index >= 6 %} <tr> <td><a href="#tab_2">Все характеристики</a></td> </tr> {break} {% ENDIF %} {% ENDFOR %} </tbody> </table> {% ENDIF %}
Замените его на:
{% IFNOT goods_features_empty %} <table class="table-features-min"> <tbody> {% FOR goods_features %} {% IF goods_features.NAME = Производитель || goods_features.NAME = Гарантия || goods_features.NAME = Время работы || goods_features.NAME = Установленные карты || goods_features.NAME = Барометрический альтиметр || goods_features.NAME = Компас || goods_features.NAME = Сенсорный экран || goods_features.NAME = Стекло SAPPHIRE || goods_features.NAME = Время работы || goods_features.NAME = Garmin Pay || goods_features.NAME = Музыкальный плеер || goods_features.NAME = Материал || goods_features.NAME = Ширина || goods_features.NAME = Серия || goods_features.NAME = Частота трансдьюсера || goods_features.NAME = Мощность || goods_features.NAME = Серия || goods_features.NAME = Длина клинка || goods_features.NAME = Закалка || goods_features.NAME = Сталь || goods_features.NAME = Вес || goods_features.NAME = Тип замка || goods_features.NAME = Кол-во инструментов %} <tr> <td class="cell1"><span class="features-name">{goods_features.NAME}</span></td> <td class="cell2">{goods_features.VALUE}</td> </tr> {% ENDIF %} {% ENDFOR %} </tbody> </table> {% ENDIF %}
#5
Отправлено 16 Июль 2019 - 11:46
stasia (16 Июль 2019 - 11:37) писал:
Здравствуйте. Зайдите в раздел Сайт---Редактор шаблонов---Товар и найдите код:
Замените его на:
<!-- {% IFNOT goods_features_empty %}--> <!-- <div>--> <!-- {% FOR goods_features%}--> <!-- {% IF goods_features.NAME = Производитель || goods_features.NAME = Гарантия || goods_features.NAME = Время работы || goods_features.NAME = Установленные карты || goods_features.NAME = Барометрический альтиметр || goods_features.NAME = Компас || goods_features.NAME = Сенсорный экран || goods_features.NAME = Стекло SAPPHIRE || goods_features.NAME = Время работы || goods_features.NAME = Garmin Pay || goods_features.NAME = Музыкальный плеер || goods_features.NAME = Материал || goods_features.NAME = Ширина || goods_features.NAME = Серия || goods_features.NAME = Частота трансдьюсера || goods_features.NAME = Мощность || goods_features.NAME = Серия || goods_features.NAME = Длина клинка || goods_features.NAME = Закалка || goods_features.NAME = Сталь || goods_features.NAME = Вес || goods_features.NAME = Тип замка || goods_features.NAME = Кол-во инструментов %}--> <!-- <div>{goods_features.NAME} : <strong>{goods_features.VALUE}</strong></div>--> <!-- {% ENDIF %}--> <!-- {% ENDFOR %}--> <!-- </div>--> <!--{% ENDIF %}--> {% IFNOT goods_features_empty %} <table class="table-features-min"> <tbody> {% FOR goods_features %} <tr> <td class="cell1"><span class="features-name">{goods_features.NAME}</span></td> <td class="cell2">{goods_features.VALUE}</td> </tr> {% IF goods_features.index >= 6 %} <tr> <td><a href="#tab_2">Все характеристики</a></td> </tr> {break} {% ENDIF %} {% ENDFOR %} </tbody> </table> {% ENDIF %}
Замените его на:
{% IFNOT goods_features_empty %} <table class="table-features-min"> <tbody> {% FOR goods_features %} {% IF goods_features.NAME = Производитель || goods_features.NAME = Гарантия || goods_features.NAME = Время работы || goods_features.NAME = Установленные карты || goods_features.NAME = Барометрический альтиметр || goods_features.NAME = Компас || goods_features.NAME = Сенсорный экран || goods_features.NAME = Стекло SAPPHIRE || goods_features.NAME = Время работы || goods_features.NAME = Garmin Pay || goods_features.NAME = Музыкальный плеер || goods_features.NAME = Материал || goods_features.NAME = Ширина || goods_features.NAME = Серия || goods_features.NAME = Частота трансдьюсера || goods_features.NAME = Мощность || goods_features.NAME = Серия || goods_features.NAME = Длина клинка || goods_features.NAME = Закалка || goods_features.NAME = Сталь || goods_features.NAME = Вес || goods_features.NAME = Тип замка || goods_features.NAME = Кол-во инструментов %} <tr> <td class="cell1"><span class="features-name">{goods_features.NAME}</span></td> <td class="cell2">{goods_features.VALUE}</td> </tr> {% ENDIF %} {% ENDFOR %} </tbody> </table> {% ENDIF %}
отлично с выводом нужных характеристик все супер, а получится прижать свойства по правой стенке, скрин во вложении.?
#6
Отправлено 20 Июль 2019 - 05:40
Здравствуйте.
Зайдите в раздел Сайт - Редактор шаблонов - Товар - найдите:
замените на:
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
замените на:
Зайдите в раздел Сайт - Редактор шаблонов - Товар - найдите:
<td class="cell1"><span class="features-name">{goods_features.NAME}</span></td> <td class="cell2">{goods_features.VALUE}</td>
замените на:
<td class="cell1"><span class="features-name">{goods_features.NAME}</span></td> <td class="cell2"><span class="features-name">{goods_features.VALUE}</span></td>
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.table-features-min .cell1 {position: relative;} .table-features-min .cell1:after {content: '';position: absolute;right: -5px;bottom: 4px;left: 10px;border-bottom: 1px dotted #b1bfc8}
замените на:
.table-features-min .cell1 {position: relative;} .table-features-min .cell1:after {content: '';position: absolute;right: -5px;bottom: 4px;left: 10px;border-bottom: 1px dotted #b1bfc8} .table-features-min .cell2 {position: relative;text-align: right;padding: 8px 0 0;} .table-features-min .cell2:after {content: '';position: absolute;right: -5px;bottom: 4px;left: 0;border-bottom: 1px dotted #b1bfc8}
#7
Отправлено 25 Июль 2019 - 20:41
Vaccina (20 Июль 2019 - 05:40) писал:
Здравствуйте.
Зайдите в раздел Сайт - Редактор шаблонов - Товар - найдите:
замените на:
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
замените на:
Зайдите в раздел Сайт - Редактор шаблонов - Товар - найдите:
<td class="cell1"><span class="features-name">{goods_features.NAME}</span></td> <td class="cell2">{goods_features.VALUE}</td>
замените на:
<td class="cell1"><span class="features-name">{goods_features.NAME}</span></td> <td class="cell2"><span class="features-name">{goods_features.VALUE}</span></td>
Зайдите в раздел Сайт - Редактор шаблонов - main.css - найдите:
.table-features-min .cell1 {position: relative;} .table-features-min .cell1:after {content: '';position: absolute;right: -5px;bottom: 4px;left: 10px;border-bottom: 1px dotted #b1bfc8}
замените на:
.table-features-min .cell1 {position: relative;} .table-features-min .cell1:after {content: '';position: absolute;right: -5px;bottom: 4px;left: 10px;border-bottom: 1px dotted #b1bfc8} .table-features-min .cell2 {position: relative;text-align: right;padding: 8px 0 0;} .table-features-min .cell2:after {content: '';position: absolute;right: -5px;bottom: 4px;left: 0;border-bottom: 1px dotted #b1bfc8}
СПАСИБО!
Количество пользователей, читающих эту тему: 0
0 пользователей, 0 гостей, 0 анонимных