diff --git a/assets/css/custom.css b/assets/css/custom.css new file mode 100644 index 0000000..e41ba66 --- /dev/null +++ b/assets/css/custom.css @@ -0,0 +1,39 @@ + +body { + font-family: 'Nunito', sans-serif; + background-color: #F8F9FA; +} + +.navbar-brand { + font-weight: bold; +} + +.pecs-card { + border-radius: 0.5rem; + transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out; + cursor: pointer; + overflow: hidden; +} + +.pecs-card:hover { + transform: translateY(-5px); + box-shadow: 0 4px 12px rgba(0,0,0,0.1); +} + +.pecs-card.active { + transform: translateY(-5px); + box-shadow: 0 6px 20px rgba(0,0,0,0.15); + border: 2px solid #4285F4; +} + +.card-img-top { + width: 100%; + height: 150px; + object-fit: cover; + background-color: #e9ecef; +} + +.card-title { + font-size: 1.1rem; + font-weight: bold; +} diff --git a/assets/js/main.js b/assets/js/main.js new file mode 100644 index 0000000..b38bd2a --- /dev/null +++ b/assets/js/main.js @@ -0,0 +1,20 @@ +document.addEventListener('DOMContentLoaded', () => { + const cards = document.querySelectorAll('.pecs-card'); + const synth = window.speechSynthesis; + + cards.forEach(card => { + card.addEventListener('click', () => { + // Remove active state from all other cards + cards.forEach(c => c.classList.remove('active')); + // Add active state to clicked card + card.classList.add('active'); + + const textToSpeak = card.querySelector('.card-title').textContent; + if (textToSpeak && synth) { + const utterance = new SpeechSynthesisUtterance(textToSpeak); + utterance.lang = 'pt-BR'; // Set language to Brazilian Portuguese + synth.speak(utterance); + } + }); + }); +}); diff --git a/index.php b/index.php index 7205f3d..8b5efec 100644 --- a/index.php +++ b/index.php @@ -1,150 +1,75 @@ - - - + + - - - New Style - - - - - - - - - - - - - - - - - - - + + + Talk TEA + + + + + + + + + + + + + + + + + + -
-
-

Analyzing your requirements and generating your website…

-
- Loading… -
-

AI is collecting your requirements and applying the first changes.

-

This page will update automatically as the plan is implemented.

-

Runtime: PHP — UTC

-
-
- + + + +
+

Necessidades

+ +
+ + 'Estou com fome', 'icon' => '🍽️'], + ['text' => 'Estou com sede', 'icon' => '💧'], + ['text' => 'Quero ir ao banheiro', 'icon' => '🚽'], + ['text' => 'Estou cansado', 'icon' => '😴'], + ['text' => 'Quero brincar', 'icon' => '🧸'], + ['text' => 'Preciso de ajuda', 'icon' => '🙋'], + ]; + + foreach ($cards as $card): + ?> +
+
+
+
+
+
+
+
+ + +
+
+ + + + + + + - + \ No newline at end of file