plugins/query_editor/static/css/query_editor.css

   1 div.query-editor-spacer {
   2     padding: 15px 5px;
   3 }
   4
   5 table.query-editor {
   6     width: 95%;
   7     padding-bottom: 10px;
   8 }
   9
  10 /* Add a scrollbar to autocomplete fields */
  11 .ui-autocomplete {
  12     max-height: 100px;
  13     overflow-y: auto;
  14     /* prevent horizontal scrollbar */
  15     overflow-x: hidden;
  16     /* add padding to account for vertical scrollbar */
  17     padding-right: 20px;
  18
  19     /* NEED TO BE IMPROVED LATER... */
  20     /* How to use properties from content class in /templates/myslice/css/myslice.css ? */
  21     /* How to factorize this ? Maybe applied differently in other plugins ? */
  22     font-size: 11px;
  23 }
  24 .queryeditor-auto-filter{
  25     width:200px;
  26 }
  27 /* IE 6 doesn't support max-height
  28  * we use height instead, but this forces the menu to always be this tall
  29  */
  30 * html .ui-autocomplete {
  31     height: 100px;
  32 }
  33
  34 table.query-editor {
  35     margin: 0 auto;
  36     clear: both;
  37     /* width: 80%;*/
  38     width: 300px;
  39 }
  40
  41 table.query-editor input {
  42     font: normal 12px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
  43 }
  44
  45 table.query-editor thead th {
  46     padding: 3px 18px 3px 3px;
  47     border-bottom: 1px solid black;
  48     font-weight: bold;
  49     cursor: pointer;
  50     * cursor: hand;
  51 }
  52
  53 table.query-editor tfoot th {
  54     padding: 3px 18px 3px 10px;
  55     border-top: 1px solid black;
  56     font-weight: bold;
  57 }
  58
  59 table.query-editor td {
  60     padding: 2px 5px;
  61     font: normal 12px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
  62 }
  63
  64 table.query-editor td.center, table.query-editor th.center {
  65     text-align: center;
  66 }
  67
  68
  69 /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
  70  * DataTables row classes
  71  */
  72 table.query-editor tr.odd.gradeA {
  73     background-color: #ddffdd;
  74 }
  75
  76 table.query-editor tr.even.gradeA {
  77     background-color: #eeffee;
  78 }
  79
  80 table.query-editor tr.odd.gradeC {
  81     background-color: #ddddff;
  82 }
  83
  84 table.query-editor tr.even.gradeC {
  85     background-color: #eeeeff;
  86 }
  87
  88 table.query-editor tr.odd.gradeX {
  89     background-color: #ffdddd;
  90 }
  91
  92 table.query-editor tr.even.gradeX {
  93     background-color: #ffeeee;
  94 }
  95
  96 table.query-editor tr.odd.gradeU {
  97     background-color: #ddd;
  98 }
  99
 100 table.query-editor tr.even.gradeU {
 101     background-color: #eee;
 102 }
 103
 104 /* change color: T / even -> odd +1 +5 -3*/
 105 table.query-editor tr.odd.row_sliver td {
 106     background-color: #9FAFD1;
 107 }
 108
 109 table.query-editor tr.even.row_added td {
 110     background-color: #b1d19f;
 111 }
 112 table.query-editor tr.odd.row_added td {
 113     background-color: #a3c98f;
 114 }
 115
 116 table.query-editor tr.even.row_removed td {
 117     background-color: #d9b0b0;
 118 }
 119
 120 table.query-editor tr.odd.row_removed td {
 121     background-color: #d1a09f;
 122 }
 123
 124 table.query-editor tr.gradeA {
 125     background-color: #eeffee;
 126 }
 127
 128 table.query-editor tr.gradeC {
 129     background-color: #ddddff;
 130 }
 131
 132 table.query-editor tr.gradeX {
 133     background-color: #ffdddd;
 134 }
 135
 136 table.query-editor tr.gradeU {
 137     background-color: #ddd;
 138 }
 139
 140
 141
 142
 143 div.selected{background-color:gray; color:black}
 144
 145 /* icons */
 146 .myslice-icon-timestamp {
 147     background-image: url('images/myslice-icon-timestamp.png') !important;
 148 }
 149 .myslice-icon-filter {
 150     background-image: url('images/myslice-icon-filter.png') !important;
 151 }
 152 .myslice-icon-fields {
 153     background-image: url('images/myslice-icon-fields.png') !important;
 154 }
 155 .myslice-icon-groups {
 156     background-image: url('images/myslice-icon-groups.png') !important;
 157 }
 158 .myslice-icon-summary {
 159     background-image: url('images/myslice-icon-summary.png') !important;
 160 }
 161 .myslice-icon-resources {
 162     background-image: url('images/myslice-icon-resources.png') !important;
 163 }
 164 .myslice-icon-users {
 165     background-image: url('images/myslice-icon-users.png') !important;
 166 }
 167
 168 a.source-url{
 169     font-weight: bold;
 170 }
 171
 172 span.bold {
 173     font-weight: bold;
 174 }
 175
 176 div#selectdescr {
 177     padding-top:2em;
 178     color: #555555;
 179 }
 180
 181 span.short {
 182     height:10px;
 183 }
 184
 185 span.column-title {
 186     font-size: 15px;
 187     font-weight: bold;
 188 }
 189
 190 span.column-detail {
 191     font-size: 11px;
 192     font-style: italic;
 193 }
 194
 195 span.group_info {
 196     font-size: 11px;
 197     color: green;
 198     font-weight: bold;
 199 }
 200
 201 span.filter_info {
 202     color: red;
 203     font-weight: bold;
 204 }
 205
 206
 207 /* column configuation style */
 208
 209 OPTION.out{
 210     background-color:white;
 211     color:black;
 212 }
 213 OPTION.in{
 214     background-color:#CAE8EA;
 215     color:#4f6b72;
 216 }
 217
 218 /* jordan disabled
 219    div.out{background-color:white; color:black}
 220    div.in{background-color:#CAE8EA; color:#4f6b72}
 221    div.selected{background-color:gray; color:black}
 222    div.invisible{display:none}
 223    */
 224
 225 div.note-div {
 226     padding: 4px;
 227     background-color: #cae8ea;
 228     width: 800px;
 229     margin-left:auto;
 230     margin-right:auto;
 231 }
 232
 233 div#scrolldiv_old {
 234     border : solid 2px grey;
 235     padding:4px;
 236     width:300px;
 237     height:180px;
 238     overflow:auto;
 239 }
 240
 241 th,td.top {
 242     vertical-align: top;
 243     text-align: left;
 244     padding:10px;
 245 }
 246
 247 tr.hidden {
 248     display:none;
 249 }
 250
 251 td.smallright {
 252     text-align: right;
 253     width:20px;
 254 }
 255
 256 table.center {
 257     margin-left:auto;
 258     margin-right:auto;
 259 }
 260
 261 table.columnlist {
 262     width:270px;
 263 }
 264
 265 table.query-editor td.header {
 266     background-color: #CAE8EA;
 267     text-align: center;
 268     width:30px;
 269 }
 270
 271 span.header {
 272     font-weight: bold;
 273     color: #3399CC;
 274 }
 275
 276 a.source-url{
 277     font-weight: bold;
 278 }
 279
 280 span.menubig {
 281     font-size: 16px;
 282     font-weight: bold;
 283 }
 284
 285 span.menusmall {
 286     font-size: 14px;
 287     font-weight: bold;
 288 }
 289
 290 span.menuright {
 291     font-weight: bold;
 292     float: right;
 293 }
 294
 295 span.simpleright {
 296     float: right;
 297 }
 298
 299 span.gray{
 300     color: #555555;
 301 }
 302
 303 span.short {
 304     height:10px;
 305 }
 306
 307 span.column-title {
 308     font-size: 13px;
 309     font-weight: bold;
 310 }
 311
 312 span.column-detail {
 313     font-size: 11px;
 314     font-style: italic;
 315 }
 316
 317 span.myslice_small {
 318     font-size: 11px;
 319 }
 320
 321 span#username {
 322     font-weight: bold;
 323     font-size: 1.3em;
 324 }
 325
 326 .filter_popup{
 327     position:relative; /*this is the key*/
 328     float: right;
 329     z-index:24;
 330     background: url('images/myslice-icon-filter.png') no-repeat;
 331     /*background-color:#ccc;*/
 332     width: 200px;
 333     height: 300px;
 334     color:#000;
 335     text-decoration:none;
 336     clear: both;
 337 }
 338
 339 .filter_popup:hover{
 340     z-index:25;
 341 /*background-color:#ff0*/
 342 }
 343
 344 .filter_popup span{
 345     display: none;
 346 }
 347
 348 .filter_popup:hover span{ /*the span will display just on :hover state*/
 349     display:block;
 350     position:absolute;
 351     /*top:1em;*/
 352     left:-19em;
 353     width: 20em;
 354     font-size: 8pt;
 355     border:1px solid #ccdddd;
 356     background-color:#ddeeee;
 357     color:#000;
 358     text-align: left;
 359     padding: 0em 0em 0em 1em;
 360 }