@techv/design-system 0.1.3 → 0.1.5

package/dist/utility.css

@@ -0,0 +1,100 @@
+.bg-red-50{background-color:var(--red-50)}.bg-red-100{background-color:var(--red-100)}.bg-red-200{background-color:var(--red-200)}.bg-red-300{background-color:var(--red-300)}.bg-red-400{background-color:var(--red-400)}.bg-red-500{background-color:var(--red-500)}.bg-red-600{background-color:var(--red-600)}.bg-red-700{background-color:var(--red-700)}.bg-red-800{background-color:var(--red-800)}.bg-red-900{background-color:var(--red-900)}
+.bg-orange-50{background-color:var(--orange-50)}.bg-orange-100{background-color:var(--orange-100)}.bg-orange-200{background-color:var(--orange-200)}.bg-orange-300{background-color:var(--orange-300)}.bg-orange-400{background-color:var(--orange-400)}.bg-orange-500{background-color:var(--orange-500)}.bg-orange-600{background-color:var(--orange-600)}.bg-orange-700{background-color:var(--orange-700)}.bg-orange-800{background-color:var(--orange-800)}.bg-orange-900{background-color:var(--orange-900)}
+.bg-amber-50{background-color:var(--amber-50)}.bg-amber-100{background-color:var(--amber-100)}.bg-amber-200{background-color:var(--amber-200)}.bg-amber-300{background-color:var(--amber-300)}.bg-amber-400{background-color:var(--amber-400)}.bg-amber-500{background-color:var(--amber-500)}.bg-amber-600{background-color:var(--amber-600)}.bg-amber-700{background-color:var(--amber-700)}.bg-amber-800{background-color:var(--amber-800)}.bg-amber-900{background-color:var(--amber-900)}
+.bg-yellow-50{background-color:var(--yellow-50)}.bg-yellow-100{background-color:var(--yellow-100)}.bg-yellow-200{background-color:var(--yellow-200)}.bg-yellow-300{background-color:var(--yellow-300)}.bg-yellow-400{background-color:var(--yellow-400)}.bg-yellow-500{background-color:var(--yellow-500)}.bg-yellow-600{background-color:var(--yellow-600)}.bg-yellow-700{background-color:var(--yellow-700)}.bg-yellow-800{background-color:var(--yellow-800)}.bg-yellow-900{background-color:var(--yellow-900)}
+.bg-lime-50{background-color:var(--lime-50)}.bg-lime-100{background-color:var(--lime-100)}.bg-lime-200{background-color:var(--lime-200)}.bg-lime-300{background-color:var(--lime-300)}.bg-lime-400{background-color:var(--lime-400)}.bg-lime-500{background-color:var(--lime-500)}.bg-lime-600{background-color:var(--lime-600)}.bg-lime-700{background-color:var(--lime-700)}.bg-lime-800{background-color:var(--lime-800)}.bg-lime-900{background-color:var(--lime-900)}
+.bg-green-50{background-color:var(--green-50)}.bg-green-100{background-color:var(--green-100)}.bg-green-200{background-color:var(--green-200)}.bg-green-300{background-color:var(--green-300)}.bg-green-400{background-color:var(--green-400)}.bg-green-500{background-color:var(--green-500)}.bg-green-600{background-color:var(--green-600)}.bg-green-700{background-color:var(--green-700)}.bg-green-800{background-color:var(--green-800)}.bg-green-900{background-color:var(--green-900)}
+.bg-teal-50{background-color:var(--teal-50)}.bg-teal-100{background-color:var(--teal-100)}.bg-teal-200{background-color:var(--teal-200)}.bg-teal-300{background-color:var(--teal-300)}.bg-teal-400{background-color:var(--teal-400)}.bg-teal-500{background-color:var(--teal-500)}.bg-teal-600{background-color:var(--teal-600)}.bg-teal-700{background-color:var(--teal-700)}.bg-teal-800{background-color:var(--teal-800)}.bg-teal-900{background-color:var(--teal-900)}
+.bg-cyan-50{background-color:var(--cyan-50)}.bg-cyan-100{background-color:var(--cyan-100)}.bg-cyan-200{background-color:var(--cyan-200)}.bg-cyan-300{background-color:var(--cyan-300)}.bg-cyan-400{background-color:var(--cyan-400)}.bg-cyan-500{background-color:var(--cyan-500)}.bg-cyan-600{background-color:var(--cyan-600)}.bg-cyan-700{background-color:var(--cyan-700)}.bg-cyan-800{background-color:var(--cyan-800)}.bg-cyan-900{background-color:var(--cyan-900)}
+.bg-sky-50{background-color:var(--sky-50)}.bg-sky-100{background-color:var(--sky-100)}.bg-sky-200{background-color:var(--sky-200)}.bg-sky-300{background-color:var(--sky-300)}.bg-sky-400{background-color:var(--sky-400)}.bg-sky-500{background-color:var(--sky-500)}.bg-sky-600{background-color:var(--sky-600)}.bg-sky-700{background-color:var(--sky-700)}.bg-sky-800{background-color:var(--sky-800)}.bg-sky-900{background-color:var(--sky-900)}
+.bg-blue-50{background-color:var(--blue-50)}.bg-blue-100{background-color:var(--blue-100)}.bg-blue-200{background-color:var(--blue-200)}.bg-blue-300{background-color:var(--blue-300)}.bg-blue-400{background-color:var(--blue-400)}.bg-blue-500{background-color:var(--blue-500)}.bg-blue-600{background-color:var(--blue-600)}.bg-blue-700{background-color:var(--blue-700)}.bg-blue-800{background-color:var(--blue-800)}.bg-blue-900{background-color:var(--blue-900)}
+.bg-indigo-50{background-color:var(--indigo-50)}.bg-indigo-100{background-color:var(--indigo-100)}.bg-indigo-200{background-color:var(--indigo-200)}.bg-indigo-300{background-color:var(--indigo-300)}.bg-indigo-400{background-color:var(--indigo-400)}.bg-indigo-500{background-color:var(--indigo-500)}.bg-indigo-600{background-color:var(--indigo-600)}.bg-indigo-700{background-color:var(--indigo-700)}.bg-indigo-800{background-color:var(--indigo-800)}.bg-indigo-900{background-color:var(--indigo-900)}
+.bg-violet-50{background-color:var(--violet-50)}.bg-violet-100{background-color:var(--violet-100)}.bg-violet-200{background-color:var(--violet-200)}.bg-violet-300{background-color:var(--violet-300)}.bg-violet-400{background-color:var(--violet-400)}.bg-violet-500{background-color:var(--violet-500)}.bg-violet-600{background-color:var(--violet-600)}.bg-violet-700{background-color:var(--violet-700)}.bg-violet-800{background-color:var(--violet-800)}.bg-violet-900{background-color:var(--violet-900)}
+.bg-purple-50{background-color:var(--purple-50)}.bg-purple-100{background-color:var(--purple-100)}.bg-purple-200{background-color:var(--purple-200)}.bg-purple-300{background-color:var(--purple-300)}.bg-purple-400{background-color:var(--purple-400)}.bg-purple-500{background-color:var(--purple-500)}.bg-purple-600{background-color:var(--purple-600)}.bg-purple-700{background-color:var(--purple-700)}.bg-purple-800{background-color:var(--purple-800)}.bg-purple-900{background-color:var(--purple-900)}
+.bg-pink-50{background-color:var(--pink-50)}.bg-pink-100{background-color:var(--pink-100)}.bg-pink-200{background-color:var(--pink-200)}.bg-pink-300{background-color:var(--pink-300)}.bg-pink-400{background-color:var(--pink-400)}.bg-pink-500{background-color:var(--pink-500)}.bg-pink-600{background-color:var(--pink-600)}.bg-pink-700{background-color:var(--pink-700)}.bg-pink-800{background-color:var(--pink-800)}.bg-pink-900{background-color:var(--pink-900)}
+.bg-rose-50{background-color:var(--rose-50)}.bg-rose-100{background-color:var(--rose-100)}.bg-rose-200{background-color:var(--rose-200)}.bg-rose-300{background-color:var(--rose-300)}.bg-rose-400{background-color:var(--rose-400)}.bg-rose-500{background-color:var(--rose-500)}.bg-rose-600{background-color:var(--rose-600)}.bg-rose-700{background-color:var(--rose-700)}.bg-rose-800{background-color:var(--rose-800)}.bg-rose-900{background-color:var(--rose-900)}
+.bg-slate-50{background-color:var(--slate-50)}.bg-slate-100{background-color:var(--slate-100)}.bg-slate-200{background-color:var(--slate-200)}.bg-slate-300{background-color:var(--slate-300)}.bg-slate-400{background-color:var(--slate-400)}.bg-slate-500{background-color:var(--slate-500)}.bg-slate-600{background-color:var(--slate-600)}.bg-slate-700{background-color:var(--slate-700)}.bg-slate-800{background-color:var(--slate-800)}.bg-slate-900{background-color:var(--slate-900)}
+.bg-gray-50{background-color:var(--gray-50)}.bg-gray-100{background-color:var(--gray-100)}.bg-gray-200{background-color:var(--gray-200)}.bg-gray-300{background-color:var(--gray-300)}.bg-gray-400{background-color:var(--gray-400)}.bg-gray-500{background-color:var(--gray-500)}.bg-gray-600{background-color:var(--gray-600)}.bg-gray-700{background-color:var(--gray-700)}.bg-gray-800{background-color:var(--gray-800)}.bg-gray-900{background-color:var(--gray-900)}
+.bg-zinc-50{background-color:var(--zinc-50)}.bg-zinc-100{background-color:var(--zinc-100)}.bg-zinc-200{background-color:var(--zinc-200)}.bg-zinc-300{background-color:var(--zinc-300)}.bg-zinc-400{background-color:var(--zinc-400)}.bg-zinc-500{background-color:var(--zinc-500)}.bg-zinc-600{background-color:var(--zinc-600)}.bg-zinc-700{background-color:var(--zinc-700)}.bg-zinc-800{background-color:var(--zinc-800)}.bg-zinc-900{background-color:var(--zinc-900)}
+.bg-white{background-color:#ffffff}.bg-black{background-color:#000000}
+
+.tx-red-50{color:var(--red-50)}.tx-red-100{color:var(--red-100)}.tx-red-200{color:var(--red-200)}.tx-red-300{color:var(--red-300)}.tx-red-400{color:var(--red-400)}.tx-red-500{color:var(--red-500)}.tx-red-600{color:var(--red-600)}.tx-red-700{color:var(--red-700)}.tx-red-800{color:var(--red-800)}.tx-red-900{color:var(--red-900)}
+.tx-orange-50{color:var(--orange-50)}.tx-orange-100{color:var(--orange-100)}.tx-orange-200{color:var(--orange-200)}.tx-orange-300{color:var(--orange-300)}.tx-orange-400{color:var(--orange-400)}.tx-orange-500{color:var(--orange-500)}.tx-orange-600{color:var(--orange-600)}.tx-orange-700{color:var(--orange-700)}.tx-orange-800{color:var(--orange-800)}.tx-orange-900{color:var(--orange-900)}
+.tx-amber-50{color:var(--amber-50)}.tx-amber-100{color:var(--amber-100)}.tx-amber-200{color:var(--amber-200)}.tx-amber-300{color:var(--amber-300)}.tx-amber-400{color:var(--amber-400)}.tx-amber-500{color:var(--amber-500)}.tx-amber-600{color:var(--amber-600)}.tx-amber-700{color:var(--amber-700)}.tx-amber-800{color:var(--amber-800)}.tx-amber-900{color:var(--amber-900)}
+.tx-yellow-50{color:var(--yellow-50)}.tx-yellow-100{color:var(--yellow-100)}.tx-yellow-200{color:var(--yellow-200)}.tx-yellow-300{color:var(--yellow-300)}.tx-yellow-400{color:var(--yellow-400)}.tx-yellow-500{color:var(--yellow-500)}.tx-yellow-600{color:var(--yellow-600)}.tx-yellow-700{color:var(--yellow-700)}.tx-yellow-800{color:var(--yellow-800)}.tx-yellow-900{color:var(--yellow-900)}
+.tx-lime-50{color:var(--lime-50)}.tx-lime-100{color:var(--lime-100)}.tx-lime-200{color:var(--lime-200)}.tx-lime-300{color:var(--lime-300)}.tx-lime-400{color:var(--lime-400)}.tx-lime-500{color:var(--lime-500)}.tx-lime-600{color:var(--lime-600)}.tx-lime-700{color:var(--lime-700)}.tx-lime-800{color:var(--lime-800)}.tx-lime-900{color:var(--lime-900)}
+.tx-green-50{color:var(--green-50)}.tx-green-100{color:var(--green-100)}.tx-green-200{color:var(--green-200)}.tx-green-300{color:var(--green-300)}.tx-green-400{color:var(--green-400)}.tx-green-500{color:var(--green-500)}.tx-green-600{color:var(--green-600)}.tx-green-700{color:var(--green-700)}.tx-green-800{color:var(--green-800)}.tx-green-900{color:var(--green-900)}
+.tx-teal-50{color:var(--teal-50)}.tx-teal-100{color:var(--teal-100)}.tx-teal-200{color:var(--teal-200)}.tx-teal-300{color:var(--teal-300)}.tx-teal-400{color:var(--teal-400)}.tx-teal-500{color:var(--teal-500)}.tx-teal-600{color:var(--teal-600)}.tx-teal-700{color:var(--teal-700)}.tx-teal-800{color:var(--teal-800)}.tx-teal-900{color:var(--teal-900)}
+.tx-cyan-50{color:var(--cyan-50)}.tx-cyan-100{color:var(--cyan-100)}.tx-cyan-200{color:var(--cyan-200)}.tx-cyan-300{color:var(--cyan-300)}.tx-cyan-400{color:var(--cyan-400)}.tx-cyan-500{color:var(--cyan-500)}.tx-cyan-600{color:var(--cyan-600)}.tx-cyan-700{color:var(--cyan-700)}.tx-cyan-800{color:var(--cyan-800)}.tx-cyan-900{color:var(--cyan-900)}
+.tx-sky-50{color:var(--sky-50)}.tx-sky-100{color:var(--sky-100)}.tx-sky-200{color:var(--sky-200)}.tx-sky-300{color:var(--sky-300)}.tx-sky-400{color:var(--sky-400)}.tx-sky-500{color:var(--sky-500)}.tx-sky-600{color:var(--sky-600)}.tx-sky-700{color:var(--sky-700)}.tx-sky-800{color:var(--sky-800)}.tx-sky-900{color:var(--sky-900)}
+.tx-blue-50{color:var(--blue-50)}.tx-blue-100{color:var(--blue-100)}.tx-blue-200{color:var(--blue-200)}.tx-blue-300{color:var(--blue-300)}.tx-blue-400{color:var(--blue-400)}.tx-blue-500{color:var(--blue-500)}.tx-blue-600{color:var(--blue-600)}.tx-blue-700{color:var(--blue-700)}.tx-blue-800{color:var(--blue-800)}.tx-blue-900{color:var(--blue-900)}
+.tx-indigo-50{color:var(--indigo-50)}.tx-indigo-100{color:var(--indigo-100)}.tx-indigo-200{color:var(--indigo-200)}.tx-indigo-300{color:var(--indigo-300)}.tx-indigo-400{color:var(--indigo-400)}.tx-indigo-500{color:var(--indigo-500)}.tx-indigo-600{color:var(--indigo-600)}.tx-indigo-700{color:var(--indigo-700)}.tx-indigo-800{color:var(--indigo-800)}.tx-indigo-900{color:var(--indigo-900)}
+.tx-violet-50{color:var(--violet-50)}.tx-violet-100{color:var(--violet-100)}.tx-violet-200{color:var(--violet-200)}.tx-violet-300{color:var(--violet-300)}.tx-violet-400{color:var(--violet-400)}.tx-violet-500{color:var(--violet-500)}.tx-violet-600{color:var(--violet-600)}.tx-violet-700{color:var(--violet-700)}.tx-violet-800{color:var(--violet-800)}.tx-violet-900{color:var(--violet-900)}
+.tx-purple-50{color:var(--purple-50)}.tx-purple-100{color:var(--purple-100)}.tx-purple-200{color:var(--purple-200)}.tx-purple-300{color:var(--purple-300)}.tx-purple-400{color:var(--purple-400)}.tx-purple-500{color:var(--purple-500)}.tx-purple-600{color:var(--purple-600)}.tx-purple-700{color:var(--purple-700)}.tx-purple-800{color:var(--purple-800)}.tx-purple-900{color:var(--purple-900)}
+.tx-pink-50{color:var(--pink-50)}.tx-pink-100{color:var(--pink-100)}.tx-pink-200{color:var(--pink-200)}.tx-pink-300{color:var(--pink-300)}.tx-pink-400{color:var(--pink-400)}.tx-pink-500{color:var(--pink-500)}.tx-pink-600{color:var(--pink-600)}.tx-pink-700{color:var(--pink-700)}.tx-pink-800{color:var(--pink-800)}.tx-pink-900{color:var(--pink-900)}
+.tx-rose-50{color:var(--rose-50)}.tx-rose-100{color:var(--rose-100)}.tx-rose-200{color:var(--rose-200)}.tx-rose-300{color:var(--rose-300)}.tx-rose-400{color:var(--rose-400)}.tx-rose-500{color:var(--rose-500)}.tx-rose-600{color:var(--rose-600)}.tx-rose-700{color:var(--rose-700)}.tx-rose-800{color:var(--rose-800)}.tx-rose-900{color:var(--rose-900)}
+.tx-slate-50{color:var(--slate-50)}.tx-slate-100{color:var(--slate-100)}.tx-slate-200{color:var(--slate-200)}.tx-slate-300{color:var(--slate-300)}.tx-slate-400{color:var(--slate-400)}.tx-slate-500{color:var(--slate-500)}.tx-slate-600{color:var(--slate-600)}.tx-slate-700{color:var(--slate-700)}.tx-slate-800{color:var(--slate-800)}.tx-slate-900{color:var(--slate-900)}
+.tx-gray-50{color:var(--gray-50)}.tx-gray-100{color:var(--gray-100)}.tx-gray-200{color:var(--gray-200)}.tx-gray-300{color:var(--gray-300)}.tx-gray-400{color:var(--gray-400)}.tx-gray-500{color:var(--gray-500)}.tx-gray-600{color:var(--gray-600)}.tx-gray-700{color:var(--gray-700)}.tx-gray-800{color:var(--gray-800)}.tx-gray-900{color:var(--gray-900)}
+.tx-zinc-50{color:var(--zinc-50)}.tx-zinc-100{color:var(--zinc-100)}.tx-zinc-200{color:var(--zinc-200)}.tx-zinc-300{color:var(--zinc-300)}.tx-zinc-400{color:var(--zinc-400)}.tx-zinc-500{color:var(--zinc-500)}.tx-zinc-600{color:var(--zinc-600)}.tx-zinc-700{color:var(--zinc-700)}.tx-zinc-800{color:var(--zinc-800)}.tx-zinc-900{color:var(--zinc-900)}
+.tx-white{color:#ffffff}.tx-black{color:#000000}
+
+.bd-red-50{border-color:var(--red-50)}.bd-red-100{border-color:var(--red-100)}.bd-red-200{border-color:var(--red-200)}.bd-red-300{border-color:var(--red-300)}.bd-red-400{border-color:var(--red-400)}.bd-red-500{border-color:var(--red-500)}.bd-red-600{border-color:var(--red-600)}.bd-red-700{border-color:var(--red-700)}.bd-red-800{border-color:var(--red-800)}.bd-red-900{border-color:var(--red-900)}
+.bd-orange-50{border-color:var(--orange-50)}.bd-orange-100{border-color:var(--orange-100)}.bd-orange-200{border-color:var(--orange-200)}.bd-orange-300{border-color:var(--orange-300)}.bd-orange-400{border-color:var(--orange-400)}.bd-orange-500{border-color:var(--orange-500)}.bd-orange-600{border-color:var(--orange-600)}.bd-orange-700{border-color:var(--orange-700)}.bd-orange-800{border-color:var(--orange-800)}.bd-orange-900{border-color:var(--orange-900)}
+.bd-amber-50{border-color:var(--amber-50)}.bd-amber-100{border-color:var(--amber-100)}.bd-amber-200{border-color:var(--amber-200)}.bd-amber-300{border-color:var(--amber-300)}.bd-amber-400{border-color:var(--amber-400)}.bd-amber-500{border-color:var(--amber-500)}.bd-amber-600{border-color:var(--amber-600)}.bd-amber-700{border-color:var(--amber-700)}.bd-amber-800{border-color:var(--amber-800)}.bd-amber-900{border-color:var(--amber-900)}
+.bd-green-50{border-color:var(--green-50)}.bd-green-100{border-color:var(--green-100)}.bd-green-200{border-color:var(--green-200)}.bd-green-300{border-color:var(--green-300)}.bd-green-400{border-color:var(--green-400)}.bd-green-500{border-color:var(--green-500)}.bd-green-600{border-color:var(--green-600)}.bd-green-700{border-color:var(--green-700)}.bd-green-800{border-color:var(--green-800)}.bd-green-900{border-color:var(--green-900)}
+.bd-blue-50{border-color:var(--blue-50)}.bd-blue-100{border-color:var(--blue-100)}.bd-blue-200{border-color:var(--blue-200)}.bd-blue-300{border-color:var(--blue-300)}.bd-blue-400{border-color:var(--blue-400)}.bd-blue-500{border-color:var(--blue-500)}.bd-blue-600{border-color:var(--blue-600)}.bd-blue-700{border-color:var(--blue-700)}.bd-blue-800{border-color:var(--blue-800)}.bd-blue-900{border-color:var(--blue-900)}
+.bd-indigo-50{border-color:var(--indigo-50)}.bd-indigo-100{border-color:var(--indigo-100)}.bd-indigo-200{border-color:var(--indigo-200)}.bd-indigo-300{border-color:var(--indigo-300)}.bd-indigo-400{border-color:var(--indigo-400)}.bd-indigo-500{border-color:var(--indigo-500)}.bd-indigo-600{border-color:var(--indigo-600)}.bd-indigo-700{border-color:var(--indigo-700)}.bd-indigo-800{border-color:var(--indigo-800)}.bd-indigo-900{border-color:var(--indigo-900)}
+.bd-gray-50{border-color:var(--gray-50)}.bd-gray-100{border-color:var(--gray-100)}.bd-gray-200{border-color:var(--gray-200)}.bd-gray-300{border-color:var(--gray-300)}.bd-gray-400{border-color:var(--gray-400)}.bd-gray-500{border-color:var(--gray-500)}.bd-gray-600{border-color:var(--gray-600)}.bd-gray-700{border-color:var(--gray-700)}.bd-gray-800{border-color:var(--gray-800)}.bd-gray-900{border-color:var(--gray-900)}
+.bd-slate-50{border-color:var(--slate-50)}.bd-slate-100{border-color:var(--slate-100)}.bd-slate-200{border-color:var(--slate-200)}.bd-slate-300{border-color:var(--slate-300)}.bd-slate-400{border-color:var(--slate-400)}.bd-slate-500{border-color:var(--slate-500)}.bd-slate-600{border-color:var(--slate-600)}.bd-slate-700{border-color:var(--slate-700)}.bd-slate-800{border-color:var(--slate-800)}.bd-slate-900{border-color:var(--slate-900)}
+.bd-white{border-color:#ffffff}.bd-black{border-color:#000000}
+
+.fl-red-500{fill:var(--red-500)}.fl-green-500{fill:var(--green-500)}.fl-blue-500{fill:var(--blue-500)}.fl-indigo-500{fill:var(--indigo-500)}.fl-gray-400{fill:var(--gray-400)}.fl-gray-500{fill:var(--gray-500)}.fl-gray-600{fill:var(--gray-600)}.fl-white{fill:#ffffff}.fl-black{fill:#000000}
+.fl-red-400{fill:var(--red-400)}.fl-green-400{fill:var(--green-400)}.fl-blue-400{fill:var(--blue-400)}.fl-amber-400{fill:var(--amber-400)}.fl-orange-500{fill:var(--orange-500)}.fl-pink-500{fill:var(--pink-500)}
+
+.p-0{padding:var(--spacing-0)}.p-1{padding:var(--spacing-1)}.p-2{padding:var(--spacing-2)}.p-3{padding:var(--spacing-3)}.p-4{padding:var(--spacing-4)}.p-5{padding:var(--spacing-5)}.p-6{padding:var(--spacing-6)}.p-7{padding:var(--spacing-7)}.p-8{padding:var(--spacing-8)}.p-9{padding:var(--spacing-9)}.p-10{padding:var(--spacing-10)}.p-12{padding:var(--spacing-12)}.p-14{padding:var(--spacing-14)}.p-16{padding:var(--spacing-16)}.p-20{padding:var(--spacing-20)}.p-24{padding:var(--spacing-24)}.p-32{padding:var(--spacing-32)}
+.px-0{padding-left:var(--spacing-0);padding-right:var(--spacing-0)}.px-1{padding-left:var(--spacing-1);padding-right:var(--spacing-1)}.px-2{padding-left:var(--spacing-2);padding-right:var(--spacing-2)}.px-3{padding-left:var(--spacing-3);padding-right:var(--spacing-3)}.px-4{padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.px-5{padding-left:var(--spacing-5);padding-right:var(--spacing-5)}.px-6{padding-left:var(--spacing-6);padding-right:var(--spacing-6)}.px-8{padding-left:var(--spacing-8);padding-right:var(--spacing-8)}.px-10{padding-left:var(--spacing-10);padding-right:var(--spacing-10)}.px-12{padding-left:var(--spacing-12);padding-right:var(--spacing-12)}.px-16{padding-left:var(--spacing-16);padding-right:var(--spacing-16)}
+.py-0{padding-top:var(--spacing-0);padding-bottom:var(--spacing-0)}.py-1{padding-top:var(--spacing-1);padding-bottom:var(--spacing-1)}.py-2{padding-top:var(--spacing-2);padding-bottom:var(--spacing-2)}.py-3{padding-top:var(--spacing-3);padding-bottom:var(--spacing-3)}.py-4{padding-top:var(--spacing-4);padding-bottom:var(--spacing-4)}.py-5{padding-top:var(--spacing-5);padding-bottom:var(--spacing-5)}.py-6{padding-top:var(--spacing-6);padding-bottom:var(--spacing-6)}.py-8{padding-top:var(--spacing-8);padding-bottom:var(--spacing-8)}.py-10{padding-top:var(--spacing-10);padding-bottom:var(--spacing-10)}.py-12{padding-top:var(--spacing-12);padding-bottom:var(--spacing-12)}
+.pt-0{padding-top:var(--spacing-0)}.pt-1{padding-top:var(--spacing-1)}.pt-2{padding-top:var(--spacing-2)}.pt-3{padding-top:var(--spacing-3)}.pt-4{padding-top:var(--spacing-4)}.pt-5{padding-top:var(--spacing-5)}.pt-6{padding-top:var(--spacing-6)}.pt-8{padding-top:var(--spacing-8)}.pt-10{padding-top:var(--spacing-10)}.pt-12{padding-top:var(--spacing-12)}
+.pb-0{padding-bottom:var(--spacing-0)}.pb-1{padding-bottom:var(--spacing-1)}.pb-2{padding-bottom:var(--spacing-2)}.pb-3{padding-bottom:var(--spacing-3)}.pb-4{padding-bottom:var(--spacing-4)}.pb-5{padding-bottom:var(--spacing-5)}.pb-6{padding-bottom:var(--spacing-6)}.pb-8{padding-bottom:var(--spacing-8)}.pb-10{padding-bottom:var(--spacing-10)}.pb-12{padding-bottom:var(--spacing-12)}
+.pl-0{padding-left:var(--spacing-0)}.pl-1{padding-left:var(--spacing-1)}.pl-2{padding-left:var(--spacing-2)}.pl-3{padding-left:var(--spacing-3)}.pl-4{padding-left:var(--spacing-4)}.pl-5{padding-left:var(--spacing-5)}.pl-6{padding-left:var(--spacing-6)}.pl-8{padding-left:var(--spacing-8)}.pl-10{padding-left:var(--spacing-10)}.pl-12{padding-left:var(--spacing-12)}
+.pr-0{padding-right:var(--spacing-0)}.pr-1{padding-right:var(--spacing-1)}.pr-2{padding-right:var(--spacing-2)}.pr-3{padding-right:var(--spacing-3)}.pr-4{padding-right:var(--spacing-4)}.pr-5{padding-right:var(--spacing-5)}.pr-6{padding-right:var(--spacing-6)}.pr-8{padding-right:var(--spacing-8)}.pr-10{padding-right:var(--spacing-10)}.pr-12{padding-right:var(--spacing-12)}
+
+.m-0{margin:var(--spacing-0)}.m-1{margin:var(--spacing-1)}.m-2{margin:var(--spacing-2)}.m-3{margin:var(--spacing-3)}.m-4{margin:var(--spacing-4)}.m-5{margin:var(--spacing-5)}.m-6{margin:var(--spacing-6)}.m-7{margin:var(--spacing-7)}.m-8{margin:var(--spacing-8)}.m-9{margin:var(--spacing-9)}.m-10{margin:var(--spacing-10)}.m-12{margin:var(--spacing-12)}.m-16{margin:var(--spacing-16)}.m-auto{margin:auto}
+.mx-0{margin-left:var(--spacing-0);margin-right:var(--spacing-0)}.mx-1{margin-left:var(--spacing-1);margin-right:var(--spacing-1)}.mx-2{margin-left:var(--spacing-2);margin-right:var(--spacing-2)}.mx-3{margin-left:var(--spacing-3);margin-right:var(--spacing-3)}.mx-4{margin-left:var(--spacing-4);margin-right:var(--spacing-4)}.mx-6{margin-left:var(--spacing-6);margin-right:var(--spacing-6)}.mx-8{margin-left:var(--spacing-8);margin-right:var(--spacing-8)}.mx-auto{margin-left:auto;margin-right:auto}
+.my-0{margin-top:var(--spacing-0);margin-bottom:var(--spacing-0)}.my-1{margin-top:var(--spacing-1);margin-bottom:var(--spacing-1)}.my-2{margin-top:var(--spacing-2);margin-bottom:var(--spacing-2)}.my-3{margin-top:var(--spacing-3);margin-bottom:var(--spacing-3)}.my-4{margin-top:var(--spacing-4);margin-bottom:var(--spacing-4)}.my-6{margin-top:var(--spacing-6);margin-bottom:var(--spacing-6)}.my-8{margin-top:var(--spacing-8);margin-bottom:var(--spacing-8)}.my-auto{margin-top:auto;margin-bottom:auto}
+.mt-0{margin-top:var(--spacing-0)}.mt-1{margin-top:var(--spacing-1)}.mt-2{margin-top:var(--spacing-2)}.mt-3{margin-top:var(--spacing-3)}.mt-4{margin-top:var(--spacing-4)}.mt-5{margin-top:var(--spacing-5)}.mt-6{margin-top:var(--spacing-6)}.mt-8{margin-top:var(--spacing-8)}.mt-10{margin-top:var(--spacing-10)}.mt-12{margin-top:var(--spacing-12)}.mt-auto{margin-top:auto}
+.mb-0{margin-bottom:var(--spacing-0)}.mb-1{margin-bottom:var(--spacing-1)}.mb-2{margin-bottom:var(--spacing-2)}.mb-3{margin-bottom:var(--spacing-3)}.mb-4{margin-bottom:var(--spacing-4)}.mb-5{margin-bottom:var(--spacing-5)}.mb-6{margin-bottom:var(--spacing-6)}.mb-8{margin-bottom:var(--spacing-8)}.mb-10{margin-bottom:var(--spacing-10)}.mb-12{margin-bottom:var(--spacing-12)}.mb-auto{margin-bottom:auto}
+.ml-0{margin-left:var(--spacing-0)}.ml-1{margin-left:var(--spacing-1)}.ml-2{margin-left:var(--spacing-2)}.ml-3{margin-left:var(--spacing-3)}.ml-4{margin-left:var(--spacing-4)}.ml-6{margin-left:var(--spacing-6)}.ml-8{margin-left:var(--spacing-8)}.ml-auto{margin-left:auto}
+.mr-0{margin-right:var(--spacing-0)}.mr-1{margin-right:var(--spacing-1)}.mr-2{margin-right:var(--spacing-2)}.mr-3{margin-right:var(--spacing-3)}.mr-4{margin-right:var(--spacing-4)}.mr-6{margin-right:var(--spacing-6)}.mr-8{margin-right:var(--spacing-8)}.mr-auto{margin-right:auto}
+
+.g-0{gap:var(--spacing-0)}.g-1{gap:var(--spacing-1)}.g-2{gap:var(--spacing-2)}.g-3{gap:var(--spacing-3)}.g-4{gap:var(--spacing-4)}.g-5{gap:var(--spacing-5)}.g-6{gap:var(--spacing-6)}.g-7{gap:var(--spacing-7)}.g-8{gap:var(--spacing-8)}.g-10{gap:var(--spacing-10)}.g-12{gap:var(--spacing-12)}
+.gx-1{column-gap:var(--spacing-1)}.gx-2{column-gap:var(--spacing-2)}.gx-3{column-gap:var(--spacing-3)}.gx-4{column-gap:var(--spacing-4)}.gx-6{column-gap:var(--spacing-6)}.gx-8{column-gap:var(--spacing-8)}
+.gy-1{row-gap:var(--spacing-1)}.gy-2{row-gap:var(--spacing-2)}.gy-3{row-gap:var(--spacing-3)}.gy-4{row-gap:var(--spacing-4)}.gy-6{row-gap:var(--spacing-6)}.gy-8{row-gap:var(--spacing-8)}
+
+.w-1{width:var(--spacing-1)}.w-2{width:var(--spacing-2)}.w-3{width:var(--spacing-3)}.w-4{width:var(--spacing-4)}.w-5{width:var(--spacing-5)}.w-6{width:var(--spacing-6)}.w-7{width:var(--spacing-7)}.w-8{width:var(--spacing-8)}.w-10{width:var(--spacing-10)}.w-12{width:var(--spacing-12)}.w-16{width:var(--spacing-16)}.w-20{width:var(--spacing-20)}.w-24{width:var(--spacing-24)}.w-32{width:var(--spacing-32)}.w-full{width:100%}.w-auto{width:auto}
+.h-1{height:var(--spacing-1)}.h-2{height:var(--spacing-2)}.h-3{height:var(--spacing-3)}.h-4{height:var(--spacing-4)}.h-5{height:var(--spacing-5)}.h-6{height:var(--spacing-6)}.h-7{height:var(--spacing-7)}.h-8{height:var(--spacing-8)}.h-10{height:var(--spacing-10)}.h-12{height:var(--spacing-12)}.h-16{height:var(--spacing-16)}.h-20{height:var(--spacing-20)}.h-24{height:var(--spacing-24)}.h-32{height:var(--spacing-32)}.h-full{height:100%}.h-auto{height:auto}
+
+.fs-xs{font-size:var(--fs-xs)}.fs-sm{font-size:var(--fs-sm)}.fs-md{font-size:var(--fs-md)}.fs-lg{font-size:var(--fs-lg)}.fs-xl{font-size:var(--fs-xl)}.fs-2xl{font-size:var(--fs-2xl)}.fs-3xl{font-size:var(--fs-3xl)}.fs-4xl{font-size:var(--fs-4xl)}.fs-5xl{font-size:var(--fs-5xl)}
+.fw-3{font-weight:var(--fw-3)}.fw-4{font-weight:var(--fw-4)}.fw-5{font-weight:var(--fw-5)}.fw-6{font-weight:var(--fw-6)}.fw-7{font-weight:var(--fw-7)}.fw-8{font-weight:var(--fw-8)}.fw-9{font-weight:var(--fw-9)}
+.lh-none{line-height:1}.lh-tight{line-height:1.25}.lh-snug{line-height:1.375}.lh-base{line-height:1.5}.lh-relaxed{line-height:1.625}.lh-loose{line-height:2}
+.ta-l{text-align:left}.ta-r{text-align:right}.ta-c{text-align:center}.ta-j{text-align:justify}
+
+.br-none{border-radius:var(--br-none)}.br-sm{border-radius:var(--br-sm)}.br-md{border-radius:var(--br-md)}.br-lg{border-radius:var(--br-lg)}.br-xl{border-radius:var(--br-xl)}.br-2xl{border-radius:var(--br-2xl)}.br-3xl{border-radius:var(--br-3xl)}.br-full{border-radius:var(--br-full)}
+.bw-0{border-width:0;border-style:solid}.bw-1{border-width:var(--bw-1);border-style:solid}.bw-2{border-width:var(--bw-2);border-style:solid}.bw-4{border-width:var(--bw-4);border-style:solid}
+.sh-none{box-shadow:none}.sh-1{box-shadow:var(--sh-1)}.sh-2{box-shadow:var(--sh-2)}.sh-3{box-shadow:var(--sh-3)}.sh-4{box-shadow:var(--sh-4)}.sh-5{box-shadow:var(--sh-5)}
+.op-0{opacity:0}.op-5{opacity:0.05}.op-10{opacity:0.1}.op-20{opacity:0.2}.op-25{opacity:0.25}.op-30{opacity:0.3}.op-40{opacity:0.4}.op-50{opacity:0.5}.op-60{opacity:0.6}.op-70{opacity:0.7}.op-75{opacity:0.75}.op-80{opacity:0.8}.op-90{opacity:0.9}.op-95{opacity:0.95}.op-100{opacity:1}
+
+.flex{display:flex}.inline-flex{display:inline-flex}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.hidden{display:none}
+.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}
+.flex-1{flex:1}.flex-auto{flex:auto}.flex-none{flex:none}.flex-shrink-0{flex-shrink:0}.flex-grow{flex-grow:1}
+.items-start{align-items:flex-start}.items-center{align-items:center}.items-end{align-items:flex-end}.items-stretch{align-items:stretch}.items-baseline{align-items:baseline}
+.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.justify-evenly{justify-content:space-evenly}
+.self-start{align-self:flex-start}.self-center{align-self:center}.self-end{align-self:flex-end}.self-stretch{align-self:stretch}
+
+.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}
+.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.overflow-scroll{overflow:scroll}
+.cursor-pointer{cursor:pointer}.cursor-default{cursor:default}.cursor-not-allowed{cursor:not-allowed}
+.select-none{user-select:none}.whitespace-nowrap{white-space:nowrap}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.italic{font-style:italic}.not-italic{font-style:normal}.underline{text-decoration:underline}.no-underline{text-decoration:none}.line-through{text-decoration:line-through}
+.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}
+.border{border-width:1px;border-style:solid}.border-t{border-top-width:1px;border-top-style:solid}.border-b{border-bottom-width:1px;border-bottom-style:solid}.border-l{border-left-width:1px;border-left-style:solid}.border-r{border-right-width:1px;border-right-style:solid}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@techv/design-system",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "author": "Pranav V K <pranavvk@techversantinfotech.com>",
   "license": "MIT",
   "main": "./dist/cjs/index.js",
@@ -17,14 +17,16 @@
         "default": "./dist/cjs/index.js"
       }
     },
