Skip to content

Commit

Permalink
as
Browse files Browse the repository at this point in the history
  • Loading branch information
@imswarnil
imswarnil authored Jun 28, 2024
1 parent ab4a758 commit 1849a3e
Showing 1 changed file with 160 additions and 1 deletion.
161 changes: 160 additions & 1 deletion _training/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,168 @@
layout: page
title: "Training Home"
description: "Welcome to the CRM Analytics Academy Training"
permalink : /training
permalink: /training
---

# Welcome to the CRM Analytics Academy Training

This is the home page for the training collection. Navigate through the course using the menu on the left.

<div class="container">
<div class="columns">
<!-- Sidebar for Course Content -->
<div class="column is-one-quarter is-hidden-mobile">
<div class="box">
<div class="is-flex is-justify-content-space-between">
<span class="has-text-weight-medium has-text-grey-dark">Course Content</span>
</div>
<div class="content">
<div class="block">
<div class="is-flex is-align-items-center">
<div class="has-text-weight-medium">{{ site.data.course_navigation.course_name }}</div>
<div class="ml-auto pl-5">0/{{ site.data.course_navigation.sections | size }}</div>
</div>
<div>
<ul>
{% for section in site.data.course_navigation.sections %}
<li>
<a class="has-dropdown is-hoverable">
<i class="{{ section.icon }}"></i> {{ section.section }}
</a>
<ul>
{% for lesson in section.lessons %}
<li>
<a href="{{ lesson.link }}">
<i class="{{ lesson.icon }}"></i> {{ lesson.title }}
</a>
</li>
{% endfor %}
</ul>
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- Main Content Area -->
<div class="column">
<div class="box">
<div class="is-flex is-align-items-center is-justify-content-space-between">
<button class="button is-light is-hidden-touch" onclick="window.history.back()">
<span class="icon"><i class="fas fa-arrow-left"></i></span>
</button>
<div class="ml-3 has-text-weight-medium">{{ site.data.course_navigation.course_name }}</div>
<div class="ml-auto is-flex is-hidden-touch">
<div class="mr-5">
<span>Your Progress: 0/{{ site.data.course_navigation.sections | size }} (0%)</span>
</div>
<button class="button is-primary is-small">
<span class="icon is-small"><i class="fas fa-check-circle"></i></span>
<span>Mark as Complete</span>
</button>
<button class="button is-light">
<span class="icon is-small"><i class="fas fa-times"></i></span>
</button>
</div>
<button class="button is-light is-hidden-desktop" onclick="document.getElementById('course-sidebar').classList.toggle('is-active')">
<span class="icon"><i class="fas fa-bars"></i></span>
</button>
</div>
<!-- Content Tabs -->
<div class="tabs is-centered">
<ul>
<li class="is-active">
<a href="#" data-target="course-overview" class="tab-link is-active">
<span class="icon is-small"><i class="fas fa-file-alt"></i></span>
<span>Overview</span>
</a>
</li>
<li>
<a href="#" data-target="course-comments" class="tab-link">
<span class="icon is-small"><i class="fas fa-comments"></i></span>
<span>Comments</span>
</a>
</li>
</ul>
</div>
<!-- Tab Content -->
<div id="course-overview" class="box tab-content is-active">
<div class="content">
<div class="columns is-centered">
<div class="column is-two-thirds">
<div class="title is-5 has-text-weight-medium">About Course</div>
<div class="content">
<p>{{ page.description }}</p>
</div>
</div>
</div>
</div>
</div>
<div id="course-comments" class="box tab-content is-hidden">
<div class="content">
<div class="title is-5 has-text-weight-medium">Join the conversation</div>
<form class="box" method="post">
<div class="field">
<figure class="image is-48x48">
<img src="https://namastesalesforce.com/wp-content/litespeed/avatar/25fe46c993efce870036b2cb94df4064.jpg?ver=1718713637" alt="Avatar">
</figure>
</div>
<div class="field">
<textarea class="textarea" placeholder="Write your comment here…" name="comment"></textarea>
<input type="hidden" name="comment_post_ID" value="{{ page.id }}">
<input type="hidden" name="comment_parent" value="0">
</div>
<div class="field">
<button type="submit" class="button is-primary is-small">Submit</button>
</div>
</form>
<div class="content"></div>
<div class="buttons is-right"></div>
</div>
</div>
</div>
<!-- Course Progress -->
<div class="box">
<div class="is-flex is-justify-content-space-between">
<span class="has-text-weight-medium has-text-grey-dark">Course Progress</span>
</div>
<div class="content">
<div class="block">
<div class="is-flex is-align-items-center">
<div class="has-text-weight-medium">Your Progress</div>
<div class="ml-auto pl-5">0%</div>
</div>
<progress class="progress is-primary" value="0" max="100">0%</progress>
</div>
<div class="is-half">
<a href="#" class="button is-light is-fullwidth">Back to Course</a>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
document.addEventListener('DOMContentLoaded', () => {
const tabs = document.querySelectorAll('.tab-link');
const tabContents = document.querySelectorAll('.tab-content');
tabs.forEach(tab => {
tab.addEventListener('click', event => {
event.preventDefault();
const target = tab.getAttribute('data-target');
tabs.forEach(t => t.classList.remove('is-active'));
tabContents.forEach(tc => tc.classList.remove('is-active', 'is-hidden'));
tab.classList.add('is-active');
document.getElementById(target).classList.add('is-active');
});
});
const burger = document.querySelector('.navbar-burger');
const menu = document.querySelector('.navbar-menu');
burger.addEventListener('click', () => {
burger.classList.toggle('is-active');
menu.classList.toggle('is-active');
});
});
</script>

0 comments on commit 1849a3e

Please sign in to comment.