From e51d86e88a5b3c00170b4c9bac41b049b796143f Mon Sep 17 00:00:00 2001
From: Dorian Lesbre <dorian.lesbre@gmail.com>
Date: Sun, 28 Feb 2021 17:36:32 +0100
Subject: [PATCH] Made activity list prettier

---
 home/static/css/style.css     | 29 +++++++++++++++++++++++++++++
 home/templates/activites.html |  6 +++---
 2 files changed, 32 insertions(+), 3 deletions(-)

diff --git a/home/static/css/style.css b/home/static/css/style.css
index 4dc2678..a8c81ca 100644
--- a/home/static/css/style.css
+++ b/home/static/css/style.css
@@ -118,6 +118,15 @@ main h2 {
 	color: var(--color_bg_2);
 	padding-top: 20px;
 	font-size: 1.5rem;
+	font-weight: bold;
+	text-align: left;
+	border-bottom: 2px solid var(--color_bg_1);
+	border-image-source: linear-gradient(to right, var(--color_bg_1) 0%, transparent 75%);
+	border-image-slice: 1;
+}
+main h3 {
+	color: var(--color_bg_2);
+	font-size: 1.2rem;
 	font-weight: 300;
 	text-align: left;
 	border-bottom: 2px solid var(--color_bg_1);
@@ -125,6 +134,7 @@ main h2 {
 	border-image-slice: 1;
 }
 
+
 main p {
 	font-size: 1rem;
 }
@@ -134,6 +144,25 @@ main a:link {
 	color: rgb(62, 62, 255);
 }
 
+dl {
+	list-style: none;
+	display: grid;
+	grid-template-columns: 1fr 5fr;
+}
+dl dt {
+	grid-column: 1 / span 1;
+	justify-self: end;
+	text-align: right;
+	margin: 5px 10px;
+	font-weight: bold;
+	align-self: center;
+}
+dl dd {
+	margin: 5px 5px;
+	justify-self: start;
+	text-align: left;
+}
+
 footer {
 	position: absolute;
 	bottom: 0;
diff --git a/home/templates/activites.html b/home/templates/activites.html
index a6ccd93..6d7653b 100644
--- a/home/templates/activites.html
+++ b/home/templates/activites.html
@@ -9,9 +9,9 @@
 	{% for activity in activities %}
 		<h3>{{ activity.title }}</h3>
 		<dl>
-			<dd>Durée :</dd><dt>{{ activity.duration }}</dt>
-			<dd>MJ :</dd><dt>{{ activity.host_name }}</dt>
-			<dd>Description :</dd><dt>{{ activity.description }}</dt>
+			<dt>Durée :</dt><dd>{{ activity.duration }}</dd>
+			<dt>MJ :</dt><dd>{{ activity.host_name }}</dd>
+			<dt>Description :</dt><dd>{{ activity.description }}</dd>
 		</dl>
 	{% endfor %}
 {% endblock %}
\ No newline at end of file
-- 
GitLab