mirror of https://github.com/usememos/memos
chore: update memo detail page
parent
0dd2337663
commit
77a3513a6b
@ -0,0 +1,83 @@
|
||||
@import "./mixin.less";
|
||||
|
||||
.page-wrapper.memo-detail {
|
||||
@apply relative top-0 w-full h-screen overflow-y-auto overflow-x-hidden;
|
||||
background-color: #f6f5f4;
|
||||
|
||||
> .page-container {
|
||||
@apply relative w-full min-h-screen mx-auto flex flex-col justify-start items-center pb-8;
|
||||
|
||||
> .page-header {
|
||||
@apply sticky top-0 z-10 max-w-2xl w-full min-h-full flex flex-row justify-between items-center px-4 sm:pr-6 pt-6 mb-2;
|
||||
background-color: #f6f5f4;
|
||||
|
||||
> .title-container {
|
||||
@apply flex flex-row justify-start items-center;
|
||||
|
||||
> .logo-img {
|
||||
@apply h-12 sm:h-14 w-auto mr-1;
|
||||
}
|
||||
|
||||
> .title-text {
|
||||
@apply text-xl sm:text-3xl font-mono text-gray-700;
|
||||
}
|
||||
}
|
||||
|
||||
> .action-button-container {
|
||||
> .btn {
|
||||
@apply block text-gray-600 font-mono text-base py-1 border px-3 leading-8 rounded-xl hover:opacity-80 hover:underline;
|
||||
|
||||
> .icon {
|
||||
@apply text-lg;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .memos-wrapper {
|
||||
@apply relative flex-grow max-w-2xl w-full min-h-full flex flex-col justify-start items-start px-4 sm:pr-6;
|
||||
|
||||
> .memo-container {
|
||||
@apply flex flex-col justify-start items-start w-full p-4 mt-2 bg-white rounded-lg border border-white hover:border-gray-200;
|
||||
|
||||
> .memo-header {
|
||||
@apply mb-2 w-full flex flex-row justify-start items-center text-sm font-mono text-gray-400;
|
||||
|
||||
> .split-text {
|
||||
@apply mx-2;
|
||||
}
|
||||
|
||||
> .name-text {
|
||||
@apply hover:text-green-600 hover:underline;
|
||||
}
|
||||
|
||||
> .visibility-selector {
|
||||
> .status-text {
|
||||
@apply flex flex-row justify-start items-center leading-5 text-xs cursor-pointer ml-2 rounded border px-1;
|
||||
|
||||
&.public {
|
||||
@apply border-green-600 text-green-600;
|
||||
}
|
||||
|
||||
&.protected {
|
||||
@apply border-gray-400 text-gray-400;
|
||||
}
|
||||
}
|
||||
|
||||
.action-button {
|
||||
@apply px-2 leading-7 w-full rounded text-gray-600 hover:bg-gray-100;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .memo-content {
|
||||
@apply cursor-default;
|
||||
|
||||
> * {
|
||||
@apply cursor-default;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue