From 667595efa06cb518be6ee8a6da7e6ab2cf606d75 Mon Sep 17 00:00:00 2001
From: Pablo Vazquez <pablo@blender.org>
Date: Thu, 9 Feb 2023 19:48:16 +0100
Subject: [PATCH] UI: Layout update to dashboard and home cards

---
 .../blender_components/card_modules.tmpl      |  2 +-
 .../blender_components/card_projects.tmpl     |  2 +-
 .../blender_components/card_releases.tmpl     |  2 +-
 templates/blender_components/card_repos.tmpl  | 86 +++++++++----------
 templates/custom/extra_links.tmpl             | 40 +++++++++
 templates/home.tmpl                           |  2 +-
 templates/user/dashboard/dashboard.tmpl       | 70 +++++++++++++--
 7 files changed, 147 insertions(+), 57 deletions(-)

diff --git a/templates/blender_components/card_modules.tmpl b/templates/blender_components/card_modules.tmpl
index 3dba0c4..91b6142 100644
--- a/templates/blender_components/card_modules.tmpl
+++ b/templates/blender_components/card_modules.tmpl
@@ -1,4 +1,4 @@
-<div class="ui card">
+<div class="ui fluid card">
   <div class="content">
     <h3>Modules</h3>
     <div class="description">
diff --git a/templates/blender_components/card_projects.tmpl b/templates/blender_components/card_projects.tmpl
index 6c63ea6..32c5b9d 100644
--- a/templates/blender_components/card_projects.tmpl
+++ b/templates/blender_components/card_projects.tmpl
@@ -1,4 +1,4 @@
-<div class="ui card">
+<div class="ui fluid card">
   <div class="content">
     <h3>Ongoing Projects</h3>
     <p>Focused activities to advance Blender.</p>
diff --git a/templates/blender_components/card_releases.tmpl b/templates/blender_components/card_releases.tmpl
index 87f0636..321129a 100644
--- a/templates/blender_components/card_releases.tmpl
+++ b/templates/blender_components/card_releases.tmpl
@@ -1,4 +1,4 @@
-<div class="ui card">
+<div class="ui fluid card">
   <div class="content">
     <h3>Release Status</h3>
     <p>Current and upcoming versions</p>
diff --git a/templates/blender_components/card_repos.tmpl b/templates/blender_components/card_repos.tmpl
index 248fc05..8b68bfa 100644
--- a/templates/blender_components/card_repos.tmpl
+++ b/templates/blender_components/card_repos.tmpl
@@ -1,55 +1,49 @@
-<div class="ui stackable three column grid">
-    <div class="column">
-        <div class="ui card card-with-image card-with-icon">
-            <a href="blender/blender" class="image">
-                <img src="/assets/img/thumb_blender.jpg">
-            </a>
-            <div class="row">
-                <div class="content">
-                    <a href="blender/blender">
-                        <h3>Blender</h3>
-                    </a>
-                    <div class="description">
-                        <p>The main repository for Blender's code and all its branches.</p>
-                    </div>
-                </div>
-            </div>
+<div class="ui cards">
+    <div class="ui card card-with-image" style="flex: 1;">
+      <a href="blender/blender" class="image">
+        <img src="/assets/img/thumb_blender.jpg">
+      </a>
+      <div class="row">
+        <div class="content p-4">
+          <a href="blender/blender">
+            <h3>Blender</h3>
+          </a>
+          <div class="description">
+            <p>The main repository for Blender's code and all its branches.</p>
+          </div>
         </div>
+      </div>
     </div>
 
-    <div class="column">
-        <div class="ui card card-with-image card-with-icon">
-            <a href="blender/documentation" class="image">
-                <img src="/assets/img/thumb_manual.jpg">
-            </a>
-            <div class="row">
-                <div class="content">
-                    <a href="blender/documentation">
-                        <h3>User Manual</h3>
-                    </a>
-                    <div class="description">
-                        <p>The official Blender manual, with references and examples.</p>
-                    </div>
-                </div>
-            </div>
+    <div class="ui card card-with-image" style="flex: 1;">
+      <a href="blender/documentation" class="image">
+        <img src="/assets/img/thumb_manual.jpg">
+      </a>
+      <div class="row">
+        <div class="content p-4">
+          <a href="blender/documentation">
+            <h3>User Manual</h3>
+          </a>
+          <div class="description">
+            <p>The official Blender manual, with references and examples.</p>
+          </div>
         </div>
+      </div>
     </div>
 
-    <div class="column">
-        <div class="ui card card-with-image card-with-icon">
-            <a href="studio/flamenco" class="image">
-                <img src="/assets/img/thumb_flamenco.jpg">
-            </a>
-            <div class="row">
-                <div class="content">
-                    <a href="studio/flamenco">
-                        <h3>Flamenco</h3>
-                    </a>
-                    <div class="description">
-                        <p>Free and open source render management software.</p>
-                    </div>
-                </div>
-            </div>
+    <div class="ui card card-with-image" style="flex: 1;">
+      <a href="studio/flamenco" class="image">
+        <img src="/assets/img/thumb_flamenco.jpg">
+      </a>
+      <div class="row">
+        <div class="content p-4">
+          <a href="studio/flamenco">
+            <h3>Flamenco</h3>
+          </a>
+          <div class="description">
+            <p>Free and open source render management software.</p>
+          </div>
         </div>
+      </div>
     </div>
 </div>
