composer/iTop
6
0
Fork 0
mirror of https://github.com/Combodo/iTop.git synced 2026-04-23 18:48:51 +02:00
Code Issues Packages Projects Releases Wiki Activity

Advanced search: WIP POC, UI/UX.

Browse Source 
SVN:b1162[5439]
This commit is contained in:
Guillaume Lajarige
2018-03-16 08:08:24 +00:00
parent 156cb03069
commit a1c6e32e28
11 changed files with 172 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
css/light-grey.css
View File

@@ -704,35 +704,6 @@ input.dp-applied {
}
}
}*/
.DrawerClosed {
display: none;
}
.DrawerHandle {
margin: 0;
padding: 5px;
background: url(../images/drawer-handle.gif) bottom no-repeat transparent;
color: #fff;
cursor: pointer;
text-align: center;
/* center the block */
width: 100px;
margin-left: auto;
margin-right: auto;
margin-top: 0;
margin-bottom: 0;
display: block;
font-size: 12px;
}
div.HRDrawer {
height: 5px;
width: 100%;
margin: 0;
background-color: #1c94c4;
margin-top: 10px;
padding: 0;
border: 0;
display: block;
}
.mini_tabs a {
text-decoration: none;
font-weight: bold;
@@ -759,10 +730,18 @@ div.HRDrawer {
}
/* Search forms v2 */
/* TODO: Remove comment before final commit */
.search_box {
box-sizing: border-box;
/* Sizing reset */
}
.search_box * {
box-sizing: border-box;
}
.search_form_handler {
position: relative;
z-index: 10;
font-size: 12px;
border: 1px solid #3f7294;
/* Sizing reset */
/* Hyperlink reset */
}
@@ -773,7 +752,30 @@ div.HRDrawer {
color: inherit;
text-decoration: none;
}
.search_form_handler.opened .sf_title .sft_toggler {
transform: rotateX(180deg);
}
.search_form_handler.opened .sf_criterion_area {
/*display: inherit;*/
}
.search_form_handler .sf_title {
padding: 8px 10px;
margin: 0;
color: #fff;
background-color: #3f7294;
/* Pictogram */
}
.search_form_handler .sf_title > span {
margin-right: 10px;
}
.search_form_handler .sf_title .sft_toggler {
transition: all 0.4s ease-in-out;
}
.search_form_handler .sf_criterion_area {
/*display: none;*/
padding: 8px 8px 3px 8px;
/* padding-bottom must equals to padding-top - .search_form_criteria:margin-bottom */
background-color: #fff;
/* Common style between criterion and more criterion */
/* Criteria tags */
/* More criterion */
@@ -782,6 +784,13 @@ div.HRDrawer {
position: relative;
display: inline-block;
}
.search_form_handler .sf_criterion_area .search_form_criteria, .search_form_handler .sf_criterion_area .sf_more_criterion {
margin-bottom: 5px;
}
.search_form_handler .sf_criterion_area .search_form_criteria.opened, .search_form_handler .sf_criterion_area .sf_more_criterion.opened {
margin-bottom: 0px;
/* To compensate the .sfc/.sfm_header:padding-bottom: 13px */
}
.search_form_handler .sf_criterion_area .search_form_criteria.opened .sfc_header, .search_form_handler .sf_criterion_area .sf_more_criterion.opened .sfc_header, .search_form_handler .sf_criterion_area .search_form_criteria.opened .sfm_header, .search_form_handler .sf_criterion_area .sf_more_criterion.opened .sfm_header {
border-bottom: none !important;
box-shadow: none !important;
@@ -791,9 +800,9 @@ div.HRDrawer {
.search_form_handler .sf_criterion_area .search_form_criteria > *, .search_form_handler .sf_criterion_area .sf_more_criterion > * {
padding: 7px 8px;
vertical-align: top;
background-color: #d6e8ef;
background-color: #f0f3f5;
color: #2d2d2d;
border: 1px solid #1c94c4;
border: 1px solid #3f7294;
border-radius: 1px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
}
@@ -808,7 +817,6 @@ div.HRDrawer {
position: relative;
display: inline-block;
margin-right: 5px;
margin-bottom: 5px;
/* Non editable criteria */
/* Draft criteria (modifications not applied) */
/* Opened criteria (form group displayed) */
@@ -828,13 +836,20 @@ div.HRDrawer {
z-index: 1;
/* To be over other criterion */
}
.search_form_handler .sf_criterion_area .search_form_criteria.opened .sfc_toggle {
transform: rotateX(-180deg);
}
.search_form_handler .sf_criterion_area .search_form_criteria.opened .sfc_form_group {
display: block;
}
.search_form_handler .sf_criterion_area .search_form_criteria.opened_left .sfc_form_group {
left: auto;
right: 0px;
}
.search_form_handler .sf_criterion_area .search_form_criteria .sfc_close, .search_form_handler .sf_criterion_area .search_form_criteria .sfc_toggle {
position: absolute;
top: 7px;
color: #1c94c4;
color: #3f7294;
}
.search_form_handler .sf_criterion_area .search_form_criteria .sfc_close {
right: 7px;
@@ -842,10 +857,7 @@ div.HRDrawer {
.search_form_handler .sf_criterion_area .search_form_criteria .sfc_toggle {
display: inline-block;
right: 23px;
transition: all 0.4s ease-in-out;
}
.search_form_handler .sf_criterion_area .search_form_criteria .sfc_toggle.opened {
transform: rotateZ(-180deg);
transition: all 0.3s ease-in-out;
}
.search_form_handler .sf_criterion_area .search_form_criteria .sfc_title {
padding-right: 35px;
@@ -896,7 +908,7 @@ div.HRDrawer {
bottom: 4px;
right: 0px;
cursor: pointer;
color: #1c94c4;
color: #3f7294;
font-size: 10px;
font-weight: bold;
border: none;
@@ -942,11 +954,15 @@ div.HRDrawer {
.search_form_handler .sf_criterion_area .sf_more_criterion.opened .sfm_content {
display: inherit;
}
.search_form_handler .sf_criterion_area .sf_more_criterion.opened_left .sfm_content {
left: auto;
right: 0px;
}
.search_form_handler .sf_criterion_area .sf_more_criterion .sfm_toggler .sfm_tg_title {
margin-right: 7px;
}
.search_form_handler .sf_criterion_area .sf_more_criterion .sfm_toggler .sfm_tg_icon {
color: #1c94c4;
color: #3f7294;
}
.search_form_handler .sf_criterion_area .sf_more_criterion .sfm_content {
display: none;