sergey/anti-hvost
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: tasks buttons

Browse Source
This commit is contained in:
Sergey Elpashev
2025-04-15 16:42:35 +03:00
parent 9d6f0ce73d
commit 1b1c45935b
2 changed files with 16 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/menu.module.scss
View File

@@ -1,7 +1,7 @@
@reference "../index.scss";
#container {
@apply flex min-h-auto w-screen flex-col items-center gap-4 px-2 py-3 md:min-h-screen md:w-[30rem];
@apply flex min-h-auto w-screen flex-col items-center gap-4 px-2 py-3 md:min-h-screen md:w-[20rem];
}
.menu_container {

15
src/pages/profile_tasks.tsx
View File

@@ -1,6 +1,8 @@
import Task from "@/components/task";
import { withTitle } from "@/constructors/Component";
import { UrlsTitle } from "@/enums/urls";
import { PlusIcon } from "@heroicons/react/20/solid";
import { FunnelIcon, MagnifyingGlassIcon } from "@heroicons/react/24/outline";
import { FunctionComponent } from "preact";
import { useMemo } from "preact/hooks";
import classes from "./profile_tasks.module.scss";
@@ -21,6 +23,19 @@ const ProfileTasks: FunctionComponent = () => {
<Task name={task} key={index} checked={index % 2 === 0} />
))}
</div>
<div class="group fixed right-[22rem] bottom-4 hidden flex-row items-center justify-start space-x-3 overflow-x-hidden md:flex">
<div class="aspect-square h-20 cursor-pointer items-center justify-center rounded-full bg-[rgb(251,194,199,0.53)] text-9xl text-white transition-all duration-300 ease-out group-hover:ml-[12rem] hover:bg-[rgb(251,194,199,0.7)]">
<PlusIcon />
</div>
<div class="absolute left-0 my-auto flex flex-row space-x-3 opacity-0 transition-opacity duration-100 group-hover:opacity-100">
<div class="flex aspect-square h-20 cursor-pointer flex-col items-center justify-center rounded-full bg-[rgba(206,232,251,0.7)] text-xl text-gray-600 hover:bg-[rgba(206,232,251,0.9)]">
<MagnifyingGlassIcon class="size-12" />
</div>
<div class="flex aspect-square h-20 cursor-pointer flex-col items-center justify-center rounded-full bg-[rgba(206,232,251,0.7)] text-xl text-gray-600 hover:bg-[rgba(206,232,251,0.9)]">
<FunnelIcon class="size-12" />
</div>
</div>
</div>
</div>
);
};