-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
correcao na barra de progresso form, animacao oppening
- Loading branch information
Showing
19 changed files
with
417 additions
and
286 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -129,7 +129,7 @@ | |
| } | ||
| ], | ||
| "text": "Teste", | ||
| "name": "Teste" | ||
| "name": "radio" | ||
| }, | ||
| "title": "Teste", | ||
| "text": "Teste", | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,95 @@ | ||
| import Script, { type Props } from "./script.tsx"; | ||
|
|
||
| export interface Open { | ||
| /** | ||
| * @title Título | ||
| * @description Escreva aqui o título da abertura | ||
| */ | ||
| title?: string; | ||
| /** | ||
| * @title Palavra ou Frase com Cor | ||
| * @description Escreva a palavra ou frase com cor | ||
| */ | ||
| highlight?: string; | ||
| /** | ||
| * @title Subtítulo | ||
| * @description Escreva aqui o subtítulo da abertura | ||
| */ | ||
| subtitleDescription?: string; | ||
| } | ||
|
|
||
| /** | ||
| * @title {{{title}}} | ||
| */ | ||
| export interface Props { | ||
| /** | ||
| * @title Título do Bloco | ||
| * @description Escreva aqui o título do bloco | ||
| */ | ||
| title?: string; | ||
| /** | ||
| * @title Títulos de Abertura | ||
| * @description Lista de títulos de abertura com suas propriedades | ||
| */ | ||
| open?: Open[]; | ||
| } | ||
|
|
||
| export default function Section({ | ||
| title = "", | ||
| open = [], | ||
| }: Props) { | ||
| const getHighlightedText = (text: string, highlight?: string) => { | ||
| if (!highlight) return text; | ||
|
|
||
| const parts = text.split(new RegExp(`(${highlight})`, "gi")); | ||
| return parts.map((part, index) => | ||
| part.toLowerCase() === highlight.toLowerCase() | ||
| ? ( | ||
| <span key={index} className="text-accent"> | ||
| {part} | ||
| </span> | ||
| ) | ||
| : part | ||
| ); | ||
| }; | ||
|
|
||
| return ( | ||
| <> | ||
| <div className="bg-sacramentoState h-[80vh] flex"> | ||
| <div className="ml-4 md:ml-10 w-full flex flex-col items-start justify-center"> | ||
| {open.map((item, index) => ( | ||
| <div | ||
| key={index} | ||
| data-slide={String(index)} | ||
| className={`pt-[10px] md:pt-[21px] w-full | ||
| ${ | ||
| index === 0 | ||
| ? "block slide-in-left" | ||
| : "slide-in-left hidden" | ||
| } | ||
| transition-all duration-800 ease-out`} | ||
| > | ||
| <div className="grid gap-y-[14px]"> | ||
| {item.title && ( | ||
| <div className="max-w-[320px] md:max-w-[548px]"> | ||
| <p className="font-sans text-white font-medium text-[32px] lg:text-[64px] leading-tight-35 lg:leading-tight-70 tracking-tight-2 fade-in-animation"> | ||
| {getHighlightedText(item.title, item.highlight)} | ||
| </p> | ||
| </div> | ||
| )} | ||
| {item.subtitleDescription && ( | ||
| <div className="pr-10 md:pr-0 w-full !max-w-none"> | ||
| <p className="text-base md:text-lg font-sans font-normal leading-tight-18 md:leading-tight-25 text-white-80 fade-in-animation"> | ||
| {item.subtitleDescription} | ||
| </p> | ||
| </div> | ||
| )} | ||
| </div> | ||
| </div> | ||
| ))} | ||
| </div> | ||
| </div> | ||
| <Script /> | ||
| </> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,65 @@ | ||
| import { useScript } from "@deco/deco/hooks"; | ||
|
|
||
| export interface Props {} | ||
|
|
||
| const setup = () => { | ||
| let currentIndex = 0; | ||
| const slides = Array.from(document.querySelectorAll("[data-slide]")); | ||
| const totalSlides = slides.length; | ||
|
|
||
| console.log("TOTAL SLIDES: " + totalSlides); | ||
|
|
||
| const showSlide = (index: number) => { | ||
| slides.forEach((slide, idx) => { | ||
| if (idx === index) { | ||
| slide.classList.remove("translate-x-full", "opacity-0", "hidden"); | ||
| slide.classList.add("translate-x-0", "opacity-100", "block"); | ||
| } else { | ||
| slide.classList.remove("translate-x-0", "opacity-100", "block"); | ||
| slide.classList.add("translate-x-full", "opacity-0", "hidden"); | ||
| } | ||
| }); | ||
| }; | ||
|
|
||
| const nextSlide = () => { | ||
| currentIndex = (currentIndex + 1) % totalSlides; | ||
| console.log("INDEX ATUAL: " + currentIndex); | ||
| showSlide(currentIndex); | ||
| }; | ||
|
|
||
| const prevSlide = () => { | ||
| currentIndex = (currentIndex - 1 + totalSlides) % totalSlides; | ||
| console.log("INDEX ATUAL: " + currentIndex); | ||
| showSlide(currentIndex); | ||
| }; | ||
|
|
||
| document.addEventListener("DOMContentLoaded", () => { | ||
| if (slides.length === 0) return; | ||
|
|
||
| showSlide(currentIndex); | ||
|
|
||
| document.addEventListener("keydown", (event) => { | ||
| if (event.key === "ArrowRight") { | ||
| nextSlide(); | ||
| } | ||
| if (event.key === "ArrowLeft") { | ||
| prevSlide(); | ||
| } | ||
| }); | ||
|
|
||
| setInterval(nextSlide, 5000); | ||
| }); | ||
| }; | ||
|
|
||
| function Open({}: Props) { | ||
| return ( | ||
| <script | ||
| type="module" | ||
| dangerouslySetInnerHTML={{ | ||
| __html: useScript(setup, {}), | ||
| }} | ||
| /> | ||
| ); | ||
| } | ||
|
|
||
| export default Open; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.