frutjam
Version:
A utility-first CSS UI Library for Tailwind CSS
2 lines (1 loc) • 2.09 kB
JavaScript
export default {".join":{"display":"inline-flex","align-items":"stretch","--join-radius":"calc(var(--border-radius) * 2)","& .join-item":{"border-start-start-radius":"var(--join-ss, 0)","border-start-end-radius":"var(--join-se, 0)","border-end-start-radius":"var(--join-es, 0)","border-end-end-radius":"var(--join-ee, 0)","margin-inline-start":"calc(var(--border, 1px) * -1)"},"flex-direction":"row",">:only-child":{"--join-ss":"var(--join-radius)","--join-se":"var(--join-radius)","--join-es":"var(--join-radius)","--join-ee":"var(--join-radius)"},">:first-child:not(:only-child)":{"--join-ss":"var(--join-radius)","--join-se":"0","--join-es":"var(--join-radius)","--join-ee":"0"},">:last-child:not(:only-child)":{"--join-ss":"0","--join-se":"var(--join-radius)","--join-es":"0","--join-ee":"var(--join-radius)"},">:not(:first-child):not(:last-child)":{"border-radius":"0"}},".join-horizontal":{"flex-direction":"row",">:only-child":{"--join-ss":"var(--join-radius)","--join-se":"var(--join-radius)","--join-es":"var(--join-radius)","--join-ee":"var(--join-radius)"},">:first-child:not(:only-child)":{"--join-ss":"var(--join-radius)","--join-se":"0","--join-es":"var(--join-radius)","--join-ee":"0"},">:last-child:not(:only-child)":{"--join-ss":"0","--join-se":"var(--join-radius)","--join-es":"0","--join-ee":"var(--join-radius)"},">:not(:first-child):not(:last-child)":{"border-radius":"0"},"& .join-item":{"margin-inline-start":"calc(var(--border, 1px) * -1)"}},".join-vertical":{"flex-direction":"column",">:only-child":{"--join-ss":"var(--join-radius)","--join-se":"var(--join-radius)","--join-es":"var(--join-radius)","--join-ee":"var(--join-radius)"},">:first-child:not(:only-child)":{"--join-ss":"var(--join-radius)","--join-se":"var(--join-radius)","--join-es":"0","--join-ee":"0"},">:last-child:not(:only-child)":{"--join-ss":"0","--join-se":"0","--join-es":"var(--join-radius)","--join-ee":"var(--join-radius)"},">:not(:first-child):not(:last-child)":{"border-radius":"0"},"& .join-item":{"margin-block-start":"calc(var(--border, 1px) * -1)"}},".join-item":{"--join-item":"1"}};