Merge pull request #8 from VitorCarvalho67/dev

Added two new notes: 'Send Request' and 'Accept', integrating them in…
VitorCarvalho67 · May 24, 2024 · 9ee9bac · 9ee9bac
2 parents 89e8790 + 56a1db5
commit 9ee9bac
Show file tree

Hide file tree

Showing 26 changed files with 372 additions and 60 deletions.
diff --git a/client/src/router/index.js b/client/src/router/index.js
@@ -4,43 +4,15 @@ import { adminRoutes } from './routes/admin'
 import { professorRoutes } from './routes/professor'
 import { funcionarioRoutes } from './routes/funcionario'
 import { empresaRoutes } from './routes/empresa'
-
-import Home from '../views/Home.vue';
-import NotFound from '../views/NotFound.vue';
-import PublicPerfilAluno from '../views/PerfilAluno.vue';
-import PublicPerfilProfessor from '../views/PerfilProfessor.vue';
+import { sharedRoutes } from './routes/shared'
 
 const routes = [
     ...alunoRoutes,
     ...adminRoutes,
     ...professorRoutes,
     ...funcionarioRoutes,
     ...empresaRoutes,
-    {
-        path: '/:pathMatch(.*)*',
-        name: 'NotFound',
-        component: NotFound
-    },
-    {
-        path: '/home',
-        name: 'Home',
-        component: Home
-    },
-    {
-        path: '/',
-        name: 'Home2',
-        component: Home
-    },
-    {
-        path: "/aluno/profile/:name",
-        name: "PublicPerfilAluno",
-        component: PublicPerfilAluno
-    },
-    {
-        path: "/professor/profile/:name",
-        name: "PublicPerfilProfessor",
-        component: PublicPerfilProfessor
-    }
+    ...sharedRoutes
 ];
 
 const router = createRouter({

diff --git a/client/src/router/routes/shared.js b/client/src/router/routes/shared.js
@@ -0,0 +1,32 @@
+import Home from '../../views/shared/Home.vue';
+import NotFound from '../../views/shared/NotFound.vue';
+import PublicPerfilAluno from '../../views/shared/PerfilAluno.vue';
+import PublicPerfilProfessor from '../../views/shared/PerfilProfessor.vue';
+
+export const sharedRoutes = [
+    {
+        path: '/home',
+        name: 'Home',
+        component: Home
+    },
+    {
+        path: '/',
+        name: 'Home2',
+        component: Home
+    },
+    {
+        path: "/aluno/profile/:name",
+        name: "PublicPerfilAluno",
+        component: PublicPerfilAluno
+    },
+    {
+        path: "/professor/profile/:name",
+        name: "PublicPerfilProfessor",
+        component: PublicPerfilProfessor
+    },
+    {
+        path: '/:pathMatch(.*)*',
+        name: 'NotFound',
+        component: NotFound
+    }
+]
diff --git a/client/src/scss/abstracts/_mixins.scss b/client/src/scss/abstracts/_mixins.scss
@@ -35,6 +35,12 @@
     }
 }
 
