From 5c67337d0e32999d1b7a4a74075b8e6bc35ae0fb Mon Sep 17 00:00:00 2001
From: Emi <coppolaemilio@protonmail.com>
Date: Fri, 3 May 2024 09:47:47 +0200
Subject: [PATCH] Make hero shorter and update call to actions (#840)

* Make hero shorter

* Update home.html

* Remove max-width for subtitle text
---
 _includes/header.html |  2 +-
 assets/css/main.css   |  4 +---
 pages/home.html       | 34 +++++++++++++++++-----------------
 3 files changed, 19 insertions(+), 21 deletions(-)

diff --git a/_includes/header.html b/_includes/header.html
index e32b4f1eb0..ac9135a411 100644
--- a/_includes/header.html
+++ b/_includes/header.html
@@ -23,7 +23,7 @@
 
 			<ul class="right">
 				<li><a href="/download/windows" class="set-os-download-url">Download</a></li>
-				<li><a href="https://docs.godotengine.org">Learn</a></li>
+				<li><a href="https://docs.godotengine.org">Docs</a></li>
 				<li><a href="https://docs.godotengine.org/en/stable/community/contributing/index.html">Contribute</a></li>
 				{% comment %}
 				We add the control character at the end to force the heart to render as text and not as an emoji.
diff --git a/assets/css/main.css b/assets/css/main.css
index 9234445e99..65947871b9 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -1232,7 +1232,6 @@ section.hero .background-image {
 section.hero .copy {
   position: relative;
   z-index: 1;
-  max-width: 670px;
   margin-left: 0;
 }
 
@@ -1247,7 +1246,6 @@ section.hero .copy p {
   font-size: 20px;
   line-height: 1.5;
   margin-bottom: 20px;
-  max-width: 550px;
   text-shadow: 0 0 28px #00000080;
   color: white;
 }
@@ -1270,7 +1268,7 @@ section.hero .wrapper {
   position: relative;
   max-width: 1200px;
   margin: 0 auto;
-  padding: 200px 20px 120px;
+  padding: 180px 20px 100px;
 }
 
 @media (max-width: 650px) {
diff --git a/pages/home.html b/pages/home.html
index 0b0c5ccfbf..288c09b90a 100644
--- a/pages/home.html
+++ b/pages/home.html
@@ -26,18 +26,24 @@ layout: default
 	.main-download-links .btn-download {
 		width: 100%;
 	}
-	.main-download-links .btn-download:nth-of-type(2n) {
-		background-color: rgb(132 151 174 / 68%);
-		-webkit-backdrop-filter: blur(4px);
-		backdrop-filter: blur(4px);
+	
+	.main-download-links .download-3 {
+		text-align: center;
+		color: #ffffffd6;
+		text-shadow: 0 0 10px black;
+		font-weight: 100;
+		font-size: 14px;
 	}
-	.main-download-links .btn-download:nth-of-type(2n) .download-title {
-		color: #f7f7f7;
+	
+	.main-download-links .download-3 a {
+		color: inherit;
+		text-decoration-color: inherit;
+		text-decoration-thickness: 1px;
 	}
-	.main-download-links .btn-download:nth-of-type(2n) .download-hint {
-		background-color: var(--primary-color-subdued);
+	.main-download-links .download-3 a:hover {
+		color: white;
 	}
-
+	
 	@media (max-width: 900px) {
 		.main-download {
 			align-items: center;
@@ -168,8 +174,7 @@ layout: default
 	<div class="wrapper">
 		<div class="copy container">
 			<h1>
-				Your free,<br>
-				open&#8209;source<br>
+				Your free, open&#8209;source<br>
 				game engine.
 			</h1>
 			<p>Develop your 2D &amp; 3D games, cross-platform projects, or even XR ideas!</p>
@@ -185,14 +190,9 @@ layout: default
 						<div class="download-hint">{{ stable_version_4.name }}</div>
 					</a>
 
-					<a href="/download/windows" class="btn btn-download set-os-download-url" data-version="3"
-						title="Download the long-term support version of Godot 3">
-						<div class="download-title">Download LTS</div>
-						<div class="download-hint">{{ stable_version_3.name }}</div>
+					<span class="download-3">Looking for <a href="/download/windows" class="set-os-download-url" data-version="3" title="Download the long-term support version of Godot 3">Godot 3</a> or a <a href="/download/archive">previous version</a>?</span>
 					</a>
 				</div>
-
-				<a href="/features" class="btn btn-flat btn-flat-white btn-flat-frosted btn-hero-learn-more">Learn more</a>
 			</div>
 		</div>
 	</div>