diff --git a/assets/css/aboutus.scss b/assets/css/aboutus.scss
index 9783bc22..2c1a6237 100644
--- a/assets/css/aboutus.scss
+++ b/assets/css/aboutus.scss
@@ -6,7 +6,7 @@
}
}
-.lighter-banner{
+.lighter-banner {
display: flex;
flex-direction: column;
text-align: center;
@@ -18,10 +18,10 @@
background-blend-mode: multiply;
.banner-img {
- z-index: -1;
- position: absolute;
- width: 100vw;
- height: 260px;
+ z-index: -1;
+ position: absolute;
+ width: 100vw;
+ height: 260px;
}
}
@@ -64,7 +64,7 @@
}
.know-content {
- width: 100vw;
+ width: 100vw;
padding: 0px 20px;
margin-top: 40px;
}
@@ -221,7 +221,7 @@
}
img {
- order: 2;
+ order: 2;
width: 100%;
}
@@ -251,4 +251,4 @@
height: 100%;
z-index: -1;
}
-}
\ No newline at end of file
+}
diff --git a/assets/css/app.scss b/assets/css/app.scss
index 1cf71721..5fc3167e 100644
--- a/assets/css/app.scss
+++ b/assets/css/app.scss
@@ -173,6 +173,7 @@ footer {
// Sem autenticação
@import "./pages/login.scss";
@import "./aboutus.scss";
+@import "./cooperativas.scss";
@import "./agenda.scss";
@import "./contact.scss";
diff --git a/assets/css/cooperativas.scss b/assets/css/cooperativas.scss
new file mode 100644
index 00000000..5ac07e4c
--- /dev/null
+++ b/assets/css/cooperativas.scss
@@ -0,0 +1,87 @@
+.cooperativas-wrapper {
+ @apply flex flex-col;
+
+ .cooperativas-container {
+ @apply flex flex-col;
+ gap: 5rem;
+ margin-bottom: 5rem;
+
+ .header {
+ @apply relative;
+
+ .header-content {
+ img {
+ width: 100%;
+ height: auto;
+ }
+
+ h2 {
+ @apply absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ text-align: center;
+ }
+ }
+ }
+
+ .block {
+ @apply flex flex-row;
+ gap: 3.5rem;
+ margin: 0 2.5rem 0 2.5rem;
+
+ .block-content {
+ @apply flex flex-col;
+ gap: 2.5rem;
+ width: 50%;
+ }
+
+ img {
+ width: 50%;
+ }
+ }
+ }
+}
+
+@media (max-width: 768px) {
+ .cooperativas-wrapper {
+ .cooperativas-container {
+ @apply flex flex-wrap;
+ gap: 4rem;
+
+ .header {
+ height: 16.25rem;
+
+ .header-content {
+ img {
+ height: 16.25rem;
+ object-fit: none;
+ }
+ }
+ }
+
+ .block {
+ @apply flex-wrap;
+ gap: 4rem;
+ margin: 0 1rem 0 1rem;
+
+ .block-content {
+ width: 100%;
+
+ h1 {
+ font-size: 2rem;
+ }
+ }
+
+ img {
+ width: 100%;
+ border-radius: 0.5rem;
+ }
+
+ &:nth-child(3) {
+ @apply flex flex-col-reverse;
+ }
+ }
+ }
+ }
+}
diff --git a/assets/css/get_in_touch.scss b/assets/css/get_in_touch.scss
index db6862b7..88c7e3bd 100644
--- a/assets/css/get_in_touch.scss
+++ b/assets/css/get_in_touch.scss
@@ -1,19 +1,25 @@
.onde-nos-encontrar-wrapper {
@apply flex bg-orange-100;
+ grid-area: onde-nos-encontrar;
flex-direction: column;
justify-content: center;
align-items: center;
+ text-align: center;
gap: 5rem;
- padding: 5rem;
+ padding: 5rem 0 5rem 0;
+ width: 100vw;
.redes-sociais-wrapper {
@apply flex;
flex-direction: column;
justify-content: center;
align-items: center;
+ text-align: center;
.redes-sociais-links-wrapper {
- @apply flex;
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+ gap: 2rem;
padding-top: 2.5rem;
.redes-sociais-link {
@@ -50,6 +56,7 @@
flex-direction: column;
justify-content: center;
align-items: center;
+ text-align: center;
gap: 2.5rem;
.contact-btn {
@@ -74,3 +81,56 @@
}
}
}
+
+@media (max-width: 767px) {
+ .onde-nos-encontrar-wrapper {
+ .redes-sociais-wrapper {
+ margin: 1rem;
+
+ .redes-sociais-links-wrapper {
+ @apply flex;
+
+ .redes-sociais-link {
+ padding: 0;
+
+ .redes-sociais-icon {
+ width: 60px;
+ height: 60px;
+ }
+ }
+ }
+ }
+ }
+}
+
+@media (min-width: 768px) {
+ .onde-nos-encontrar-wrapper {
+ .redes-sociais-wrapper {
+ .redes-sociais-links-wrapper {
+ /* 2 colunas em telas médias */
+ @apply grid;
+ grid-template-columns: repeat(2, 1fr);
+ grid-template-rows: auto;
+ column-gap: 80px;
+ min-height: auto;
+ margin-top: 2.5rem;
+ }
+ }
+ }
+}
+
+@media (min-width: 1024px) {
+ .onde-nos-encontrar-wrapper {
+ .redes-sociais-wrapper {
+ .redes-sociais-links-wrapper {
+ /* 3 colunas em telas grandes */
+ @apply grid;
+ grid-template-columns: repeat(3, 1fr);
+ grid-template-rows: auto;
+ column-gap: 80px;
+ min-height: auto;
+ margin-top: 2.5rem;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/assets/css/landing.scss b/assets/css/landing.scss
index b4bdb2ab..f62dff1e 100644
--- a/assets/css/landing.scss
+++ b/assets/css/landing.scss
@@ -1,121 +1,394 @@
.landing-grid {
- overflow: scroll;
- overflow-x: hidden;
display: grid;
+ /* Ajuste automático das colunas */
+ grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
grid-template-areas:
- "top-banner"
- "glide"
- "links"
- "about"
+ "landing-carousel"
+ "landing-links"
+ "project"
"news"
- "bottom-banner";
-}
-
-.top-banner {
- @apply w-full;
+ "gallery-carousel"
+ "onde-nos-encontrar";
width: 100%;
- min-height: 25rem;
- grid-area: top-banner;
-}
+ gap: 5rem;
+ overflow: scroll;
+ overflow-x: hidden;
-.land-carousel {
- margin-bottom: 70px;
+ .landing-carousel {
+ grid-area: landing-carousel;
+ grid-column: 1 / -1;
- .glide1 {
- max-width: 100vw;
- max-height: 600px;
- }
+ .glide__slide {
+ max-width: 100%;
+ height: 100%;
- .glide__slide {
- max-width: 100%;
- height: 100%;
+ img {
+ width: 100%;
+ height: 100%;
+ background-size: cover;
+ }
+ }
- img {
- width: 100%;
- height: 100%;
- max-width: 1100px;
- max-height: 600px;
- background-size: cover;
- margin: 0 auto;
+ .glide__bullets {
+ display: flex;
+ justify-content: center;
+ margin-top: 40px;
+ margin-bottom: 40px;
+ }
+
+ .glide__bullet {
+ @apply bg-black-10;
+ height: 10px;
+ width: 10px;
+ border-radius: 50%;
+ margin: 0 5px;
+ }
+
+ .glide__bullet.active {
+ @apply bg-blue-80;
}
}
- .glide__bullets {
- display: flex;
- justify-content: center;
- margin-top: 40px;
+ .landing-links {
+ @apply flex flex-wrap justify-center;
+ grid-area: landing-links;
+ width: 100%;
+ gap: 1rem;
+
+ .links-item {
+ @apply flex flex-col justify-start items-start bg-blue-100;
+ width: 13.333rem;
+ height: 6.5rem;
+ padding: 1.5rem;
+ border-radius: 0.5rem;
+
+ a {
+ @apply flex flex-col;
+ gap: 1rem;
+ }
+
+ img {
+ @apply hidden;
+ }
+
+ h3 {
+ font-size: 1.5rem;
+ font-style: normal;
+ font-weight: 700;
+ line-height: 1.75rem;
+ }
+
+ button {
+ @apply flex;
+ margin: 0;
+ padding: 0;
+ gap: 0.5rem;
+ background-color: transparent;
+
+ p {
+ @apply text-white-100;
+ font-size: 1rem;
+ font-style: normal;
+ font-weight: 500;
+ line-height: 1.125rem;
+ }
+ }
+ }
+
+ @media (max-width: 768px) {
+ padding: 1rem 1rem;
+
+ .links-item {
+ position: relative;
+ width: 100%;
+ box-sizing: border-box;
+ background: linear-gradient(180deg, rgba(16, 16, 16, 0) 0%, #101010 100%);
+
+ img {
+ @apply block absolute;
+ width: inherit;
+ height: inherit;
+ border-radius: 0.5rem;
+ object-fit: cover;
+
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+
+ z-index: -10;
+ }
+ }
+ }
}
- .glide__bullet {
- @apply bg-black-10;
- height: 10px;
- width: 10px;
- border-radius: 50%;
- margin: 0 5px;
+ .project {
+ @apply flex justify-between;
+ grid-area: project;
+ /* width: 100%; */
+ padding: 0 2.5rem;
+
+ .project-content {
+ @apply flex flex-col;
+ gap: 0.94rem;
+ width: 50%;
+
+ p {
+ font-size: 0.75rem;
+ font-style: normal;
+ font-weight: 700;
+ line-height: 1.125rem;
+ color: #9f9f9f;
+ }
+
+ .project-body {
+ @apply flex flex-col;
+ gap: 2.5rem;
+ width: 90%;
+
+ a button {
+ @apply flex;
+ height: 3rem;
+ padding: 1rem 1.5rem;
+ justify-content: center;
+ align-items: center;
+ gap: 0.5rem;
+
+ p {
+ @apply text-white-100;
+ font-size: 1rem;
+ font-weight: 500;
+ }
+ }
+ }
+ }
+
+ img {
+ width: 50%;
+ border-radius: 0.5rem;
+ }
+
+ @media (max-width: 768px) {
+ @apply flex flex-col-reverse;
+ padding: 0 1rem;
+
+ .project-content {
+ width: 100%;
+
+ .project-body {
+ width: 100%;
+
+ a button {
+ width: 100%;
+ }
+ }
+ }
+
+ img {
+ width: 100%;
+ margin-bottom: 2.5rem;
+ }
+ }
}
- .glide__bullet.active {
- @apply bg-blue-80;
+ .news {
+ grid-area: news;
+
+ h2 {
+ display: flex;
+ justify-content: center;
+ margin-top: 40px;
+ margin-bottom: 5rem;
+ }
+
+ .news-cards {
+ @apply flex flex-wrap justify-center md:mt-10;
+
+ .news-item {
+ @apply flex flex-col max-w-sm;
+ border-radius: 0.5rem;
+ border: 1px solid #66a2de;
+ margin: 0 2.5rem 2.5rem 2.5rem;
+ width: 20.125rem;
+
+ img {
+ border-radius: 0.5rem 0.5rem 0 0;
+ width: 100%;
+ min-height: 242px;
+ max-height: 242px;
+ }
+
+ h2 {
+ display: flex;
+ justify-content: center;
+ }
+ }
+ }
}
-}
-.bottom-banner {
- @apply w-full;
+ .gallery-carousel {
+ grid-area: gallery-carousel;
+ grid-column: 1 / -1;
- height: 30rem;
- grid-area: bottom-banner;
-}
+ h2 {
+ display: flex;
+ justify-content: center;
+ margin-bottom: 2.5rem;
+ }
-.links-landing {
- @apply flex flex-wrap justify-center;
+ .glide__slides {
+ @apply flex justify-center items-center;
+ margin: 0;
+ padding: 0;
+ list-style: none;
- .links-item {
- @apply flex flex-col justify-start items-start m-8;
- width: 20.125rem;
- height: 20.875rem;
- border-radius: 8px;
- box-sizing: border-box;
- background: linear-gradient(180deg, rgba(16, 16, 16, 0) 0%, #101010 100%);
+ .glide__slide {
+ @apply flex justify-center items-center;
+ max-width: 41.75rem;
+ height: auto;
+ transition: transform 0.25s ease-out;
- a {
- @apply flex flex-col mt-auto;
+ &:not(.glide__slide--active) {
+ max-width: 33.125rem;
+ }
+
+ img {
+ width: 100%;
+ height: auto;
+ border-radius: 8px;
+ object-fit: cover;
+ max-width: 100%;
+ max-height: 100%;
+ }
+ }
}
- img {
- @apply absolute;
- z-index: -10;
- height: inherit;
- width: inherit;
+ .glide__progress {
+ max-width: 660px;
+ margin: 56px auto 0;
+ height: 4px;
+ background-color: #ddd;
+ border-radius: 2px;
}
- h3 {
- padding-left: 1rem;
+ .glide__progress-bar {
+ @apply bg-blue-80;
+ height: 4px;
+ width: 0;
+ border-radius: 2px;
}
+ }
+}
+
- p {
- text-wrap: wrap;
- margin-top: 0.5rem;
- padding: 0 1rem 1.5rem 1rem;
+@media (max-width: 768px) {
+ .landing-grid {
+ .news {
+ .news-cards {
+ @apply flex-nowrap;
+ overflow-x: auto;
+ scroll-snap-type: x mandatory;
+
+ .news-item {
+ margin: 0 1.5rem 0 0;
+ scroll-snap-align: start;
+ }
+ }
}
- button {
- width: 100%;
- padding: 0 1rem 1.5rem 0;
- background-color: transparent;
+ .gallery-carousel {
+ .glide__slide {
+ max-width: 100%;
+ width: 80%;
+ height: auto;
- p {
- display: inline-flex;
- width: inherit;
+ transition: transform 0.3s ease, width 0.3s ease;
+ transform: scale(0.8);
+ border-radius: 8px;
+ overflow: hidden;
- &:hover {
- text-decoration: underline;
+ img {
+ width: 100%;
+ height: 100%;
+ background-size: cover;
+ border-radius: 8px;
}
}
+
+ .glide__slide--active {
+ width: 100%;
+ transform: scale(1.2);
+ z-index: 2;
+ border-radius: 16px;
+ }
+
+ .glide__bullets {
+ display: flex;
+ justify-content: center;
+ margin-top: 40px;
+ margin-bottom: 40px;
+ }
+
+ .glide__bullet {
+ @apply bg-black-10;
+ height: 10px;
+ width: 10px;
+ border-radius: 50%;
+ margin: 0 5px;
+ }
+
+ .glide__bullet.active {
+ @apply bg-blue-80;
+ }
}
}
}
+@media (min-width: 768px) {
+ .landing-grid {
+ /* 2 colunas em telas médias */
+ grid-template-columns: repeat(2, 1fr);
+ grid-template-areas:
+ "landing-carousel landing-carousel"
+ "landing-links landing-links"
+ "project project"
+ "news news"
+ "gallery-carousel gallery-carousel"
+ "onde-nos-encontrar onde-nos-encontrar";
+ }
+}
+
+@media (min-width: 1024px) {
+ .landing-grid {
+ /* 3 colunas em telas grandes */
+ grid-template-columns: repeat(3, 1fr);
+ grid-template-areas:
+ "landing-carousel landing-carousel landing-carousel"
+ "landing-links landing-links landing-links"
+ "project project project"
+ "news news news"
+ "gallery-carousel gallery-carousel gallery-carousel"
+ "onde-nos-encontrar onde-nos-encontrar onde-nos-encontrar";
+ }
+}
+
+.top-banner {
+ @apply w-full;
+
+ width: 100%;
+ min-height: 25rem;
+ grid-area: top-banner;
+}
+
+
+.bottom-banner {
+ @apply w-full;
+
+ height: 30rem;
+ grid-area: bottom-banner;
+}
+
.about {
@apply flex justify-center;
padding: 2rem;
@@ -144,7 +417,6 @@
display: flex;
flex-direction: column;
align-items: center;
- width: 100%;
.publications-main-text {
margin: 5rem 30rem;
@@ -179,42 +451,6 @@
}
}
-.news {
- h2 {
- display: flex;
- justify-content: center;
- margin-bottom: 5rem;
- }
-
- .news-cards {
- @apply flex flex-wrap justify-center md:mt-10;
-
- .news-item {
- @apply max-w-sm;
- border-radius: 0.5rem;
- border: 1px solid #66a2de;
- margin: 0 2.5rem 2.5rem 2.5rem;
- width: 20.125rem;
-
- img {
- border-radius: 0.5rem 0.5rem 0 0;
- width: 100%;
- min-height: 242px;
- max-height: 242px;
- }
-
- h2 {
- display: flex;
- justify-content: center;
- }
-
- button {
- margin-top: 1rem;
- }
- }
- }
-}
-
.input-space {
display: flex;
@@ -225,56 +461,6 @@
}
}
-.gallery-carousel {
- padding: 56px 0;
-
- h2 {
- display: flex;
- justify-content: center;
- margin-bottom: 2.5rem;
- }
-
- .glide2 {
- max-width: 100vw;
- max-height: 500px;
- }
-
- .glide__slides {
- margin: 0;
- padding: 0;
- list-style: none;
- }
-
- .glide__slide {
- @apply flex justify-center items-center;
- width: 670px !important;
- height: 380px;
- transition: transform 0.25s ease-out;
- }
-
- .glide__slide img {
- height: 100%;
- width: 100%;
- border-radius: 8px;
- object-fit: cover;
- }
-
- .glide__progress {
- max-width: 660px;
- margin: 56px auto 0;
- height: 4px;
- background-color: #ddd;
- border-radius: 2px;
- }
-
- .glide__progress-bar {
- @apply bg-blue-80;
- height: 4px;
- width: 0;
- border-radius: 2px;
- }
-}
-
.equipes-wrapper {
@apply flex;
flex-direction: column;
@@ -496,114 +682,4 @@
.nossas-equipes-container {
width: 1360px;
}
-}
-
-@media (min-width: 530px) and (max-width: 770px){
- .links-landing {
- @apply flex flex-col justify-center items-center ;
- width: 100%;
-
- .links-item {
- @apply flex flex-col justify-start items-start m-8;
- width: 60%;
- height: 16rem;
- border-radius: 8px;
- box-sizing: border-box;
- background: linear-gradient(180deg, rgba(16, 16, 16, 0) 0%, #101010 100%);
-
- a {
- @apply flex flex-col mt-auto;
- }
-
- img {
- border-radius: 8px;
- width: inherit;
- height: inherit;
- @apply absolute;
- z-index: -10;
- }
-
- h3 {
- padding-left: 1rem;
- }
-
- p {
- text-wrap: wrap;
- margin-top: 0.5rem;
- padding: 0 1rem 1.5rem 1rem;
- }
-
- button {
- width: 100%;
- padding: 0 1rem 1.5rem 0;
- background-color: transparent;
-
- p {
- display: inline-flex;
- width: inherit;
-
- &:hover {
- text-decoration: underline;
- }
- }
- }
- }
- }
-
-}
-
-@media (min-width: 350px) and (max-width: 529px){
-
-
-
- .links-landing {
- @apply flex flex-col justify-center items-center;
- width: 100%;
-
- .links-item {
- @apply flex flex-col justify-start items-start m-8;
- width: 70%;
- height: 13rem;
- border-radius: 8px;
- box-sizing: border-box;
- background: linear-gradient(180deg, rgba(16, 16, 16, 0) 0%, #101010 100%);
-
- a {
- @apply flex flex-col mt-auto;
- }
-
- img {
- border-radius: 8px;
- width: inherit;
- height: inherit;
- @apply absolute;
- z-index: -10;
- }
-
- h3 {
- padding-left: 1rem;
- }
-
- p {
- text-wrap: wrap;
- margin-top: 0.5rem;
- padding: 0 1rem 1.5rem 1rem;
- }
-
- button {
- width: 100%;
- padding: 0 1rem 1.5rem 0;
- background-color: transparent;
-
- p {
- display: inline-flex;
- width: inherit;
-
- &:hover {
- text-decoration: underline;
- }
- }
- }
- }
- }
-}
+}
\ No newline at end of file
diff --git a/assets/css/navbar.scss b/assets/css/navbar.scss
index e7c52a40..6cb12eb3 100644
--- a/assets/css/navbar.scss
+++ b/assets/css/navbar.scss
@@ -4,7 +4,11 @@
height: 98px;
.logo {
- margin: 24px 0px 24px 100px;
+ margin: 1.5rem 0 1.5rem 6.25rem;
+
+ @media screen and (max-width: 768px) {
+ margin: 1.5rem 1.5rem;
+ }
}
.login-button {
@@ -13,7 +17,7 @@
}
.nav-menu {
- @apply flex justify-between items-center;
+ @apply justify-between items-center;
gap: 3rem;
margin: 21px 0;
@@ -37,6 +41,40 @@
}
}
}
+
+ .hamburger-button {
+ @apply md:hidden;
+ margin: 1.5rem;
+ }
+}
+
+#navbar {
+ @apply relative;
+ z-index: 20;
+
+ .hamburger-container {
+ @apply absolute bg-white-100;
+ margin-top: 8px;
+ padding: 24px 24px;
+ top: calc(100% + 8px);
+ left: 0;
+ width: 100%;
+ z-index: 10;
+ box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
+
+ transform: translateY(-20px);
+ transition: opacity 0.3s ease, transform 0.3s ease;
+
+ .nav-menu {
+ @apply flex;
+ flex-direction: column;
+ gap: 32px;
+ }
+
+ a button {
+ margin-top: 16px;
+ }
+ }
}
.arrow-open,
@@ -166,4 +204,4 @@
width: 12.25rem;
height: 3.8rem;
}
-}
+}
\ No newline at end of file
diff --git a/assets/js/app.js b/assets/js/app.js
index ce48ec1e..1a368306 100644
--- a/assets/js/app.js
+++ b/assets/js/app.js
@@ -35,9 +35,9 @@ document.querySelectorAll(`[data-component="navbar-dropdown"]`).forEach(el => {
dropdown.addEventListener("mouseleave", e => hide());
});
-window.addEventListener("phx:js-exec", ({detail}) => {
+window.addEventListener("phx:js-exec", ({ detail }) => {
document.querySelectorAll(detail.to).forEach(el => {
- liveSocket.execJS(el, el.getAttribute(detail.attr))
+ liveSocket.execJS(el, el.getAttribute(detail.attr))
})
})
diff --git a/assets/js/glide.js b/assets/js/glide.js
index 54760430..c24796ab 100644
--- a/assets/js/glide.js
+++ b/assets/js/glide.js
@@ -3,15 +3,15 @@ import Glide from "@glidejs/glide/dist/glide.esm";
const glide1 = new Glide('.glide1', {
type: 'slider',
gap: 20,
- perview: 1,
- autoplay: 35 * 10 * 10,
+ perView: 1,
+ autoplay: 3500,
hoverpause: true,
- animationDuration: 15 * 100,
+ animationDuration: 1500,
direction: 'ltr'
});
-glide1.on('run', function () {
- const bullets = document.querySelectorAll('.glide__bullet');
+glide1.on('run', function() {
+ const bullets = document.querySelectorAll('.glide1 .glide__bullet');
bullets.forEach((bullet, index) => {
if (index === glide1.index) {
bullet.classList.add('active');
@@ -21,7 +21,6 @@ glide1.on('run', function () {
});
});
-
const glide2 = new Glide('.glide2', {
type: 'carousel',
autoplay: 5000,
@@ -31,6 +30,17 @@ const glide2 = new Glide('.glide2', {
peek: 107
});
+glide2.on('run', function() {
+ const bullets = document.querySelectorAll('.glide2 .glide__bullet');
+ bullets.forEach((bullet, index) => {
+ if (index === glide2.index) {
+ bullet.classList.add('active');
+ } else {
+ bullet.classList.remove('active');
+ }
+ });
+});
+
if (window.location.pathname === '/') {
glide1.mount();
glide2.mount();
diff --git a/assets/package-lock.json b/assets/package-lock.json
index c12b5e66..b187a0d3 100644
--- a/assets/package-lock.json
+++ b/assets/package-lock.json
@@ -22,7 +22,7 @@
"phoenix_live_view": "file:../deps/phoenix_live_view",
"postcss": "^8.4.38",
"tailwindcss": "^3.4.3",
- "topbar": "^1.0.1"
+ "topbar": "^3.0.0"
}
},
"../deps/phoenix": {
@@ -644,19 +644,6 @@
"url": "https://github.com/sponsors/rawify"
}
},
- "node_modules/fsevents": {
- "version": "2.3.3",
- "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
- "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
- "hasInstallScript": true,
- "optional": true,
- "os": [
- "darwin"
- ],
- "engines": {
- "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
- }
- },
"node_modules/function-bind": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
@@ -879,7 +866,6 @@
"version": "4.0.8",
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
"integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
- "license": "MIT",
"dependencies": {
"braces": "^3.0.3",
"picomatch": "^2.3.1"
@@ -1710,9 +1696,9 @@
}
},
"node_modules/topbar": {
- "version": "1.0.1",
- "resolved": "https://registry.npmjs.org/topbar/-/topbar-1.0.1.tgz",
- "integrity": "sha512-HZqQSMBiG29vcjOrqKCM9iGY/h69G5gQH7ae83ZCPz5uPmbQKwK0sMEqzVDBiu64tWHJ+kk9NApECrF+FAAvRA=="
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/topbar/-/topbar-3.0.0.tgz",
+ "integrity": "sha512-mhczD7KfYi1anfoMPKRdl0wPSWiYc0YOK4KyycYs3EaNT15pVVNDG5CtfgZcEBWIPJEdfR7r8K4hTXDD2ECBVQ=="
},
"node_modules/ts-interface-checker": {
"version": "0.1.13",
diff --git a/assets/package.json b/assets/package.json
index b24ea46e..4717719b 100644
--- a/assets/package.json
+++ b/assets/package.json
@@ -20,6 +20,6 @@
"phoenix_live_view": "file:../deps/phoenix_live_view",
"postcss": "^8.4.38",
"tailwindcss": "^3.4.3",
- "topbar": "^1.0.1"
+ "topbar": "^3.0.0"
}
}
diff --git a/flake.nix b/flake.nix
index 1de4fa79..b38d28de 100644
--- a/flake.nix
+++ b/flake.nix
@@ -31,7 +31,7 @@
mkShell {
name = "peapescarte";
packages = with pkgs;
- [beam.elixir_1_16 nodejs supabase-cli ghostscript zlib postgresql flyctl]
+ [beam.elixir_1_16 nodejs supabase-cli ghostscript zlib postgresql flyctl pass]
++ lib.optional stdenv.isLinux [inotify-tools chromium]
++ lib.optional stdenv.isDarwin [
darwin.apple_sdk.frameworks.CoreServices
diff --git a/lib/pescarte_web/design_system/navbar.ex b/lib/pescarte_web/design_system/navbar.ex
index ce088631..5de8b23d 100644
--- a/lib/pescarte_web/design_system/navbar.ex
+++ b/lib/pescarte_web/design_system/navbar.ex
@@ -13,24 +13,76 @@ defmodule PescarteWeb.DesignSystem.Navbar do
-
-
- <.button style="primary" class="login-button">
-
- <.text size="base" color="text-white-100">Acessar
-
-
+
+ <.menu />
+
+ <.hamburger_button />
+ <.hamburger_menu />
"""
end
+ defp hamburger_button(assigns) do
+ ~H"""
+
+ <.button
+ style="link"
+ click={JS.toggle(to: "#hamburger-container", in: "fade-in-scale", out: "fade-out-scale")}
+ >
+ <.icon name={:menu} class="text-blue-100" />
+
+
+ """
+ end
+
+ attr(:current_path, :string, default: "/")
+
+ defp menu(assigns) do
+ ~H"""
+
+
+
+ <.button style="primary" class="login-button">
+ <.icon name={:log_in} class="text-white-100" />
+ <.text size="base" color="text-white-100">Acessar
+
+
+ """
+ end
+
+ attr(:current_path, :string, default: "/")
+
+ defp hamburger_menu(assigns) do
+ ~H"""
+
+
+
+
+ <.button style="link" class="login-button">
+ <.text size="h4" color="text-orange-100">Acessar
+
+
+
+ """
+ end
+
+ attr(:current_path, :string, default: "/")
+
+ defp links(assigns) do
+ ~H"""
+ <.navlink label="Sobre" navigate={~p"/sobre"} current_path={@current_path} />
+ <.navlink label="Equipes" navigate={~p"/equipes"} current_path={@current_path} />
+ <.navlink label="Sedes" navigate={~p"/sedes"} current_path={@current_path} />
+ <.navlink label="Cooperativas" navigate={~p"/cooperativas"} current_path={@current_path} />
+ <.navlink label="Contato" navigate={~p"/contato"} current_path={@current_path} />
+ """
+ end
+
attr(:label, :string, required: true)
attr(:navigate, :string, default: "/")
attr(:current_path, :string, default: "/")
diff --git a/lib/pescarte_web/router.ex b/lib/pescarte_web/router.ex
index e926d28b..1cefe2b2 100644
--- a/lib/pescarte_web/router.ex
+++ b/lib/pescarte_web/router.ex
@@ -39,7 +39,7 @@ defmodule PescarteWeb.Router do
get "/censo", CensoController, :show
get "/confirmar", TokenController, :confirm
get "/noticias", NoticiasController, :show
- get "/pgtrs", PGTRController, :show
+ get "/pgtr", PGTRController, :show
get "/sedes", SedesController, :show
get "/aplicativos", AplicativosController, :show
diff --git a/lib/pescarte_web/templates/cooperativas_html/show.html.heex b/lib/pescarte_web/templates/cooperativas_html/show.html.heex
index c8b5166b..a02a72ec 100644
--- a/lib/pescarte_web/templates/cooperativas_html/show.html.heex
+++ b/lib/pescarte_web/templates/cooperativas_html/show.html.heex
@@ -1,58 +1,67 @@
-
+
<.flash :if={@error_message} id="login-error" kind={:error}>
<%= @error_message %>
-
-
-
- <.text size="h1" color="text-blue-100">
- O Laço Entre Cooperativas e Pescarte
+
+
+
+
+
+
+ <.text size="h1" color="text-blue-100">
+ O Laço Entre Cooperativas e Pescarte
+
+
+ <.text size="lg" color="text-black-80">
+ Junto às comunidades de pesca artesanal, o PEA Pescarte promove ações colaborativas e democráticas pautadas na economia solidária e no cooperativismo, para a construção de Projetos de Geração de Trabalho e Renda (PGTR’s), que são empreendimentos socioeconômicos, ambientalmente responsáveis para a atuação de pessoas pescadoras e suas famílias em 10 municípios da Bacia de Campos.
+
+
+ Os Projetos de Geração de Trabalho e Renda (PGTR's) foram iniciados na segunda fase do projeto Pescarte e resultam na materialização para os Estudos de Viabilidade Técnica, Econômica, Ambiental e Social (EVTEAS) de seis tipos de empreendimentos, previstos para serem implantados de acordo com o Plano de Trabalho do projeto e a particularidade de cada comunidade de pesca.
-
- <.text size="lg" color="text-black-80">
- Junto às comunidades de pesca artesanal, o PEA Pescarte promove ações colaborativas e democráticas pautadas na economia solidária e no cooperativismo, para a construção de Projetos de Geração de Trabalho e Renda (PGTR’s), que são empreendimentos socioeconômicos, ambientalmente responsáveis para a atuação de pessoas pescadoras e suas famílias em 10 municípios da Bacia de Campos.
-
-
- Os Projetos de Geração de Trabalho e Renda (PGTR's) foram iniciados na segunda fase do projeto Pescarte e resultam na materialização para os Estudos de Viabilidade Técnica, Econômica, Ambiental e Social (EVTEAS) de seis tipos de empreendimentos, previstos para serem implantados de acordo com o Plano de Trabalho do projeto e a particularidade de cada comunidade de pesca.
-
- <.text size="lg" color="text-blue-100">
-
- Visite também Organização das Cooperativas do Brasil (OCB)
-
-
-
-
-
+ <.text size="lg" color="text-blue-100">
+
+ Visite também Organização das Cooperativas do Brasil (OCB)
+
+
+
+
+
-
-
-
-
- <.text size="h1" color="text-blue-100">
- Estudo de Viabilidade Técnica, Econômica, Ambiental e Social
+
+
+
+
+ <.text size="h1" color="text-blue-100">
+ Estudo de Viabilidade Técnica, Econômica, Ambiental e Social
+
+
+ <.text size="lg" color="text-black-80">
+ O EVTEAS busca identificar as vantagens e desvantagens dos PGTR’s que serão implantados pelo Pescarte. Cada foco do estudo busca investigar aspectos específicos:
+
+ - Técnico: se o projeto tem suporte técnico para existir;
+ -
+ Econômico:
+ como o projeto pode render o suficiente para pagar seus custos e gerar lucro para dividir entre as pessoas trabalhadoras.
+
+ -
+ Ambiental:
+ possibilidades e alternativas para criar um empreendimento que gere nenhuma poluição ou dano ao meio ambiente.
+
+ -
+ Social:
+ se os projetos têm um número suficiente de pessoas interessadas em criar e manter um PGTR. Assim, a junção de todos estes termos avalia se o empreendimento pode ou não ser implantando.
+
+
-
- <.text size="lg" color="text-black-80">
- O EVTEAS busca identificar as vantagens e desvantagens dos PGTR’s que serão implantados pelo Pescarte. Cada foco do estudo busca investigar aspectos específicos:
-
- - Técnico: se o projeto tem suporte técnico para existir;
- -
- Econômico:
- como o projeto pode render o suficiente para pagar seus custos e gerar lucro para dividir entre as pessoas trabalhadoras.
-
- -
- Ambiental:
- possibilidades e alternativas para criar um empreendimento que gere nenhuma poluição ou dano ao meio ambiente.
-
- -
- Social:
- se os projetos têm um número suficiente de pessoas interessadas em criar e manter um PGTR. Assim, a junção de todos estes termos avalia se o empreendimento pode ou não ser implantando.
-
-
-
-
+
+
diff --git a/lib/pescarte_web/templates/landing_html/show.html.heex b/lib/pescarte_web/templates/landing_html/show.html.heex
index 1f6e0ce8..84d7558d 100644
--- a/lib/pescarte_web/templates/landing_html/show.html.heex
+++ b/lib/pescarte_web/templates/landing_html/show.html.heex
@@ -2,8 +2,8 @@
<.flash :if={@error_message} id="login-error" kind={:error}>
<%= @error_message %>
-
-
+
+
-
-
+
+
-
- <.text size="h3" color="text-white-100">Notícias
- <.text size="base" color="text-white-100">
- Notícias do Projeto
-
- <.button style="primary">
+ <.text size="h3" color="text-white-100">Notícias
+
+ <.button style="link">
Saiba mais
-
+ <.text size="h3" color="text-white-100">Publicações
- <.text size="h3" color="text-white-100">Publicações
- <.text size="base" color="text-white-100">
- Publicações do PEA.
-
- <.button style="primary">
+ <.button style="link">
Saiba mais
-
+ <.text size="h3" color="text-white-100">Agenda
- <.text size="h3" color="text-white-100">Relatórios Públicos
- <.text size="base" color="text-white-100">
- Agenda mensal
-
- <.button style="primary">
+ <.button style="link">
Saiba mais
-
- <.text size="h3" color="text-white-100">CENSO
- <.text size="base" color="text-white-100">
- Dados do Censo
-
- <.button style="primary">
+ <.text size="h3" color="text-white-100">Censo
+
+ <.button style="link">
Saiba mais
-
- <.text size="h3" color="text-white-100">PGTR's
- <.text size="base" color="text-white-100">
- Empreendimentos por Munícipios.
-
- <.button style="primary">
+ <.text size="h3" color="text-white-100">PGTR
+
+ <.button style="link">
Saiba mais
-
+ <.text size="h3" color="text-white-100">Aplicações
- <.text size="h3" color="text-white-100">Aplicações
- <.text size="base" color="text-white-100">
- Aplicações do projeto
-
- <.button style="primary">
+ <.button style="link">
Saiba mais
-
-
-
- <.text size="sm" color="text-black-40">O PROJETO
- <.text size="h1" color="text-blue-100">
- O que o Pescarte oferece para a comunidade?
+
+
+
+ <.text size="sm" color="text-black-40">O PROJETO
+
+ <.text size="h2" color="text-blue-100">O que o Pescarte oferece para a comunidade?
+ <.text size="h4" color="text-blue-100">
+ O Projeto PESCARTE tem como sua principal finalidade a criação de uma rede social regional
+ integrada por pescadores artesanais e por seus familiares, buscando, por meio de processos educativos,
+ promover, fortalecer e aperfeiçoar a sua organização comunitária e a sua qualificação profissional,
+ bem como o seu envolvimento na construção participativa e na implementação de projetos de geração de
+ trabalho e renda.
-
- <.text size="lg" color="text-black-80">
- O Projeto PESCARTE tem como sua principal finalidade a criação de uma
- rede social regional integrada por pescadores artesanais e por seus
- familiares, buscando, por meio de processos educativos, promover,
- fortalecer e aperfeiçoar a sua organização comunitária e a sua
- qualificação profissional, bem como o seu envolvimento na construção
- participativa e na implementação de projetos de geração de trabalho e
- renda.
-
-
- <.button style="primary" click="hello">
- <.text size="base" color="text-white-100">Ver mais
-
-
-
-
+
+ <.button style="primary">
+ Ver mais
+
+
+
+
+
+
<.text size="h2" color="text-blue-100">Notícias
@@ -286,10 +264,9 @@
-
+
<.text size="h2" color="text-blue-100">Galeria Pescarte
-
diff --git a/priv/static/images/landing/cooperativas/banner.webp b/priv/static/images/landing/cooperativas/banner.webp
new file mode 100644
index 00000000..02ae7f5d
Binary files /dev/null and b/priv/static/images/landing/cooperativas/banner.webp differ