0.0.30 forms

This commit is contained in:
SBD
2025-01-15 18:00:11 +03:00
parent 97be421ee3
commit 33239e3c90
3 changed files with 83 additions and 2 deletions

View File

@@ -6,7 +6,7 @@
--big-font-size: 16px;
--medium-font-size: 14px;
--small-font-size: 12px;
--small-font-size: 10px;
--route-text-container-bg: #F1F1F1;
--route-text-container-padding: 15px;
@@ -22,6 +22,16 @@
--route_card_route_data-margin-top: 30px;
--route-btn-border: 1.5px solid #FF613A;
--route-btn-border-radius: 10px;
--route-btn-padding: 7.5px 0;
--route-btn-width: 171px;
--route-btn-bg: #FFFFFF;
--route-btn-hover-bg: #FF613A;
--route-btn-hover-text-color: #FFFFFF;
--route-btn-title-color: #272424;
--route-btn-text-data-color: #27242499;
background: var(--route-card-bg);
box-shadow: var(--route-card-box_shadow);
border-radius: 10px;
@@ -143,6 +153,7 @@
justify-content: center;
gap: 5px;
margin-bottom: 10px;
margin-top: 8px;
.route_transport_name{
font-size: var(--medium-font-size);
font-weight: 600;
@@ -162,6 +173,7 @@
border-radius: 100%;
position: absolute;
top: -10px;
z-index: 2;
&:first-of-type{
border: 3px solid #065BFF;
left: 0;
@@ -175,9 +187,62 @@
width: calc(100% - 10px);
margin-left: 10px;
height: 4px;
position: absolute;
top: 2px;
z-index: 1;
background: linear-gradient(90deg, rgba(6,91,255,1) 0%, rgba(69,194,38,1) 100%);
}
}
}
}
.route_card_actions_container{
margin-top: 23px;
display: flex;
justify-content: space-between;
align-items: center;
.delete_route{
cursor: pointer;
color: #27242499;
font-size: var(--medium-font-size);
&:hover{
color: #FF613A;
}
}
.right_part_action_btns{
display: flex;
align-items: center;
gap: 20px;
}
.route_btn{
cursor: pointer;
&.solid{
--route-btn-width: 222px;
--route-btn-padding: 12px 0;
--route-btn-bg: #FF613A;
--route-btn-title-color: #ffffff;
}
width: var(--route-btn-width);
border: var(--route-btn-border);
border-radius: var(--route-btn-border-radius);
padding: var(--route-btn-padding);
background: var(--route-btn-bg);
height: 100%;
text-align: center;
transition: 200ms all;
&:hover{
background: var(--route-btn-hover-bg);
.route_btn_title{color: var(--route-btn-hover-text-color);}
.route_btn_data{color: var(--route-btn-hover-text-color);}
box-shadow: 0 4px 4px rgba(189, 104, 104, 0.25);
}
.route_btn_title{
color: var(--route-btn-title-color);
font-size: var(--medium-font-size);
}
.route_btn_data{
font-size: var(--small-font-size);
color: var(--route-btn-text-data-color);
}
}
}
}