You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
memos/web/src/less/memo-card-dialog.less

88 lines
2.0 KiB
Plaintext

@import "./mixin.less";
.dialog-wrapper.memo-card-dialog {
@apply px-4;
> .dialog-container {
@apply w-full p-0 bg-transparent flex flex-col justify-start items-center;
> .memo-card-container {
@apply flex flex-col justify-start items-start relative w-128 max-w-full py-3 px-6 mb-3 rounded-lg bg-yellow-200;
> * {
z-index: 1;
}
> .header-container {
@apply flex flex-row justify-between items-center w-full h-auto pb-0 my-0;
> .time-text {
@apply text-sm text-gray-500 font-mono;
}
> .btns-container {
.flex(row, flex-end, center);
> .btn {
.flex(row, center, center);
@apply w-6 h-6 p-1 ml-2 rounded text-gray-600 hover:bg-white;
}
> .split-line {
@apply font-mono text-gray-300 ml-2;
}
}
}
> .memo-container {
@apply w-full flex flex-col justify-start items-start pt-2;
}
> .normal-text {
@apply mt-2 text-sm text-gray-500;
}
> .layer-container,
> .background-layer-container {
position: absolute;
bottom: -3px;
left: 3px;
width: calc(100% - 6px);
height: 100%;
border-radius: 8px;
z-index: -1;
background-color: @bg-paper-yellow;
border-bottom: 1px solid lightgray;
}
> .layer-container {
z-index: 0;
background-color: @bg-paper-yellow;
border: 1px solid lightgray;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
}
> .linked-memos-wrapper {
.flex(column, flex-start, flex-start);
@apply w-128 max-w-full mt-2 py-3 px-6 rounded-lg bg-white last:mb-8;
> .normal-text {
@apply text-sm;
}
> .linked-memo-container {
@apply text-sm leading-6 mt-2 cursor-pointer max-w-full truncate hover:opacity-80;
> .time-text {
@apply font-mono text-gray-500;
}
}
}
}
}