+@mixin m-screen($width) {
+    @media screen and (max-width: $width) {
+        @content;
+    }
+}
+
 @mixin line {
     &:after {
         content: '';

diff --git a/client/src/scss/base/_base.scss b/client/src/scss/base/_base.scss
@@ -20,4 +20,5 @@ main {
 img, button, a{
     -webkit-user-select: none;
     user-select: none;
+    transition: .2s;
 }
diff --git a/client/src/scss/layouts/_cards.scss b/client/src/scss/layouts/_cards.scss
@@ -2,8 +2,10 @@
     background-color: $terciary-color-dark;
     padding: 100px;
     min-height: 400px;
-
     @include flex(column, flex-start, center);
+    @include m-screen(1400px){
+        min-height: 360px;
+    }
 
     h1,
     h2 {
@@ -12,21 +14,31 @@
 
     h1 {
         font-size: 2rem;
-        @include font-inter(700);
         color: $secondary-color-orange;
+        @include font-inter(700);
+        @include m-screen(1400px){
+            font-size: 1.8rem;
+        }
     }
 
     h2 {
         font-size: 1.3rem;
-        @include font-inter(300);
         color: $font-color-dark-2;
+        @include font-inter(300);
+        @include m-screen(1400px){
+            font-size: 1.1rem;
+        }
     }
 
     .wrapper {
         max-width: 1100px;
         width: 100%;
         margin: 80px 0px 20px 0px;
         position: relative;
+        @include m-screen(1400px){
+            margin: 60px 0px 18px 0px;
+            max-width: 1000px;
+        }
     }
 
     .wrapper i {
@@ -42,6 +54,9 @@
         filter: invert(100%);
         opacity: 0.7;
         transition: transform 0.1s linear;
+        @include m-screen(1400px){
+            background-size: 30px;
+        }
     }
 
     .wrapper i:first-child {
@@ -95,6 +110,9 @@
             padding-bottom: 15px;
             flex-direction: column;
             border-radius: 8px;
+            @include m-screen(1400px){
+                height: 300px;
+            }
 
             .img {
                 background: $primary-color-dark;
@@ -115,13 +133,19 @@
                 font-size: 1.5rem;
                 color: $font-color-dark;
                 padding: 10px;
+                @include m-screen(1400px){
+                    font-size: 1.3rem;
+                }
             }
 
             span {
                 @include font-inter(200);
                 font-size: 0.9rem;
                 color: $font-color-dark-2;
                 padding: 10px;
+                @include m-screen(1400px){
+                    font-size: 0.7rem;
+                }
             }
         }
     }

diff --git a/client/src/scss/layouts/_contactUs.scss b/client/src/scss/layouts/_contactUs.scss
@@ -14,6 +14,21 @@
             color: $secondary-color-orange;
             @include font-inter(500);
             font-size: 2rem;
+            @include m-screen(1420px) {
+                font-size: 1.8rem;
+            }
+            @include m-screen(1120px) {
+                font-size: 1.6rem;
+            }
+        }
+
+        p {
+            @include m-screen(1420px) {
+                font-size: 0.8rem;
+            }
+            @include m-screen(1120px) {
+                font-size: 0.7rem;
+            }
         }
 
         p:last-child {
@@ -32,6 +47,18 @@
                 padding: 8px;
                 min-width: 350px;
                 border-radius: 3px;
+                @include m-screen(1420px) {
+                    padding: 7.2px;
+                    min-width: 315px;
+                    border-radius: 3px;
+                    font-size: 0.8rem;
+                }
+                @include m-screen(1120px) {
+                    padding: 6.4px;
+                    min-width: 280px;
+                    border-radius: 3px;
+                    font-size: 0.7rem;
+                }
 
                 &:focus {
                     border: solid 1px $secondary-color-orange;
@@ -48,6 +75,20 @@
                 min-width: 350px;
                 border-radius: 3px;
                 resize: none;
+                @include m-screen(1420px) {
+                    padding: 7.2px;
+                    min-width: 315px;
+                    border-radius: 3px;
+                    font-size: 0.8rem;
+                    height: calc(1.5em * 7);
+                }
+                @include m-screen(1120px) {
+                    padding: 6.4px;
+                    min-width: 280px;
+                    border-radius: 3px;
+                    font-size: 0.7rem;
+                    height: calc(1.5em * 6);
+                }
 
                 &:focus {
                     border: solid 1px $secondary-color-orange;
@@ -62,12 +103,20 @@
                     padding: 8px 25px;
                     border-radius: 3px;
                     font-size: 1rem;
-                    color: $font-color-dark;
+                    color: $secondary-color-dark;
                     background-color: $primary-color-orange;
                     border: none;
                     border: solid 1px $primary-color-orange;
                     transition: 0.1s linear;
                     cursor: pointer;
+                    @include m-screen(1420px) {
+                        font-size: 0.8rem;
+                        padding: 7px 20px;
+                    }
+                    @include m-screen(1120px) {
+                        font-size: 0.7rem;
+                        padding: 6px 15px;
+                    }
 
                     &:hover {
                         background-color: transparent;
@@ -80,6 +129,12 @@
 
         * {
             margin-top: 10px;
+            @include m-screen(1420px) {
+                margin-top: 8px;
+            }
+            @include m-screen(1120px) {
+                margin-top: 7px;
+            }
         }
     }
 }
diff --git a/client/src/scss/layouts/_footer.scss b/client/src/scss/layouts/_footer.scss
@@ -3,9 +3,20 @@ footer {
     height: 25vh;
     @include flex(column, space-evenly, center);
     @include font-inter(200);
-
+    @include m-screen(1400px) {
+        font-size: 0.8rem;
+    }
+    @include m-screen(1120px) {
+        font-size: 0.7rem;
+    }
     img {
         height: 40px;
+        @include m-screen(1400px) {
+            height: 34px;
+        }
+        @include m-screen(1120px) {
+            height: 30px;
+        }
     }
 
     nav ul {

diff --git a/client/src/scss/layouts/_header.scss b/client/src/scss/layouts/_header.scss
@@ -29,6 +29,10 @@ header {
                 @include flex(column, center, flex-start);
                 @include font-inter(400);
                 @include line;
+                @include m-screen(1120px){
+                    font-size: 0.7rem;
+                    margin-inline: 8px;
+                }
             }
 
             li:nth-child(2) {
@@ -44,6 +48,9 @@ header {
                 transition: 0.1s linear;
                 @include line;
                 @include flex-center;
+                @include m-screen(1120px){
+                    padding: 8px 18px;
+                }
 
                 &:after {
                     height: 0;

diff --git a/client/src/scss/pages/PerfilProfessor.scss b/client/src/scss/pages/PerfilProfessor.scss