examples/tasks/tasks.css

   1 /*!
   2  * Ext JS Library 3.3.1
   3  * Copyright(c) 2006-2010 Sencha Inc.
   4  * licensing@sencha.com
   5  * http://www.sencha.com/license
   6  */
   7 #tasks-grid .x-grid3-header {
   8     background: #f9f9f9 url(images/hrow.gif) repeat-x left top;
   9 }
  10 #tasks-grid .new-task-row {
  11     height:24px;
  12 }
  13 #tasks-grid .new-task-row .x-small-editor {
  14     overflow:hidden;
  15     width:100%;
  16 }
  17 #tasks-grid .new-task-row .x-small-editor input {
  18     font-size:11px;
  19 }
  20 #new-task-icon {
  21     width:16px;
  22     height:16px;
  23     margin-left:3px;
  24     background: transparent url(images/edit.gif) no-repeat;
  25 }
  26 .x-grid3-body .x-grid3-td-task-col .x-grid3-cell-inner {
  27     padding: 1px 0 0 0 !important;
  28 }
  29
  30 .task-check {
  31     width:98%;
  32     height:16px;
  33     background: transparent url(images/check.gif) no-repeat center 0;
  34     cursor:pointer;
  35 }
  36
  37 .task-completed .task-check {
  38     background: transparent url(images/check.gif) no-repeat center -16px;
  39 }
  40
  41 .task-check-over {
  42     background: transparent url(images/check.gif) no-repeat center -32px;
  43 }
  44
  45
  46 .task-overdue .x-grid3-cell-inner {
  47     color:#fb223a;
  48 }
  49
  50 .task-completed .x-grid3-cell-inner {
  51     text-decoration:line-through;
  52     color:gray;
  53 }
  54
  55 .task-col-hd {
  56     width:98%;
  57     height:12px;
  58     background: transparent url(images/hd-check.gif) no-repeat center center;
  59     cursor:default;
  60 }
  61
  62 .x-grid3-td-task-title .x-grid3-cell-inner {
  63     white-space:normal;
  64 }
  65
  66
  67 .icon-show-active {
  68     background-image:url(images/icon-show-active.gif) !important;
  69 }
  70 .icon-show-complete {
  71     background-image:url(images/icon-show-complete.gif) !important;
  72 }
  73 .icon-show-all {
  74     background-image:url(images/icon-show-all.gif) !important;
  75 }
  76 .x-grid3-dirty-cell {
  77     background:transparent;
  78 }
  79
  80 .icon-active {
  81     background-image:url(images/icon-active.gif) !important;
  82 }
  83 .icon-complete {
  84     background-image:url(images/icon-complete.gif) !important;
  85 }
  86 .icon-delete {
  87     background-image:url(images/delete.gif) !important;
  88 }
  89 .icon-edit {
  90         background-image:url(images/edit.gif) !important;
  91 }
  92
  93
  94 .icon-by-date {
  95     background-image:url(images/icon-by-date.gif) !important;
  96 }
  97 .icon-by-category {
  98     background-image:url(images/icon-by-category.gif) !important;
  99 }
 100 .icon-no-group {
 101     background-image:url(images/icon-no-group.gif) !important;
 102 }
 103
 104 #action-panel .x-panel {
 105         margin-bottom:3px;
 106         margin-right:0;
 107 }
 108 #action-panel .x-panel-body {
 109         border:0 none;
 110 }
 111 #action-panel .x-panel-body li {
 112         margin:3px;
 113 }
 114 #action-panel .x-panel-body li img {
 115         width:16px;
 116         height:16px;
 117         vertical-align:middle;
 118         margin-right:2px;
 119         margin-bottom:2px;
 120 }
 121 #action-panel .x-panel-body li a {
 122         text-decoration:none;
 123         color:#3764A0;
 124 }
 125 #action-panel .x-plain-body {
 126         background-color:#cad9ec;
 127     padding:3px 0 0 5px;
 128 }
 129 .x-air #action-panel .x-plain-body {
 130         padding-left:3px;
 131 }
 132 #action-panel .x-panel-body li a:hover {
 133         text-decoration:underline;
 134         color:#15428b;
 135 }
 136
 137 .x-panel-trans {
 138         background:transparent;
 139 }
 140
 141 .x-layout-split-west {
 142         cursor:move;
 143     background-color:#cad9ec;
 144 }
 145 .x-panel-header-text {
 146         color:#3764A0;
 147 }
 148 #tasks-grid {
 149         border-left:1px solid #99bbe8;
 150 }