diff --git a/CNAME b/CNAME new file mode 100644 index 0000000..5e726b6 --- /dev/null +++ b/CNAME @@ -0,0 +1 @@ +2026.pythonbrasil.org.br \ No newline at end of file diff --git a/img/foto-grupo.jpg b/img/foto-grupo.jpg new file mode 100644 index 0000000..ed46dcd Binary files /dev/null and b/img/foto-grupo.jpg differ diff --git a/img/hero-principal.svg b/img/hero-principal.svg new file mode 100644 index 0000000..42219f9 --- /dev/null +++ b/img/hero-principal.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/logo-pybr.png b/img/logo-pybr.png new file mode 100644 index 0000000..ed45fae Binary files /dev/null and b/img/logo-pybr.png differ diff --git a/img/nosvemo.png b/img/nosvemo.png new file mode 100644 index 0000000..cdb7e77 Binary files /dev/null and b/img/nosvemo.png differ diff --git a/img/pybr-icon.png b/img/pybr-icon.png new file mode 100644 index 0000000..400fcb7 Binary files /dev/null and b/img/pybr-icon.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..9612b26 --- /dev/null +++ b/index.html @@ -0,0 +1,69 @@ + + + + + + Python Brasil 2026 + + + + + + + + +
+ Logo Python Brasil + +
+
+ 000 +

dias

+
+
:
+
+ 00 +

horas

+
+
:
+
+ 00 +

mins

+
+
:
+
+ 00 +

segs

+
+
+ + Nos Vemos em Breve +
+ +
+ + + Python Brasil 2026 em Floripa +
+ +
+
+

Faça parte do maior encontro da comunidade Python no Brasil!

+

Conecte sua marca à inovação, tecnologia e pessoas incríveis.
+ Confira os planos de patrocínio ou garanta já seu ingresso 👇

