-
Notifications
You must be signed in to change notification settings - Fork 24
New issue
Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? # to your account
Custom theme not applied #30
Comments
I believe your webpack config and postcss config are pointless here because react-toolbox-themr doesn't use them. Why aren't you adding the background-color variable to your customProperties of |
Thanks for looking into this. Thing is, not even |
Edit: I've also tried importing raw RT components as outlined here import Input from 'react-toolbox/lib/input/Input';
import Button from 'react-toolbox/lib/button/Button'; |
@icd2k3 You need to import the css file generated by themr to style your raw components |
Having same issue here. Trying to change the typeface but running into issues. My files...
{
"name": "movementa-ui",
"version": "0.1.0",
"private": true,
"engines": {
"node": "6.10.0",
"npm": "3.10.10"
},
"dependencies": {
"flexboxgrid": "^6.3.1",
"flexboxgrid-helpers": "^1.1.1",
"history": "^3.0.0",
"material-design-icons-iconfont": "^3.0.3",
"postcss": "^5.2.15",
"postcss-cssnext": "^2.9.0",
"react": "^15.4.2",
"react-dom": "^15.4.2",
"react-redux": "^5.0.3",
"react-router": "^3.0.2",
"react-toolbox": "^2.0.0-beta.6",
"react-toolbox-themr": "^1.0.2",
"redux": "^3.6.0",
"roboto-fontface": "^0.7.0",
"typeface-jura": "0.0.22"
},
"devDependencies": {
"@kadira/storybook": "^2.21.0",
"eslint": "^3.17.0",
"postcss-loader": "^1.3.3",
"react-scripts": "0.9.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"toolbox": "react-toolbox-themr",
"storybook": "start-storybook -p 9009 -s public",
"build-storybook": "build-storybook -s public"
},
"reactToolbox": {
"include": [
"AUTOCOMPLETE",
"AVATAR",
"BUTTON",
"CARD",
"CHECKBOX",
"CHIP",
"DATE_PICKER",
"DIALOG",
"DRAWER",
"DROPDOWN",
"INPUT",
"LAYOUT",
"LINK",
"LIST",
"MENU",
"NAVIGATION",
"OVERLAY",
"PROGRESS_BAR",
"RADIO",
"RIPPLE",
"SLIDER",
"SNACKBAR",
"SWITCH",
"TABLE",
"TABS",
"TIME_PICKER",
"TOOLTIP"
],
"customProperties": {
"variables": {
"preferred-font": "'Jura', sans-serif;"
}
},
"output": "src/toolbox"
}
} No matter what custom property I try to set, none of them take hold. The default theme is being applied though, because the components are styled, but just not with the updated properties: Using Wondering what I can do to get this to work? |
Having the same issue. I just downloaded the lib and im having troubles on getting the custom theme on red-500 for all the components. I have my package.json:
My webpack config (using version 2):
|
I had this problem as well, and I realized I forgot to link the generated css in my html file. |
@danielmichaelni I know this is a bit late, but do you mind showing your code? Not sure where exactly the import is supposed to come from. Thank you! |
To follow up with what @danielmichaelni said, it's important to note that react-toolbox-themr creates two files, a css file and a js file. The js file is used to create a provider, which is in turn used to apply the classNames that get set. The css file is used for expressing the styles. It's up to you for where to stick it, but there are a few options:
As a workaround for webpack: EDIT: This breaks some styles on react-toolbox itself. Would not recommend. EDIT 2: I've tried making this work for hours. It is impossible. |
Well after many years I have encountered the same issue. Were you able to solve it? |
I'm trying to apply a custom theme using react-toolbox-themr, but none of the changes I make are being applied to the components.. Here's my config:
App.js
:webpack.config.js
postcss.config.js
package.json
I'm running
react-toolbox-themr
and the assets are being generated, although no custom styles are included. Classes are also applied to the components as far as I can see, but again, components look the same no matter what I do.. The generated CSS file is included in my index' head, of course.I'm pretty sure I'm missing something obvious here..
The text was updated successfully, but these errors were encountered: