@import "./mixin.less"; .daily-memo-diary-dialog { @apply p-0 sm:py-16; > .dialog-container { @apply w-112 max-w-full p-0 rounded-none sm:rounded-lg; > .dialog-header-container { @apply flex flex-row justify-between items-center w-full p-6 pb-0 mb-0; > .btns-container { @apply flex flex-row justify-start items-center; > .btn-text { @apply w-6 h-6 mr-2 rounded cursor-pointer select-none last:mr-0 hover:bg-gray-200; > .icon-img { @apply w-full h-auto; } &.share-btn { @apply ~"p-0.5"; } } } } > .dialog-content-container { @apply w-full h-auto flex flex-col justify-start items-start p-6 pb-0; > .date-card-container { @apply flex flex-col justify-center items-center m-auto pb-6 select-none; z-index: 1; > .year-text { @apply m-auto font-bold text-gray-600 text-center leading-6 mb-2; } > .date-container { @apply flex flex-col justify-center items-center m-auto w-24 h-24; border-radius: 24px; box-shadow: 0 0 8px 0 rgb(0 0 0 / 20%); > .month-text, > .day-text { @apply flex flex-col justify-center items-center text-center w-full h-6 text-sm; } > .month-text { @apply bg-blue-700 text-white; border-top-left-radius: 24px; border-top-right-radius: 24px; } > .date-text { @apply flex flex-col justify-center items-center text-center w-full pt-1 h-12; font-size: 40px; font-weight: bold; } > .day-text { @apply text-xs; } } } > .date-picker { @apply mx-auto border border-gray-200 rounded-lg mb-6; } > .tip-container { @apply m-auto py-4 px-0; > .tip-text { font-style: italic; } } > .dailymemos-wrapper { @apply flex flex-col justify-start items-start w-full mt-2; } } } }