Files
SkinbaseNova/resources/css/app.css
2026-02-14 15:14:12 +01:00

66 lines
1.6 KiB
CSS

@tailwind base;
@tailwind components;
@tailwind utilities;
.form-label {
@apply block text-sm text-soft mb-1;
}
.form-input {
@apply w-full bg-deep border border-nebula-500/30 rounded-lg px-4 py-2
text-white placeholder-gray-500
focus:outline-none focus:ring-2 focus:ring-accent;
}
.form-textarea {
@apply w-full bg-deep border border-nebula-500/30 rounded-lg px-4 py-2
text-white resize-none
focus:outline-none focus:ring-2 focus:ring-accent;
}
.form-file {
@apply w-full text-sm text-soft
file:bg-panel file:border-0 file:px-4 file:py-2
file:rounded-lg file:text-white
hover:file:bg-nebula-600/40;
}
.btn-primary {
@apply bg-accent text-deep px-6 py-2 rounded-lg
font-medium hover:brightness-110 transition;
}
.btn-secondary {
@apply bg-nebula-500/30 text-white px-5 py-2 rounded-lg
hover:bg-nebula-500/50 transition;
}
@layer components {
/* Ensure plain inputs, textareas and selects match the dark form styles
so we don't end up with white backgrounds + white text. */
input,
input[type="text"],
input[type="email"],
input[type="password"],
textarea,
select {
@apply bg-deep text-white border border-nebula-500/30 rounded-lg px-4 py-2
placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-accent;
}
/* Keep file inputs styled separately (file controls use .form-file class).
This prevents the native file button from inheriting the same padding. */
input[type="file"] {
@apply bg-transparent text-soft p-0;
}
}
@layer base {
*,:before,:after {
box-sizing: border-box;
border: 0 solid transparent;
}
}