diff --git a/src/_skins-pseudo.css b/src/_skins-pseudo.css index 79fbc7a..9a4b019 100644 --- a/src/_skins-pseudo.css +++ b/src/_skins-pseudo.css @@ -10,91 +10,600 @@ it is focused or hovered over. http://tachyons.io/docs/themes/skins-pseudo/ */ -.hover-black:hover, -.hover-black:focus { color: var(--black); } -.hover-white:hover, -.hover-white:focus { color: var(--white); } +/* Text colors */ + +.hover-color-inherit:hover, +.hover-color-inherit:focus { color: inherit; } .hover-black-90:hover, -.hover-black-90:focus { color: var(--black-90); } +.hover-black-90:focus { color: var(--black-90); } .hover-black-80:hover, -.hover-black-80:focus { color: var(--black-80); } +.hover-black-80:focus { color: var(--black-80); } .hover-black-70:hover, -.hover-black-70:focus { color: var(--black-70); } +.hover-black-70:focus { color: var(--black-70); } .hover-black-60:hover, -.hover-black-60:focus { color: var(--black-60); } +.hover-black-60:focus { color: var(--black-60); } .hover-black-50:hover, -.hover-black-50:focus { color: var(--black-50); } +.hover-black-50:focus { color: var(--black-50); } .hover-black-40:hover, -.hover-black-40:focus { color: var(--black-40); } +.hover-black-40:focus { color: var(--black-40); } .hover-black-30:hover, -.hover-black-30:focus { color: var(--black-30); } +.hover-black-30:focus { color: var(--black-30); } .hover-black-20:hover, -.hover-black-20:focus { color: var(--black-20); } +.hover-black-20:focus { color: var(--black-20); } .hover-black-10:hover, -.hover-black-10:focus { color: var(--black-10); } -.hover-white-90:hover, -.hover-white-90:focus { color: var(--white-90); } -.hover-white-80:hover, -.hover-white-80:focus { color: var(--white-80); } -.hover-white-70:hover, -.hover-white-70:focus { color: var(--white-70); } -.hover-white-60:hover, -.hover-white-60:focus { color: var(--white-60); } -.hover-white-50:hover, -.hover-white-50:focus { color: var(--white-50); } -.hover-white-40:hover, -.hover-white-40:focus { color: var(--white-40); } -.hover-white-30:hover, -.hover-white-30:focus { color: var(--white-30); } -.hover-white-20:hover, -.hover-white-20:focus { color: var(--white-20); } -.hover-white-10:hover, -.hover-white-10:focus { color: var(--white-10); } -.hover-inherit:hover, -.hover-inherit:focus { color: inherit; } +.hover-black-10:focus { color: var(--black-10); } +.hover-black-05:hover, +.hover-black-05:focus { color: var(--black-05); } + +.hover-white-90:hover, +.hover-white-90:focus { color: var(--white-90); } +.hover-white-80:hover, +.hover-white-80:focus { color: var(--white-80); } +.hover-white-70:hover, +.hover-white-70:focus { color: var(--white-70); } +.hover-white-60:hover, +.hover-white-60:focus { color: var(--white-60); } +.hover-white-50:hover, +.hover-white-50:focus { color: var(--white-50); } +.hover-white-40:hover, +.hover-white-40:focus { color: var(--white-40); } +.hover-white-30:hover, +.hover-white-30:focus { color: var(--white-30); } +.hover-white-20:hover, +.hover-white-20:focus { color: var(--white-20); } +.hover-white-10:hover, +.hover-white-10:focus { color: var(--white-10); } + +.hover-black:hover, +.hover-black:focus { color: var(--black); } +.hover-gray-0:hover, +.hover-gray-0:focus { color: var(--gray-0); } +.hover-gray-1:hover, +.hover-gray-1:focus { color: var(--gray-1); } +.hover-gray-2:hover, +.hover-gray-2:focus { color: var(--gray-2); } +.hover-gray-3:hover, +.hover-gray-3:focus { color: var(--gray-3); } +.hover-gray-4:hover, +.hover-gray-4:focus { color: var(--gray-4); } +.hover-gray-5:hover, +.hover-gray-5:focus { color: var(--gray-5); } +.hover-gray-6:hover, +.hover-gray-6:focus { color: var(--gray-6); } +.hover-gray-7:hover, +.hover-gray-7:focus { color: var(--gray-7); } +.hover-gray-8:hover, +.hover-gray-8:focus { color: var(--gray-8); } +.hover-white:hover, +.hover-white:focus { color: var(--white); } + +.hover-green-0:hover, +.hover-green-0:focus { color: var(--green-0); } +.hover-green-1:hover, +.hover-green-1:focus { color: var(--green-1); } +.hover-green-2:hover, +.hover-green-2:focus { color: var(--green-2); } +.hover-green-3:hover, +.hover-green-3:focus { color: var(--green-3); } +.hover-green-4:hover, +.hover-green-4:focus { color: var(--green-4); } +.hover-green-5:hover, +.hover-green-5:focus { color: var(--green-5); } +.hover-green-6:hover, +.hover-green-6:focus { color: var(--green-6); } +.hover-green-7:hover, +.hover-green-7:focus { color: var(--green-7); } +.hover-green-8:hover, +.hover-green-8:focus { color: var(--green-8); } +.hover-green-9:hover, +.hover-green-9:focus { color: var(--green-9); } +.hover-green-10:hover, +.hover-green-10:focus { color: var(--green-10); } + +.hover-teal-0:hover, +.hover-teal-0:focus { color: var(--teal-0); } +.hover-teal-1:hover, +.hover-teal-1:focus { color: var(--teal-1); } +.hover-teal-2:hover, +.hover-teal-2:focus { color: var(--teal-2); } +.hover-teal-3:hover, +.hover-teal-3:focus { color: var(--teal-3); } +.hover-teal-4:hover, +.hover-teal-4:focus { color: var(--teal-4); } +.hover-teal-5:hover, +.hover-teal-5:focus { color: var(--teal-5); } +.hover-teal-6:hover, +.hover-teal-6:focus { color: var(--teal-6); } +.hover-teal-7:hover, +.hover-teal-7:focus { color: var(--teal-7); } +.hover-teal-8:hover, +.hover-teal-8:focus { color: var(--teal-8); } +.hover-teal-9:hover, +.hover-teal-9:focus { color: var(--teal-9); } +.hover-teal-10:hover, +.hover-teal-10:focus { color: var(--teal-10); } + +.hover-teal-0:hover , +.hover-teal-0:focus{ color: var(--cyan-0); } +.hover-teal-1:hover , +.hover-teal-1:focus{ color: var(--cyan-1); } +.hover-teal-2:hover , +.hover-teal-2:focus{ color: var(--cyan-2); } +.hover-teal-3:hover , +.hover-teal-3:focus{ color: var(--cyan-3); } +.hover-teal-4:hover , +.hover-teal-4:focus{ color: var(--cyan-4); } +.hover-teal-5:hover , +.hover-teal-5:focus{ color: var(--cyan-5); } +.hover-teal-6:hover , +.hover-teal-6:focus{ color: var(--cyan-6); } +.hover-teal-7:hover , +.hover-teal-7:focus{ color: var(--cyan-7); } +.hover-teal-8:hover , +.hover-teal-8:focus{ color: var(--cyan-8); } +.hover-teal-9:hover , +.hover-teal-9:focus{ color: var(--cyan-9); } +.hover-teal-10:hover , +.hover-teal-10:focus{ color: var(--cyan-10); } + +.hover-blue-0:hover, +.hover-blue-0:focus { color: var(--blue-0); } +.hover-blue-1:hover, +.hover-blue-1:focus { color: var(--blue-1); } +.hover-blue-2:hover, +.hover-blue-2:focus { color: var(--blue-2); } +.hover-blue-3:hover, +.hover-blue-3:focus { color: var(--blue-3); } +.hover-blue-4:hover, +.hover-blue-4:focus { color: var(--blue-4); } +.hover-blue-5:hover, +.hover-blue-5:focus { color: var(--blue-5); } +.hover-blue-6:hover, +.hover-blue-6:focus { color: var(--blue-6); } +.hover-blue-7:hover, +.hover-blue-7:focus { color: var(--blue-7); } +.hover-blue-8:hover, +.hover-blue-8:focus { color: var(--blue-8); } +.hover-blue-9:hover, +.hover-blue-9:focus { color: var(--blue-9); } +.hover-blue-10:hover, +.hover-blue-10:focus { color: var(--blue-10); } + +.hover-indigo-0:hover, +.hover-indigo-0:focus { color: var(--indigo-0); } +.hover-indigo-1:hover, +.hover-indigo-1:focus { color: var(--indigo-1); } +.hover-indigo-2:hover, +.hover-indigo-2:focus { color: var(--indigo-2); } +.hover-indigo-3:hover, +.hover-indigo-3:focus { color: var(--indigo-3); } +.hover-indigo-4:hover, +.hover-indigo-4:focus { color: var(--indigo-4); } +.hover-indigo-5:hover, +.hover-indigo-5:focus { color: var(--indigo-5); } +.hover-indigo-6:hover, +.hover-indigo-6:focus { color: var(--indigo-6); } +.hover-indigo-7:hover, +.hover-indigo-7:focus { color: var(--indigo-7); } +.hover-indigo-8:hover, +.hover-indigo-8:focus { color: var(--indigo-8); } +.hover-indigo-9:hover, +.hover-indigo-9:focus { color: var(--indigo-9); } +.hover-indigo-10:hover, +.hover-indigo-10:focus { color: var(--indigo-10); } + +.hover-purple-0:hover, +.hover-purple-0:focus { color: var(--purple-0); } +.hover-purple-1:hover, +.hover-purple-1:focus { color: var(--purple-1); } +.hover-purple-2:hover, +.hover-purple-2:focus { color: var(--purple-2); } +.hover-purple-3:hover, +.hover-purple-3:focus { color: var(--purple-3); } +.hover-purple-4:hover, +.hover-purple-4:focus { color: var(--purple-4); } +.hover-purple-5:hover, +.hover-purple-5:focus { color: var(--purple-5); } +.hover-purple-6:hover, +.hover-purple-6:focus { color: var(--purple-6); } +.hover-purple-7:hover, +.hover-purple-7:focus { color: var(--purple-7); } +.hover-purple-8:hover, +.hover-purple-8:focus { color: var(--purple-8); } +.hover-purple-9:hover, +.hover-purple-9:focus { color: var(--purple-9); } +.hover-purple-10:hover, +.hover-purple-10:focus { color: var(--purple-10); } + +.hover-pink-0:hover, +.hover-pink-0:focus { color: var(--pink-0); } +.hover-pink-1:hover, +.hover-pink-1:focus { color: var(--pink-1); } +.hover-pink-2:hover, +.hover-pink-2:focus { color: var(--pink-2); } +.hover-pink-3:hover, +.hover-pink-3:focus { color: var(--pink-3); } +.hover-pink-4:hover, +.hover-pink-4:focus { color: var(--pink-4); } +.hover-pink-5:hover, +.hover-pink-5:focus { color: var(--pink-5); } +.hover-pink-6:hover, +.hover-pink-6:focus { color: var(--pink-6); } +.hover-pink-7:hover, +.hover-pink-7:focus { color: var(--pink-7); } +.hover-pink-8:hover, +.hover-pink-8:focus { color: var(--pink-8); } +.hover-pink-9:hover, +.hover-pink-9:focus { color: var(--pink-9); } +.hover-pink-10:hover, +.hover-pink-10:focus { color: var(--pink-10); } + +.hover-red-0:hover, +.hover-red-0:focus { color: var(--red-0); } +.hover-red-1:hover, +.hover-red-1:focus { color: var(--red-1); } +.hover-red-2:hover, +.hover-red-2:focus { color: var(--red-2); } +.hover-red-3:hover, +.hover-red-3:focus { color: var(--red-3); } +.hover-red-4:hover, +.hover-red-4:focus { color: var(--red-4); } +.hover-red-5:hover, +.hover-red-5:focus { color: var(--red-5); } +.hover-red-6:hover, +.hover-red-6:focus { color: var(--red-6); } +.hover-red-7:hover, +.hover-red-7:focus { color: var(--red-7); } +.hover-red-8:hover, +.hover-red-8:focus { color: var(--red-8); } +.hover-red-9:hover, +.hover-red-9:focus { color: var(--red-9); } +.hover-red-10:hover, +.hover-red-10:focus { color: var(--red-10); } + +.hover-orange-0:hover, +.hover-orange-0:focus { color: var(--orange-0); } +.hover-orange-1:hover, +.hover-orange-1:focus { color: var(--orange-1); } +.hover-orange-2:hover, +.hover-orange-2:focus { color: var(--orange-2); } +.hover-orange-3:hover, +.hover-orange-3:focus { color: var(--orange-3); } +.hover-orange-4:hover, +.hover-orange-4:focus { color: var(--orange-4); } +.hover-orange-5:hover, +.hover-orange-5:focus { color: var(--orange-5); } +.hover-orange-6:hover, +.hover-orange-6:focus { color: var(--orange-6); } +.hover-orange-7:hover, +.hover-orange-7:focus { color: var(--orange-7); } +.hover-orange-8:hover, +.hover-orange-8:focus { color: var(--orange-8); } +.hover-orange-9:hover, +.hover-orange-9:focus { color: var(--orange-9); } +.hover-orange-10:hover, +.hover-orange-10:focus { color: var(--orange-10); } + +.hover-yellow-0:hover, +.hover-yellow-0:focus { color: var(--yellow-0); } +.hover-yellow-1:hover, +.hover-yellow-1:focus { color: var(--yellow-1); } +.hover-yellow-2:hover, +.hover-yellow-2:focus { color: var(--yellow-2); } +.hover-yellow-3:hover, +.hover-yellow-3:focus { color: var(--yellow-3); } +.hover-yellow-4:hover, +.hover-yellow-4:focus { color: var(--yellow-4); } +.hover-yellow-5:hover, +.hover-yellow-5:focus { color: var(--yellow-5); } +.hover-yellow-6:hover, +.hover-yellow-6:focus { color: var(--yellow-6); } +.hover-yellow-7:hover, +.hover-yellow-7:focus { color: var(--yellow-7); } +.hover-yellow-8:hover, +.hover-yellow-8:focus { color: var(--yellow-8); } +.hover-yellow-9:hover, +.hover-yellow-9:focus { color: var(--yellow-9); } +.hover-yellow-10:hover, +.hover-yellow-10:focus { color: var(--yellow-10); } + + + +/* Background colors */ -.hover-bg-black:hover, -.hover-bg-black:focus { background-color: var(--black); } -.hover-bg-white:hover, -.hover-bg-white:focus { background-color: var(--white); } .hover-bg-transparent:hover, -.hover-bg-transparent:focus { background-color: var(--transparent); } +.hover-bg-transparent:focus { background-color: var(--transparent); } .hover-bg-black-90:hover, -.hover-bg-black-90:focus { background-color: var(--black-90); } +.hover-bg-black-90:focus { background-color: var(--black-90); } .hover-bg-black-80:hover, -.hover-bg-black-80:focus { background-color: var(--black-80); } +.hover-bg-black-80:focus { background-color: var(--black-80); } .hover-bg-black-70:hover, -.hover-bg-black-70:focus { background-color: var(--black-70); } +.hover-bg-black-70:focus { background-color: var(--black-70); } .hover-bg-black-60:hover, -.hover-bg-black-60:focus { background-color: var(--black-60); } +.hover-bg-black-60:focus { background-color: var(--black-60); } .hover-bg-black-50:hover, -.hover-bg-black-50:focus { background-color: var(--black-50); } +.hover-bg-black-50:focus { background-color: var(--black-50); } .hover-bg-black-40:hover, -.hover-bg-black-40:focus { background-color: var(--black-40); } +.hover-bg-black-40:focus { background-color: var(--black-40); } .hover-bg-black-30:hover, -.hover-bg-black-30:focus { background-color: var(--black-30); } +.hover-bg-black-30:focus { background-color: var(--black-30); } .hover-bg-black-20:hover, -.hover-bg-black-20:focus { background-color: var(--black-20); } +.hover-bg-black-20:focus { background-color: var(--black-20); } .hover-bg-black-10:hover, -.hover-bg-black-10:focus { background-color: var(--black-10); } -.hover-bg-white-90:hover, -.hover-bg-white-90:focus { background-color: var(--white-90); } -.hover-bg-white-80:hover, -.hover-bg-white-80:focus { background-color: var(--white-80); } -.hover-bg-white-70:hover, -.hover-bg-white-70:focus { background-color: var(--white-70); } -.hover-bg-white-60:hover, -.hover-bg-white-60:focus { background-color: var(--white-60); } -.hover-bg-white-50:hover, -.hover-bg-white-50:focus { background-color: var(--white-50); } -.hover-bg-white-40:hover, -.hover-bg-white-40:focus { background-color: var(--white-40); } -.hover-bg-white-30:hover, -.hover-bg-white-30:focus { background-color: var(--white-30); } -.hover-bg-white-20:hover, -.hover-bg-white-20:focus { background-color: var(--white-20); } -.hover-bg-white-10:hover, -.hover-bg-white-10:focus { background-color: var(--white-10); } +.hover-bg-black-10:focus { background-color: var(--black-10); } +.hover-bg-black-05:hover, +.hover-bg-black-05:focus { background-color: var(--black-05); } +.bg-white-90:hover, +.bg-white-90:focus { background-color: var(--white-90); } +.bg-white-80:hover, +.bg-white-80:focus { background-color: var(--white-80); } +.bg-white-70:hover, +.bg-white-70:focus { background-color: var(--white-70); } +.bg-white-60:hover, +.bg-white-60:focus { background-color: var(--white-60); } +.bg-white-50:hover, +.bg-white-50:focus { background-color: var(--white-50); } +.bg-white-40:hover, +.bg-white-40:focus { background-color: var(--white-40); } +.bg-white-30:hover, +.bg-white-30:focus { background-color: var(--white-30); } +.bg-white-20:hover, +.bg-white-20:focus { background-color: var(--white-20); } +.bg-white-10:hover, +.bg-white-10:focus { background-color: var(--white-10); } + +.hover-bg-black:hover, +.hover-bg-black:focus { background-color: var(--black); } +.hover-bg-gray-0:hover, +.hover-bg-gray-0:focus { background-color: var(--gray-0); } +.hover-bg-gray-1:hover, +.hover-bg-gray-1:focus { background-color: var(--gray-1); } +.hover-bg-gray-2:hover, +.hover-bg-gray-2:focus { background-color: var(--gray-2); } +.hover-bg-gray-3:hover, +.hover-bg-gray-3:focus { background-color: var(--gray-3); } +.hover-bg-gray-4:hover, +.hover-bg-gray-4:focus { background-color: var(--gray-4); } +.hover-bg-gray-5:hover, +.hover-bg-gray-5:focus { background-color: var(--gray-5); } +.hover-bg-gray-6:hover, +.hover-bg-gray-6:focus { background-color: var(--gray-6); } +.hover-bg-gray-7:hover, +.hover-bg-gray-7:focus { background-color: var(--gray-7); } +.hover-bg-gray-8:hover, +.hover-bg-gray-8:focus { background-color: var(--gray-8); } +.hover-bg-white:hover, +.hover-bg-white:focus { background-color: var(--white); } + +.hover-bg-green-0:hover, +.hover-bg-green-0:focus { background-color: var(--green-0); } +.hover-bg-green-1:hover, +.hover-bg-green-1:focus { background-color: var(--green-1); } +.hover-bg-green-2:hover, +.hover-bg-green-2:focus { background-color: var(--green-2); } +.hover-bg-green-3:hover, +.hover-bg-green-3:focus { background-color: var(--green-3); } +.hover-bg-green-4:hover, +.hover-bg-green-4:focus { background-color: var(--green-4); } +.hover-bg-green-5:hover, +.hover-bg-green-5:focus { background-color: var(--green-5); } +.hover-bg-green-6:hover, +.hover-bg-green-6:focus { background-color: var(--green-6); } +.hover-bg-green-7:hover, +.hover-bg-green-7:focus { background-color: var(--green-7); } +.hover-bg-green-8:hover, +.hover-bg-green-8:focus { background-color: var(--green-8); } +.hover-bg-green-9:hover, +.hover-bg-green-9:focus { background-color: var(--green-9); } +.hover-bg-green-10:hover, +.hover-bg-green-10:focus { background-color: var(--green-10); } + +.hover-bg-teal-0:hover, +.hover-bg-teal-0:focus { background-color: var(--teal-0); } +.hover-bg-teal-1:hover, +.hover-bg-teal-1:focus { background-color: var(--teal-1); } +.hover-bg-teal-2:hover, +.hover-bg-teal-2:focus { background-color: var(--teal-2); } +.hover-bg-teal-3:hover, +.hover-bg-teal-3:focus { background-color: var(--teal-3); } +.hover-bg-teal-4:hover, +.hover-bg-teal-4:focus { background-color: var(--teal-4); } +.hover-bg-teal-5:hover, +.hover-bg-teal-5:focus { background-color: var(--teal-5); } +.hover-bg-teal-6:hover, +.hover-bg-teal-6:focus { background-color: var(--teal-6); } +.hover-bg-teal-7:hover, +.hover-bg-teal-7:focus { background-color: var(--teal-7); } +.hover-bg-teal-8:hover, +.hover-bg-teal-8:focus { background-color: var(--teal-8); } +.hover-bg-teal-9:hover, +.hover-bg-teal-9:focus { background-color: var(--teal-9); } +.hover-bg-teal-10:hover, +.hover-bg-teal-10:focus { background-color: var(--teal-10); } + +.hover-bg-cyan-0:hover, +.hover-bg-cyan-0:focus { background-color: var(--cyan-0); } +.hover-bg-cyan-1:hover, +.hover-bg-cyan-1:focus { background-color: var(--cyan-1); } +.hover-bg-cyan-2:hover, +.hover-bg-cyan-2:focus { background-color: var(--cyan-2); } +.hover-bg-cyan-3:hover, +.hover-bg-cyan-3:focus { background-color: var(--cyan-3); } +.hover-bg-cyan-4:hover, +.hover-bg-cyan-4:focus { background-color: var(--cyan-4); } +.hover-bg-cyan-5:hover, +.hover-bg-cyan-5:focus { background-color: var(--cyan-5); } +.hover-bg-cyan-6:hover, +.hover-bg-cyan-6:focus { background-color: var(--cyan-6); } +.hover-bg-cyan-7:hover, +.hover-bg-cyan-7:focus { background-color: var(--cyan-7); } +.hover-bg-cyan-8:hover, +.hover-bg-cyan-8:focus { background-color: var(--cyan-8); } +.hover-bg-cyan-9:hover, +.hover-bg-cyan-9:focus { background-color: var(--cyan-9); } +.hover-bg-cyan-10:hover, +.hover-bg-cyan-10:focus { background-color: var(--cyan-10); } + +.hover-bg-blue-0:hover, +.hover-bg-blue-0:focus { background-color: var(--blue-0); } +.hover-bg-blue-1:hover, +.hover-bg-blue-1:focus { background-color: var(--blue-1); } +.hover-bg-blue-2:hover, +.hover-bg-blue-2:focus { background-color: var(--blue-2); } +.hover-bg-blue-3:hover, +.hover-bg-blue-3:focus { background-color: var(--blue-3); } +.hover-bg-blue-4:hover, +.hover-bg-blue-4:focus { background-color: var(--blue-4); } +.hover-bg-blue-5:hover, +.hover-bg-blue-5:focus { background-color: var(--blue-5); } +.hover-bg-blue-6:hover, +.hover-bg-blue-6:focus { background-color: var(--blue-6); } +.hover-bg-blue-7:hover, +.hover-bg-blue-7:focus { background-color: var(--blue-7); } +.hover-bg-blue-8:hover, +.hover-bg-blue-8:focus { background-color: var(--blue-8); } +.hover-bg-blue-9:hover, +.hover-bg-blue-9:focus { background-color: var(--blue-9); } +.hover-bg-blue-10:hover, +.hover-bg-blue-10:focus { background-color: var(--blue-10); } + +.hover-bg-indigo-0:hover, +.hover-bg-indigo-0:focus { background-color: var(--indigo-0); } +.hover-bg-indigo-1:hover, +.hover-bg-indigo-1:focus { background-color: var(--indigo-1); } +.hover-bg-indigo-2:hover, +.hover-bg-indigo-2:focus { background-color: var(--indigo-2); } +.hover-bg-indigo-3:hover, +.hover-bg-indigo-3:focus { background-color: var(--indigo-3); } +.hover-bg-indigo-4:hover, +.hover-bg-indigo-4:focus { background-color: var(--indigo-4); } +.hover-bg-indigo-5:hover, +.hover-bg-indigo-5:focus { background-color: var(--indigo-5); } +.hover-bg-indigo-6:hover, +.hover-bg-indigo-6:focus { background-color: var(--indigo-6); } +.hover-bg-indigo-7:hover, +.hover-bg-indigo-7:focus { background-color: var(--indigo-7); } +.hover-bg-indigo-8:hover, +.hover-bg-indigo-8:focus { background-color: var(--indigo-8); } +.hover-bg-indigo-9:hover, +.hover-bg-indigo-9:focus { background-color: var(--indigo-9); } +.hover-bg-indigo-10:hover, +.hover-bg-indigo-10:focus { background-color: var(--indigo-10); } + +.hover-bg-purple-0:hover, +.hover-bg-purple-0:focus { background-color: var(--purple-0); } +.hover-bg-purple-1:hover, +.hover-bg-purple-1:focus { background-color: var(--purple-1); } +.hover-bg-purple-2:hover, +.hover-bg-purple-2:focus { background-color: var(--purple-2); } +.hover-bg-purple-3:hover, +.hover-bg-purple-3:focus { background-color: var(--purple-3); } +.hover-bg-purple-4:hover, +.hover-bg-purple-4:focus { background-color: var(--purple-4); } +.hover-bg-purple-5:hover, +.hover-bg-purple-5:focus { background-color: var(--purple-5); } +.hover-bg-purple-6:hover, +.hover-bg-purple-6:focus { background-color: var(--purple-6); } +.hover-bg-purple-7:hover, +.hover-bg-purple-7:focus { background-color: var(--purple-7); } +.hover-bg-purple-8:hover, +.hover-bg-purple-8:focus { background-color: var(--purple-8); } +.hover-bg-purple-9:hover, +.hover-bg-purple-9:focus { background-color: var(--purple-9); } +.hover-bg-purple-10:hover, +.hover-bg-purple-10:focus { background-color: var(--purple-10); } + +.hover-bg-pink-0:hover, +.hover-bg-pink-0:focus { background-color: var(--pink-0); } +.hover-bg-pink-1:hover, +.hover-bg-pink-1:focus { background-color: var(--pink-1); } +.hover-bg-pink-2:hover, +.hover-bg-pink-2:focus { background-color: var(--pink-2); } +.hover-bg-pink-3:hover, +.hover-bg-pink-3:focus { background-color: var(--pink-3); } +.hover-bg-pink-4:hover, +.hover-bg-pink-4:focus { background-color: var(--pink-4); } +.hover-bg-pink-5:hover, +.hover-bg-pink-5:focus { background-color: var(--pink-5); } +.hover-bg-pink-6:hover, +.hover-bg-pink-6:focus { background-color: var(--pink-6); } +.hover-bg-pink-7:hover, +.hover-bg-pink-7:focus { background-color: var(--pink-7); } +.hover-bg-pink-8:hover, +.hover-bg-pink-8:focus { background-color: var(--pink-8); } +.hover-bg-pink-9:hover, +.hover-bg-pink-9:focus { background-color: var(--pink-9); } +.hover-bg-pink-10:hover, +.hover-bg-pink-10:focus { background-color: var(--pink-10); } + +.hover-bg-red-0:hover, +.hover-bg-red-0:focus { background-color: var(--red-0); } +.hover-bg-red-1:hover, +.hover-bg-red-1:focus { background-color: var(--red-1); } +.hover-bg-red-2:hover, +.hover-bg-red-2:focus { background-color: var(--red-2); } +.hover-bg-red-3:hover, +.hover-bg-red-3:focus { background-color: var(--red-3); } +.hover-bg-red-4:hover, +.hover-bg-red-4:focus { background-color: var(--red-4); } +.hover-bg-red-5:hover, +.hover-bg-red-5:focus { background-color: var(--red-5); } +.hover-bg-red-6:hover, +.hover-bg-red-6:focus { background-color: var(--red-6); } +.hover-bg-red-7:hover, +.hover-bg-red-7:focus { background-color: var(--red-7); } +.hover-bg-red-8:hover, +.hover-bg-red-8:focus { background-color: var(--red-8); } +.hover-bg-red-9:hover, +.hover-bg-red-9:focus { background-color: var(--red-9); } +.hover-bg-red-10:hover, +.hover-bg-red-10:focus { background-color: var(--red-10); } + +.hover-bg-orange-0:hover, +.hover-bg-orange-0:focus { background-color: var(--orange-0); } +.hover-bg-orange-1:hover, +.hover-bg-orange-1:focus { background-color: var(--orange-1); } +.hover-bg-orange-2:hover, +.hover-bg-orange-2:focus { background-color: var(--orange-2); } +.hover-bg-orange-3:hover, +.hover-bg-orange-3:focus { background-color: var(--orange-3); } +.hover-bg-orange-4:hover, +.hover-bg-orange-4:focus { background-color: var(--orange-4); } +.hover-bg-orange-5:hover, +.hover-bg-orange-5:focus { background-color: var(--orange-5); } +.hover-bg-orange-6:hover, +.hover-bg-orange-6:focus { background-color: var(--orange-6); } +.hover-bg-orange-7:hover, +.hover-bg-orange-7:focus { background-color: var(--orange-7); } +.hover-bg-orange-8:hover, +.hover-bg-orange-8:focus { background-color: var(--orange-8); } +.hover-bg-orange-9:hover, +.hover-bg-orange-9:focus { background-color: var(--orange-9); } +.hover-bg-orange-10:hover, +.hover-bg-orange-10:focus { background-color: var(--orange-10); } + +.hover-bg-yellow-0:hover, +.hover-bg-yellow-0:focus { background-color: var(--yellow-0); } +.hover-bg-yellow-1:hover, +.hover-bg-yellow-1:focus { background-color: var(--yellow-1); } +.hover-bg-yellow-2:hover, +.hover-bg-yellow-2:focus { background-color: var(--yellow-2); } +.hover-bg-yellow-3:hover, +.hover-bg-yellow-3:focus { background-color: var(--yellow-3); } +.hover-bg-yellow-4:hover, +.hover-bg-yellow-4:focus { background-color: var(--yellow-4); } +.hover-bg-yellow-5:hover, +.hover-bg-yellow-5:focus { background-color: var(--yellow-5); } +.hover-bg-yellow-6:hover, +.hover-bg-yellow-6:focus { background-color: var(--yellow-6); } +.hover-bg-yellow-7:hover, +.hover-bg-yellow-7:focus { background-color: var(--yellow-7); } +.hover-bg-yellow-8:hover, +.hover-bg-yellow-8:focus { background-color: var(--yellow-8); } +.hover-bg-yellow-9:hover, +.hover-bg-yellow-9:focus { background-color: var(--yellow-9); } +.hover-bg-yellow-10:hover, +.hover-bg-yellow-10:focus { background-color: var(--yellow-10); }