@tailwind base; @tailwind components; @tailwind utilities; /* Base definition */ body { font-family: 'Source Sans 3', 'Roboto', 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif; } [v-cloak] { display: none; } /* Additional classes */ .bg-gray-850 { background-color: #242b3a; } .hover\:bg-gray-850:hover { --bg-opacity: 1; background-color: #242b3a; } .text-xxs { font-size: 0.65rem; } .mt-14 { margin-top: 3.5rem; } .text-7xl { font-size: 4.5rem; line-height: 1.1; } .text-8xl { font-size: 5rem; line-height: 1.1; } .imp\:cursor-not-allowed { @apply cursor-not-allowed !important; } /* Custom classes */ .h1 { @apply font-semibold text-3xl text-white m-0 } .h1-subcaption { @apply text-gray-600 text-sm; } .btn-default { @apply py-2 px-4 font-semibold rounded bg-gray-800 hover:bg-gray-850 text-white text-sm; } .btn-disabled { @apply py-2 px-4 font-semibold rounded bg-gray-800 text-gray-600 text-sm; } .btn-primary { @apply py-2 px-4 font-semibold rounded bg-green-700 hover:bg-green-800 text-white text-sm; } .btn-danger { @apply py-2 px-4 font-semibold rounded bg-red-600 hover:bg-red-700 text-white text-sm; } .btn-small { @apply py-1 px-2; } .input-default { @apply appearance-none bg-gray-850 focus:bg-gray-800 text-gray-300 outline-none rounded w-full py-2 px-4; } .select-default { @apply input-default cursor-pointer; } .menu-item { @apply flex items-center text-sm font-semibold space-x-2 rounded hover:bg-gray-850 py-2 px-4 cursor-pointer; } .submenu-item { @apply hover:bg-gray-800 rounded p-1 text-right; } .chip { @apply text-xs bg-gray-850 rounded rounded-full py-1 px-2 font-semibold inline-block mb-1; } .link { @apply font-semibold text-gray-400 hover:text-gray-300; } .newsbox { @apply px-4 py-2 border-2 border-red-700 bg-gray-850 rounded-md text-white border-green-700; } .newsbox-default { @apply border-green-700; } .newsbox-warning { @apply border-yellow-600; } .newsbox-danger { @apply border-red-700; } .leaderboard-default { @apply border-gray-700; } .leaderboard-self { margin-left: -10px; margin-right: -10px; padding-left: calc(1rem + 10px); padding-right: calc(1rem + 10px); @apply border-green-700 bg-gray-800; } .text-gold { color: #DAA520; } .leaderboard-gold { border-color: #DAA520; } .leaderboard-silver { border-color: #c0c0c0; } .leaderboard-bronze { border-color: #cd7f32; } ::-webkit-calendar-picker-indicator { filter: invert(1); cursor: pointer; } .max-available { max-width: -moz-available; max-width: -webkit-fill-available; max-width: fill-available; }