globals.css

@import '@radix-ui/themes/styles.css';

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

#changelogcontent {
  font-family: var(--font-rubik);
}
.radix-themes {
  --cursor-button: pointer;
}
.fancy-border {
  transition-property: box-shadow, border-color;
  transition-duration: 0.25s;
  transition-timing-function: ease-out;

  &:hover {
    box-shadow:
      0 2px 0 rgba(54, 45, 89, 0.15),
      -0.1875rem -0.1875rem 0 0.1875rem #f2b712,
      0 0 0 0.375rem #e1567c;
    text-decoration: none;
    cursor: pointer;
  }
}

.hero-top-left-down-slope {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 40%);
}

.hero-bottom-left-down-slope {
  clip-path: polygon(0 0, 100% 100%, 100% 100%, 0 100%)
}

.footer-top-right-down-slope {
  clip-path: polygon(0 0, 100% 0, 100% 40%, 0 100%);
}

.icon {
  margin-left: 0.25em;

  svg {
    display: inline;
    width: 14px;
    height: 14px;
  }
}