#ActuallyAutistic web dev. Does front of the front-end. Loves perf and minimalism. Prefers HTML, CSS, Web Standards over JS, UX over DX. Hates div disease.
'width: >=500px <1000px'->'(min-width: 500px) and (max-width: 999px)'
And you can config it a lot so you can get something usable with Styled Components:
constbreakpoints={s:'360px',m:'480px',l:'640px',xl:'960px'}// or: { s: 360, m: 480, l: 640, xl: 960 }constscreen=newcompactMediaQuery({breakpoints,prefix:'@media screen'})screen('width: >=m <xl')// '@media screen and (min-width: 480px) and (max-width: 959px)'constComponent=styled.div({[screen('width: >=m <xl')]:{// styles that work from M and above, but below XL}})
This is just a thing I assumed would already be solved by someone, but so far breakpoint tools seem to mostly focus to doing traditional mobile-first where you have only min-width based queries, and if you have max-width then you have to write more code.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Okay, there hasn't been much activity here, but here is something I made last night.
You can write:
And you can config it a lot so you can get something usable with Styled Components:
This is just a thing I assumed would already be solved by someone, but so far breakpoint tools seem to mostly focus to doing traditional mobile-first where you have only
min-width
based queries, and if you havemax-width
then you have to write more code.