fabsoftwareitp / fabsoftware.itp.ifsp.edu.br

3 stars 0 forks source link

Criar um slider para a página de projetos do site da Fábrica #15

Closed danilocbueno closed 3 months ago

danilocbueno commented 1 year ago

Recentemente o Rafael fez um padronização das imagens porém a exibição não ficou interessante. Você pode conferir como está através do link: https://fabsoftware.itp.ifsp.edu.br/projetos/

Transformar essa exibição das imagens em um componente de slider para que possa ser melhor trabalhado a exibição. Para criação desse componente será necessário utilizar um componente via greenwood.js.

Então será necessário ler a documentação sobre como criar um componente no greenwood. A documentação está disponível nesse link: https://www.greenwoodjs.io/getting-started/branding/. Também um pouco de JavaScript e ainda como construir um slider.

Primeiro aprenda como construir um componente comum e depois tente criar um slider bem simples. Pode usar essa referência: https://www.w3schools.com/howto/howto_js_slideshow.asp

Depois de terminado, tente fazer a integração com esse aqui: https://swiperjs.com/ parece um bom exemplo que pode ser utilizado para realizar a integração.

Documente o processo em nosso site.

Leo2828 commented 3 months ago

Dado a transição da framework do site da fábrica (Greewood para Astro), os projetos foram divididos em diversos arquivos Markdown e devido a isso, foi criado um layout para esses arquivos. Para os projetos que possuem mais de uma imagem, um slider foi feito de uma forma bem simples, usando o tutorial apresentado no site: https://www.w3schools.com/howto/howto_js_slideshow.asp.