title: Change row color based on a value (inside the row)
body: <p>I have this grid</p>
  
  <pre><code>{
          xtype: 'gridpanel',
          id: 'grdSeguimiento',
          margin: '20 0 10 0',
          width: 1423,
          store: 'Solicitud',
          viewConfig: {
              getRowClass: function(record, rowIndex, rowParams, store) {
                  console.log(record);
                  return record.data.get('TIEMPO') == 1 ? 'child-row' : 'adult-row';
  
              },
              stripeRows: false
          },
          columns: [
  
              {
                  xtype: 'gridcolumn',
                  hidden: true,
                  dataIndex: 'TIEMPO',
                  hideable: false
              }
          ],
          plugins: [
              {
                  ptype: 'rowediting',
                  listeners: {
                      edit: 'onRowEditingEdit'
                  }
              }
          ]
      }
  </code></pre>
  
  <p>And this css file</p>
  
  <pre><code>.child-row .x-grid-cell { 
  background-color: #ffe2e2 !important; 
  color: #900; 
  } 
  
  .adult-row .x-grid-cell { 
  background-color: #e2ffe2 !important; 
  color: #090;
   }
  </code></pre>
  
  <p>I just want each row to have a color based on a value (TIEMPO) inside each row.</p>
  
  <p>But I am getting the </p>
  
  <pre><code>Error: rendered block refreshed at 0 rows while BufferedRenderer view size is 63
  </code></pre>
  
  <p>The grid worked fine before using the css file. I made some research but couldn't find anything useful.</p>
  
  <p>The code above is not all the code, I used renderer and action columns but I gues that is not so important.</p>
  
  <p>Any ideas?</p>
  
  <p><strong>Edit 1</strong>: If I change the table to non sortable the data appears but without any styling</p>