refactor: cards and hero markup

erpnext/www/lms/all-programs.html

@@ -32,9 +32,9 @@
 
 
 {% macro card(program, is_enrolled) %}
-<div class="col-sm mb-4 text-left">
+<div class="col-sm-6 mb-4 text-left">
-	<div class="card">
 	<a href="/lms/program?name={{ program.name }}" class="no-decoration no-underline">
+	<div class="card h-100">
 		{% if program.hero_image %}
 		<div class="card-hero-img" style="background-image: url({{ program.hero_image }})"></div>
 		{% else %}
@@ -47,11 +47,11 @@
 			<div>{{ program.description }}</div>
 		</div>
 		<div class='card-footer'>
-				<a href='#' class='small'>Watch Intro</a>
+			<span class='small'>Watch Intro</span>
+		</div>
 	</div>
 	</a>
 </div>
-</div>
 {% endmacro %}
 
 {% block content %}
@@ -68,9 +68,6 @@
 				{{ card(program.program, program.is_enrolled) }}
 			{% endfor %}
 		</div>
-		<p class='mt-4'>
-			<a href='/lms/all-programs' class='text-muted'>View All Programs</a>
-		</p>
 	</div>
 </section>
 {% endblock %}

erpnext/www/lms/index.html

@@ -32,8 +32,8 @@
 	</style>
 {% endblock %}
 
-{% macro card(program, is_enrolled) %}
+{% macro card(program) %}
-<div class="col-sm-6 mb-4 text-left">
+<div class="col-sm mb-4 text-left">
 	<a href="/lms/program?name={{ program.name }}" class="no-decoration no-underline">
 	<div class="card h-100">
 		{% if program.hero_image %}
@@ -68,7 +68,7 @@
 	<div class='container'>
 		<div class="row mt-5">
 			{% for program in featured_programs %}
-				{{ card(program.program, program.is_enrolled) }}
+				{{ card(program.program) }}
 			{% endfor %}
 		</div>
 		<p class='mt-4'>

erpnext/www/lms/macros/hero.html

@@ -1,22 +1,21 @@
-{% macro hero(title, description) %}
+{% macro hero(title, description, is_enrolled) %}
 	<div class='container pb-5'>
 		<h1>{{ title}}</h1>
 		<p class='lead' style="max-width: 100%;">{{ description }}</p>
 		<p class="mt-4">
 			{% if frappe.session.user == 'Guest' %}
-			<a id="signup" class="btn btn-primary btn-lg" style="width: 170px;" href="/login#signup" hidden=true>Sign Up</a>
+			<a id="signup" class="btn btn-primary btn-lg" href="/login#signup">Sign Up</a>
+			{% elif not is_enrolled %}
+			<button id="enroll" class="btn btn-primary btn-lg" onclick="enroll()">Enroll</button>
 			{% endif %}
 		</p>
 	</div>
 
 {% block script %}
 <script type="text/javascript">
-	frappe.ready(() => {
+	function enroll() {
-		btn = document.getElementById('signup')
+		console.log(frappe.utils.get_query_params())
-		if(frappe.session.user == 'Guest') {
-			btn.hidden = false;
 	}
-	})
 </script>
 {% endblock %}
 {% endmacro %}