JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Data Grid › How to change the Grid component's required smart.default.css to non-global

Tagged: 

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • November 23, 2020 at 10:49 am #101164
    LC
    Member

    Hello!
    I’m currently trying to use more complex web page structures, such as Grid components and other components that work together.
    Now I have some problems and I need your help, thank you.
    Here’s the problem: When using a Grid component, we must add:
    @import../ node_modules/smart-webcomponents – presents/source/styles/smart.default.css ‘;
    to the styles.css file to import the CSS files that the Grid needs.
    Without this file, the Grid component will not work properly.
    But the CSS file imported here is global.
    Here are some questions.
    Can we set this CSS file to be used only by Grid components, not globally?
    I’ve got some information on Google, so far I haven’t got a good way.
    Thank you very much.
    Looking forward to your early reply.
    B,R,
    LC

    November 23, 2020 at 1:19 pm #101165
    admin
    Keymaster

    Hi,
    What do you mean by global? The css is required for the grid and the components used by the grid like buttons, inputs, windows, scrollbars, etc. It is one file for all smart ui components.
    Regards,
    Peter

    November 23, 2020 at 1:34 pm #101166
    LC
    Member

    Hi Peter,
    I will explain in detail what I have encountered so far:
    I currently have a set of Angular projects that I have developed that already contain components such as Button. Sorry for that Smart components are not used in these original components for the time being.
    I’m currently trying to integrate smart-Grid components into it to see how it works.
    First of all, I added
    “@import../ node_modules/smart-webcomponents – presents/source/styles/smart.default.css;”
    into the styles.css file and wrote some data according the official website instance.
    But at this point the Grid does not display correctly.
    I wonder if smart.default.css conflicts with my original .css file?
    Then I tried adding smart.default.css to the .css file which only belongs to the smart-Grid component, but it still didn’t work.
    Is there any good solution to this problem?
    Thank you.
    BR,
    LC

    November 23, 2020 at 2:27 pm #101167
    admin
    Keymaster

    Hi,
    As other styles, you should define this in angular.json. My suggestion is to read the angular getting started tutorials on our website. Just in case to mention is that we do not support Internet explorer. We support it in jqwidgets.com product.
    Regards,
    Peter

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.