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/search-bar.less

68 lines
1.5 KiB
Plaintext

.search-bar-container {
@apply relative w-auto;
&:hover,
&:active {
> .search-bar-inputer > .text-input {
@apply flex;
}
> .quickly-action-wrapper {
@apply flex;
}
}
> .search-bar-inputer {
@apply h-9 flex flex-row justify-start items-center w-full py-2 px-3 sm:px-4 rounded-full sm:rounded-lg bg-zinc-200;
> .icon-img {
@apply w-4 h-auto opacity-30;
}
> .text-input {
@apply hidden sm:flex ml-2 w-24 grow text-sm;
}
}
> .quickly-action-wrapper {
@apply hidden absolute top-9 -right-2 p-2 w-80 z-10;
> .quickly-action-container {
@apply flex flex-col justify-start items-start w-full bg-white px-4 py-3 rounded-lg;
box-shadow: 0 0 8px 0 rgb(0 0 0 / 20%);
> .title-text {
@apply text-gray-600 text-xs;
}
> .types-container {
@apply flex flex-row justify-start items-start w-full text-xs mt-2;
> .section-text {
@apply text-gray-600 mr-1 shrink-0 leading-6;
}
> .values-container {
@apply flex flex-row justify-start items-start flex-wrap select-none;
> div {
@apply flex flex-row justify-start items-center leading-6;
.type-item {
@apply cursor-pointer px-1 rounded hover:bg-gray-100;
&.selected {
@apply bg-green-600 text-white;
}
}
.split-text {
@apply text-gray-400 mx-1;
}
}
}
}
}
}
}