evo/evoleasing-account
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style fix

Browse Source
This commit is contained in:
Денис Воронков 2023-10-29 16:26:28 +03:00
parent 498f2335f7
commit e466aef876
3 changed files with 164 additions and 154 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/DealsStatus/components/Offers.js
View File

@ -150,7 +150,7 @@ export default class Offers extends Step
<td> <td>
<div className="form_field checkbox checkbox_disabled"> <div className="form_field checkbox checkbox_disabled">
<input type="checkbox" name="row" id={`offer_${ offer.quote_number }`} checked={ true } onChange={ () => { } } style={{ filter: "grayscale", opacity: 0.5 }}/> <input type="checkbox" name="row" id={`offer_${ offer.quote_number }`} checked={ true } onChange={ () => { } } style={{ filter: "grayscale", opacity: 0.5 }}/>
<label htmlFor={`offer_${ offer.quote_number }`}></label> <label htmlFor={`offer_${ offer.quote_number }`} data-text="Принято"></label>
</div> </div>
</td> </td>
) } ) }

58
css/main/style.css
View File

@ -6064,6 +6064,28 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block .block_body .fines_
.contractStatus_modal .single_status > div .status_body .wrap table .i-pdf span { .contractStatus_modal .single_status > div .status_body .wrap table .i-pdf span {
font-weight: 400; font-weight: 400;
} }
@media all and (max-width: 920px) {
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table label[data-text] {
height: auto;
width: 100%;
display: flex;
align-items: center;
min-height: 16px;
}
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table label[data-text]:before {
position: relative;
order: 2;
margin-left: auto;
margin-right: calc(50% - 16px);
}
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table label[data-text]:after {
content: attr(data-text);
order: 1;
display: block;
padding-top: 0;
width: 50%;
}
}
@media all and (max-width: 920px) { @media all and (max-width: 920px) {
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table thead { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table thead {
display: none; display: none;
@ -6074,27 +6096,19 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block .block_body .fines_
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table tr { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table tr {
display: block; display: block;
position: relative; position: relative;
padding-left: 31px; padding-left: 0;
} }
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td {
display: block; display: block;
padding: 8px; padding: 8px;
} }
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:first-child:not(:empty) { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:first-child:not(:empty) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 32px;
box-sizing: border-box; box-sizing: border-box;
background: #fff; background: #fff;
border-top: 0;
border-bottom: 0;
border-left: 0;
} }
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:first-child:not(:empty) .form_field { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:first-child:not(:empty) .form_field {
width: 16px; display: flex;
margin: auto; width: 100%;
} }
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:not(:last-child) { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:not(:last-child) {
border-bottom: 0; border-bottom: 0;
@ -6131,34 +6145,22 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block .block_body .fines_
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table tr { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table tr {
display: block; display: block;
position: relative; position: relative;
padding-right: 56px; padding-right: 0;
padding-left: 0;
} }
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td {
display: block; display: block;
padding: 8px; padding: 8px;
} }
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:first-child:not(:empty) {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 57px;
box-sizing: border-box;
background: #fff;
border-top: 0;
border-bottom: 0;
border-right: 0;
}
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:first-child:not(:empty) .form_field {
width: 16px;
margin: auto;
}
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:not(:last-child) { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:not(:last-child) {
border-bottom: 0; border-bottom: 0;
} }
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:empty { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td:empty {
display: none; display: none;
} }
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td label[data-text]:before {
margin-right: 0;
}
.contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td[data-title]:before { .contractStatus_modal .single_status > div .status_body .wrap table.deal_offers_table td[data-title]:before {
content: attr(data-title); content: attr(data-title);
color: var(--text_not_active); color: var(--text_not_active);

258
css/main/style.less
View File

@ -2925,9 +2925,9 @@ main {
display: flex; display: flex;
width: 100%; width: 100%;
@media (max-width: 1280px) { @media (max-width: 1280px) {
padding-bottom: 0px !important; padding-bottom: 0px !important;
} }
.table_cell { .table_cell {
padding: 16px 8px; padding: 16px 8px;
@ -2962,10 +2962,10 @@ main {
color: var(--green); color: var(--green);
} }
@media (max-width: 1280px) { @media (max-width: 1280px) {
width: 100%; width: 100%;
margin-top: 40px; margin-top: 40px;
} }
} }
b { b {
@ -4153,7 +4153,7 @@ main .dropdown_blocks_list .dropdown_block .block_body {
} }
@media all and (max-width: 960px) { @media all and (max-width: 960px) {
// width: 100%; // width: 100%;
margin-top: 10px; margin-top: 10px;
} }
} }
@ -6651,7 +6651,7 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
@media all and (max-width: 768px) { @media all and (max-width: 768px) {
flex-wrap: wrap; flex-wrap: wrap;
height: auto; height: auto;
} }
@ -6822,7 +6822,7 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
@media all and (max-width: 768px) { @media all and (max-width: 768px) {
margin-right: 0; margin-right: 0;
padding-top: 0; padding-top: 0;
line-height: 15px; line-height: 15px;
} }
&:before { &:before {
@ -6892,6 +6892,33 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
} }
&.deal_offers_table { &.deal_offers_table {
@media all and (max-width: 920px) {
label[data-text] {
height: auto;
width: 100%;
display: flex;
align-items: center;
min-height: 16px;
&:before {
position: relative;
order: 2;
margin-left: auto;
margin-right: calc(50% - 16px);
}
&:after {
content: attr(data-text);
order: 1;
display: block;
padding-top: 0;
width: 50%;
}
}
}
@media all and (max-width: 920px) { @media all and (max-width: 920px) {
thead { thead {
display: none; display: none;
@ -6904,7 +6931,7 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
tr { tr {
display: block; display: block;
position: relative; position: relative;
padding-left: 31px; padding-left: 0;
} }
td { td {
@ -6912,20 +6939,12 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
padding: 8px; padding: 8px;
&:first-child:not(:empty) { &:first-child:not(:empty) {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 32px;
box-sizing: border-box; box-sizing: border-box;
background: #fff; background: #fff;
border-top: 0;
border-bottom: 0;
border-left: 0;
.form_field { .form_field {
width: 16px; display: flex;
margin: auto; width: 100%;
} }
} }
@ -6973,31 +6992,14 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
tr { tr {
display: block; display: block;
position: relative; position: relative;
padding-right: 56px; padding-right: 0;
padding-left: 0;
} }
td { td {
display: block; display: block;
padding: 8px; padding: 8px;
&:first-child:not(:empty) {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 57px;
box-sizing: border-box;
background: #fff;
border-top: 0;
border-bottom: 0;
border-right: 0;
.form_field {
width: 16px;
margin: auto;
}
}
&:not(:last-child) { &:not(:last-child) {
border-bottom: 0; border-bottom: 0;
} }
@ -7006,6 +7008,12 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
display: none; display: none;
} }
label[data-text] {
&:before {
margin-right: 0;
}
}
&[data-title]:before { &[data-title]:before {
content: attr(data-title); content: attr(data-title);
color: var(--text_not_active); color: var(--text_not_active);
@ -7135,7 +7143,7 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
gap: 10px 0; gap: 10px 0;
button { button {
width :100%; width: 100%;
} }
} }
} }
@ -7192,9 +7200,9 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
@media all and (max-width: 1279px) { @media all and (max-width: 1279px) {
flex-wrap: wrap; flex-wrap: wrap;
} }
@ -7280,7 +7288,7 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
@media all and (max-width: 1279px) { @media all and (max-width: 1279px) {
flex: auto; flex: auto;
width: 100%; width: 100%;
@ -7296,14 +7304,14 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
button { button {
white-space: nowrap; white-space: nowrap;
@media all and (max-width: 1279px) { @media all and (max-width: 1279px) {
order: 1; order: 1;
padding: 0; padding: 0;
justify-content: flex-start; justify-content: flex-start;
width: 100%; width: 100%;
} }
} }
.status { .status {
@ -7715,19 +7723,19 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
margin-bottom: 30px; margin-bottom: 30px;
width: 100%; width: 100%;
flex-direction: row; flex-direction: row;
@media all and (max-width: 640px) { @media all and (max-width: 640px) {
flex-direction: column; flex-direction: column;
} }
label { label {
width: 186px; width: 186px;
margin-right: 12px; margin-right: 12px;
&.wide { &.wide {
width: 30%; width: 30%;
} }
} }
} }
@ -7735,9 +7743,9 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
flex: 1; flex: 1;
margin-top: -12px; margin-top: -12px;
@media all and (max-width: 640px) { @media all and (max-width: 640px) {
margin-top: 20px; margin-top: 20px;
} }
.item { .item {
width: 100%; width: 100%;
@ -7840,9 +7848,9 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
flex-direction: row; flex-direction: row;
gap: 0px 30px; gap: 0px 30px;
@media all and (max-width: 640px) { @media all and (max-width: 640px) {
flex-direction: column; flex-direction: column;
} }
padding-top: 15px; padding-top: 15px;
padding-bottom: 15px; padding-bottom: 15px;
@ -7886,9 +7894,9 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
.edo_sign_documents_document_left { .edo_sign_documents_document_left {
width: 35%; width: 35%;
@media all and (max-width: 640px) { @media all and (max-width: 640px) {
width: 100%; width: 100%;
} }
} }
.edo_sign_documents_document_right { .edo_sign_documents_document_right {
@ -7897,25 +7905,25 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
@media all and (max-width: 640px) { @media all and (max-width: 640px) {
width: 100%; width: 100%;
margin-top: 20px; margin-top: 20px;
margin-left: 40px; margin-left: 40px;
position: relative; position: relative;
padding-right: 40px; padding-right: 40px;
align-items: flex-start; align-items: flex-start;
&::before { &::before {
content: ""; content: "";
position: absolute; position: absolute;
top: -17px; top: -17px;
left: -40px; left: -40px;
width: 40px; width: 40px;
height: 40px; height: 40px;
background: url(/assets/images/deal_contract_status_mobile_arrow.svg) no-repeat; background: url(/assets/images/deal_contract_status_mobile_arrow.svg) no-repeat;
} }
} }
i { i {
width: 100% !important; width: 100% !important;
@ -7959,46 +7967,46 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
.actions { .actions {
width: 65%; width: 65%;
justify-content: space-between; justify-content: space-between;
justify-content: flex-start !important; justify-content: flex-start !important;
.status_icon { .status_icon {
width: 24px; width: 24px;
min-width: 24px; min-width: 24px;
height: 24px; height: 24px;
min-height: 24px; min-height: 24px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
background-position-y: -1px; background-position-y: -1px;
background-position-x: -1px; background-position-x: -1px;
&.success {
background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21Z' stroke='%235FB158' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16.125 9.75L10.625 15L7.875 12.375' stroke='%235FB158' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
border: none !important;
}
&.error {
background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21Z' stroke='%23ED0A34' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M13 16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16C11 15.4477 11.4477 15 12 15C12.5523 15 13 15.4477 13 16Z' fill='%23ED0A34'/%3E%3Cpath d='M12 8L12 12' stroke='%23ED0A34' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
border: none !important;
}
&.await {
background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21Z' stroke='%238E94A7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 8L12 12' stroke='%238E94A7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16 12L12 12' stroke='%238E94A7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
border: none !important;
}
}
.status_title {
padding: 0px 10px;
i {
display: contents;
}
}
&.actions_with_status { &.success {
justify-content: flex-start !important; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21Z' stroke='%235FB158' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16.125 9.75L10.625 15L7.875 12.375' stroke='%235FB158' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
margin-left: 15px; border: none !important;
} }
&.error {
background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21Z' stroke='%23ED0A34' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M13 16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16C11 15.4477 11.4477 15 12 15C12.5523 15 13 15.4477 13 16Z' fill='%23ED0A34'/%3E%3Cpath d='M12 8L12 12' stroke='%23ED0A34' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
border: none !important;
}
&.await {
background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21Z' stroke='%238E94A7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 8L12 12' stroke='%238E94A7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16 12L12 12' stroke='%238E94A7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
border: none !important;
}
}
.status_title {
padding: 0px 10px;
i {
display: contents;
}
}
&.actions_with_status {
justify-content: flex-start !important;
margin-left: 15px;
}
} }
&:first-child { &:first-child {
@ -8020,11 +8028,11 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
} }
.checkbox_disabled { .checkbox_disabled {
label { label {
&:before { &:before {
filter: grayscale(); filter: grayscale();
opacity: 0.5; opacity: 0.5;
cursor: default !important; cursor: default !important;
} }
} }
} }