106 lines
2.1 KiB
CSS
106 lines
2.1 KiB
CSS
/* *
|
|
* 按钮组件样式
|
|
*/
|
|
|
|
/* 基础按钮
|
|
.btn {
|
|
@apply inline-flex items-center justify-center px-4 py-2
|
|
border border-transparent rounded-md font-medium text-sm
|
|
focus:outline-none focus:ring-2 focus:ring-offset-2 transition-all duration-200
|
|
disabled:opacity-50 disabled:cursor-not-allowed;
|
|
} */
|
|
|
|
/* 按钮尺寸
|
|
.btn-xs {
|
|
@apply px-2.5 py-1 text-xs;
|
|
}
|
|
|
|
.btn-sm {
|
|
@apply px-3 py-1.5 text-sm;
|
|
}
|
|
|
|
.btn-lg {
|
|
@apply px-5 py-2.5 text-base;
|
|
} */
|
|
|
|
/* 按钮类型
|
|
.btn-primary {
|
|
@apply bg-[#00684a] text-white hover:bg-[#005a3f] focus:ring-[#00684a];
|
|
}
|
|
|
|
.btn-default {
|
|
@apply bg-white text-gray-800 hover:bg-gray-300 focus:ring-gray-300;
|
|
}
|
|
|
|
.btn-secondary {
|
|
@apply bg-gray-200 text-gray-800 hover:bg-gray-300 focus:ring-gray-300;
|
|
}
|
|
|
|
.btn-outline {
|
|
@apply bg-transparent border border-[#00684a] text-[#00684a]
|
|
hover:bg-[rgba(0,104,74,0.05)] focus:ring-[#00684a];
|
|
}
|
|
|
|
.btn-danger {
|
|
@apply bg-[#f5222d] text-white hover:bg-[#cf1f29] focus:ring-[#f5222d];
|
|
}
|
|
|
|
.btn-text {
|
|
@apply bg-transparent text-[#00684a] shadow-none border-none
|
|
hover:bg-[rgba(0,104,74,0.05)] focus:ring-0;
|
|
} */
|
|
|
|
/* 图标按钮
|
|
.btn-icon {
|
|
@apply p-2 rounded-full;
|
|
}
|
|
|
|
.btn-icon.btn-sm {
|
|
@apply p-1.5;
|
|
}
|
|
|
|
.btn-icon i, .btn-icon svg {
|
|
@apply text-current w-5 h-5;
|
|
} */
|
|
|
|
/* 按钮组
|
|
.btn-group {
|
|
@apply inline-flex;
|
|
}
|
|
|
|
.btn-group .btn {
|
|
@apply rounded-none;
|
|
}
|
|
|
|
.btn-group .btn:first-child {
|
|
@apply rounded-l-md;
|
|
}
|
|
|
|
.btn-group .btn:last-child {
|
|
@apply rounded-r-md;
|
|
} */
|
|
|
|
|
|
/* 按钮样式 */
|
|
.ant-btn {
|
|
@apply inline-flex items-center justify-center px-4 py-2
|
|
border border-transparent rounded-md font-medium text-sm
|
|
focus:outline-none focus:ring-2 focus:ring-offset-2 transition-all duration-200
|
|
disabled:opacity-50 disabled:cursor-not-allowed;
|
|
}
|
|
|
|
.ant-btn-primary {
|
|
@apply bg-[#00684a] text-white hover:bg-[#005a3f] focus:ring-[#00684a];
|
|
}
|
|
|
|
.ant-btn-default {
|
|
@apply bg-white border border-gray-300 text-gray-800 focus:ring-gray-300;
|
|
}
|
|
|
|
.ant-btn-danger {
|
|
@apply bg-[#f5222d] text-white hover:bg-[#cf1f29] focus:ring-[#f5222d];
|
|
}
|
|
|
|
.ant-btn-sm {
|
|
@apply px-3 py-1.5 text-sm;
|
|
} |