Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

scoped styled-jsx not working with antd components. #2296

Closed
supra28 opened this issue Jun 17, 2017 · 1 comment
Closed

scoped styled-jsx not working with antd components. #2296

supra28 opened this issue Jun 17, 2017 · 1 comment

Comments

@supra28
Copy link

supra28 commented Jun 17, 2017

Take for example a Form:

<div>
<Form onSubmit={this.handleSubmit} className="login-form">

          <FormItem>
            {getFieldDecorator("userName", {
              rules: [
                { required: true, message: "Please input your username!" }
              ]
            })(
              <Input
                prefix={<Icon type="user" style={{ fontSize: 13 }} />}
                placeholder="Username"
              />
            )}
          </FormItem>
</Form>
 <style jsx>{`
          .login-form {
            max-width: 300px;
            margin: 0 auto;
          }
        `}</style>
</div>

The style doesn't apply to the Form unless we change <style jsx> to <style>
It doesn't generate data-jsx Id for the form component.
is this behavior expected?

@giuseppeg
Copy link
Contributor

@supra28 yes components are not regular dom elements. vercel/styled-jsx#27 could enable what you are asking, I suggest that you close this issue and subscribe to that one instead. I might start to work on it soon.

@lock lock bot locked as resolved and limited conversation to collaborators May 11, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants