dify/web/app/components/datasets/documents/detail/completed/style.module.css
Stephen Zhou a84c2d36a3
style: format with vp fmt (#38803)
Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
2026-07-12 15:57:46 +00:00

142 lines
3.9 KiB
CSS

@reference "../../../../../styles/globals.css";
.docSearchWrapper {
@apply sticky -top-3 z-[11] mb-3 flex w-full flex-wrap items-center justify-between gap-y-1 pr-3;
}
.listContainer {
height: calc(100% - 3.25rem);
@apply box-border pb-[30px];
}
.cardWrapper {
@apply grid min-w-[902px] grid-cols-3 gap-4 last:mb-[30px];
}
.segWrapper {
@apply box-border flex h-[180px] w-full flex-col rounded-xl border border-transparent bg-gray-50 px-4 pt-4 hover:cursor-pointer hover:border-gray-200 hover:bg-white hover:shadow-lg xl:min-w-[290px];
}
.segTitleWrapper {
@apply flex items-center justify-between;
}
.segStatusWrapper {
@apply box-border flex items-center;
}
.segContent {
white-space: wrap;
@apply mt-2 h-0 min-h-0 flex-1 overflow-hidden from-gray-800 to-white text-sm text-ellipsis text-gray-800;
}
.segData {
@apply hidden pt-2 text-xs text-gray-500;
}
.segDataText {
@apply max-w-[80px] truncate;
}
.chartLinkText {
background: linear-gradient(to left, white, 90%, transparent);
@apply absolute right-0 hidden h-12 items-center pl-12 text-xs font-semibold text-primary-600;
}
.segModalContent {
@apply h-96 overflow-y-scroll text-base break-all text-gray-800;
white-space: pre-line;
}
.footer {
@apply mt-4 box-border flex flex-wrap items-center justify-between gap-y-2 border-t-[0.5px] border-t-gray-200 pt-3;
}
.numberInfo {
@apply text-xs font-medium text-gray-500;
}
.keywordTitle {
@apply mt-1 mb-2 text-xs text-gray-500 uppercase;
}
.keywordWrapper {
@apply flex max-h-[200px] w-full flex-wrap overflow-auto text-gray-700;
}
.keyword {
@apply mr-1 mb-2 max-h-[100px] max-w-[200px] overflow-y-auto rounded-lg border border-gray-200 px-2 py-1 text-sm whitespace-pre-line last:mr-0;
}
.hashText {
@apply inline-block w-48 truncate;
}
.commonIcon {
@apply mr-1 inline-block h-3 w-3 bg-gray-500 align-middle;
mask-repeat: no-repeat;
mask-size: contain;
mask-position: center center;
}
.targetIcon {
mask-image: url(../../assets/target.svg);
}
.typeSquareIcon {
mask-image: url(../../assets/typeSquare.svg);
}
.bezierCurveIcon {
mask-image: url(../../assets/bezierCurve.svg);
}
.cardLoadingWrapper {
@apply relative inline-block h-full w-full rounded-b-xl;
background-position: center center;
background-repeat: no-repeat;
background-size: 100% 100%;
background-origin: content-box;
}
.cardLoadingIcon {
background-image: url(../../assets/cardLoading.svg);
}
/* .hitLoadingIcon {
background-image: url(../../assets/hitLoading.svg);
} */
.cardLoadingBg {
@apply relative mt-4 h-full rounded-b-xl;
left: calc(-1rem - 1px);
width: calc(100% + 2rem + 2px);
height: calc(100% - 1rem + 1px);
background: linear-gradient(180deg, rgba(252, 252, 253, 0) 0%, #fcfcfd 74.15%);
}
.hitTitleWrapper {
@apply mb-2 flex w-full items-center justify-between;
}
.progressWrapper {
@apply flex w-full items-center justify-between;
}
.progress {
border-radius: 3px;
@apply relative mr-2 box-border h-1.5 flex-1 border border-gray-300;
}
.progressLoading {
@apply border-[#EAECF0] bg-[#EAECF0];
}
.progressInner {
@apply absolute top-0 h-full bg-gray-300;
}
.progressText {
font-size: 13px;
@apply font-bold text-gray-700;
}
.progressTextLoading {
border-radius: 5px;
@apply h-3.5 w-3.5 bg-[#EAECF0];
}
.editTip {
box-shadow:
0px 4px 6px -2px rgba(16, 24, 40, 0.03),
0px 12px 16px -4px rgba(16, 24, 40, 0.08);
}
.delModal {
background:
linear-gradient(180deg, rgba(217, 45, 32, 0.05) 0%, rgba(217, 45, 32, 0) 24.02%), #f9fafb;
box-shadow:
0px 20px 24px -4px rgba(16, 24, 40, 0.08),
0px 8px 8px -4px rgba(16, 24, 40, 0.03);
@apply rounded-2xl p-8;
}
.warningWrapper {
box-shadow:
0px 20px 24px -4px rgba(16, 24, 40, 0.08),
0px 8px 8px -4px rgba(16, 24, 40, 0.03);
background: rgba(255, 255, 255, 0.9);
@apply mb-3 flex h-12 w-12 items-center justify-center rounded-xl border-[0.5px] border-gray-100;
}
.warningIcon {
@apply h-[22px] w-[22px] fill-current text-red-600;
}