TableDnD/tablednd.css

   1 body {
   2     color:#333333;
   3     font-family:'Lucida Grande',Verdana,Arial,Sans-Serif;
   4     font-size: 80%;
   5     margin: 1em 9em;
   6     background-color: #F0F0F0;
   7     line-height: 1.4em;
   8 }
   9
  10 p {
  11     padding: 10px;
  12     width: 60%;
  13 }
  14
  15 h1 {
  16     color: #114477;
  17 }
  18
  19 pre.prettyprint {
  20     margin-bottom: 20px;
  21     padding-top: 15px;
  22 }
  23 .prettyprint {
  24     background-color: #F7F7F9;
  25 }
  26 code, pre {
  27     display: block;
  28     margin: 0 0 10px;
  29     line-height: 20px;
  30     -webkit-border-radius: 4px;
  31     -moz-border-radius: 4px;
  32     border-radius: 4px;
  33 }
  34 pre {
  35     word-break: break-all;
  36     word-wrap: break-word;
  37     white-space: pre;
  38     font-weight:normal;
  39 }
  40
  41 pre, code {
  42     color:#264A94;
  43     font-family:Monaco,Lucida Console,monospace;
  44     font-size:90%;
  45 }
  46
  47 div#page {
  48     background-color: white;
  49     padding: 1em;
  50 }
  51
  52 .tableDemo {
  53     background-color: white;
  54     border: 1px solid #666699;
  55     margin-right: 10px;
  56     padding: 6px;
  57 }
  58
  59 .tableDemo table {
  60     border: 1px solid silver;
  61 }
  62
  63 .tableDemo td {
  64  padding: 2px 6px
  65 }
  66
  67 .tableDemo th {
  68     color: white;
  69     text-shadow: 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A, 0 0 18px #29215A;
  70     border-bottom: 8px double #29215A;
  71     padding: 10px;
  72 }
  73
  74 #table-2 th {
  75     background-color: #29215A;
  76     color: white;
  77 }
  78
  79 #table-2 td, th {
  80     padding-right: 8px;
  81 }
  82
  83 .category td {
  84     background-color: #E4EBF3;
  85 }
  86
  87 table {
  88     /*position: relative;*/
  89     border-collapse: separate;
  90     border-spacing: 0;
  91 }
  92 tr {
  93     /*position: relative;*/
  94
  95     /*display: block;*/
  96 }
  97
  98 .tDnD_whileDrag {
  99     /*z-index: 500;*/
 100     /*width: 90%;*/
 101     /*margin: -10px;*/
 102     /*display: table-cell;*/
 103     /*color: transparent;*/
 104     /*width: 0px*/
 105 }
 106 .tDnD_whileDrag td {
 107     background-color: #eee;
 108     /*-webkit-box-shadow: 11px 5px 12px 2px #333, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;*/
 109     -webkit-box-shadow: 6px 3px 5px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;
 110     /*-moz-box-shadow: 6px 4px 5px 1px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;*/
 111     /*-box-shadow: 6px 4px 5px 1px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;*/
 112 }
 113 /*.tDnD_whileDrag td:first-child {*/
 114     /*-webkit-box-shadow: 5px 4px 5px 1px #111, 0 1px 0 #ccc inset, 1px -1px 0 #ccc inset;*/
 115     /*-moz-box-shadow: 6px 3px 5px 2px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset, 1px 0 0 #ccc inset;*/
 116     /*-box-shadow: 6px 3px 5px 2px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset, 1px 0 0 #ccc inset;*/
 117 /*}*/
 118 .tDnD_whileDrag td:last-child {
 119     /*-webkit-box-shadow: 8px 7px 12px 0 #333, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;*/
 120     -webkit-box-shadow: 1px 8px 6px -4px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;
 121     /*-moz-box-shadow: 0 9px 4px -4px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset, -1px 0 0 #ccc inset;*/
 122     /*-box-shadow: 0 9px 4px -4px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset, -1px 0 0 #ccc inset;*/
 123 }
 124     /*-webkit-box-shadow:  0 0 40px white, 10px 10px 15px black;*/
 125     /*-moz-box-shadow: 0 4px 2px -3px rgba(0, 0, 0, 0.5) inset;*/
 126     /*-webkit-box-shadow: 0px 0px 40px 1px white, 0px 1px 1px 1px black;*/
 127     /*box-shadow: 0 4px 2px -3px rgba(0, 0, 0, 0.5) inset;*/
 128 /*}*/
 129 /*.tDnD_whileDrag {*/
 130     /*background-color: black;*/
 131     /*position: relative;*/
 132     /*display: block;*/
 133     /*-moz-box-shadow: 0px 0px 40px 1px white, 0px 1px 1px 1px black;*/
 134     /*-webkit-box-shadow: 0px 0px 40px 1px white, 0px 1px 1px 1px black;*/
 135     /*box-shadow:        0px 0px 40px 1px white, 0px 1px 1px 1px black ;*/
 136     /*-webkit-box-shadow: 0 15px 10px -10px black, 0 1px 4px black, 0 0 10px darkgray inset;*/
 137     /*-webkit-box-shadow: 0 15px 10px -10px black, 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;*/
 138     /*-moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;*/
 139     /*box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;*/
 140     /*width: 90%;*/
 141     /*height: 90%;*/
 142     /*width: 100%;*/
 143     /*overflow: visible;*/
 144     /*z-index: 10000;*/
 145     /*opacity: .4;*/
 146     /*border-collapse: separate;*/
 147     /*filter:Alpha(Opacity=50);*/
 148     /*width: auto;*/
 149
 150 /*}*/
 151
 152 /*tr.alt td {*/
 153     /*width:200px*/
 154     /*-ms-transform:rotate(1deg;*/
 155     /*-moz-transform: rotate(0deg);*/
 156     /*-webkit-transform:rotate(0deg);*/
 157     /*-o-transform:rotate(0deg);*/
 158 /*}*/
 159
 160 tr.alt td {
 161     background-color: #ecf6fc;
 162     padding-top: 5px;
 163     padding-bottom: 5px;
 164 }
 165
 166 td {
 167     padding-top: 5px;
 168     padding-bottom: 5px;
 169     white-space: nowrap;
 170 }
 171
 172 tr.myDragClass td {
 173     /*position: fixed;*/
 174     color: yellow;
 175     text-shadow: 0 0 10px black, 0 0 10px black, 0 0 8px black, 0 0 6px black, 0 0 6px black;
 176     background-color: #999;
 177     -webkit-box-shadow: 0 12px 14px -12px #111 inset, 0 -2px 2px -1px #333 inset;
 178 }
 179 tr.myDragClass td:first-child {
 180     -webkit-box-shadow: 0 12px 14px -12px #111 inset, 12px 0 14px -12px #111 inset, 0 -2px 2px -1px #333 inset;
 181 }
 182 tr.myDragClass td:last-child {
 183     -webkit-box-shadow: 0 12px 14px -12px #111 inset, -12px 0 14px -12px #111 inset, 0 -2px 2px -1px #333 inset;
 184 }
 185
 186 #table-2 {
 187     margin: 0 0 1em 0; padding: 0
 188 }
 189 tr.nodrop td {
 190     border-bottom: 1px solid #00bb00;
 191     color: #00bb00;
 192 }
 193 tr.nodrag td {
 194     border-bottom: 1px solid #FF6600;
 195     color: #FF6600;
 196 }
 197 div.result {
 198     background-color: #F7F7F9;
 199 }
 200
 201 tr.alt tr:after, .group:after {
 202     visibility: hidden;
 203     display: block;
 204     content: "";
 205     clear: both;
 206     height: 0;
 207 }
 208
 209 table input,
 210 tr td input,
 211 tr input,
 212 tr.myDragClass input,
 213 tbody tr td input {
 214     z-index: -10;
 215         text-align: right;
 216         float: right;
 217     height: 12px;
 218     margin-top: 5px;
 219     margin-bottom: 5px;
 220 }
 221
 222 td.dragHandle {
 223
 224 }
 225
 226 td.showDragHandle {
 227         background-image: url(images/updown2.gif);
 228         background-repeat: no-repeat;
 229         background-position: center center;
 230         cursor: move;
 231 }
 232
 233 .versionHistory td {
 234     vertical-align: top;
 235     padding: 0.3em;
 236     white-space: normal;
 237 }
 238
 239 div.indent {
 240     width: 30px;
 241     float: left;
 242 }
 243
 244 #sprintlist_table th {
 245     color: white;
 246     /*border-style: ;*/
 247     text-shadow: 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600, 0 0 18px #FF6600;
 248     border-bottom: 14px double #FF6600;
 249     padding: 10px;
 250 }
 251 .sprintlist-drag td.small_buttons div button {
 252     /*font-size: xx-small;*/
 253     /*height: 18px;*/
 254     /*color: #333;*/
 255     /*cursor: pointer;*/
 256     /*background-color: #f4a460;*/
 257     box-shadow:0px 2px 3px black inset;
 258     -moz-box-shadow:0px 2px 3px black inset;
 259     -webkit-box-shadow:0px 2px 3px black inset;
 260     /*border: 0px;*/
 261     /*background-color: #ccc;*/
 262 }
 263 .sprintlist-drag td.small_buttons div button:first-child {
 264     box-shadow:2px 2px 3px black inset;
 265     -moz-box-shadow:2px 2px 3px black inset;
 266     -webkit-box-shadow:2px 2px 3px black inset;
 267     /*border: 0px;*/
 268     /*background-color: #ccc;*/
 269 }
 270 .sprintlist-drag td {
 271     background-color: #f4a460;
 272     /*-webkit-box-shadow: 11px 5px 12px 2px #333, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;*/
 273     -webkit-box-shadow: 6px 3px 5px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;
 274     /*-moz-box-shadow: 6px 4px 5px 1px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;*/
 275     /*-box-shadow: 6px 4px 5px 1px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;*/
 276 }
 277 .sprintlist-drag td:last-child {
 278     /*-webkit-box-shadow: 8px 7px 12px 0 #333, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;*/
 279     -webkit-box-shadow: 1px 8px 6px -4px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;
 280 /*-moz-box-shadow: 0 9px 4px -4px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset, -1px 0 0 #ccc inset;*/
 281 }
 282 tr.group_heading td eojq
 283     border-bottom: 8px double #FF6600;
 284     color: #FF6600;
 285     font-size: larger;
 286     font-weight: bolder;
 287 }
 288
 289 td.small_buttons div {
 290     display: inline-block;
 291     position: relative;
 292 }
 293 #table-6 tr {
 294     background-color: red;
 295     z-index: -1000;
 296     /*background-color:rgb(165, 182, 229);*/
 297     display: block;
 298     margin-bottom: 5px;
 299     /*box-shadow:0 0 0 black;*/
 300     /*-moz-box-shadow:0 0 0 black,;*/
 301     /*-webkit-box-shadow:0 0 0 black;*/
 302 }
 303 #table-6 td {
 304     padding:5px;
 305     /*text-align:left;*/
 306 }
 307
 308 #table-7 {
 309     border: #000000 solid 1px;
 310 }
 311
 312 td.small_buttons div button {
 313     font-size: xx-small;
 314     height: 18px;
 315     color: #333;
 316     cursor: pointer;
 317     background-color: whiteSmoke;
 318 }
 319
 320 td.small_buttons div button:first-child
 321 {
 322     margin-left: 0;
 323     -webkit-border-bottom-left-radius: 4px;
 324     border-bottom-left-radius: 4px;
 325     -webkit-border-top-left-radius: 4px;
 326     border-top-left-radius: 4px;
 327     -moz-border-radius-bottomleft: 4px;
 328     -moz-border-radius-topleft: 4px;
 329 }
 330
 331 td.small_buttons div button:last-child
 332 {
 333     margin-left: -2px;
 334     -webkit-border-bottom-right-radius: 4px;
 335     border-bottom-right-radius: 4px;
 336     -webkit-border-top-right-radius: 4px;
 337     border-top-right-radius: 4px;
 338     -moz-border-radius-bottomright: 4px;
 339     -moz-border-radius-topright: 4px;
 340 }