Update sponsors

_data/sponsors.yml

@@ -1,10 +1,11 @@
-platinum:
+patron:
   - name: "OSS Capital"
     link: "https://oss.capital/"
     image: "https://fund.godotengine.org/static/logos/ossc-logo.svg"
-  - name: "Gamblify"
-    link: "https://www.gamblify.com/"
-    image: "https://fund.godotengine.org/static/logos/gamblify.png"
+  - name: "Re-Logic"
+    link: "https://re-logic.com/"
+    image: "https://fund.godotengine.org/static/logos/re-logic.png"
+platinum:
   - name: "Spiffcode"
     link: "http://spiffcode.com/"
     image: "https://fund.godotengine.org/static/logos/spiffcode.png"
@@ -17,9 +18,6 @@ platinum:
   - name: "Ramatak"
     link: "https://ramatak.com/"
     image: "https://fund.godotengine.org/static/logos/ramatak.png"
-  - name: "Re-Logic"
-    link: "https://re-logic.com/"
-    image: "https://fund.godotengine.org/static/logos/re-logic.png"
 gold:
   - name: "Prehensile Tales"
     link: "https://prehensile-tales.com"

_includes/sponsors.html

@@ -1,19 +1,27 @@
 <section class="sponsors padded" id="sponsors">
 	<div class="container">
 		<h2>Godot is sponsored by:</h2>
+		<h3>Patron</h3>
+		<div class="grid patron">
+			{% for sponsor in site.data.sponsors.patron %}
+			<a class="sponsor-card patron" href="{{ sponsor.link }}" target="_blank" rel="noopener">
+				<img src="{{ sponsor.image }}" alt="{{ sponsor.name }}">
+			</a>
+			{% endfor %}
+		</div>
 		<h3>Sponsor Platinum</h3>
 		<div class="grid platinum">
 			{% for sponsor in site.data.sponsors.platinum %}
 			<a class="sponsor-card platinum" href="{{ sponsor.link }}" target="_blank" rel="noopener">
-				<img src="{{ sponsor.image }}" alt="{{ sponsor.name }}" loading="lazy">
+				<img src="{{ sponsor.image }}" alt="{{ sponsor.name }}">
 			</a>
 			{% endfor %}
 		</div>
 		<h3>Sponsor Gold</h3>
 		<div class="grid gold">
 			{% for sponsor in site.data.sponsors.gold %}
 			<a class="sponsor-card gold" href="{{ sponsor.link }}" target="_blank" rel="noopener">
-				<img src="{{ sponsor.image }}" alt="{{ sponsor.name }}" loading="lazy">
+				<img src="{{ sponsor.image }}" alt="{{ sponsor.name }}">
 			</a>
 			{% endfor %}
 		</div>

assets/css/main.css

@@ -60,6 +60,7 @@
 
   --sponsor-background-color: #dcdcdc;
   --sponsor-platinum-background-color: #cfdbe4;
+  --sponsor-patron-background-color: #cfdbe4;
   --sponsor-gold-background-color: #e0dfd4;
   --sponsor-silver-background-color: #e3e3e3;
 
@@ -148,6 +149,7 @@
 
     --sponsor-background-color: #ffffff;
     --sponsor-platinum-background-color: #e2ebfa;
+    --sponsor-patron-background-color: #e2ebfa;
     --sponsor-gold-background-color: #efece2;
 
     --download-hero-color: hsla(0, 0%, 100%, 0.9);
@@ -1381,6 +1383,10 @@ section.sponsors .grid {
 
 @media (min-width: 768px) {
   section.sponsors .grid {
+    grid-template-columns: repeat(2, 1fr);
+  }
+
+  section.sponsors .grid.platinum {
     grid-template-columns: repeat(3, 1fr);
   }
 
@@ -1402,6 +1408,10 @@ section.sponsors .grid {
   box-sizing: border-box;
 }
 
+.sponsor-card.patron {
+  background-color: var(--sponsor-patron-background-color);
+}
+
 .sponsor-card.platinum {
   background-color: var(--sponsor-platinum-background-color);
 }
@@ -1418,10 +1428,18 @@ section.sponsors .grid {
   max-width: 100%;
   mix-blend-mode: multiply;
   width: auto;
-  max-height: 80px;
+  max-height: 100px;
   margin: 0 auto;
 }
 
+.patron img {
+  width: 100%;
+}
+
+.platinum img {
+  max-height: 80px;
+}
+
 .gold img {
   max-height: 60px;
 }