From 38054a1c1ef51c75f626fc68c68029a491783f73 Mon Sep 17 00:00:00 2001
From: merelendor <merelendor@gmail.com>
Date: Mon, 23 Oct 2023 11:57:49 +0300
Subject: [PATCH] update for mobile markup

---
 css/main/style.css                            | 40 +++++++++++++++++++
 css/main/style.less                           | 38 ++++++++++++++++++
 .../deal_contract_status_mobile_arrow.svg     |  4 ++
 3 files changed, 82 insertions(+)
 create mode 100644 public/assets/images/deal_contract_status_mobile_arrow.svg

diff --git a/css/main/style.css b/css/main/style.css
index cc93eb8..d26751f 100644
--- a/css/main/style.css
+++ b/css/main/style.css
@@ -6739,6 +6739,12 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block .block_body .fines_
   align-items: flex-start !important;
   margin-bottom: 30px;
   width: 100%;
+  flex-direction: row;
+}
+@media all and (max-width: 640px) {
+  .edo_list_field {
+    flex-direction: column;
+  }
 }
 .edo_list_field label {
   width: 186px;
@@ -6748,6 +6754,11 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block .block_body .fines_
   flex: 1;
   margin-top: -12px;
 }
+@media all and (max-width: 640px) {
+  .edo_list_selection {
+    margin-top: 20px;
+  }
+}
 .edo_list_selection .item {
   width: 100%;
   padding: 16px 0px;
@@ -6832,6 +6843,11 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block .block_body .fines_
   padding-bottom: 15px;
   border-top: solid 1px #edeff5;
 }
+@media all and (max-width: 640px) {
+  .edo_sign_documents_document {
+    flex-direction: column;
+  }
+}
 .edo_sign_documents_document .status_icon {
   width: 24px;
   min-width: 24px;
@@ -6863,12 +6879,36 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block .block_body .fines_
 .edo_sign_documents_document .edo_sign_documents_document_left {
   width: 35%;
 }
+@media all and (max-width: 640px) {
+  .edo_sign_documents_document .edo_sign_documents_document_left {
+    width: 100%;
+  }
+}
 .edo_sign_documents_document .edo_sign_documents_document_right {
   width: 65%;
   display: flex;
   align-items: center;
   justify-content: flex-start;
 }
+@media all and (max-width: 640px) {
+  .edo_sign_documents_document .edo_sign_documents_document_right {
+    width: 100%;
+    margin-top: 20px;
+    margin-left: 40px;
+    position: relative;
+    padding-right: 40px;
+    align-items: flex-start;
+  }
+  .edo_sign_documents_document .edo_sign_documents_document_right::before {
+    content: "";
+    position: absolute;
+    top: -17px;
+    left: -40px;
+    width: 40px;
+    height: 40px;
+    background: url(/assets/images/deal_contract_status_mobile_arrow.svg) no-repeat;
+  }
+}
 .edo_sign_documents_document .edo_sign_documents_document_right i {
   width: 100% !important;
   height: auto !important;
diff --git a/css/main/style.less b/css/main/style.less
index 581627c..60554d6 100644
--- a/css/main/style.less
+++ b/css/main/style.less
@@ -7705,6 +7705,12 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
     margin-bottom: 30px;
     width: 100%;
 
+	flex-direction: row;
+
+	@media all and (max-width: 640px) {
+		flex-direction: column;
+	}
+
     label {
         width: 186px;
         margin-right: 12px;
@@ -7715,6 +7721,10 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
     flex: 1;
     margin-top: -12px;
 
+	@media all and (max-width: 640px) {
+		margin-top: 20px;
+	}
+
     .item {
         width: 100%;
         padding: 16px 0px;
@@ -7816,6 +7826,10 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
     flex-direction: row;
     gap: 0px 30px;
 
+	@media all and (max-width: 640px) {
+		flex-direction: column;
+	}
+
     padding-top: 15px;
     padding-bottom: 15px;
 
@@ -7857,6 +7871,10 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
 
     .edo_sign_documents_document_left {
         width: 35%;
+
+		@media all and (max-width: 640px) {
+			width: 100%;
+		}
     }
 
     .edo_sign_documents_document_right {
@@ -7865,6 +7883,26 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
         align-items: center;
         justify-content: flex-start;
 
+		@media all and (max-width: 640px) {
+			width: 100%;
+			margin-top: 20px;
+			margin-left: 40px;
+			position: relative;
+			padding-right: 40px;
+
+			align-items: flex-start;
+
+			&::before {
+				content: "";
+				position: absolute;
+				top: -17px;
+				left: -40px;
+				width: 40px;
+				height: 40px;
+				background: url(/assets/images/deal_contract_status_mobile_arrow.svg) no-repeat;
+			}
+		}
+
         i {
             width: 100% !important;
             height: auto !important;
diff --git a/public/assets/images/deal_contract_status_mobile_arrow.svg b/public/assets/images/deal_contract_status_mobile_arrow.svg
new file mode 100644
index 0000000..40d9550
--- /dev/null
+++ b/public/assets/images/deal_contract_status_mobile_arrow.svg
@@ -0,0 +1,4 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="40" height="40"/>
+<path d="M30.9999 28.0002L25.9999 25.1135L25.9999 30.887L30.9999 28.0002ZM15.999 28.0002L15.499 28.0002L15.499 28.5002L15.999 28.5002L15.999 28.0002ZM15.499 -9.57005e-07L15.499 1.00001L16.499 1.00001L16.499 9.57005e-07L15.499 -9.57005e-07ZM15.499 3.00002L15.499 5.00004L16.499 5.00004L16.499 3.00003L15.499 3.00002ZM15.499 7.00006L15.499 9.00007L16.499 9.00008L16.499 7.00006L15.499 7.00006ZM15.499 11.0001L15.499 13.0001L16.499 13.0001L16.499 11.0001L15.499 11.0001ZM15.499 15.0001L15.499 17.0001L16.499 17.0001L16.499 15.0001L15.499 15.0001ZM15.499 19.0002L15.499 21.0002L16.499 21.0002L16.499 19.0002L15.499 19.0002ZM15.499 23.0002L15.499 25.0002L16.499 25.0002L16.499 23.0002L15.499 23.0002ZM15.499 27.0002L15.499 28.0002L16.499 28.0002L16.499 27.0002L15.499 27.0002ZM15.999 28.5002L16.9365 28.5002L16.9365 27.5002L15.999 27.5002L15.999 28.5002ZM18.8117 28.5002L20.6868 28.5002L20.6868 27.5002L18.8117 27.5002L18.8117 28.5002ZM22.5619 28.5002L24.437 28.5002L24.437 27.5002L22.5619 27.5002L22.5619 28.5002ZM26.3121 28.5002L28.1873 28.5002L28.1873 27.5002L26.3121 27.5002L26.3121 28.5002Z" fill="#8F94A5"/>
+</svg>