Page 1 of 2 12 LastLast
Results 1 to 10 of 11

Thread: If there is a way to globally change the padding/margin for the grid column headers?

  1. #1
    Sencha Premium User
    Join Date
    Jun 2017
    Location
    China
    Posts
    35
    Answers
    1

    Default If there is a way to globally change the padding/margin for the grid column headers?

    We want to reduce the white space around the text, and change the font to some narrower font for All grid head,what should I do?[email protected]({P%K1HRA(A4.png
    Attached Images Attached Images

  2. #2
    Sencha Premium User
    Join Date
    Jun 2017
    Location
    China
    Posts
    35
    Answers
    1

    Default

    up...

  3. #3
    Sencha Premium User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    19,250
    Answers
    758

    Default

    See: http://docs.sencha.com/extjs/6.5.1/c...lumn.html#vars

    For example you can set:
    $grid-column-header-font-size
    $grid-column-header-font-weight

    Also see: http://docs.sencha.com/extjs/6.5.1/classic/Ext.grid.header.Container.html#css_var-S-$grid-header-padding
    $grid-header-padding
    Twitter - @evantrimboli
    Former Sencha framework engineer, available for consulting.
    As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

  4. #4
    Sencha Premium User
    Join Date
    Jun 2017
    Location
    China
    Posts
    35
    Answers
    1

    Default

    Quote Originally Posted by evant View Post
    See: http://docs.sencha.com/extjs/6.5.1/c...lumn.html#vars

    For example you can set:
    $grid-column-header-font-size
    $grid-column-header-font-weight

    Also see: http://docs.sencha.com/extjs/6.5.1/classic/Ext.grid.header.Container.html#css_var-S-$grid-header-padding
    $grid-header-padding
    Hi evant, Which directory should I add these to?

  5. #5
    Sencha User
    Join Date
    Aug 2017
    Location
    Bydgoszcz
    Posts
    2

    Default

    I have the same problem...

  6. #6
    Sencha User
    Join Date
    Apr 2013
    Posts
    913
    Answers
    105

    Default

    Quote Originally Posted by [email protected] View Post
    Which directory should I add these to?
    /sass/var/all.scss

    Code:
    $grid-header-padding: dynamic(5px);
    Rebuild the app and see if it works.

  7. #7
    Sencha Premium User
    Join Date
    Jun 2017
    Location
    China
    Posts
    35
    Answers
    1

    Default

    Quote Originally Posted by hakimio View Post
    /sass/var/all.scss

    Code:
    $grid-header-padding: dynamic(5px);
    Rebuild the app and see if it works.
    emmmm....I have added it to 'myapp/sass/var/all.scss' ,and rebuilded it ,but it seems not work....

  8. #8
    Sencha User
    Join Date
    Apr 2013
    Posts
    913
    Answers
    105

    Default

    Do you have the following in your app.json:
    Code:
    "var": [
        "sass/var/all.scss",
        "sass/var",
        "${toolkit.name}/sass/var"
    ]
    Did you copy all the files under "build" folder to your test server? Can you test in new "incognito" window?

  9. #9
    Sencha Premium User
    Join Date
    Jun 2017
    Location
    China
    Posts
    35
    Answers
    1

    Default

    Quote Originally Posted by hakimio View Post
    Do you have the following in your app.json:
    Code:
    "var": [
        "sass/var/all.scss",
        "sass/var",
        "${toolkit.name}/sass/var"
    ]
    Did you copy all the files under "build" folder to your test server? Can you test in new "incognito" window?
    My app.json configuration:
    "sass": {
    "namespace": "MyApp",
    "etc": [
    "sass/etc/all.scss",
    "${toolkit.name}/sass/etc/all.scss"
    ],
    "var": [
    "sass/var/all.scss",
    "sass/var",
    "${toolkit.name}/sass/var"
    ],
    "src": [
    "sass/src",
    "${toolkit.name}/sass/src"
    ]

    },

    MyApp/sass/var/all.scss configuration:
    $grid-column-header-font-size:dynamic(8px);
    $grid-header-padding:dynamic(7px 0px 7px 0px);

    it is build successful,but it doesn't work....

  10. #10
    Sencha Premium User
    Join Date
    Jun 2017
    Location
    China
    Posts
    35
    Answers
    1

    Default

    up...

Page 1 of 2 12 LastLast

Similar Threads

  1. Change padding or margin at runtime
    By farion in forum Ext: Q&A
    Replies: 7
    Last Post: 3 Aug 2012, 1:05 AM
  2. Change Grid Row (Cell) padding and margin
    By xjpmauricio in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 4 Nov 2010, 4:15 AM
  3. Change font size in grid column headers
    By teknaut in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 21 Jul 2008, 4:06 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •