Radium is a set of tools to manage inline styles on [tag:reactjs] elements. It gives you powerful styling capabilities without CSS.
Questions tagged [radium]
44 questions
7
votes
2 answers
"outline" is not a valid style property
I am trying to reuse some components built for web application using reactjswith radium.
I have a component which contains outline css property . I reuse the component , unfortunalty , i got this error :
My questions are :
What is the…
Abdennour TOUMI
- 87,526
- 38
- 249
- 254
7
votes
3 answers
Issue using multiple styles with Material-ui and Radium
I am trying to combine Radium and Material-ui. When I try to apply multiple styles on a single Material-ui component, no style is applied. So, for example, something like this produces no styling applied:
4
votes
1 answer
Radium ':Hover' not working
In my first time implementing Radium, I am trying a simple ':hover'. Here is what I have ...
import React from 'react'
import Radium from 'radium'
@Radium
export default class ResSideNav extends React.Component {
render() {
const style = {
…
Sequential
- 1,455
- 2
- 17
- 27
3
votes
0 answers
Does Radium not work with Material UI?
I want to change the color of the Tab component for smaller devices. Below is an example of what I'm trying to achieve:
import React from 'react'
import Radium from 'radium'
const inkBarStyle = {
background: 'green',
'@media screen and…
patrickhuang94
- 2,085
- 5
- 36
- 58
2
votes
1 answer
radium install Error while using with react 17.0.2
When I am trying to install radium with npm, I am getting a dependency tree error.
Command I am using:
npm install --save radium
Here is the error stack I am getting -
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm…
Nis
- 449
- 4
- 13
2
votes
2 answers
React hover style not working when used with Radium and Material-UI
I am using Radium library for inline styling in react . Using it works fine for other components but i am having issues with Material-UI components. When i hover my mouse over the Paper , it doesn't change the color to green . What's wrong here ?…
Natesh bhat
- 12,274
- 10
- 84
- 125
2
votes
4 answers
Can't resolve radium
I am new to React Environment, and was going through a tutorial and tried to install Radium for css pseudo behaviour using visual integrated terminal.
npm i --save radium
the radium has been installed and added to the package.json
but after…
Aman Kumar
- 480
- 2
- 7
- 21
2
votes
1 answer
Binding Scope in ComponentDidMount for Radium Enhanced Component
I'm working on React component called ProjectCard that holds two divs. The second div has a dropdown, and I want to highlight the entire card when the user hovers over the card or the dropdown has been clicked. I used Radium for adding hover…
Joel Ye
- 63
- 1
- 4
2
votes
1 answer
How to test if styles are dynamically applied on a React component
I've written a React component, Button:
import PropTypes from 'prop-types'
import Radium from 'radium'
import React from 'react'
import { Icon } from 'components'
import { COLOURS, GLOBAL_STYLES, ICONS, MEASUREMENTS } from…
Daniel
- 3,115
- 5
- 28
- 39
2
votes
3 answers
How to dynamically change css selector property value in react js code?
I need to dynamically change the color in the react component for specific selector.
In scss (use sass) i have the following rule:
foo.bar.var * {
color: blue;
}
I want to change it in react code, to be yellow, red or something else.
I cant use…
sky great
- 31
- 1
- 5
2
votes
2 answers
Dynamic CSS stylesheets based using State Values in React
I am implementing a custom color theme module. Simply the user selects two separate colors (a primary and secondary that are ANY hex value) and save the value in state. I use these colors to set custom dynamic styles to components in my application…
Sequential
- 1,455
- 2
- 17
- 27
2
votes
2 answers
Media Query not working in Radium
I have the following react code and when I use Radium to in-line style, the media query doesn't work. It simply shows a blank page as output.
import React, { Component } from 'react';
import Radium from 'Radium';
class contact extends…
mukhilsaravanan
- 115
- 1
- 1
- 9
2
votes
1 answer
How do I wrap react redux connect inside Radium?
Typically when I use Radium in my React app, I would simply wrap my exported class inside Radium
export default Radium(App)
and media queries would work as expected. However, I want to use both connect from react-router alongside Radium like…
patrickhuang94
- 2,085
- 5
- 36
- 58
2
votes
2 answers
Radium - Error: please wrap your application in the StyleRoot component
I have a simple React component that I would like to add media queries to:
import React, {Component} from 'react';
import Radium, {StyleRoot} from 'radium';
import styles from '../../core/styles/base.css';
import sliderstyles from…
Miha Šušteršič
- 9,742
- 25
- 92
- 163
2
votes
1 answer
How to inline style child DOM element React?
Let imagine I import library react-select or any other that I don't have direct access to its component and jsx. Is it possible to pass your own style to child DOM element like drop down menus from other library. Like your can with normal css div…
alphiii
- 1,597
- 3
- 21
- 27