Skip to content

Commit

Permalink
upd
Browse files Browse the repository at this point in the history
  • Loading branch information
@progof
progof committed Nov 6, 2024
1 parent 56b9f6c commit e3b647a
Show file tree
Hide file tree
Showing 14 changed files with 191 additions and 39 deletions.
42 changes: 12 additions & 30 deletions README.md
View file
Original file line number Diff line number Diff line change
@@ -1,30 +1,12 @@
# Altpalce

Altplace is a platform for students to join interest groups and organize events.

![](https://i.imgur.com/Pr1JWnt.png)

## Installation and run app

1. Clone this repository: `git clone https://github.com/progof/altpalce.git`.
2. Install dependencies for server part: `cd server/ npm i`.
3. Start the client part: `npm run dev`
4. Install dependencies for server part: `cd client/ npm i`.
5. Running dockercontainer with postgres: `npm run docker:up`
6. Start the server part: `npm run dev2`

## Screenshots of the application

![](https://i.imgur.com/53Z8Xch.png)

![](https://i.imgur.com/4LLI15n.png)

![](https://i.imgur.com/qrndKPS.png)

![](https://i.imgur.com/mEMoE6j.png)

![](https://i.imgur.com/jgBtyKS.png)

![](https://i.imgur.com/wm5wTmB.png)

![](https://i.imgur.com/YirA0BG.png)
<div align="center">
<p align="center">
<img align="center" width="380px" src="https://i.imgur.com/Q4izm8t.png">
</p>

</div>

<div align="center">
<p align="center">
AltLoc is an intuitive and gamified goal and task management app that empowers users to set and track personal goals, organize tasks by category, and earn rewards through virtual progress levels.
</p>
</div>
7 changes: 4 additions & 3 deletions frontend/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,9 +4,10 @@
<meta charset="UTF-8">
<link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="AltLoc">
<meta name="keywords" content="AltLoc">
<title>AltLoc</title>
<meta name="description" content="AltLoc - goal and task management app that uses gamification to help you set, organize, and achieve your goals. Track progress, earn rewards, and level up as you complete tasks and move closer to your desired outcomes.">
<meta name="keywords" content="AltLoc, goal management, task management, habit tracking, productivity app, gamification, progress tracker, achieve goals, virtual rewards, level up">

<title>ALTLOC</title>
</head>
<body>
<div id="app"></div>
Expand Down
Binary file modified frontend/public/favicon.ico
View file
Binary file not shown.
Binary file added frontend/public/images/blue-grid.webp
View file
Binary file not shown.
Binary file added frontend/public/images/virtual-world.avif
View file
Binary file not shown.
Binary file added frontend/public/images/vr.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
19 changes: 19 additions & 0 deletions frontend/src/assets/icons/clipboard-list.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions frontend/src/assets/icons/github.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
7 changes: 7 additions & 0 deletions frontend/src/assets/icons/space-star.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 9 additions & 0 deletions frontend/src/assets/icons/target.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion frontend/src/components/RegisterFormIsland.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,7 @@ const submitForm = async (event: Event) => {
<Button
type="submit"
:disabled="isPending"
class="mt-6 flex h-11 w-full items-center justify-center rounded-full bg-blue-500 px-5 font-medium text-zinc-100 transition-colors hover:bg-blue-600/90 disabled:cursor-not-allowed disabled:opacity-50"
class="mt-6 flex h-11 w-full items-center justify-center rounded-full bg-blue-500 px-5 font-medium text-white transition-colors hover:bg-blue-600/90 disabled:cursor-not-allowed disabled:opacity-50"
>
<LoaderIcon
class="mr-2 size-5 animate-spin stroke-[1.5] text-zinc-400"
Expand Down
22 changes: 19 additions & 3 deletions frontend/src/layouts/MainLayout.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import InstagramIcon from "@/assets/icons/instagram.svg?component";
import FacebookIcon from "@/assets/icons/facebook.svg?component";
import XIcon from "@/assets/icons/x.svg?component";
import AstronautIcon from "@/assets/icons/astronaut.svg?component";
import GithubIcon from "@/assets/icons/github.svg?component";
import { buttonVariant } from "@/components/ui/button";
import { getSoialMediaURL } from "@/utils";
import MobileMenu from "./MobileMenu.vue";
Expand Down Expand Up @@ -65,9 +66,20 @@ onUnmounted(() => {
<div
class="flex w-full flex-col items-start justify-center gap-3 text-center md:flex-row md:items-center md:justify-between"
>
<div class="flex gap-1 items-center">
<span class="font-semibold text-xl text-zinc-100">AltLoc</span>
<AstronautIcon class="size-10 stroke-[4] text-zinc-100" />
<div class="flex gap-6 justify-between">
<div class="flex gap-2 items-center">
<AstronautIcon class="size-10 stroke-[4] text-zinc-100" />
<span class="font-semibold text-xl text-zinc-100">ALTLOC</span>
</div>

<a
href="https://github.com/progof"
target="_blank"
class="font-semibold text-xs text-zinc-100/75 flex gap-1 items-center"
>
<GithubIcon class="size-5 stroke-[3] text-zinc-100/75" />
by PROGOF
</a>
</div>
<ul
class="flex flex-wrap items-start justify-start gap-x-5 gap-y-2 md:justify-between"
Expand Down Expand Up @@ -95,24 +107,28 @@ onUnmounted(() => {
<div class="flex flex-row justify-center gap-1 md:justify-end">
<a
:href="getSoialMediaURL('telegram')"
target="_blank"
class="flex p-1 text-zinc-100/75 hover:text-zinc-100/90"
>
<TelegramIcon class="size-5" />
</a>
<a
:href="getSoialMediaURL('instagram')"
target="_blank"
class="flex p-1 text-zinc-100/75 hover:text-zinc-100/90"
>
<InstagramIcon class="size-5" />
</a>
<a
:href="getSoialMediaURL('facebook')"
target="_blank"
class="flex p-1 text-zinc-100/75 hover:text-zinc-100/90"
>
<FacebookIcon class="size-5" />
</a>
<a
:href="getSoialMediaURL('twitter')"
target="_blank"
class="flex p-1 text-zinc-100/75 hover:text-zinc-100/90"
>
<XIcon class="size-5" />
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/pages/auth/register.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import GoogleIcon from "@/assets/icons/google.svg?component";
<AuthLayout>
<div class="flex w-full max-w-lg flex-col gap-y-6 xl:py-20">
<div class="w-full">
<h1 class="text-2xl font-bold tracking-[-0.015em]">
<h1 class="text-2xl font-bold tracking-[-0.015em] text-blue-500">
Create your personal account
</h1>
<p class="mt-2 text-sm font-medium text-zinc-600">
Expand Down
116 changes: 115 additions & 1 deletion frontend/src/pages/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,11 @@ import MainLayout from "@/layouts/MainLayout.vue";
import GameControllerIcon from "@/assets/icons/game-controller.svg?component";
import CommentIcon from "@/assets/icons/comment.svg?component";
import AstronautIcon from "@/assets/icons/astronaut.svg?component";
import TargetIcon from "@/assets/icons/target.svg?component";
import CategoriesIcon from "@/assets/icons/categories.svg?component";
import ClipboardListIcon from "@/assets/icons/clipboard-list.svg?component";
import RankingIcon from "@/assets/icons/ranking.svg?component";
import SpaceStarIcon from "@/assets/icons/space-star.svg?component";
</script>

<template>
Expand Down Expand Up @@ -43,7 +48,7 @@ import AstronautIcon from "@/assets/icons/astronaut.svg?component";
</div>
</section>

<section class="relative group mt-6 p-12 px-6 md:px-10">
<!-- <section class="relative group mt-6 p-12 px-6 md:px-10">
<div class="container flex flex-col gap-12 items-center">
<img
src="/images/abstract-space2.jpg"
Expand Down Expand Up @@ -141,6 +146,115 @@ import AstronautIcon from "@/assets/icons/astronaut.svg?component";
</div>
</div>
</div>
</section> -->
<section class="relative group mt-6 p-12 px-6 md:px-10">
<div class="container flex flex-col gap-12 items-center">
<img
src="/images/blue-grid.webp"
alt="Gamification poster"
class="absolute inset-0 size-full object-cover opacity-65 blur-sm bg-blue-200"
/>

<div class="flex flex-col gap-6 items-center z-10">
<h2 class="text-2xl font-semibold text-zinc-100 text-center">
How to Gamify Your Goals
</h2>
<span class="text-zinc-200 text-center">
Transform your goals into engaging quests with these simple steps.
Complete tasks, gain experience, and unlock achievements along the
way!
</span>
</div>

<div
class="grid grid-cols-1 gap-6 sm:grid-cols-2 md:grid-cols-3 md:grid-rows-2 z-10"
>
<div
class="bg-white rounded-lg p-4 gap-3 flex-col flex transition transform hover:scale-105"
>
<div class="flex gap-3 items-center">
<h2 class="text-zinc-900 font-semibold">Step 1: Set a Goal</h2>
<TargetIcon class="size-5 stroke-[1.7] text-zinc-800" />
</div>
<span class="text-zinc-600 text-sm"
>Define a meaningful goal, like improving fitness or learning a
new skill.</span
>
</div>

<div
class="bg-white rounded-lg p-4 gap-3 flex-col flex transition transform hover:scale-105"
>
<div class="flex gap-3 items-center">
<h2 class="text-zinc-900 font-semibold">
Step 2: Organize by Category
</h2>
<CategoriesIcon class="size-5 stroke-[1.7] text-zinc-800" />
</div>
<span class="text-zinc-600 text-sm"
>Break down your goal into categories (e.g., "Cardio" or "Strength
Training").</span
>
</div>

<div
class="bg-white rounded-lg p-4 gap-3 flex-col flex transition transform hover:scale-105"
>
<div class="flex gap-3 items-center">
<h2 class="text-zinc-900 font-semibold">
Step 3: Add Specific Tasks
</h2>
<ClipboardListIcon class="size-5 stroke-[1.7] text-zinc-800" />
</div>
<span class="text-zinc-600 text-sm"
>Create tasks for each category, assigning difficulty and
priority.</span
>
</div>

<div
class="bg-white rounded-lg p-4 gap-3 flex-col flex transition transform hover:scale-105"
>
<div class="flex gap-3 items-center">
<h2 class="text-zinc-900 font-semibold">
Step 4: Track Progress
</h2>
<RankingIcon class="size-5 stroke-[1.7] text-zinc-800" />
</div>
<span class="text-zinc-600 text-sm"
>Mark tasks as complete to earn rewards and see your
progress.</span
>
</div>

<div
class="bg-white rounded-lg p-4 gap-3 flex-col flex transition transform hover:scale-105"
>
<div class="flex gap-3 items-center">
<h2 class="text-zinc-900 font-semibold">Step 5: Reflect Daily</h2>
<CommentIcon class="size-5 stroke-[1.7] text-zinc-800" />
</div>
<span class="text-zinc-600 text-sm"
>Leave a daily comment and track your mood to measure personal
impact.</span
>
</div>

<div
class="bg-white rounded-lg p-4 gap-3 flex-col flex transition transform hover:scale-105"
>
<div class="flex gap-3 items-center">
<h2 class="text-zinc-900 font-semibold">
Step 6: Adjust & Celebrate
</h2>
<SpaceStarIcon class="size-5 stroke-[1.7] text-zinc-800" />
</div>
<span class="text-zinc-600 text-sm"
>Revise goals as you grow and celebrate each new milestone!</span
>
</div>
</div>
</div>
</section>

<section class="relative mt-6 p-3 px-6 md:px-10">
Expand Down

0 comments on commit e3b647a

Please sign in to comment.