style.css

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

/* line-clamp 定义缩写 */
.line-1 {
  @apply line-clamp-1 break-words;
}
.line-2 {
  @apply line-clamp-2 break-words;
}
.line-3 {
  @apply line-clamp-3 break-words;
}

/* flex 定义缩写 */
.f-c {
  @apply flex items-center;
}
.f-s {
  @apply flex items-start;
}
.f-e { 
  @apply flex items-end;
}
.f-c-c {
  @apply flex items-center justify-center;
}
.f-c-e {
  @apply flex items-center justify-end;
}
.f-c-a {
  @apply flex items-center justify-around;
}
.f-c-b {
  @apply flex items-center justify-between;
}

/* 页面切换动画 */
/* .fade-slide-enter-active {
  transition: all 0.3s ease-out;
}
.fade-slide-leave-active {
  transition: all 0.5s cubic-bezier(1, 0.5, 0.8, 1);
}
.fade-slide-enter-from,
.fade-slide-leave-to {
  transform: translateX(20px);
  opacity: 0;
} */

/* 修改默认样式 */
input,
button,
select,
textarea {
  outline: none !important;
}
textarea {
  resize: none !important;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

/* 自定义滚动条样式 */
.hide-scrollbar::-webkit-scrollbar {
  @apply w-0.5 md:w-1
}

.hide-scrollbar::-webkit-scrollbar-track {
  @apply bg-transparent
}

.hide-scrollbar::-webkit-scrollbar-thumb {
  @apply bg-black/20 rounded-xl
}

.hide-scrollbar::-webkit-scrollbar-thumb:hover {
  @apply bg-black/30
}