Styling

Styling

Learn different approaches to styling your aincraft projects.

CSS Modules

Use CSS modules for scoped styling:

.container {
  padding: 1rem;
  background: white;
}

Tailwind CSS

Use utility classes with Tailwind:

<div class="p-4 bg-white rounded-lg">Content</div>

SCSS/SASS

Write more powerful stylesheets with SCSS:

$primary-color: #007bff;

.button {
  background: $primary-color;
  &:hover {
    opacity: 0.9;
  }
}

CSS-in-JS

Style components with JavaScript:

const styles = {
  container: { padding: '1rem' }
};

Dark Mode

Support dark mode in your projects.

Responsive Design

Create responsive layouts that work on all devices.