feat: Enabled translation on html files in LMS [Proposal] (#21582)

* :fix:  translation fix for html files in LMS

* fix: typo in translation

* Update content.html

* Update content.html

* Update profile.html

Co-authored-by: Shivam Mishra <scmmishra@users.noreply.github.com>
Co-authored-by: Marica <maricadsouza221197@gmail.com>
diff --git a/erpnext/www/lms/content.html b/erpnext/www/lms/content.html
index cdc7141..dc9b6d8 100644
--- a/erpnext/www/lms/content.html
+++ b/erpnext/www/lms/content.html
@@ -59,7 +59,7 @@
 {% macro title() %}
 	<div class="mb-3">
 		<a href="/lms/course?name={{ course }}&program={{ program }}" class="text-muted">
-				Back to Course
+			{{_('Back to Course')}}
 		</a>
 	</div>
 	<div>
@@ -69,15 +69,15 @@
 
 {% macro navigation() %}
 		{% if previous %}
-			<a href="/lms/content?program={{ program }}&course={{ course }}&topic={{ topic }}&type={{ previous.content_type }}&content={{ previous.content }}" class='btn text-muted' style="box-shadow: none;">Previous</a>
+			<a href="/lms/content?program={{ program }}&course={{ course }}&topic={{ topic }}&type={{ previous.content_type }}&content={{ previous.content }}" class='btn text-muted' style="box-shadow: none;">{{_('Previous')}}</a>
 		{% else %}
-			<a href="/lms/course?name={{ course }}&program={{ program }}" class='btn text-muted' style="box-shadow: none;">Back to Course</a>
+			<a href="/lms/course?name={{ course }}&program={{ program }}" class='btn text-muted' style="box-shadow: none;">{{ _('Back to Course') }}</a>
 		{% endif %}
 
 		{% if next %}
-			<button id="nextButton" onclick="handle('/lms/content?program={{ program }}&course={{ course }}&topic={{ topic }}&type={{ next.content_type }}&content={{ next.content }}')" class='btn btn-primary' disabled="true">Next</button>
+			<button id="nextButton" onclick="handle('/lms/content?program={{ program }}&course={{ course }}&topic={{ topic }}&type={{ next.content_type }}&content={{ next.content }}')" class='btn btn-primary' disabled="true">{{_('Next')}}</button>
 		{% else %}
-			<button id="nextButton" onclick="handle('/lms/course?name={{ course }}&program={{ program }}')" class='btn btn-primary' disabled="true">Finish Topic</button>
+			<button id="nextButton" onclick="handle('/lms/course?name={{ course }}&program={{ program }}')" class='btn btn-primary' disabled="true">{{_('Finish Topic')}}</button>
 		{% endif %}
 {% endmacro %}
 
@@ -86,7 +86,7 @@
 	{{ title() }}
 	<div class="text-muted">
 		{% if content.duration %}
-			{{ content.duration }} Mins
+			{{ content.duration }} {{_('Mins')}}
 		{% endif %}
 
 		{% if content.publish_date and content.duration%}
@@ -94,7 +94,7 @@
 		{% endif %}
 
 		{% if content.publish_date %}
-			Published on {{ content.publish_date.strftime('%d, %b %Y') }}
+			{{_('Published on')}} {{ content.publish_date.strftime('%d, %b %Y') }}
 		{% endif %}
 	</div>
 </div>
@@ -109,13 +109,13 @@
 	{{ title() }}
 	<div class="text-muted">
 		{% if content.author or content.publish_date %}
-			Published
+			{{_('Published')}}
 		{% endif %}
 		{% if content.author %}
-			by {{ content.author }}
+			{{_('by')}} {{ content.author }}
 		{% endif %}
 		{% if content.publish_date %}
-			on {{ content.publish_date.strftime('%d, %b %Y') }}
+			{{_('on')}} {{ content.publish_date.strftime('%d, %b %Y') }}
 		{% endif %}
 	</div>
 </div>
@@ -205,4 +205,4 @@
 
 		{% endif %}
 	</script>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/erpnext/www/lms/course.html b/erpnext/www/lms/course.html
index f2fd936..0d70ed5 100644
--- a/erpnext/www/lms/course.html
+++ b/erpnext/www/lms/course.html
@@ -72,11 +72,11 @@
 		{% if has_access %}
 			<div class='card-footer'>
 				{% if progress[topic.name].completed %}
-					<span class="indicator green">Completed</span>
+					<span class="indicator green">{{_('Completed')}}</span>
 				{% elif progress[topic.name].started %}
-					<span class="indicator orange">In Progress</span>
+					<span class="indicator orange">{{_('In Progress')}}</span>
 				{% else %}
-					<span class="indicator blue">Start</span>
+					<span class="indicator blue">{{_('Start')}}</span>
 				{% endif %}
 			</div>
 			</a>
diff --git a/erpnext/www/lms/index.html b/erpnext/www/lms/index.html
index ffb4419..7ce3521 100644
--- a/erpnext/www/lms/index.html
+++ b/erpnext/www/lms/index.html
@@ -45,7 +45,7 @@
 		<p class='lead'>{{ education_settings.description }}</p>
 		<p class="mt-4">
 			{% if frappe.session.user == 'Guest' %}
-				<a class="btn btn-primary btn-lg" href="'/login#signup'">Sign Up</a>
+				<a class="btn btn-primary btn-lg" href="'/login#signup'">{{_('Sign Up')}}</a>
 			{% endif %}
 		</p>
 	</div>
diff --git a/erpnext/www/lms/macros/card.html b/erpnext/www/lms/macros/card.html
index 076061d..dc8fc5c 100644
--- a/erpnext/www/lms/macros/card.html
+++ b/erpnext/www/lms/macros/card.html
@@ -15,8 +15,8 @@
 		</div>
 		{% if has_access or program.intro_video%}
 		<div class='card-footer'>
-			{% if has_access %} <span class="indicator green">Enrolled</span>
-			{% elif program.intro_video %} <span><a href="{{ program.intro_video }}" target="blank">Watch Intro</a></span>
+			{% if has_access %} <span class="indicator green">{{_('Enrolled')}}</span>
+			{% elif program.intro_video %} <span><a href="{{ program.intro_video }}" target="blank">{{_('Watch Intro')}}</a></span>
 			{% endif %}
 		</div>
 		{% endif %}
diff --git a/erpnext/www/lms/macros/hero.html b/erpnext/www/lms/macros/hero.html
index 66bb861..94f239e 100644
--- a/erpnext/www/lms/macros/hero.html
+++ b/erpnext/www/lms/macros/hero.html
@@ -2,16 +2,16 @@
 	<div class='container pb-5'>
 		<div class="mb-3">
 			<a href="{{ back.url }}" class="text-muted">
-				Back to {{ back.name }}
+				{{_('Back to')}} {{ _(back.name) }}
 			</a>
 		</div>
 		<h1>{{ title }}</h1>
 		<p class='lead' style="max-width: 100%;">{{ description or ''}}</p>
 		<p class="mt-4">
 			{% if frappe.session.user == 'Guest' %}
-			<a id="signup" class="btn btn-primary btn-lg" href="/login#signup">Sign Up</a>
+			<a id="signup" class="btn btn-primary btn-lg" href="/login#signup">{{_('Sign Up')}}</a>
 			{% elif not has_access %}
-			<button id="enroll" class="btn btn-primary btn-lg" onclick="enroll()" disabled>Enroll</button>
+			<button id="enroll" class="btn btn-primary btn-lg" onclick="enroll()" disabled>{{_('Enroll')}}</button>
 			{% endif %}
 		</p>
 	</div>
@@ -28,7 +28,7 @@
 
 		let btn = document.getElementById('enroll');
 		btn.disbaled = true;
-		btn.innerText = 'Enrolling...'
+		btn.innerText = __('Enrolling...')
 
 		let opts = {
 			method: 'erpnext.education.utils.enroll_in_program',
@@ -44,7 +44,7 @@
 					window.location.reload()
 				}
 			})