diff --git a/templates/custom/extra_links.tmpl b/templates/custom/extra_links.tmpl
index bf1dd2c..b6334fd 100644
--- a/templates/custom/extra_links.tmpl
+++ b/templates/custom/extra_links.tmpl
@@ -1 +1,41 @@
+<div class="ui dropdown jump item tooltip" data-content="Modules">
+  <span class="text">
+    Modules
+    <span class="fitted not-mobile">{{svg "octicon-triangle-down"}}</span>
+  </span>
+  <div class="menu">
+    <a class="item" href="blender/blender/wiki/Module: Animation & Rigging">Animation & Rigging</a>
+    <a class="item" href="blender/blender/wiki/Module: Asset Browser">Asset Browser</a>
+    <a class="item" href="blender/blender/wiki/Module: Core">Core</a>
+    <a class="item" href="blender/blender/wiki/Module: Grease Pencil">Grease Pencil</a>
+    <a class="item" href="blender/blender/wiki/Module: Modeling">Modeling</a>
+
+    <div class="divider"></div>
+    <div class="header">Nodes</div>
+    <a class="item" href="blender/blender/wiki/Module: Geometry Nodes">Geometry Nodes</a>
+    <a class="item" href="blender/blender/wiki/Module: Nodes & Physics">Nodes & Physics</a>
+    <div class="divider"></div>
+
+    <a class="item" href="blender/blender/wiki/Module: Pipeline, Assets & I/O">Pipeline, Assets & I/O</a>
+    <a class="item" href="blender/blender/wiki/Module: Platforms, Builds, Tests & Devices">Platforms, Builds, Tests & Devices</a>
+
+    <div class="divider"></div>
+    <div class="header">Python & Add-ons</div>
+    <a class="item" href="blender/blender/wiki/Module: Python API & Text Editor">Python API & Text Editor</a>
+    <a class="item" href="blender/blender/wiki/Module: Officially Maintained Add-ons">Officially Maintained Add-ons</a>
+    <a class="item" href="blender/blender/wiki/Module: Community Maintained Add-ons">Community Maintained Add-ons</a>
+    <div class="divider"></div>
+
+    <div class="header">Rendering</div>
+    <a class="item" href="blender/blender/wiki/Module: EEVEE & Viewport">EEVEE & Viewport</a>
+    <a class="item" href="blender/blender/wiki/Module: Render & Cycles">Render & Cycles</a>
+    <div class="divider"></div>
+
+    <a class="item" href="blender/blender/wiki/Module: Sculpt, Paint & Texture">Sculpt, Paint & Texture</a>
+    <a class="item" href="blender/blender/wiki/Module: Triaging">Triaging</a>
+    <a class="item" href="blender/blender/wiki/Module: User Interface">User Interface</a>
+    <a class="item" href="blender/blender/wiki/Module: VFX & Video">VFX & Video</a>
+  </div>
+</div>
+
 <a class="item" href="{{AppSubUrl}}/blender/blender/issues/new?template=.gitea%2fissue_template%2fbug.yaml">{{.locale.Tr "Report a Bug"}}</a>
diff --git a/templates/home.tmpl b/templates/home.tmpl
index 195815f..69976b9 100644
--- a/templates/home.tmpl
+++ b/templates/home.tmpl
@@ -15,7 +15,7 @@
         </p>
       </div>
 
-      <div class="ui stackable twelve column">
+      <div class="ui stackable twelve column mb-4">
         <p>This portal hosts more than just the Blender sources, bug and patch tracker. Explore the other repositories and get involved!</p>
       </div>
 
diff --git a/templates/user/dashboard/dashboard.tmpl b/templates/user/dashboard/dashboard.tmpl
index e3561a6..01fce76 100644
--- a/templates/user/dashboard/dashboard.tmpl
+++ b/templates/user/dashboard/dashboard.tmpl
@@ -2,14 +2,70 @@
 <div class="page-content dashboard feeds">
 	{{template "user/dashboard/navbar" .}}
 	<div class="ui container">
-		{{template "blender_components/card_repos" .}}
-		<div class="ui stackable two column grid">
-			<div class="column">
-				{{template "blender_components/card_projects" .}}
-				{{template "blender_components/card_releases" .}}
+		<div class="ui stackable grid">
+			<div class="ui container ten wide column">
+
+				<div class="ui">
+					<div class="ui stackable three column grid">
+						<div class="column">
+							<div class="ui card card-with-image card-with-icon">
+								<a href="blender/blender" class="image">
+									<img src="/assets/img/thumb_blender.jpg">
+								</a>
+								<div class="row">
+									<div class="content p-3">
+										<a href="blender/blender">
+											<h4>Blender</h4>
+										</a>
+										<div class="description">
+											<p>The main repository for Blender's code and all its branches.</p>
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>
+						<div class="column">
+							<div class="ui card card-with-image card-with-icon">
+								<a href="blender/documentation" class="image">
+									<img src="/assets/img/thumb_manual.jpg">
+								</a>
+								<div class="row">
+									<div class="content p-3">
+										<a href="blender/documentation">
+											<h4>User Manual</h4>
+										</a>
+										<div class="description">
+											<p>The official Blender manual, with references and examples.</p>
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>
+						<div class="column">
+							<div class="ui card card-with-image card-with-icon">
+								<a href="studio/flamenco" class="image">
+									<img src="/assets/img/thumb_flamenco.jpg">
+								</a>
+								<div class="row">
+									<div class="content p-3">
+										<a href="studio/flamenco">
+											<h4>Flamenco</h4>
+										</a>
+										<div class="description">
+											<p>Free and open source render management software.</p>
+										</div>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+
+
+				{{/* template "blender_components/card_modules" . */}}
 			</div>
-			<div class="column">
-				{{template "blender_components/card_modules" .}}
+			<div class="six wide column">
+				{{template "blender_components/card_releases" .}}
 			</div>
 		</div>
 		{{template "base/alert" .}}