O Desafio consiste em uma página de curriculo, como eu já estabeleci o meu projeto como uma floricultura em uma estética e proposta especifica eu decidi aceitar o desafio de uma maneira diferente, juntando o que aprendemos ao longo dos cursos da Oracle One com a ALura, por exemplo: engenharia de prompt (a qual usei para formular textos cativantes para a floricultura hipotética), o que aprendemos de css e html ao longo desses 3 cursos, (entao decidi criar uma terceira aba para a floricultura "especialidades" em que falamos sobre as especialides, tipos de flores, arranjos são trabalhados nela. Tudo isso como forma de aceitar o desafio sem sair do meu projeto, mas seguindo a proposta sugerida.
HTML da aba Especialidades:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="./styles/style.css">
<title> les Floris Tao | Especialidades</title>
</head>
<body>
<header class="cabecalho">
<nav class="cabecalho__menu">
<a class="cabecalho__menu__link" href="index.html">Inicio</a></li>
<a class="cabecalho__menu__link" href="flores.html">Flores</a></li>
<a class="cabecalho__menu__link" href="especialidades.html">Especialidades</a></li>
</nav>
</header>
<main class="apresentacao__especialidades">
<section class="apresentacao__especialidades__conteudo">
<h1 class="apresentacao__especialidades__titulo">Especialidades de
<strong class="titulo-blog">Les Floris Tao</strong>
</h1>
<p class="apresentacao__especialidades__paragrafo">
Na Les Floris Tao, cada flor é escolhida como se fosse uma nota de perfume — com delicadeza, intenção e alma.
Inspirada pela estética oriental e pelo charme atemporal francês, nossa floricultura celebra o encontro entre
natureza e arte, emoção e equilíbrio. Mais do que arranjos, criamos experiências sensoriais que tocam o olhar e
o espírito. A seguir, nossas especialidades, pensadas para encantar com sutileza e beleza:
</p>
<ul class="apresentacao__especialidades__lista">
<li>
<strong>Arranjos Zen e Minimalistas:</strong> composições que evocam serenidade e contemplação, com flores
orientais como lírios, orquídeas cymbidium e folhagens de bambu.
</li>
<li>
<strong>Florais Personalizados com Intenção:</strong> arranjos feitos sob medida, guiados pelo simbolismo das
flores — como sakura, peônias e cravos japoneses — para transmitir emoções específicas.
</li>
<li>
<strong>Decoração Floral para Eventos Intimistas:</strong> ambientações delicadas e sofisticadas, inspiradas
na arte do ikebana, ideais para casamentos, jantares e celebrações com alma.
</li>
<li>
<strong>Buquês Poéticos:</strong> pequenos gestos florais acompanhados de frases ou poemas, criados para
emocionar e eternizar momentos especiais.
</li>
<li>
<strong>Bonsais e Mini Jardins Tao:</strong> curadoria de bonsais e jardins zen com pedras, musgos e areia
branca — perfeitos para contemplação e decoração espiritual.
</li>
<li>
<strong>Assinatura Floral Tao:</strong> entregas periódicas de arranjos exclusivos, seguindo o ritmo das
estações e o estado emocional do assinante.
</li>
</ul>
<script>
function quebrarTexto(elemento, tamanhoMaximo) {
let textoOriginal = elemento.innerHTML.trim();
let resultado = "";
let linhaAtual = "";
textoOriginal.split(" ").forEach((palavra) => {
if ((linhaAtual + palavra).replace(/<[^>]*>/g, "").length > tamanhoMaximo) {
resultado += linhaAtual.trim() + "<br>";
linhaAtual = palavra + " ";
} else {
linhaAtual += palavra + " ";
}
});
resultado += linhaAtual.trim();
elemento.innerHTML = resultado;
}
// Aplica ao parágrafo principal
let paragrafo = document.querySelector(".apresentacao__especialidades__texto");
quebrarTexto(paragrafo, 60);
// Aplica a cada item da lista
let itensLista = document.querySelectorAll(".apresentacao__especialidades__lista li");
itensLista.forEach((item) => quebrarTexto(item, 60));
</script>
</section>
<figure>
<img src="./assets/BonsaiFrame.png" alt="bonsai carregado com flores brancas" style="width: 300px; height: auto;">
</figure>
</main>
<footer>
<p class="rodape">© 2025 Les Floris Tao. All rights reserved.</p>
</footer>
</body>
</html>