Main CSS

Configure global CSS styles for your pages.

In the styles folder, you will find a file named main.css, where you can define global styles and classes. You can use plain CSS, or use the @apply directive to use Tailwind CSS classes.

@tailwind base;
@tailwind components;
@tailwind utilities;

body {
  @apply text-blueGray-900 !important
}

a {
  @apply no-underline text-lightBlue-500 hover:text-lightBlue-600 transition ease-in-out duration-100
}

@keyframes caret {
  0%,
  100% { opacity: 0 }
  50% { opacity: 1 }
}

.animate-caret {
  animation: caret 1s cubic-bezier(0.14, 0, 0.16, 1) forwards infinite;
}

::selection, ::-moz-selection {
  background: #d2f7f9;
}

If you want to use Tailwind CSS throughout your pages, make sure to keep the @tailwind directives at the top of the main.css file.

© 2022 Motif Land Inc. All rights reserved. This site is built with Motif.