[facet js] fix reordering of facet check boxes. Closes #2732947
Before this patch, when one select an element, it's moved to the top of
the select content. Fine. But when it's later deselected, it stays there
instead of moving back to its original location.
This patch fixes that by introducing a facetCheckBoxReorder function which
properly reorder the whole facet, instead of buggy attempt to locally reorder.
/*
* :organization: Logilab
* :copyright: 2003-2011 LOGILAB S.A. (Paris, FRANCE), all rights reserved.
* :contact: http://www.logilab.fr/ -- mailto:contact@logilab.fr
*/
/***************************************/
/* xhtml tags */
/***************************************/
* {
margin: 0px;
padding: 0px;
}
html, body {
background: #e2e2e2;
}
body {
font-size: 69%;
font-weight: normal;
font-family: Verdana, sans-serif;
}
h1,
.vtitle {
font-size: %(h1FontSize)s;
margin: 0.2em 0px 0.3em;
border-bottom: 1px solid #000;
}
h2, h3 {
margin-top: 0.2em;
margin-bottom: 0.3em;
}
h2 {
font-size: %(h2FontSize)s;
}
h3 {
font-size: %(h3FontSize)s;
}
h4 {
font-size: %(h4FontSize)s;
margin: 0.2em 0px;
}
h5 {
font-size:110%;
}
h6{
font-size:105%;
}
a, a:active, a:visited, a:link {
color: %(aColor)s;
text-decoration: none;
}
a:hover{
text-decoration: underline;
}
a img{
text-align: center;
}
img{
border: none;
}
img.prevnext {
width: 22px;
height: 22px;
}
img.prevnext_nogo {
width: 22px;
height: 22px;
filter:alpha(opacity=25); /* IE */
opacity:.25;
}
p {
margin: 0em 0px 0.2em;
padding-top: 2px;
}
table, td, input, select{
font-size: 100%;
}
table {
border-collapse: collapse;
border: none;
}
table th, table td {
vertical-align: top;
}
table td img {
vertical-align: middle;
margin-right: 10px;
}
ol {
margin: 1px 0px 1px 16px;
}
ul{
margin: 1px 0px 1px 4px;
list-style-type: none;
}
ul > li {
margin-top: 2px;
padding: 0px 0px 2px 8px;
background: url("bullet_orange.png") 0% 6px no-repeat;
}
dt {
font-size:1.17em;
font-weight:600;
}
dd {
margin: 0.6em 0 1.5em 2em;
}
fieldset {
border: none;
}
legend {
padding: 0px 2px;
font: bold 1em Verdana, sans-serif;
}
input, textarea {
padding: 0.2em;
vertical-align: middle;
border: 1px solid #ccc;
}
input:focus {
border: 1px inset #ff7700;
}
label, .label {
font-weight: bold;
}
iframe {
border: 0px;
}
pre {
font-family: Courier, "Courier New", Monaco, monospace;
font-size: 100%;
color: #000;
background-color: #f2f2f2;
border: 1px solid #ccc;
margin: 10px 0;
padding-bottom: 12px;
padding-left: 5px;
}
code {
font-size: 120%;
color: #000;
background-color: #f2f2f2;
border: 1px solid #ccc;
}
blockquote {
font-family: Courier, "Courier New", serif;
font-size: 120%;
margin: 5px 0px;
padding: 0.8em;
background-color: #f2f2f2;
border: 1px solid #ccc;
}
/***************************************/
/* generic classes */
/***************************************/
.odd {
background-color: #f7f6f1;
}
.even {
background-color: transparent;
}
.hr {
border-bottom: 1px dotted #ccc;
margin: 1em 0px;
}
.left {
float: left;
}
.right {
float: right;
}
.clear {
clear: both;
}
.hidden {
display: none;
visibility: hidden;
}
li.invisible {
list-style: none;
background: none;
padding: 0px 0px 1px 1px;
}
li.invisible div {
display: inline;
}
.caption {
font-weight: bold;
}
.legend{
font-style: italic;
}
/* rest related image classes generated with align: directive */
img.align-right {
margin-left: auto;
display:block;
}
img.align-left {
margin-right: auto;
display:block;
}
img.align-center{
text-align: center;
margin-left: auto;
margin-right: auto;
display:block;
}
/***************************************/
/* LAYOUT */
/***************************************/
/* header */
table#header {
background: %(headerBg)s;
width: 100%;
}
table#header td {
vertical-align: middle;
}
table#header a {
color: #000;
}
table#header td#headtext {
white-space: nowrap;
}
table#header td#header-right {
padding-top: 1em;
white-space: nowrap;
}
table#header td#header-center{
width: 100%;
}
span#appliName {
font-weight: bold;
color: #000;
white-space: nowrap;
}
/* FIXME appear with 4px width in IE6 */
div#stateheader{
min-width: 66%;
}
/* Popup on login box and userActionBox */
.popupWrapper{
position:relative;
}
div.popup {
position: absolute;
background: #fff;
border: 1px solid black;
text-align: left;
z-index: 400;
}
div.popup ul li a {
text-decoration: none;
color: black;
}
/* main zone */
div#page {
background: #e2e2e2;
position: relative;
min-height: 800px;
}
table#mainLayout{
padding: 0px 3px;
}
table#mainLayout td#contentColumn {
padding: 8px 10px 5px;
}
table#mainLayout td#navColumnLeft,
table#mainLayout td#navColumnRight {
width: 16em;
}
#contentheader {
margin: 0px;
padding: 0.2em 0.5em 0.5em 0.5em;
}
#contentheader a {
color: #000;
}
div#pageContent {
clear: both;
padding: 10px 1em 2em;
background: #ffffff;
border: 1px solid #ccc;
}
/* rql bar */
div#rqlinput {
border: 1px solid #cfceb7;
margin-bottom: 8px;
padding: 1px;
background: #cfceb7;
width: 100%;
}
input#rql {
width: 99%;
}
input.rqlsubmit{
display: block;
width: 20px;
height: 20px;
background: %(buttonBgColor)s url("go.png") 50% 50% no-repeat;
vertical-align: bottom;
}
/* old boxes, deprecated */
div.boxFrame {
width: 100%;
}
div.boxTitle {
padding-top: 0px;
padding-bottom: 0.2em;
font: bold 100% Georgia;
color: #fff;
background: #ff9900 url("search.png") left bottom repeat-x;
}
div.boxTitle span,
div.sideBoxTitle span {
padding: 0px 5px;
white-space: nowrap;
}
div.sideBoxTitle span {
color: #222211;
}
.boxFrame a {
color: #000;
}
div.boxContent {
padding: 3px 0px;
background: #fff;
border-top: none;
}
div.shadow{
height: 14px;
background: url("shadow.gif") no-repeat top right;
}
div.sideBoxTitle {
background: #cfceb7;
display: block;
font: bold 100% Georgia;
}
div.sideBox {
padding: 0 0 0.2em;
margin-bottom: 0.5em;
}
ul.sideBox li {
list-style: none;
background: none;
padding: 0px 0px 1px 1px;
}
div.sideBoxBody {
padding: 0.2em 5px;
background: #eeedd9;
}
div.sideBoxBody a {
color:#555544;
}
div.sideBoxBody a:hover {
text-decoration: underline;
}
div.sideBox table td {
padding-right: 1em;
}
/* boxes */
div.navboxes {
padding-top: 0.5em;
}
div.boxTitle {
overflow: hidden;
font-weight: bold;
}
div.boxTitle span {
padding: 0px 0.5em;
white-space: nowrap;
}
div.boxBody {
padding: 3px 3px;
border-top: none;
background-color: %(leftrightBoxBodyBgColor)s;
}
div.boxBody a {
color: %(leftrightBoxBodyColor)s;
}
div.boxBody a:hover {
text-decoration: none;
cursor: pointer;
background-color: %(leftrightBoxBodyHoverBgColor)s;
}
hr.boxSeparator {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
/* boxes contextual customization */
.contextFreeBox div.boxTitle {
background: %(contextFreeBoxTitleBg)s;
color: %(contextFreeBoxTitleColor)s;
}
.contextualBox div.boxTitle {
background: %(contextualBoxTitleBg)s;
color: %(contextualBoxTitleColor)s;
}
.primaryRight div.boxTitle {
background: %(incontextBoxTitleBg)s;
color: %(incontextBoxTitleColor)s;
}
.primaryRight div.boxBody {
padding: 0.2em 5px;
background: %(incontextBoxBodyBgColor)s;
}
.primaryRight div.boxBody a {
color: %(incontextBoxBodyColor)s;
}
.primaryRight div.boxBody a:hover {
background-color: %(incontextBoxBodyHoverBgColor)s;
}
.primaryRight div.boxFooter {
margin-bottom: 1em;
}
#navColumnLeft div.boxFooter, #navColumnRight div.boxFooter{
height: 14px;
background: url("shadow.gif") no-repeat top right;
}
/* boxes lists and menus */
ul.boxListing {
margin: 0;
padding: 0;
}
ul.boxListing ul {
padding: 1px 3px;
}
ul.boxListing a {
color: %(defaultColor)s;
padding: 1px 3px;
display: block; /* necessary to get links across all width available (see on mouse over) */
}
ul.boxListing a.action {
padding: 0;
display: inline;
}
ul.boxListing a.action + a{
display: inline;
}
ul.boxListing li {
margin: 0px;
padding: 0px;
background-image: none;
}
ul.boxListing ul li {
margin: 0px;
padding-left: 1em;
}
ul.boxListing ul li a {
padding-left: 10px;
background-image: url("bullet_orange.png");
background-repeat: no-repeat;
background-position: 0 6px;
}
ul.boxListing .selected {
color: %(aColor)s;
font-weight: bold;
}
ul.boxListing a.boxMenu:hover {
border-top: medium none;
background: %(leftrightBoxBodyHoverBgColor)s;
}
a.boxMenu,
ul.boxListing a.boxMenu {
display: block;
padding: 1px 3px;
background: transparent %(bulletDownImg)s;
}
ul.boxListing a.boxMenu:hover {
border-top: medium none;
background: %(leftrightBoxBodyHoverBgColor)s %(bulletDownImg)s;
}
a.boxMenu:hover {
cursor: pointer;
}
a.popupMenu {
background: transparent url("puce_down_black.png") 2% 6px no-repeat;
padding-left: 2em;
}
/* custom boxes */
.search_box div.boxBody {
padding: 4px 4px 3px;
background: #f0eff0 url("gradient-grey-up.png") left top repeat-x;
}
.bookmarks_box ul.boxListing div {
padding-bottom: 0.3em;
}
.download_box div.boxTitle {
background : #8fbc8f !important;
}
.download_box div.boxBody {
background : #eefed9;
vertical-align: center;
}
/* user actions menu */
a.logout, a.logout:visited, a.logout:hover{
color: #fff;
text-decoration: none;
}
div#userActionsBox {
width: 14em;
text-align: right;
}
div#userActionsBox a.popupMenu {
color: black;
text-decoration: underline;
padding-right: 2em;
}
/**************/
/* navigation */
/**************/
div#etyperestriction {
margin-bottom: 1ex;
border-bottom: 1px solid #ccc;
}
div.pagination{
margin: 0.5em 0;
}
span.slice a:visited,
span.slice a:hover{
color: #555544;
}
span.selectedSlice a:visited,
span.selectedSlice a {
background-color: #EBE8D9;
}
/* FIXME should be moved to cubes/folder */
div.navigation a {
text-align: center;
text-decoration: none;
}
div.prevnext {
width: 100%;
margin-bottom: 1em;
}
div.prevnext a {
color: #000;
}
/***************************************/
/* entity views */
/***************************************/
.mainInfo {
margin-right: 1em;
padding: 0.2em;
}
div.mainRelated {
border: none;
margin-right: 1em;
padding: 0.5em 0.2em 0.2em;
}
div.primaryRight{
}
div.metadata {
font-size: 90%;
margin: 5px 0px 3px;
color: #666;
font-style: italic;
text-align: right;
}
div.section {
margin-top: 0.5em;
width:100%;
}
div.section a:hover {
text-decoration: none;
}
/* basic entity view */
tr.entityfield th {
text-align: left;
padding-right: 0.5em;
}
div.field {
display: inline;
}
div.ctxtoolbar {
float: right;
padding-left: 24px;
position: relative;
}
div.toolbarButton {
display: inline;
}
/***************************************/
/* messages */
/***************************************/
.warning,
.message,
.errorMessage ,
.searchMessage{
padding: 0.3em 0.3em 0.3em 1em;
font-weight: bold;
}
.loginMessage {
margin: 4px 0px;
font-weight: bold;
color: #ff7700;
}
div#appMsg, div.appMsg{
border: 1px solid #cfceb7;
margin-bottom: 8px;
padding: 3px;
background: #f8f8ee;
}
.message {
margin: 0px;
background: #f8f8ee url("information.png") 5px center no-repeat;
padding-left: 15px;
}
.errorMessage {
margin: 10px 0px;
padding-left: 25px;
background: #f7f6f1 url("critical.png") 2px center no-repeat;
color: #ed0d0d;
border: 1px solid #cfceb7;
}
.searchMessage {
margin-top: 0.5em;
border-top: 1px solid #cfceb7;
background: #eeedd9 url("information.png") 0% 50% no-repeat; /*dcdbc7*/
}
.stateMessage {
border: 1px solid #ccc;
background: #f8f8ee url("information.png") 10px 50% no-repeat;
padding:4px 0px 4px 20px;
border-width: 1px 0px 1px 0px;
}
/* warning messages like "There are too many results ..." */
.warning {
padding-left: 25px;
background: #f2f2f2 url("critical.png") 3px 50% no-repeat;
}
/* label shown in the top-right hand corner during form validation */
div#progress {
position: fixed;
right: 5px;
top: 0px;
background: #222211;
color: white;
font-weight: bold;
display: none;
}
/***************************************/
/* listing table */
/***************************************/
table.listing {
padding: 10px 0em;
color: #000;
width: 100%;
border-right: 1px solid #dfdfdf;
}
table.listing thead th.over {
background-color: #746B6B;
cursor: pointer;
}
table.listing tr th {
border: 1px solid #dfdfdf;
border-right:none;
font-size: 8pt;
padding: 4px;
}
table.listing tr .header {
border-right: 1px solid #dfdfdf;
cursor: pointer;
}
table.listing td {
color: #3D3D3D;
padding: 4px;
background-color: #FFF;
vertical-align: top;
}
table.listing th,
table.listing td {
padding: 3px 0px 3px 5px;
border: 1px solid #dfdfdf;
border-right: none;
}
table.listing th {
font-weight: bold;
background: %(listingHeaderBgColor)s;
}
table.listing td a,
table.listing td a:visited {
color: #666;
}
table.listing a:hover,
table.listing tr.highlighted td a {
color:#000;
}
table.listing td.top {
border: 1px solid white;
border-bottom: none;
text-align: right ! important;
/* insane IE row bug workaround */
position: relative;
left: -1px;
top: -1px;
}
table.htableForm label, table.oneRowTableForm label {
vertical-align: middle;
}
table.htableForm td {
padding-left: 1em;
padding-top: 0.5em;
}
table.htableForm th {
padding-left: 1em;
}
table.htableForm .validateButton {
margin-right: 0.2em;
margin-bottom: 0.2em;
}
table.oneRowTableForm td {
padding-left: 0.5em;
}
table.oneRowTableForm th {
padding-left: 1em;
}
table.oneRowTableForm .validateButton {
margin: 0 0 0 1em ;
}
table.ajaxEditRelationTable{
margin-bottom: 0.5em;
}
table.ajaxEditRelationTable td.entity{
padding-left: 0.5em;
}
/***************************************/
/* error view (views/management.py) */
/***************************************/
div.pycontext { /* html traceback */
font-family: Verdana, sans-serif;
font-size: 80%;
padding: 1em;
margin: 10px 0px 5px 20px;
background-color: #dee7ec;
}
div.pycontext span.name {
color: #ff0000;
}
/***************************************/
/* addcombobox */
/***************************************/
input#newopt{
width:120px ;
display:block;
float:left;
}
div#newvalue{
margin-top:2px;
}
#add_newopt{
background: #fffff8 url("go.png") 50% 50% no-repeat;
width: 20px;
line-height: 20px;
display:block;
float:left;
}
/***************************************/
/* buttons */
/***************************************/
input.button{
margin: 1em 1em 0px 0px;
border: 1px solid #edecd2;
border-color:#edecd2 #cfceb7 #cfceb7 #edecd2;
background: #fffff8 url("button.png") bottom left repeat-x;
}
/* FileItemInnerView jquery.treeview.css */
.folder {
/* disable odd/even under folder class */
background-color: transparent;
}
a.addButton {
margin-left: 0.5em;
padding-left: 16px;
background: transparent url("add_button.png") 0% 50% no-repeat;
}
/***************************************/
/* footer */
/***************************************/
div#footer {
text-align: center;
}
div#footer a {
color: #000;
text-decoration: none;
}
/****************************************/
/* FIXME must by managed by cubes */
/****************************************/
.needsvalidation {
font-style: italic;
color: gray;
}
/***************************************/
/* FIXME : Deprecated ? entity view ? */
/***************************************/
.title {
text-align: left;
font-size: large;
font-weight: bold;
}
.validateButton {
margin: 1em 1em 0px 0px;
border: 1px solid #edecd2;
border-color:#edecd2 #cfceb7 #cfceb7 #edecd2;
background: #fffff8 url("button.png") bottom left repeat-x;
}
/********************************/
/* placement of alt. view icons */
/********************************/
.otherView {
float: right;
}
/******************************/
/* reledit */
/******************************/
.releditField {
display: inline;
}
.releditForm {
display:none;
}
/********************************/
/* overwite other css here */
/********************************/
.ui-menu li.ui-menu-item {
/* remove background image (orange bullet) for autocomplete suggestions */
background-image: none;
}
div.ui-tabs.ui-widget-content {
background:none;
border:none;
color:inherit;
}
div.ui-tabs ul.ui-tabs-nav {
padding-left: 0.5em;
}
div.ui-tabs ul.ui-tabs-nav a {
color:#27537A;
padding: 0.3em 0.6em;
outline:0;
}
div.ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a {
color:black;
}
div.ui-tabs ul.ui-tabs-nav li.ui-state-hover, div.ui-tabs ul.ui-tabs-nav li.ui-state-focus {
background:white;
}
div.ui-tabs .ui-widget-header {
background:none;
border:none;
}
div.ui-tabs .ui-widget-header li {
border-color:#333333;
}
div.ui-tabs .ui-tabs-panel {
border-top:1px solid #97A5B0;
padding-left:0.5em;
color:inherit;
}
/* cubicweb.views.undohistory uses :
* - span.undo around undo link
* - ul.undo-transactions to list transaction
* - ol.undo-actions to list actions in a transaction
*/
span.undo {
border: 1pt;
}
ol.undo-actions > li {
margin-left: 2em;
margin-top: 2px;
padding: 0px 0px 2px 0px;
background-image: none;
}