Docs
API
  • name

    String

    There are several theme in FancyGrid: blue, bootstrap, dark, default, gray, dark, sand.

    Example

    
    theme: 'gray'
    
    To override some styling it requires to change size values and css values.

    Example

    
    .fancy-theme-gray .fancy-grid-cell {
      color: gray;
    }
    ...
    theme: {
      name: 'gray',
      config: {
        cellHeight: 92,
        titleHeight: 65
      }
    }
    

    To do absolutely new theme it needs:

    To define it over FancyGrid.defineTheme

    Example

    
    .fancy-theme-my .fancy-grid-cell {
      color: #888888;
    }
    ...
    FancyGrid.defineTheme('my', {
      config: {
        cellHeaderHeight: 30,
        cellHeight: 32,
        titleHeight: 42,
        barHeight: 37,
        bottomScrollHeight: 12
      }
    });