search

carbon-design-system / carbon

A design system built by IBM
https://www.carbondesignsystem.com
Apache License 2.0
7.86k stars 1.82k forks source link

Use DatePicker inline, currently falling to a new line #3792

Closed trsiddiqui closed 5 years ago

trsiddiqui commented 5 years ago

What package(s) are you using?

Summary

Relevant information

I am trying to implement the single selection filtering layout as explained here. I am having issues with aligning dates in the single row of filters which already have a multiselect and a drop down. Since multiselect and dropdown controls have a property called type to use these controls inline, I am wondering if the datepicker control has a similar property because no matter how i lay it out, datepicker always falls to a new line.

tw15egan commented 5 years ago

Can you produce a reduced case test scenario so we can try to debug?

trsiddiqui commented 5 years ago

Hello, I apologize for taking this long to respond. Github is not a regular app on my stack and hence I missed updates on this. I will try and create an account with my work email.

trsiddiqui commented 5 years ago

Here is a codesandbox link. https://codesandbox.io/embed/codesandbox-hpzo1

tw15egan commented 5 years ago

Can you just put all the items inside of a flex container? In your example, if I set #root div { display: flex; } they all appear on one line.

tahaimt commented 5 years ago

Yeah that worked, but is there an alternative for IE11 (I couldnt test in IE11 as the project is not set up with proper polyfills)? I was also wondering if there was a collection of ready to use classes for different layouts that could be used with carbon for react, and if yes, is there documentation around those? The reason I am asking is because I am not a full time designer and I could save a lot of time if I was able to find documentation around layout and positioning of element in carbon design system.

tw15egan commented 5 years ago

There are no predefined classes for layouts other than what comes with the Grid package (documentation).

I was also under the impression that basic flex layouts can be achieved in IE11 source

stale[bot] commented 5 years ago

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. You can keep the conversation going with just a short comment. Thanks for your contributions.

stale[bot] commented 5 years ago

As there's been no activity since this issue was marked as stale, we are auto-closing it.