akanix42 / meteor-react-toolbox-example

MIT License
18 stars 1 forks source link

Could you add an example on how to modify a component? #12

Open PolGuixe opened 8 years ago

PolGuixe commented 8 years ago

Let say I want to have my AppBar fixed and then add a padding-top to Panel to compensate for the height of the AppBar, and I use the following code:

//client/theme/layout-theme.scss

@import '~react-toolbox/lib/app_bar/_config.scss';
.layout{
  .panel { 
    padding-top: $appbar-height;
  }
}

which is imported into:

//client/theme/toolbox-theme.scss
$color-primary: $palette-blue-500 !default;
$color-primary-dark: $palette-blue-700 !default;

@import './layout-theme.scss';

and integrated using this package

//package.json

"cssModules": {
    "extensions": [
      "scss"
    ],
    "globalVariables": [
      "node_modules/react-toolbox/lib/_colors.scss",
      {
        "theme-building": true
      },
      "client/theme/toolbox-theme.scss"
    ]
  }

I have problems with the @imports, they don't seem to work...

Is this the right approach or I am missing something?