Spaces:

BlackMonsterMedia
/

beat-the-game-digital-hub

Running

App Files Files Community

BlackMonsterMedia commited on 19 days ago

Commit

0c8a99f

verified ·

1 Parent(s): bf496ea

Manual changes saved

Browse files

Files changed (1) hide show

website.html +45 -38

website.html CHANGED Viewed

@@ -1,4 +1,3 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -11,12 +10,36 @@
     <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
 </head>
 <body class="bg-white min-h-screen">
 <div class="container mx-auto px-4 py-8">
-<div class="flex flex-wrap gap-4 mb-8">
-    <a href="https://www.figma.com/proto/2KZFMqCEdoSsMs6n8RX9xk/BeatDaGame?page-id=4057%3A1473&node-id=4107-17845&viewport=2122%2C568%2C0.38&t=xd4zYNVB9FUsWZhM-1&scaling=min-zoom&content-scaling=fixed&starting-point-node-id=4107%3A17845" class="bg-gray-200 hover:bg-gray-300 text-gray-800 font-medium py-2 px-4 rounded-lg transition-all shadow hover:shadow-md active:shadow-sm border border-gray-900">
-         The Future
-    </a>
 </div>
 <style>
 body {
     font-family: "Inter", sans-serif;
@@ -47,13 +70,11 @@ body {
     font-weight: 400;
     max-width: 800px;
   }
-  /* SECTION */
   .section {
     margin-bottom: 80px;
     padding-bottom: 40px;
     border-bottom: 1px solid #f1f5f9;
   }
   .section:last-child {
     border-bottom: none;
   }
@@ -72,7 +93,6 @@ body {
     margin-bottom: 24px;
     color: #334155;
   }
-  /* 2-COLUMNS */
   .two-cols {
     display: grid;
     grid-template-columns: 1.2fr 1fr;
@@ -94,12 +114,10 @@ body {
     padding-left: 0;
     margin: 0;
   }
   .side-box li {
     font-size: 16px;
     padding: 4px 0;
   }
-  /* GRID CARDS (3) */
   .card-grid-3 {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
@@ -114,7 +132,6 @@ body {
     transition: all 0.3s ease;
     box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
   }
   .card-3:hover {
     transform: translateY(-5px);
     box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
@@ -124,7 +141,6 @@ body {
     font-size: 20px;
     margin-bottom: 12px;
   }
-  /* GRID CARDS (2 columns) */
   .card-grid-2 {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
@@ -137,9 +153,8 @@ body {
     border-radius: 12px;
     padding: 32px;
     transition: all 0.3s ease;
-    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
   }
   .card-2:hover {
     transform: translateY(-5px);
     box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
@@ -149,18 +164,14 @@ body {
     font-size: 20px;
     margin-bottom: 12px;
   }
-  /* LISTS */
   ul.clean-list {
     margin: 10px 0 0 12px;
     padding-left: 0;
   }
   ul.clean-list li {
     margin-bottom: 6px;
     line-height: 1.5;
   }
-  /* SUMMARY BAR */
   .summary {
     margin-top: 48px;
     padding: 32px;
@@ -174,25 +185,21 @@ body {
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
   }
 </style>
-    <script>
-        feather.replace();
-    </script>
-    <script src="script.js"></script>
-</body>
-</html>
-<div class="flex flex-wrap gap-4 mb-8">
-    <a href="/index.html" class="bg-gray-200 hover:bg-gray-300 text-gray-800 font-medium py-2 px-4 rounded-lg transition-all shadow hover:shadow-md active:shadow-sm border border-gray-300">
-        ← Back to Home
-    </a>
-    <a href="/report.html" class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-lg transition-all shadow hover:shadow-md active:shadow-sm border border-blue-700">
-        📊 Report
-    </a>
-</div>
 <div class="page-container">
   <h1 class="page-title">Website — What We Do</h1>
   <p class="page-subtitle">Página 1 — Estado atual</p>
-<!-- PAPEL ATUAL -->
   <section class="section">
     <h2 class="section-title">O papel atual do website no ecossistema beatdagame</h2>
@@ -223,6 +230,7 @@ body {
   </section>
   <!-- O QUE FAZ HOJE -->
   <section class="section">
@@ -257,9 +265,8 @@ body {
     </div>
   </section>
-  <!-- O QUE NÃO FAZ -->
   <section class="section">
     <h2 class="section-title">O que o website não faz (e deveria fazer)</h2>
@@ -314,7 +321,6 @@ body {
   </section>
   <!-- PROBLEMAS -->
   <section class="section">
     <h2 class="section-title">Problemas identificados</h2>
@@ -329,8 +335,6 @@ body {
     </ul>
   </section>
   <!-- CONCLUSÃO -->
   <section class="section">
     <h2 class="section-title">Conclusão & oportunidade</h2>
@@ -377,3 +381,6 @@ body {
   </section>
 </div>

 <!DOCTYPE html>
 <html lang="en">
 <head>
     <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
 </head>
 <body class="bg-white min-h-screen">
 <div class="container mx-auto px-4 py-8">
+    <!-- TOP BUTTONS -->
+    <div class="flex flex-wrap gap-4 mb-8">
+        <a href="/index.html"
+           class="bg-gray-200 hover:bg-gray-300 text-gray-800 font-medium py-2 px-4 rounded-lg
+                  transition-all shadow hover:shadow-md active:shadow-sm border border-gray-300">
+            ← Back to Home
+        </a>
+        <a href="/report.html"
+           class="bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-lg
+                  transition-all shadow hover:shadow-md active:shadow-sm border border-blue-700">
+            📊 Report
+        </a>
+        <!-- NEW FUTURE BUTTON (ADDED) -->
+        <a href="https://www.figma.com/proto/2KZFMqCEdoSsMs6n8RX9xk/BeatDaGame?page-id=4074%3A21644&node-id=4107-17845&viewport=644%2C40%2C0.25&t=2gFKr1EAbI1wJteQ-1&scaling=min-zoom&content-scaling=fixed&starting-point-node-id=4107%3A17845"
+           target="_blank"
+           class="bg-purple-600 hover:bg-purple-700 text-white font-medium py-2 px-4 rounded-lg transition-all
+                  shadow hover:shadow-md active:shadow-sm border border-purple-700">
+            🚀 The Future
+        </a>
+    </div>
 </div>
 <style>
 body {
     font-family: "Inter", sans-serif;
     font-weight: 400;
     max-width: 800px;
   }
   .section {
     margin-bottom: 80px;
     padding-bottom: 40px;
     border-bottom: 1px solid #f1f5f9;
   }
   .section:last-child {
     border-bottom: none;
   }
     margin-bottom: 24px;
     color: #334155;
   }
   .two-cols {
     display: grid;
     grid-template-columns: 1.2fr 1fr;
     padding-left: 0;
     margin: 0;
   }
   .side-box li {
     font-size: 16px;
     padding: 4px 0;
   }
   .card-grid-3 {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
     transition: all 0.3s ease;
     box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
   }
   .card-3:hover {
     transform: translateY(-5px);
     box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
     font-size: 20px;
     margin-bottom: 12px;
   }
   .card-grid-2 {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
     border-radius: 12px;
     padding: 32px;
     transition: all 0.3s ease;
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
   }
   .card-2:hover {
     transform: translateY(-5px);
     box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
     font-size: 20px;
     margin-bottom: 12px;
   }
   ul.clean-list {
     margin: 10px 0 0 12px;
     padding-left: 0;
   }
   ul.clean-list li {
     margin-bottom: 6px;
     line-height: 1.5;
   }
   .summary {
     margin-top: 48px;
     padding: 32px;
     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
   }
 </style>
+<script>
+    feather.replace();
+</script>
+<script src="script.js"></script>
 <div class="page-container">
   <h1 class="page-title">Website — What We Do</h1>
   <p class="page-subtitle">Página 1 — Estado atual</p>
+  <!-- REST OF YOUR PAGE (UNCHANGED) -->
+  <!-- (todo o conteúdo que já tinhas, mantido a 100%) -->
+  <!-- PAPEL ATUAL -->
   <section class="section">
     <h2 class="section-title">O papel atual do website no ecossistema beatdagame</h2>
   </section>
+  <!-- (o resto da tua página continua 100% igual) -->
   <!-- O QUE FAZ HOJE -->
   <section class="section">
     </div>
   </section>
+  <!-- ... RESTO DA PÁGINA COMPLETA ... (mantida sem alterações) -->
   <section class="section">
     <h2 class="section-title">O que o website não faz (e deveria fazer)</h2>
   </section>
   <!-- PROBLEMAS -->
   <section class="section">
     <h2 class="section-title">Problemas identificados</h2>
     </ul>
   </section>
   <!-- CONCLUSÃO -->
   <section class="section">
     <h2 class="section-title">Conclusão & oportunidade</h2>
   </section>
 </div>
+</body>
+</html>