0.0.52 w route card

This commit is contained in:
SBD
2025-01-23 18:10:44 +03:00
parent 2c00a38ceb
commit bb691a6ad0
2 changed files with 71 additions and 4 deletions

View File

@@ -61,7 +61,42 @@
--route-text-img-filter: unset;
}
.route_card_info_data{
&.mobile{display: none}
@media (max-width: 1024px) {
display: none;
&.mobile {
display: block;
--route-text-container-margin: 50px 0 0 51px;
.route_card_owner_info {
height: unset;
margin-left: 0;
margin-bottom: 10px;
--medium-font-size: 12px;
}
.route_card_text_img{
top: 25px;
}
.route_card_owner_avatar{
top: 31px;
}
.card_owner_name{
position: absolute;
top: 40px;
left: 74px;
--big-font-size: 12px;
}
}
}
/* mobile end !!!*/
position: relative;
.card_owner_name{
font-weight: 600;
font-size: var(--big-font-size);
}
.route_card_text_img{
position: absolute;
top: 5px;
@@ -81,6 +116,9 @@
z-index: 10;
}
.route_card_text_container{
@media (max-width: 992px) {
--big-font-size: 14px;
}
background: var(--route-text-container-bg);
padding: var(--route-text-container-padding);
margin: var(--route-text-container-margin);
@@ -98,10 +136,6 @@
display: flex;
align-items: center;
gap: 10px;
.card_owner_name{
font-weight: 600;
font-size: var(--big-font-size);
}
.card_splitter{
height: 22px;
width: 2px;
@@ -183,6 +217,9 @@
}
}
.from_to_place_data{
@media (max-width: 992px) {
--big-font-size: 14px;
}
&:has(.arrival_to){
.place{justify-content: right}
} &:has(.departure_from){
@@ -229,6 +266,9 @@
}
}
.route_way_data{
@media (max-width: 992px) {
--medium-font-size: 12px;
}
flex-grow: 1;
.route_transport{
display: flex;
@@ -361,6 +401,10 @@
}
}
.route_btn_title{
@media (max-width: 768px) {
--big-font-size: 14px;
--medium-font-size: 12px;
}
color: var(--route-btn-title-color);
font-size: var(--medium-font-size);
&.big{

View File

@@ -26,6 +26,29 @@
</div>
<div class="route_number">{% trans "Объявление №" %} {{ route.id }}</div>
</div>
<div class="route_card_info_data mobile">
<img class="route_card_text_img" src="{% static "v2/icons/widgets/w_route_card/route_card_avatar_spline.svg" %}">
<img class="route_card_owner_avatar" src="{{ route.owner.user_profile.avatar.url }}">
<div class="route_card_owner_info">
<div class="route_card_info_left_part">
<div class="card_owner_type {{ route.owner_type }}">{% if route.owner_type == 'customer' %}{% trans "Нужен перевозчик" %}{% else %}{% trans "Могу перевезти" %}{% endif %}</div>
<div class="card_cargo_type">{% trans "Тип посылки:" %} <div class="orange">{{ route.get_cargo_type_display }}</div></div>
</div>
<div class="route_btn phone inactive" style="--route-btn-width: max-content;--route-btn-height: min-content;--route-btn-padding: 7.5px 11px;">
<img src="{% static "v2/icons/widgets/w_route_card/phone_half_opacity.svg" %}" alt="">
<div class="route_btn_title big">{{ route.phone }}</div>
</div>
</div>
<div class="card_owner_name">{{ route.owner }}</div>
<div class="route_card_text_container">
{% if route.comment %}
{{ route.comment|linebreaksbr }}
{% else %}
{% trans "Комментарий отсутствует" %}
{% endif %}
</div>
<div class="route_number">{% trans "Объявление №" %} {{ route.id }}</div>
</div>
<div class="route_card_route_data">
<div class="from_to_place_data">
<div class="label departure_from">{% trans "Забрать из:" %}</div>