Issue 17 - Menu e itens #61

JonasGz · 2024-01-31T17:35:54Z

Closes #17

Feature

Criação de componente sidemenu responsivo com nav e content, contendo as funções de abrir/fechar e active.

Bugfix

Description
- conflitos de responsividade com height definida de 100vh;
Cause
- A height definida em 100vh não considera as barras de navegação e outros itens que estiverem na screen do mobile do usuário.
Solution
Alteração de height da .home de 100vh para 100dvh.

Changelog

`.home { height: 100vh para 100dvh; } `

Visual evidences 🖼️

MENU FECHADO:

MENU ABERTO:

MENU ACTIVE:

Checklist

[ x ] Issue linked
[ x ] Build working correctly
[ x ] Tests created

Additional info

- Foi necessário uma pequena alteração na ordem de montagem dos componentes na index.js da home, no sentido de organizar melhor, pois era necessário selecionar itens de outro componente que estava sendo montado depois, a alteração não modificou em nada na renderização do layout. - As funções foram definidas na index.js da home, por ser necessário a interação entre componentes

This reverts commit 8a3f4fa.

src/components/TextInput/index.scss

src/home/components/NoPetRegirestedPage/images/no-pet-regirested-page.png

src/home/components/NoPetRegirestedPage/index.scss

src/home/components/SideMenu/index.scss

src/styles/base.scss

.eslintrc.json

.prettierrc

JonasGz · 2024-02-05T21:35:37Z

@Alecell lembrar de revisar

Update feat: add active menu change: order components and other changes - change order components - corrections methods code js for standard eslint - changes css px to rem Change home height to "dvh" - dvh is dynamic and most adaptable and used Update index.js alterações de indentação Update Update Update index.js Update index.js Update index.js Update Update index.scss Update index.scss