-			success_dialog.set_message('You have successfully enrolled for the program ');
+			success_dialog.set_message(__('You have successfully enrolled for the program '));
 			success_dialog.$message.show()
 			success_dialog.show();
 			btn.disbaled = false;
diff --git a/erpnext/www/lms/profile.html b/erpnext/www/lms/profile.html
index 9508dae..5755dfe 100644
--- a/erpnext/www/lms/profile.html
+++ b/erpnext/www/lms/profile.html
@@ -30,7 +30,7 @@
 			</ul>
 		</div>
 		<div class='card-footer'>
-			<span class="small">{{ program.completion }}% Complete</span>
+			<span class="small">{{ program.completion }}{{_('% Complete')}}</span>
 		</div>
 	</div>
 	</a>
@@ -43,11 +43,11 @@
 		<div class="mb-3 row">
 			<div class="col-md-7">
 				<a href="/lms" class="text-muted">
-					Back to Home
+					{{_('Back to Home')}}
 				</a>
 			</div>
 			<div class="col-md-5 text-right">
-				<a href="/update-profile?name={{ frappe.session.user }}" target="blank" class="mt-0 text-muted">Edit Profile</a>
+				<a href="/update-profile?name={{ frappe.session.user }}" target="blank" class="mt-0 text-muted">{{_('Edit Profile')}}</a>
 			</div>
 		</div>
 		<h1>{{ student.first_name }} {{ student.last_name or '' }}</h1>
