Git Product home page Git Product logo

ag-grid-customise-theme's Introduction

ag-Grid Theme Customisation Examples

The project in this repository showcases how the ag-Grid built-in themes can be customized by overriding Sass variables. An up-to-date table with the variable default values and their function is available at: http://www.ag-grid.com/javascript-grid-styling/#customizing-sass-variables

Usage

  • Clone the project
  • Choose a project:
    • src/vanilla: customising a theme in vanilla JavaScript, including an example of changing the icon font.
    • src/vanilla-css-variables: an example of setting color parameters from CSS variables
    • src/vanilla-extending-base: an example of a custom theme that directly extends the base theme
    • src/vanilla-svg-icons: an example of using SVG images for icons
    • src/angular: Angular CLI example
    • src/react: create-react-app example
    • src/vue: Vue example
    • v22 compatibility layer examples
      • src/legacy/vanilla: Vanilla JS
      • src/legacy/angular: Angular CLI
      • src/legacy/v22-provided-themes: Demonstration of how to rebuild the deprecated Fresh, Dark, Blue and Bootstrap themes as custom themes on top of ag-theme-base.
  • In the project folder, run npm install && npm start
  • View the project in your browser at http://localhost:8080/.
  • Open the styles.scss file to see how the theme has been customised.

ag-grid-customise-theme's People

Contributors

gportela85 avatar berniesumption avatar petyosi avatar dependabot[bot] avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.