GithubHelp home page GithubHelp logo

Comments (7)

newsiberian avatar newsiberian commented on May 14, 2024 9

Hello. @dantrain, thank you for such a great project.
I added new layout. This is not exactly what were asked, but it is close. This enough for my use case. Layout uses the column width and ratio x1, x2, x3.
screencast-1465806660

from react-stonecutter.

dantrain avatar dantrain commented on May 14, 2024

This would be very cool, it's not explicitly supported right now. The best approach at the moment would be to supply a new layout function that decides which column to lay out each item in based on the item's props. So you could place wider items in a wider column.

The makeResponsive higher-order component assumes a fixed column width to set its breakpoints so something else would be needed here.

from react-stonecutter.

bento-n-box avatar bento-n-box commented on May 14, 2024

+1

from react-stonecutter.

dantrain avatar dantrain commented on May 14, 2024

@newsiberian Wow looks awesome!

from react-stonecutter.

Hazantip avatar Hazantip commented on May 14, 2024

@newsiberian Looks amazing! but how to use it ? I understand that i need to download from your branch, make layout attr as layout={layout.horizontal}, but how i can get different width of elements? Can you show code sample?

from react-stonecutter.

wyhinton avatar wyhinton commented on May 14, 2024

Any chance this could get merged?

from react-stonecutter.

wyhinton avatar wyhinton commented on May 14, 2024

I've created a simple example demonstrating @newsiberian 's horizontal layout: https://github.com/wyhinton/react-stonecutter-horizontal-example

image

from react-stonecutter.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.