question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

v3.1.0 Breaks some styles

See original GitHub issue

Version

styled-components: 3.1.0

Reproduction

I use styled-components with Slate, though the issue persists across the app, whether with or without Slate.

Steps to reproduce

I don’t have exact steps to reproduce yet, but I suspect that this happens when there’s a lot of nesting going on with components. I use a fair amount of HOC with styled-components (i.e. const Caption = styled(PictureCaption)'').

Expected Behavior

I haven’t updated the production website for 3.1.0 (it’s at 3.0.2) - you can see how things should ideally look there - www.analog.cafe - all the code for this website is open-source, not sure if that’s helpful (It’s not well-documented at all) but you can have a look at it here: https://github.com/dmitrizzle/Analog.Cafe

Actual Behavior

Things do get ugly when I test the new version: screen shot 2018-01-29 at 5 05 41 pm screen shot 2018-01-29 at 5 06 45 pm

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:1
  • Comments:12 (5 by maintainers)

github_iconTop GitHub Comments

3reactions
probablyupcommented, Jan 30, 2018

@strothj that appears to be invalid CSS: https://codepen.io/anon/pen/rJNXrz

According to a few stackoverflow articles I was reading, nested media queries are technically in the CSS3 spec but I guess most browsers don’t have support for them.

1reaction
mxstbrcommented, Feb 2, 2018

@oyeanuj yeah that’s consistent, insertRule is only used in production because it doesn’t allow you to edit styles from the DevTools.


I think this is a duplicate of #1473 so I’m going to close it in an effort to keep the discussion about this bug somewhere centralized, please follow that issue for updates! 🙏

Read more comments on GitHub >

github_iconTop Results From Across the Web

CSS · Bootstrap 3.1.0 Documentation - BootstrapDocs
Bootstrap makes use of certain HTML elements and CSS properties that ... Instead of adding on optional mobile styles, they're baked right into...
Read more >
Releases - styled-components
Because styled-components allows any kind of prop to be used for styling (a trait shared by ... Hotfix ReactNative support, which was broken...
Read more >
SciTE4AutoHotkey v3.1.0 - AutoHotkey Community
Help file word lookup is currently broken as a result of (not so) recent changes in AutoHotkey's CHM file. Debugging AutoHotkey v2 scripts...
Read more >
styler 1.0.0 - Tidyverse
styler can style text, single files, packages and entire R source ... the same before and after styling, as only spaces and line...
Read more >
Hueman theme v3.1.0 release note - Press Customizr
This has create an issue that could disable some custom rules that you've added to your child theme style.css. This is now fixed...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found