From 134acbc9832e7f589ae2d18b8ac9f61720c922ca Mon Sep 17 00:00:00 2001
From: Svetlana Rastegina <rasteginas@yandex.ru>
Date: Fri, 5 Feb 2021 14:30:54 +0100
Subject: [PATCH] Modified expanded search block and fix width properties
 custom search block on main page.

---
 webapp/src/main/webapp/themes/iph/css/iph.css | 34 +++++++++++-----
 .../themes/iph/css/query-builder-theme.css    | 40 ++++++++++---------
 .../webapp/themes/iph/css/query-builder.css   | 10 ++---
 3 files changed, 52 insertions(+), 32 deletions(-)

diff --git a/webapp/src/main/webapp/themes/iph/css/iph.css b/webapp/src/main/webapp/themes/iph/css/iph.css
index a14e2ad7..fe2de0d2 100644
--- a/webapp/src/main/webapp/themes/iph/css/iph.css
+++ b/webapp/src/main/webapp/themes/iph/css/iph.css
@@ -515,7 +515,7 @@ ul#header-nav a.log-out {
 /* SEARCH ------>  */
 .search-form-container {
 	display: flex;
-	flex-direction: raw;
+	flex-direction: row;
 	flex-wrap: no-wrap;
 	justify-content: center;
 	width: 100%;
@@ -539,7 +539,7 @@ ul#header-nav a.log-out {
 #custom-search {
 	width: 50%;
 	display: flex;
-	flex-direction: raw;
+	flex-direction: row;
 	flex-wrap: no-wrap;
 	justify-content: center;
 }
@@ -912,19 +912,22 @@ p.external-auth a.blue:hover {
 }
 /* HOME SEARCH ------>  */
 #search-home {
-    /*float: left;*/
-    margin-bottom: 10px;
-    margin-top: 10px;
-    width: 100%; 
-    
+   /*float: left;*/
+   margin-bottom: 10px;
+   margin-top: 10px;
+   width: 100%; 
+   display: flex;
+   flex-direction: row;
+	justify-content: center;
 }
 
 #simple-search-container {
 	display: flex;
-	flex-direction: raw;
+	flex-direction: row;
 	justify-content: center;
 	flex-wrap: wrap;
 	align-content: center;
+	width: 100%;
 }
 
 
@@ -964,6 +967,19 @@ input.search-home-vivo {
     margin-top: 2px;
 }
 
+/* SEARCH HOME EXPANDED------>  */
+
+#querybuilder-container {
+	width: 80%;
+	display: flex;
+	flex-direction: column;
+	flex-wrap: wrap;
+	justify-content: center;
+}
+
+
+
+
 /* SEARCH HOME------>  */
 
 #search-home-field {
@@ -1257,7 +1273,7 @@ div#adjImgHeight {
 
 #footerWrapper {
 	display: flex;
-	flex-direction: raw;
+	flex-direction: row;
 	flex-wrap: no-wrap;
 	justify-content: center;
 }
diff --git a/webapp/src/main/webapp/themes/iph/css/query-builder-theme.css b/webapp/src/main/webapp/themes/iph/css/query-builder-theme.css
index eaaa2036..3c4473f4 100644
--- a/webapp/src/main/webapp/themes/iph/css/query-builder-theme.css
+++ b/webapp/src/main/webapp/themes/iph/css/query-builder-theme.css
@@ -31,7 +31,7 @@ icons: {
 	display: inline-block;
 	padding: 6px 12px;
 	margin-bottom: 0px;
-	font-size: 14px;
+	font-size: 16px;
 	font-weight: 400;
 	line-height: 1.42857;
 	text-align: center;
@@ -41,8 +41,8 @@ icons: {
 	cursor: pointer;
 	user-select: none;
 	background-image: none;
-	border: 1px solid transparent;
-	border-radius: 4px;
+	/*border: 1px solid transparent;*/
+	/*border-radius: 4px;*/
 }
 
 .query-builder .btn.focus, .query-builder .btn:focus, .query-builder .btn:hover
@@ -54,31 +54,35 @@ icons: {
 .query-builder .btn.active, .query-builder .btn:active {
 	background-image: none;
 	outline: 0px none;
-	box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.125) inset;
+/*	box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.125) inset; */
 }
 
 .query-builder .btn-success {
-	color: #FFF;
-	background-color: #5CB85C;
-	border-color: #4CAE4C;
+	color: #000000;
+	background-color: #ffffff;
+	border: 0px;
+	
+	
 }
 
 .query-builder .btn-primary {
-	color: #FFF;
-	background-color: #337AB7;
-	border-color: #2E6DA4;
+	color: #000000;
+	background-color: #ffffff;
+	border-color: #000000;
+	border-style: dashed;
+	border-width: 1px;
 }
 
 .query-builder .btn-danger {
 	color: #FFF;
 	background-color: #D9534F;
-	border-color: #D43F3A;
+	border-color: #000000;
 }
 
 .query-builder .btn-success.active, .query-builder .btn-success.focus,
 	.query-builder .btn-success:active, .query-builder .btn-success:focus,
 	.query-builder .btn-success:hover {
-	color: #FFF;
+	color: #000000;
 	background-color: #449D44;
 	border-color: #398439;
 }
@@ -86,16 +90,16 @@ icons: {
 .query-builder .btn-primary.active, .query-builder .btn-primary.focus,
 	.query-builder .btn-primary:active, .query-builder .btn-primary:focus,
 	.query-builder .btn-primary:hover {
-	color: #FFF;
-	background-color: #286090;
-	border-color: #204D74;
+	color: #000000;
+	background-color: #EAD6A2;
+	border-color: #000000;
 }
 
 .query-builder .btn-danger.active, .query-builder .btn-danger.focus,
 	.query-builder .btn-danger:active, .query-builder .btn-danger:focus,
 	.query-builder .btn-danger:hover {
-	color: #FFF;
-	background-color: #C9302C;
+	color: #000000;
+	background-color: #ffffff;
 	border-color: #AC2925;
 }
 
@@ -134,5 +138,5 @@ icons: {
 	padding: 1px 5px;
 	font-size: 12px;
 	line-height: 1.5;
-	border-radius: 3px;
+	/*border-radius: 3px;*/
 }
diff --git a/webapp/src/main/webapp/themes/iph/css/query-builder.css b/webapp/src/main/webapp/themes/iph/css/query-builder.css
index 22e8fcec..3bb0243f 100644
--- a/webapp/src/main/webapp/themes/iph/css/query-builder.css
+++ b/webapp/src/main/webapp/themes/iph/css/query-builder.css
@@ -7,9 +7,9 @@
 	.query-builder .rule-placeholder {
 	position: relative;
 	margin: 4px 0;
-	border-radius: 5px;
+	/*border-radius: 5px;*/
 	padding: 5px;
-	border: 1px solid #EEE;
+	border: 1px dashed #000000;
 	background: rgba(255, 255, 255, 0.9);
 }
 
@@ -24,8 +24,8 @@
 .query-builder .rules-group-container {
 	padding: 10px;
 	padding-bottom: 6px;
-	border: 1px solid #DCC896;
-	background: rgba(250, 240, 210, 0.5);
+	border: 1px solid #8B4513;
+	background: #F1F1F1;
 }
 
 .query-builder .rules-group-header {
@@ -117,7 +117,7 @@
 }
 
 .query-builder .rules-list>*:last-child::before {
-	border-radius: 0 0 0 4px;
+	/*border-radius: 0 0 0 4px;*/
 }
 
 .query-builder .rules-list>*:last-child::after {