@@ -61,4 +61,4 @@
 		</div>
 	</div>
 </section>
-{% endblock %}
\ No newline at end of file
+{% endblock %}
diff --git a/erpnext/www/lms/program.html b/erpnext/www/lms/program.html
index 271b781..7ad6186 100644
--- a/erpnext/www/lms/program.html
+++ b/erpnext/www/lms/program.html
@@ -55,11 +55,11 @@
 		{% if has_access and progress[course.name] %}
 		<div class='card-footer'>
 			{% if progress[course.name].completed %}
-			<span class="indicator green">Completed</span>
+			<span class="indicator green">{{_('Completed')}}</span>
 			{% elif progress[course.name].started %}
-			<span class="indicator orange">In Progress</span>
+			<span class="indicator orange">{{_('In Progress')}}</span>
 			{% else %}
-			<span class="indicator blue">Start</span>
+			<span class="indicator blue">{{_('Start')}}</span>
 			{% endif %}
 		</div>
 		{% endif %}
diff --git a/erpnext/www/lms/topic.html b/erpnext/www/lms/topic.html
index 1f0d187..cd24616 100644
--- a/erpnext/www/lms/topic.html
+++ b/erpnext/www/lms/topic.html
@@ -23,13 +23,13 @@
 		{% if has_access %}
 		<div class='card-footer'>
 			{% if content.content_type == 'Quiz' %}
-				{% if content.result == 'Fail' %} <span class="indicator red">Fail <span class="text-muted">({{ content.score }}/100)</span></span>
-				{% elif content.result == 'Pass' %} <span class="indicator green">Pass <span class="text-muted">({{ content.score }}/100)</span>
-				{% else %} <span class="indicator blue">Start</span>
+				{% if content.result == 'Fail' %} <span class="indicator red">{{_('Fail')}} <span class="text-muted">({{ content.score }}/100)</span></span>
+				{% elif content.result == 'Pass' %} <span class="indicator green">{{_('Pass')}} <span class="text-muted">({{ content.score }}/100)</span>
+				{% else %} <span class="indicator blue">{{_('Start')}}</span>
 				{% endif %}
 			{% else %}
-				{% if content.completed %} <span class="indicator green">Completed</span>
-				{% else %} <span class="indicator blue">Start</span>
+				{% if content.completed %} <span class="indicator green">{{_('Completed')}}</span>
+				{% else %} <span class="indicator blue">{{_('Start')}}</span>
 				{% endif %}
 			{% endif %}
 		</div>