-    "./styles.css": "./dist/styles.css"
+    "./styles.css": "./dist/styles.css",
+    "./utility.css": "./dist/utility.css"
   },
   "files": [
     "dist",
     "README.md"
   ],
   "sideEffects": [
-    "./dist/styles.css"
+    "./dist/styles.css",
+    "./dist/utility.css"
   ],
   "peerDependencies": {
     "react": "^18.0.0",
@@ -39,15 +41,15 @@
     "ts-node": "^10.9.2",
     "tslib": "^2.6.2",
     "typescript": "~5.4.5",
-    "@techv/ui": "0.1.0",
-    "@techv/tokens": "0.1.0"
+    "@techv/tokens": "0.1.0",
+    "@techv/ui": "0.1.0"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org",
     "access": "public"
   },
   "scripts": {
-    "build": "rollup -c rollup.config.ts --configPlugin typescript && tsc -p tsconfig.build.json && cp node_modules/@techv/tokens/dist/global.css dist/styles.css",
+    "build": "rollup -c rollup.config.ts --configPlugin typescript && tsc -p tsconfig.build.json && cp node_modules/@techv/tokens/dist/global.css dist/styles.css && cp node_modules/@techv/tokens/dist/utility.css dist/utility.css",
     "lint": "tsc --noEmit",
     "clean": "rm -rf dist"
   }