tw-runner
Version:
Run and manage Tower Website projects with this utility.
68 lines (64 loc) • 1.71 kB
CSS
@layer base {
.btn {
@apply grid place-content-center cursor-pointer font-extralight px-4 py-2 rounded-lg transition-all duration-200;
/* stroke: var(--color-ground-text); */
}
/* Button Sizes */
.btn-sm {
@apply px-2 py-1;
}
.btn-md {
@apply px-4 py-2;
}
.btn-lg {
@apply px-6 py-3 text-lg;
}
.btn-full {
@apply w-full text-center py-4;
}
/* Fully Rounded */
.btn-rounded {
@apply rounded-full p-2;
}
/* Hyperlink Style */
.btn-link {
@apply underline
}
/* Button Backgrounds */
.btn-mute {
@apply bg-ground/20 dark:bg-ground-secondary-dark/75 hover:bg-ground/50 dark:hover:bg-ground-secondary-dark/50 text-ground-text dark:text-ground-text;
}
.btn-base {
@apply bg-ground/65 dark:bg-ground-secondary-dark/75 hover:bg-ground/50 dark:hover:bg-ground-secondary-dark/50 text-ground-text dark:text-ground-text;
}
.btn-primary {
@apply bg-primary text-primary-text hover:bg-primary-highlight hover:text-primary-highlight-text;
}
.btn-secondary {
@apply bg-secondary text-secondary-text;
}
.btn-negative {
@apply bg-ground/5 text-negative-text hover:bg-ground;
}
.btn-primary-highlight {
@apply bg-primary-highlight text-primary-highlight-text hover:bg-primary hover:text-primary-text;
}
.btn-ground {
@apply bg-ground text-ground-text;
}
.btn-ground-primary {
@apply bg-ground-primary text-ground-primary-text;
}
.btn-ground-secondary {
@apply bg-ground-secondary text-ground-secondary-text;
}
.btn-success {
@apply bg-success text-success-text;
}
.btn-warning {
@apply bg-warning text-warning-text;
}
.btn-info {
@apply bg-info text-info-text;
}
}