diff --git a/index.html b/index.html index 9a1cb69..c275a79 100644 --- a/index.html +++ b/index.html @@ -3,10 +3,8 @@ - - - - + + Let's meet diff --git a/src/assets/base.css b/src/assets/base.css index 8fba94a..f661fa2 100644 --- a/src/assets/base.css +++ b/src/assets/base.css @@ -1,5 +1,32 @@ +:root +{ + --primary-color : #fff8ed; + --secondary-color : #fff8ed; + --tertiary-color : #fff8ed; + --radius : 3px; +} + +@media screen and (min-width: 601px) { + :root { + --font-size : 18px; + } +} + +@media screen and (max-width: 600px) { + :root { + --font-size : 15px; + } +} + * { - transition: 0.3s all; + color: #141115; + text-decoration: none; + font-size: var(--font-size); font-family: 'PT Sans', sans-serif; + transition: 0.3s all; } + +h1 { + font-size: calc(var(--font-size, 1vw) * 2.15); +} \ No newline at end of file diff --git a/src/assets/main.css b/src/assets/main.css index 95c5a95..0504556 100644 --- a/src/assets/main.css +++ b/src/assets/main.css @@ -2,7 +2,7 @@ body { - background-color: #fff8ed; + background-color: var(--primary-color); } footer diff --git a/src/layouts/LayoutDefault.vue b/src/layouts/LayoutDefault.vue index 9a84f41..cabbbe5 100644 --- a/src/layouts/LayoutDefault.vue +++ b/src/layouts/LayoutDefault.vue @@ -26,7 +26,7 @@ nav { text-decoration: none; height: 2vw; border: 1px solid; - border-radius: 3px; + border-radius: var(--radius); } .main { diff --git a/src/router/index.ts b/src/router/index.ts index 9a826c2..14650c7 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -2,6 +2,8 @@ import { createRouter, createWebHistory } from 'vue-router' import HomeView from '../views/HomeView.vue' import AboutView from '../views/AboutView.vue' import ErrorView from '../views/ErrorView.vue' +import CreateView from "../views/CreateView.vue"; +import JoinView from "../views/JoinView.vue"; const router = createRouter({ history: createWebHistory(import.meta.env.BASE_URL), @@ -20,8 +22,18 @@ const router = createRouter({ path: '/error', name: 'error', component: ErrorView, + }, + { + path: '/create', + name: 'create', + component: CreateView, + }, + { + path: '/join', + name: 'join', + component: JoinView, } - ], + ] }) export default router diff --git a/src/views/CreateView.vue b/src/views/CreateView.vue new file mode 100644 index 0000000..fc3c185 --- /dev/null +++ b/src/views/CreateView.vue @@ -0,0 +1,11 @@ + + + + + diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue index eab9c50..3d26824 100644 --- a/src/views/HomeView.vue +++ b/src/views/HomeView.vue @@ -7,17 +7,12 @@

Welcome !

-

This website is currently under development and might look like ugly as fuck

+

This website is currently under development and might look ugly as fuck

-
- Join an event -
- -
- Create an event -
+
Create an event
+
Join an event
@@ -34,19 +29,36 @@ } .introduction { - justify-items: center; - align-content: center; - flex-grow: 10; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + width: 70%; height: 100%; + border: solid 1px; } .actions { - justify-items: center; + display: flex; flex-direction: column; - align-content: center; - flex-grow: 4; + justify-content: center; + align-items: center; + gap: 4vh; height: 100%; - background-color: rgba(0,0,0,0.1); + width: 30%; + border: solid 1px; +} + +.button { + text-align: center; + align-content: center; + min-width: 10vw; + min-height: 5vh; + border-radius: var(--radius); + background-color: var(--secondary-color); + box-shadow: 2px 2px 5px; + border: solid 1px; + } diff --git a/src/views/JoinView.vue b/src/views/JoinView.vue new file mode 100644 index 0000000..f5d7b9b --- /dev/null +++ b/src/views/JoinView.vue @@ -0,0 +1,11 @@ + + + + +