donaldboulton / publiuslogic

Moved to private, React project powering my discussion site To Publish Logic,.
https://publiuslogic.com
Other
7 stars 2 forks source link

React Hooks Masonry #50

Open utterances-bot opened 4 years ago

utterances-bot commented 4 years ago

React Hooks Masonry | Publiuslogic

React Hooks Masonry

https://publiuslogic.com/

cordial commented 4 years ago

hey. Nice work! I was wondering how you would enhance this by having a number of columns value for different breakpoints so that it is more responsive? It is rare you're going to want the same number of columns no matter what the viewport size.

cordial commented 4 years ago

Although I guess you can only have more than one masonry grid and hide/display them on viewports as one workaround.

donaldboulton commented 4 years ago

I am slowly changing from a mess of styled-components and global styles with bulma css and have not quite figured out my columns and breakpoints. Need to do this as bluma does not let me have a sticky TOC in its own column and remain sticky. Your suggestion is perfect for what my confusion is on needed changes are. That is something very interesting. Changing the number of columns based on breakpoints. I will work on that and get back to this. Thank You Donald Boulton

cordial commented 4 years ago

hey again. I'm not sure what I am doing wrong but the number of columns seem to be changing randomly between 1,2,3 upon refreshes?

I had presumed I can change number of cols here? -

' const [numCols, setNumCols] = useState(2)'

cordial commented 4 years ago

Are the number of columns supposed to change in reference to minWidth? I'm not sure I've understood your code quite correctly, sorry.