Hello, 

I added a Tailwind drop-shadow to my KendoReact Card components and noticed that any component with adaptive rendering stopped rendering properly and was bound to the Card.

Here is a Stackblitz example. The bottom card with the green background demonstrates the problem.

https://stackblitz.com/edit/react-hb3jww-fkedu8?file=app%2Fmain.jsx,app%2FCustomCard.jsx,index.html

I also came across this about it being more of a CSS issue than one specific to Tailwind.

https://github.com/tailwindlabs/tailwindcss/discussions/9029

I discovered that I could replace "drop-shadow" with "shadow" for my purposes and everything now works as expected. You can close this ticket. I am submitting this because you guys have been really helpful to me and hopefully this helps someone else in case they run into this strange behavior and start pulling their hair out. There is probably a better place to submit this but I had already started down this path before figuring it out on my own.

Thanks,

Julian

Hi there,

Referring to the Task Board documentation from Custom Rendering - KendoReact (telerik.com) and TaskBoardTaskEditPaneProps - React TaskBoard Component - KendoReact API (telerik.com)

How can I add additional input fields (eg: assignee) to the Task Board Task Edit Pane. Currently on 3 input were allowed (title, description, priority).

I'm working on a component library, and I'd like to wrap the Kendo Cards component with additional stuff that matches our requirements; however, I get an error about hooks being an issue due to the nesting.  Is there a way around this?

import { ReactNode } from 'react';
import { Card as KendoCard } from '@progress/kendo-react-layout';

export interface CardProps {
  /**
   * any nested JSX elements
   */
  children?: ReactNode;
}

/**
 * Primary UI component for wrapping content in a card
 */
const Card = ({ children }: CardProps) => (
  <KendoCard
    style={{
      width: 260,
      boxShadow: '0 0 4px 0 rgba(0, 0, 0, .1)',
      marginTop: '15px',
      padding: '19px',
    }}
  >
    {/* <KendoCardBody> */}
      <h4>This is a change</h4>
      {children}
    {/* </KendoCardBody> */}
  </KendoCard>
);

export default Card;

Greetings,

Is there a Kendo Tags (standalone component) I can use inside the Card body content?

I found this image that has tags inside the card body content. It would be great if the tags are closable.

Please see the attached image. Thanks!

Best Regards,

Jason Li

I have an arbitrary number of Cards being returned from a database query. I would like these cards to layout horizontally and automatically line wrap. I've tried the ListView, but I can't find a way to make it horizontal. I also tried the GridLayout, but it doesn't seem to work if you don't specify the row and column explicitly. And the StackLayout just puts them all on the same row, no matter how many of the Cards there are.

Do I have to manually divide them up into rows myself? So if I want 4 cards per row, and I have 20 cards, I programmatically create the 5 rows? Is there a better option?

Thanks!

Tye