+ +
+ Ingressos + Plano de Patrocínio (PT) + Sponsorship Plan (EN) +
+
+
+ + + + + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..9c97275 --- /dev/null +++ b/script.js @@ -0,0 +1,27 @@ +const targetDate = new Date("October 15, 2026 00:00:00").getTime(); + +function atualizarContador() { + const agora = new Date().getTime(); + const distancia = targetDate - agora; + + if (distancia <= 0) { + document.getElementById("dias").textContent = "000"; + document.getElementById("horas").textContent = "00"; + document.getElementById("minutos").textContent = "00"; + document.getElementById("segundos").textContent = "00"; + return; + } + + const dias = Math.floor(distancia / (1000 * 60 * 60 * 24)); + const horas = Math.floor((distancia % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); + const minutos = Math.floor((distancia % (1000 * 60 * 60)) / (1000 * 60)); + const segundos = Math.floor((distancia % (1000 * 60)) / 1000); + + document.getElementById("dias").textContent = String(dias).padStart(3, "0"); + document.getElementById("horas").textContent = String(horas).padStart(2, "0"); + document.getElementById("minutos").textContent = String(minutos).padStart(2, "0"); + document.getElementById("segundos").textContent = String(segundos).padStart(2, "0"); +} + +setInterval(atualizarContador, 1000); +atualizarContador(); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..10ad750 --- /dev/null +++ b/style.css @@ -0,0 +1,312 @@ +body { + font-family: 'Roboto', sans-serif; + color: white; + background-color: #000; + margin: 0; + padding: 0; + overflow-x: hidden; +} + +/* Topo */ +.topo { + display: flex; + justify-content: space-between; + align-items: center; + padding: 25px 60px; + background: #000; + color: white; +} + +.logo-img { + width: 120px; + height: auto; +} + +.contador { + text-align: center; + font-size: 22px; + font-weight: 500; +} + +.contador p { + font-size: 12px; + color: #aaa; + margin: 0; + letter-spacing: 0.5px; +} + +.nosvemo-img { + width: 160px; + height: auto; +} + +/* Hero Section */ +.hero { + position: relative; + background: linear-gradient(180deg, #000 0%, #0b0b0b 100%); + text-align: center; + overflow: hidden; +} + +.hero-principal { + width: 100%; +} + +.titulo-img { + width: 650px; + max-width: 90%; +} + +.info-imagens { + margin-top: 30px; +} + +.em-floripa { + width: 160px; + margin-right: 15px; +} + +.ano { + width: 100px; + vertical-align: middle; +} + +.datas { + display: block; + margin: 25px auto 0; + width: 250px; +} + +.mago { + position: absolute; + top: 60px; + left: 80px; + width: 200px; +} + +.surfista { + position: absolute; + bottom: 40px; + right: 120px; + width: 180px; +} + +/* Formulário */ +.formulario { + position: relative; + background-color: #f2f2f2; + color: #000; + text-align: center; +} + +.caixa-form { + background: white; + display: inline-block; + padding: 40px 60px; + box-shadow: 0px 4px 12px rgba(0,0,0,0.2); + border-radius: 4px; + position: absolute; + z-index: 2; +} + +.caixa-form p { + font-size: 18px; + font-weight: 500; + margin-bottom: 20px; + line-height: 1.5; +} + +.caixa-form input { + border: none; + border-bottom: 1px solid #000; + padding: 10px; + width: 280px; + outline: none; + font-family: 'Roboto', sans-serif; + font-size: 14px; +} + +.caixa-form button { + display: block; + margin: 20px auto 0; + background: black; + color: white; + border: none; + padding: 10px 30px; + font-family: 'Roboto', sans-serif; + font-weight: 500; + cursor: pointer; + transition: 0.3s; + border-radius: 3px; +} + +.caixa-form button:hover { + background: #444; +} + +.foto-grupo { + width: 100%; + z-index: 1; +} + +/* Rodapé */ +footer { + text-align: center; + padding: 30px 0; + font-size: 14px; + font-style: italic; + background: #000; + color: white; +} + +/* Seção de Patrocínio */ +.patrocinio { + position: relative; + color: #fff; + text-align: center; + padding: 140px 20px; + background: url("img/foto-grupo.jpg") center center / cover no-repeat; + font-family: "Cascadia Mono", sans-serif; + overflow: hidden; +} + +/* Overlay escuro sobre a foto */ +.patrocinio::before { + content: ""; + position: absolute; + inset: 0; + background: rgba(0, 0, 0, 0.55); + z-index: 0; +} + +.conteudo-patrocinio { + position: relative; + z-index: 1; + max-width: 800px; + margin: 0 auto; +} + +.patrocinio h2 { + font-size: 30px; + font-weight: 700; + margin-bottom: 20px; + line-height: 1.3; + color: #fff; + text-shadow: 0 0 20px #000; + font-family: 'Cascadia Mono'; +} + +.patrocinio p { + font-size: 18px; + font-weight: 400; + line-height: 1.6; + margin-bottom: 40px; + color: #fff; + text-shadow: 0 0 20px #000; + font-family: 'Cascadia Mono'; +} + +.botoes { + display: flex; + justify-content: center; + flex-wrap: wrap; + gap: 20px; +} + +.btn { + background: #c9ea5e; + color: #000; + padding: 14px 28px; + border-radius: 4px; + font-family: 'Roboto', sans-serif; + font-weight: 500; + text-decoration: none; + transition: all 0.3s ease; + border: 2px solid transparent; +} + +.btn:hover { + background: #000; + color: #fff; + border-color: #fff; +} + +/* Contador novo */ +.contador { + display: flex; + align-items: center; + justify-content: center; + gap: 8px; + font-family: 'Cascadia Mono', sans-serif; + color: white; +} + +.tempo { + display: flex; + flex-direction: column; + font-weight: 700; + font-size: 26px; + line-height: 1; + text-align: left; +} + +.tempo p { + margin: 4px 0 0; + font-size: 12px; + font-weight: 400; + color: #bbb; +} + +.separador { + font-size: 26px; + font-weight: 500; + margin: 0 6px; + color: #888; +} + +@media (max-width: 768px) { + .topo { + flex-direction: column; + align-items: center; + text-align: center; + gap: 10px; + padding: 20px; + } + + .logo-img { + width: 100px; + } + + .nosvemo-img { + width: 140px; + } + + /* O contador desce para baixo do topo */ + .contador { + order: 3; /* faz ele ir para o final no flex container */ + margin-top: 20px; + } + + /* Ajusta tamanho do contador para telas pequenas */ + .tempo { + font-size: 20px; + } + + .tempo p { + font-size: 11px; + } + + .separador { + font-size: 20px; + margin: 0 4px; + } + + .botoes { + flex-direction: column; + } + + .btn { + width: 80%; + margin-left: 5%; + } +} \ No newline at end of file