more styling of the searchview

bzr revid: mit@openerp.com-20120525170053-54m17it6lzwnea33
This commit is contained in:
Minh Tran 2012-05-25 19:00:53 +02:00
parent 72b98f2b70
commit 4abc07e5b8
4 changed files with 100 additions and 53 deletions

View File

@ -1,4 +1,4 @@
@charset "utf-8";
@charset "UTF-8";
@font-face {
font-family: "mnmliconsRegular";
src: url("/web/static/src/font/mnmliconsv21-webfont.eot") format("eot");
@ -1350,6 +1350,11 @@
border-top: none;
margin: 0;
}
.openerp .oe_searchview .oe_searchview_drawer h3 {
margin: 8px 4px 4px 12px;
color: #8786b7;
font-size: 13px;
}
.openerp .oe_searchview .oe_searchview_drawer h4, .openerp .oe_searchview .oe_searchview_drawer h4 * {
margin: 0;
cursor: pointer;
@ -1377,28 +1382,23 @@
-webkit-border-radius: 0;
border-radius: 0;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_filters {
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_section {
display: table;
width: 100%;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_filters > div {
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_section > div {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: table-cell;
width: 50%;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_filters h3 {
margin: 8px 4px 4px 12px;
color: #8786b7;
font-size: 13px;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_filters ul {
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_section ul {
margin: 0 8px 8px;
padding: 0;
list-style: none;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_filters li {
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_section li {
list-style: none;
padding: 2px 4px 2px 20px;
line-height: 14px;
@ -1406,7 +1406,7 @@
cursor: pointer;
position: relative;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_filters li.oe_selected:before {
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_section li.oe_selected:before {
content: "W";
font-family: "entypoRegular" !important;
font-size: 24px;
@ -1416,20 +1416,27 @@
left: 4px;
top: -2px;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_filters li:hover {
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_section li:hover {
background-color: #f0f0fa;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_section form {
margin-left: 12px;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_section form p {
margin: 4px 0;
line-height: 18px;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_section form button {
margin: 0 0 8px 0;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_custom form {
display: none;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_custom li {
cursor: pointer;
position: relative;
line-height: 1.2em;
padding: 2px 20px 2px 25px;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_custom li.oe_searchview_custom_private {
background: url(/web/static/src/img/icons/terp-locked.png) 5px center no-repeat;
line-height: 14px;
padding: 2px 4px 2px 20px;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_custom li:hover {
background-color: #f0f0fa;
@ -1441,6 +1448,7 @@
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_advanced form {
display: none;
margin-top: 8px;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_advanced button.oe_add_condition:before {
content: "Z";
@ -1454,6 +1462,7 @@
padding: 0;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_advanced li {
position: relative;
list-style: none;
margin: 0;
white-space: nowrap;
@ -1466,16 +1475,28 @@
.openerp .oe_searchview .oe_searchview_drawer .oe_opened form {
display: block;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_custom_delete, .openerp .oe_searchview .oe_searchview_drawer .searchview_extended_delete_prop {
font-size: 1px;
letter-spacing: -1px;
color: transparent;
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_custom_delete {
position: absolute;
left: 4px;
top: 3px;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_custom_delete:before, .openerp .oe_searchview .oe_searchview_drawer .searchview_extended_delete_prop:before {
font-family: "mnmliconsRegular";
content: "d";
font-size: 20px;
color: #404040;
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_custom_delete, .openerp .oe_searchview .oe_searchview_drawer .searchview_extended_delete_prop {
width: 12px;
height: 12px;
color: #8786b7;
line-height: 8px;
text-align: center;
font-weight: bold;
text-shadow: 0 1px 1px white;
}
.openerp .oe_searchview .oe_searchview_drawer .oe_searchview_custom_delete:hover, .openerp .oe_searchview .oe_searchview_drawer .searchview_extended_delete_prop:hover {
text-decoration: none;
color: white;
background: #8786b7;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}
.openerp .oe_view_nocontent > img {
float: left;

View File

@ -1067,6 +1067,10 @@ $colour4: #8a89ba
> div:first-child
border-top: none
margin: 0
h3
margin: 8px 4px 4px 12px
color: $section-title-color
font-size: 13px
h4, h4 *
margin: 0
cursor: pointer
@ -1085,17 +1089,13 @@ $colour4: #8a89ba
padding: 0 2px
@include box-shadow(none)
@include radius(0)
.oe_searchview_filters
.oe_searchview_section
display: table
width: 100%
> div
@include unscrew-box
display: table-cell
width: 50%
h3
margin: 8px 4px 4px 12px
color: $section-title-color
font-size: 13px
ul
margin: 0 8px 8px
padding: 0
@ -1119,16 +1119,21 @@ $colour4: #8a89ba
// after oe_selected so background color is not overridden
&:hover
background-color: $hover-background
form
margin-left: 12px
p
margin: 4px 0
line-height: 18px
button
margin: 0 0 8px 0
.oe_searchview_custom
form
display: none
li
cursor: pointer
position: relative
line-height: 1.2em
padding: 2px 20px 2px 25px
&.oe_searchview_custom_private
background: url(/web/static/src/img/icons/terp-locked.png) 5px center no-repeat
line-height: 14px
padding: 2px 4px 2px 20px
&:hover
background-color: $hover-background
button
@ -1138,6 +1143,7 @@ $colour4: #8a89ba
.oe_searchview_advanced
form
display: none
margin-top: 8px
button.oe_add_condition:before
content: "Z"
@ -1149,6 +1155,7 @@ $colour4: #8a89ba
list-style: none
padding: 0
li
position: relative
list-style: none
margin: 0
white-space: nowrap
@ -1161,8 +1168,24 @@ $colour4: #8a89ba
display: block
// delete buttons
.oe_searchview_custom_delete
position: absolute
left: 4px
top: 3px
.oe_searchview_custom_delete, .searchview_extended_delete_prop
@include text-to-icon("d")
width: 12px
height: 12px
color: #8786b7
line-height: 8px
text-align: center
font-weight: bold
text-shadow: 0 1px 1px white
&:hover
text-decoration: none
color: white
background: #8786b7
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4)
@include radius(2px)
// }}}
// Views Common {{{
.oe_view_nocontent

View File

@ -1564,15 +1564,14 @@ instance.web.search.CustomFilters = instance.web.search.Input.extend({
: 'oe_searchview_custom_public')
.text(filter.name);
$('<button type="button" class="oe_searchview_custom_delete">')
.text(_t("Delete"))
$('<a class="oe_searchview_custom_delete">x</a>')
.click(function (e) {
e.stopPropagation();
self.model.call('unlink', [id]).then(function () {
$filter.remove();
});
})
.appendTo($filter);
.prependTo($filter);
}
$filter.unbind('click').click(function () {
@ -1643,7 +1642,7 @@ instance.web.search.Filters = instance.web.search.Input.extend({
var col1 = [], col2 = _(this.view.controls).map(function (inputs, group) {
var filters = _(inputs).filter(is_group);
return {
name: group === 'null' ? _t("Filters") : group,
name: group === 'null' ? _t("<span class='oe_i'>q</span> Filters") : "<span class='oe_i'>w</span> " + group,
filters: filters,
length: _(filters).chain().map(function (i) {
return i.filters.length; }).sum().value()
@ -1666,7 +1665,7 @@ instance.web.search.Filters = instance.web.search.Input.extend({
},
render_column: function (column, $el) {
return $.when.apply(null, _(column).map(function (group) {
$('<h3>').text(group.name).appendTo($el);
$('<h3>').html(group.name).appendTo($el);
return $.when.apply(null,
_(group.filters).invoke('appendTo', $el));
}));

View File

@ -1475,19 +1475,23 @@
</t>
</t>
</t>
<div t-name="SearchView.Filters" class="oe_searchview_filters">
<div t-name="SearchView.Filters" class="oe_searchview_section">
</div>
<div t-name="SearchView.CustomFilters" class="oe_searchview_custom">
<ul class="oe_searchview_custom_list"/>
<h4 class="oe_searchview_custom_title">
<label for="oe_searchview_custom_input">Save search</label></h4>
<form>
<input id="oe_searchview_custom_input" placeholder="Search name"/>
<label for="oe_searchview_custom_public">Share with all users:</label>
<input id="oe_searchview_custom_public" type="checkbox"/><br/>
<button>Save</button><br/>
</form>
<div t-name="SearchView.CustomFilters" class="oe_searchview_section">
<div>
<h3><span class="oe_i">M</span> Custom Filters</h3>
<ul class="oe_searchview_custom_list"/>
</div>
<div>
<h3>Save current search</h3>
<form>
<p><input id="oe_searchview_custom_input" placeholder="Search name"/></p>
<p><input id="oe_searchview_custom_public" type="checkbox"/>
<label for="oe_searchview_custom_public">Share with all users</label></p>
<button>Save</button>
</form>
</div>
</div>
<div t-name="SearchView.advanced" class="oe_searchview_advanced">
<h4>Advanced Search</h4>
@ -1512,7 +1516,7 @@
</select>
<select class="searchview_extended_prop_op"/>
<span class="searchview_extended_prop_value"/>
<button type="button" class="searchview_extended_delete_prop button">Delete</button>
<a class="searchview_extended_delete_prop button">x</a>
</li>
</t>
<t t-name="SearchView.extended_search.proposition.char">