…ts (#52) * fix: fix the logical to set placeholder, changed the name of the events * rename the events, fix style sizes, change methods names and functions, add togle method * identation * add EOF

* Criei componente de uoload de imagens * Criei um componente de upload de imagem * Criei um componente de upload de imagem * Criei um componente de upload de imagem * Criei um componente de upload de imagem * feat: Create and adjust the UploadImage component closes #24 * Made some adjustments in UploadImage component * feat: A component to upload images, code with corrections made in code review fic #24 * feat: Made adjustments in the Upload Image component fix #24

This reverts commit 5ab2c9c.

* Criado arquivo SCSS de definições de fontes para o projeto. * integração do arquivo de font com o arquivo base * aprimorando os comentários do arquivo font.scss * substituição de mixins por variaveis e implementação da importação das fontes no arquivo index * removedo os espaços em branco * devidas remoções feitas e aguardando resposta do Designer * import correto das fontes * corrigindo os nomes das variáveis * nomenclatura ajustada para camelCase

PiluVitu · 2024-02-07T21:58:20Z

src/home/components/SideMenu/index.scss

  &__logo-container {
+    display: none;


Porque desse none pae ?

Ele toggla o como o logo é exibido baseado no formato de visualização pra garantir uma centralização correta atravez dos formatos. Ta certinho

PiluVitu · 2024-02-07T22:00:22Z

src/home/components/SideMenu/index.scss

+    &__icons {
+      display: none;
+    }
+
+    &__exitmenu {
+      display: none;
+    }
+  }


Porque esse none ?

esses itens só são visíveis na side-menu na versão mobile, em resoluções superiores eles ficam no componente da navigation, por isso os display:none.

PiluVitu · 2024-02-07T22:01:26Z

src/styles/base.scss

@@ -1,5 +1,3 @@
-@use 'reset-css/sass/reset.scss';


Q ISSO PAE ????????????????????????????????

Alecell · 2024-02-05T22:12:11Z

package.json

Isso é pra testar no celular?

Alecell · 2024-02-06T02:29:36Z

src/home/components/SideMenu/index.scss

+
+

Remover espaços em branco

Alecell · 2024-02-06T02:29:50Z

src/home/components/SideMenu/index.scss

+    width: 100%;
+    padding: 0;
+    margin: 0;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: flex-start;
+    gap: 0.8rem;
+    list-style-type: none;


Seu stylelint ta funcionando?

Alecell · 2024-02-06T02:30:19Z

src/home/components/SideMenu/index.scss

+    }
+  }
+
+  &__itens ul li a{


nunca usar tag pura no css, em termos de manutenção isso da mais trabalho pra quem for mexer nisso. Coloque classes

Alecell · 2024-02-06T02:30:32Z

src/home/components/SideMenu/index.scss

+  .side-menu-content {
+    width: 70%;
+
+    &__itens a {


Não use tag diretamente

Alecell · 2024-02-08T11:45:32Z

package-lock.json

Usar pnpm pra instalar dependencias e remover o package-lock

Alecell · 2024-02-08T11:46:09Z

src/components/TextInput/index.js

+  'placeholder:changed',
+  'asset:changed',


Pensamos ontem, mudar o changed para o imperativo change

Alecell · 2024-02-08T11:47:25Z

src/home/components/SideMenu/index.scss

  &__logo-container {
+    display: none;


Ele toggla o como o logo é exibido baseado no formato de visualização pra garantir uma centralização correta atravez dos formatos. Ta certinho

Alecell · 2024-02-08T11:50:43Z

src/home/index.scss

  width: 100vw;
-  height: 100vh;
-
+  height: 100dvh;


Alecell · 2024-02-08T11:51:42Z

src/styles/fonts.scss

Esse arquivo veio de outro PR, ele não pode constar como adicionado por vc no seu PR, precisamos ajustar isso

JonasGz added 2 commits January 13, 2024 15:01

create breakpoints.scss

8a3f4fa

Revert "create breakpoints.scss"

9272ddd

This reverts commit 8a3f4fa.

PiluVitu requested changes Jan 31, 2024

View reviewed changes

Merge branch 'diogocaronte:main' into main

04fcef9

Alecell assigned JonasGz Feb 1, 2024

JonasGz and others added 9 commits February 7, 2024 18:27

chore: resolved conflicts

20764fb

fix: fix the logical to set placeholder, changed the name of the even…

1d799d6

…ts (#52) * fix: fix the logical to set placeholder, changed the name of the events * rename the events, fix style sizes, change methods names and functions, add togle method * identation * add EOF

Revert "Criei componente de upload de imagens (#54)" (#64)

684a687

This reverts commit 5ab2c9c.

Bug fix: fonts.scss

45d2771

Update index.scss

df57553

update

3599dae

PiluVitu requested changes Feb 7, 2024

View reviewed changes

Alecell requested changes Feb 8, 2024

View reviewed changes

JonasGz closed this by deleting the head repository Feb 9, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Issue 17 - Menu e itens #61

Issue 17 - Menu e itens #61

JonasGz commented Jan 31, 2024 •

edited

Loading

JonasGz commented Feb 5, 2024

PiluVitu Feb 7, 2024

Alecell Feb 8, 2024

PiluVitu Feb 7, 2024

JonasGz Feb 8, 2024 •

edited

Loading

PiluVitu Feb 7, 2024

Alecell Feb 5, 2024

Alecell Feb 6, 2024

Alecell Feb 6, 2024

Alecell Feb 6, 2024

Alecell Feb 6, 2024

Alecell Feb 8, 2024

Alecell Feb 8, 2024

Alecell Feb 8, 2024

Alecell Feb 8, 2024

Alecell Feb 8, 2024

Issue 17 - Menu e itens #61

Issue 17 - Menu e itens #61

Conversation

JonasGz commented Jan 31, 2024 • edited Loading

JonasGz commented Feb 5, 2024

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

JonasGz Feb 8, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

JonasGz commented Jan 31, 2024 •

edited

Loading

JonasGz Feb 8, 2024 •

edited

Loading