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-content.less

85 lines
1.9 KiB
Plaintext

@import "./mixin.less";
.memo-content-wrapper {
@apply w-full flex flex-col justify-start items-start;
> .memo-content-text {
@apply w-full break-words text-base leading-7;
&.expanded {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 8;
overflow: hidden;
}
> p {
@apply w-full h-auto mb-1 last:mb-0 text-base leading-6 whitespace-pre-wrap break-words;
min-height: 24px;
}
.img {
@apply float-left max-w-full w-full;
}
.tag-span {
@apply inline-block w-auto font-mono text-blue-600 cursor-pointer;
}
.memo-link-text {
@apply inline-block text-blue-600 cursor-pointer font-bold border-none no-underline hover:opacity-80;
}
.link {
@apply text-blue-600 cursor-pointer underline break-all hover:opacity-80;
}
.ol-block,
.ul-block,
.todo-block {
@apply inline-block box-border text-center w-7 font-mono select-none;
}
.todo-block {
@apply w-4 h-4 leading-4 border rounded box-border text-lg cursor-pointer shadow-inner hover:opacity-80;
transform: translateY(2px);
margin-left: 6px;
margin-right: 6px;
}
pre {
@apply w-full my-1 py-2 px-3 rounded text-sm bg-gray-100 whitespace-pre-wrap;
}
code {
@apply bg-gray-100 px-1 rounded text-sm leading-6 inline-block;
}
}
> .expand-btn-container {
@apply w-full relative flex flex-row justify-start items-center;
> .btn {
@apply flex flex-row justify-start items-center pl-2 pr-1 py-1 my-1 text-xs rounded-lg border bg-gray-100 border-gray-200 opacity-80 shadow hover:opacity-60;
&.expand-btn {
@apply mt-2;
> .icon-img {
@apply rotate-90;
}
}
&.fold-btn {
> .icon-img {
@apply -rotate-90;
}
}
> .icon-img {
@apply w-4 h-auto ml-1 transition-all;
}
}
}
}