src/components/TaskController.css
.task-controll {
$this: .task-controll;
@apply absolute;
@apply h-full;
@apply text-right;
@apply select-none;
@apply cursor-default;
display: none;
align-items: center;
justify-content: flex-end;
width: 5.8rem;
top: 0px;
right: 0px;
pointer-events: none;
z-index: var(--z-index-task-controller);
background: rgb(249, 250, 251);
background: linear-gradient(
90deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 1) 40%,
rgba(255, 255, 255, 1) 100%
);
> * {
pointer-events: auto;
}
.TagMenu {
margin-left: 4px;
height: 40px;
}
@at-root {
.task-item:hover $this, $(this)--visible {
display: flex;
}
}
}
.controll-button {
@apply flex;
@apply text-indigo-300;
@apply text-3xl;
@apply hover:text-indigo-600;
&.mod-disable {
@apply text-gray-300;
}
&:hover svg {
@apply drop-shadow-md;
}
}