Files
front/build/snippets/collapse-accordion.html
2021-12-29 13:15:44 +01:00

3000 lines
141 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required Meta Tags Always Come First -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Title -->
<title>Collapse/Accordion - Snippets | Front - Multipurpose Responsive Template</title>
<!-- Favicon -->
<link rel="shortcut icon" href="../favicon.ico">
<!-- Font -->
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">
<!-- CSS Implementing Plugins -->
<link rel="stylesheet" href="../assets/css/vendor.min.css">
<link rel="stylesheet" href="../assets/vendor/bootstrap-icons/font/bootstrap-icons.css">
<!-- CSS Front Template -->
<link rel="stylesheet" href="../assets/css/theme.min.css?v=1.0">
<link rel="stylesheet" href="../assets/css/snippets.css">
</head>
<body class="navbar-sidebar-aside-lg">
<!-- ========== HEADER ========== -->
<header id="header" class="navbar navbar-expand navbar-fixed navbar-end navbar-light navbar-sticky-lg-top bg-white">
<div class="container-fluid">
<nav class="navbar-nav-wrap">
<div class="row flex-grow-1">
<!-- Default Logo -->
<div class="docs-navbar-sidebar-container d-flex align-items-center mb-2 mb-lg-0">
<a class="navbar-brand" href="../snippets/index.html" aria-label="Space">
<img class="navbar-brand-logo" src="../assets/svg/logos/logo.svg" alt="Logo">
</a>
<a href="../documentation/changelog.html">
<span class="badge bg-soft-primary text-primary">v4.1</span>
</a>
</div>
<!-- End Default Logo -->
<div class="col-md px-lg-0">
<div class="d-flex justify-content-between align-items-center px-lg-5 px-xl-10">
<div class="d-none d-md-block">
<!-- Search Form -->
<form id="snippetsSearch" class="position-relative"
data-hs-list-options='{
"searchMenu": true,
"keyboard": true,
"item": "searchTemplate",
"valueNames": ["component", "category", {"name": "link", "attr": "href"}],
"empty": "#searchNoResults"
}'>
<!-- Input Group -->
<div class="input-group input-group-merge navbar-input-group">
<div class="input-group-prepend input-group-text">
<i class="bi-search"></i>
</div>
<input type="search" class="search form-control form-control-sm" placeholder="Search in snippets" aria-label="Search in snippets">
<a class="input-group-append input-group-text" href="javascript:;">
<i id="clearSearchResultsIcon" class="bi-x" style="display: none;"></i>
</a>
</div>
<!-- End Input Group -->
<!-- List -->
<div class="list dropdown-menu w-100 overflow-auto" style="max-height: 16rem;"></div>
<!-- End List -->
<!-- Empty -->
<div id="searchNoResults" style="display: none;">
<div class="text-center p-4">
<img class="mb-3" src="../assets/svg/illustrations/oc-error.svg" alt="Image Description" style="width: 10rem;">
<p class="mb-0">No Results</p>
</div>
</div>
<!-- End Empty -->
</form>
<!-- End Search Form -->
<!-- List Item Template -->
<div class="d-none">
<div id="searchTemplate" class="dropdown-item">
<a class="d-block link" href="#">
<span class="category d-block fw-normal text-muted mb-1"></span>
<span class="component text-dark"></span>
</a>
</div>
</div>
<!-- End List Item Template -->
</div>
<!-- Navbar -->
<ul class="navbar-nav p-0">
<li class="nav-item">
<a class="btn btn-ghost-secondary btn-sm" href="https://htmlstream.com/contact-us" target="_blank">
Get Support <i class="bi-box-arrow-up-right ms-1"></i>
</a>
</li>
<li class="nav-item">
<a class="btn btn-primary btn-sm" href="../index.html">
<i class="bi-eye me-1"></i> Preview Demo
</a>
</li>
</ul>
<!-- End Navbar -->
</div>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</nav>
</div>
</header>
<!-- ========== END HEADER ========== -->
<!-- ========== MAIN CONTENT ========== -->
<main id="content" role="main">
<!-- Navbar -->
<nav class="js-nav-scroller navbar navbar-expand-lg navbar-sidebar navbar-vertical navbar-light bg-white border-end"
data-hs-nav-scroller-options='{
"type": "vertical",
"target": ".navbar-nav .active",
"offset": 80
}'>
<!-- Navbar Toggle -->
<button type="button" class="navbar-toggler btn btn-white d-grid w-100" data-bs-toggle="collapse" data-bs-target="#navbarVerticalNavMenu" aria-label="Toggle navigation" aria-expanded="false" aria-controls="navbarVerticalNavMenu">
<span class="d-flex justify-content-between align-items-center">
<span class="h6 mb-0">Nav menu</span>
<span class="navbar-toggler-default">
<i class="bi-list"></i>
</span>
<span class="navbar-toggler-toggled">
<i class="bi-x"></i>
</span>
</span>
</button>
<!-- End Navbar Toggle -->
<!-- Navbar Collapse -->
<div id="navbarVerticalNavMenu" class="collapse navbar-collapse">
<div class="navbar-brand-wrapper border-end" style="height: auto;">
<!-- Default Logo -->
<div class="d-flex align-items-center mb-3">
<a class="navbar-brand" href="../snippets/index.html" aria-label="Space">
<img class="navbar-brand-logo" src="../assets/svg/logos/logo.svg" alt="Logo">
</a>
<a class="navbar-brand-badge" href="../documentation/changelog.html">
<span class="badge bg-soft-primary text-primary ms-2">v4.1</span>
</a>
</div>
<!-- End Default Logo -->
<!-- Nav -->
<ul class="nav nav-segment nav-fill nav-justified">
<li class="nav-item">
<a class="nav-link" href="../documentation/index.html">Docs</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="../snippets/index.html">Snippets</a>
</li>
</ul>
<!-- End Nav -->
</div>
<div class="docs-navbar-sidebar-aside-body navbar-sidebar-aside-body">
<ul id="navbarSettings" class="navbar-nav nav nav-vertical nav-tabs nav-tabs-borderless nav-sm">
<li class="nav-item">
<span class="nav-subtitle">Snippets</span>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/index.html">Introduction</a>
</li>
<li class="nav-item my-2 my-lg-5"></li>
<li class="nav-item">
<span class="nav-subtitle">Navbar / Heroes</span>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/navbar.html">Headers (Navbar)</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/hero-sections.html">Hero Sections</a>
</li>
<li class="nav-item my-2 my-lg-5"></li>
<li class="nav-item">
<span class="nav-subtitle">Content</span>
</li>
<li class="nav-item ">
<a class="nav-link dropdown-toggle" href="#snippetsSidebarNavFeaturesCollapse" role="button" data-bs-toggle="collapse" aria-expanded="false" aria-controls="snippetsSidebarNavFeaturesCollapse">Features</a>
<div id="snippetsSidebarNavFeaturesCollapse" class="nav-collapse collapse ">
<a class="nav-link " href="features-general.html">General</a>
<a class="nav-link " href="features-stats.html">Stats</a>
<a class="nav-link " href="features-step.html">Step</a>
<a class="nav-link " href="features-navs.html">Navs (Tabs)</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/icon-blocks.html">Icon Blocks</a>
</li>
<li class="nav-item ">
<a class="nav-link dropdown-toggle" href="#snippetsSidebarNavCardsCollapse" role="button" data-bs-toggle="collapse" aria-expanded="false" aria-controls="snippetsSidebarNavCardsCollapse">Cards</a>
<div id="snippetsSidebarNavCardsCollapse" class="nav-collapse collapse ">
<a class="nav-link " href="cards-grid.html">Grid</a>
<a class="nav-link " href="cards-list.html">List</a>
</div>
</li>
<li class="nav-item ">
<a class="nav-link dropdown-toggle" href="#snippetsSidebarNavDirectoryCollapse" role="button" data-bs-toggle="collapse" aria-expanded="false" aria-controls="snippetsSidebarNavDirectoryCollapse">Directory</a>
<div id="snippetsSidebarNavDirectoryCollapse" class="nav-collapse collapse ">
<a class="nav-link " href="directory-grid.html">Grid</a>
<a class="nav-link " href="directory-list.html">List</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/testimonials.html">Testimonials</a>
</li>
<li class="nav-item ">
<a class="nav-link dropdown-toggle" href="#snippetsSidebarNavBlogsCollapse" role="button" data-bs-toggle="collapse" aria-expanded="false" aria-controls="snippetsSidebarNavBlogsCollapse">Blogs</a>
<div id="snippetsSidebarNavBlogsCollapse" class="nav-collapse collapse ">
<a class="nav-link " href="blogs-grid.html">Grid</a>
<a class="nav-link " href="blogs-list.html">List</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/tables.html">Tables</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/ecommerce.html">E-commerce</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/pricing.html">Pricing</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/team-sections.html">Team Sections</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/breadcrumb.html">Breadcrumb</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/cta.html">Call-to-Action (CTA)</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/modals.html">Modals</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/portfolio.html">Portfolio</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/gallery.html">Gallery</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/clients.html">Clients</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/countdown.html">Countdown</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/faq.html">FAQ</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/lists.html">Lists</a>
</li>
<li class="nav-item">
<a class="nav-link active" href="../snippets/collapse-accordion.html">Collapse/Accordion</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/comments.html">Comments</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/feedback-and-reviews.html">Feedback &amp; Reviews</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/user-profile.html">User Profile</a>
</li>
<li class="nav-item">
<a class="nav-link " href="sidebar-examples.html">Sidebar Examples</a>
</li>
<li class="nav-item">
<a class="nav-link " href="calendar-view.html">Calendar View</a>
</li>
<li class="nav-item">
<a class="nav-link " href="notification.html">Notification</a>
</li>
<li class="nav-item">
<a class="nav-link " href="content-sections.html">Content Sections</a>
</li>
<li class="nav-item my-2 my-lg-5"></li>
<li class="nav-item">
<small class="nav-subtitle">Forms</small>
</li>
<li class="nav-item">
<a class="nav-link " href="forms-authentication.html">Authentication</a>
</li>
<li class="nav-item">
<a class="nav-link " href="forms-feedback.html">Feedback</a>
</li>
<li class="nav-item">
<a class="nav-link " href="forms-filters.html">Filters</a>
</li>
<li class="nav-item">
<a class="nav-link " href="forms-search.html">Search</a>
</li>
<li class="nav-item">
<a class="nav-link " href="forms-directory.html">Directory</a>
</li>
<li class="nav-item">
<a class="nav-link " href="forms-subscribe.html">Subscribe</a>
</li>
<li class="nav-item">
<a class="nav-link " href="forms-account.html">Account</a>
</li>
<li class="nav-item">
<a class="nav-link " href="forms-wizard-and-steps.html">Wizard &amp; Steps</a>
</li>
<li class="nav-item my-2 my-lg-5"></li>
<li class="nav-item">
<small class="nav-subtitle">Contact / Footer</small>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/contact-sections.html">Contact Sections</a>
</li>
<li class="nav-item">
<a class="nav-link " href="../snippets/footer.html">Footer</a>
</li>
</ul>
</div>
</div>
<!-- End Navbar Collapse -->
</nav>
<!-- End Navbar -->
<!-- Content -->
<div class="navbar-sidebar-aside-content content-space-1 content-space-md-2 px-lg-5 px-xl-10">
<!-- Page Header -->
<div class="docs-page-header">
<div class="row align-items-center">
<div class="col-sm">
<h1 class="docs-page-header-title">Collapse/Accordion</h1>
</div>
</div>
</div>
<!-- End Page Header -->
<!-- Heading -->
<h2 id="component-1" class="hs-docs-heading">
Component #1 <a class="anchorjs-link" href="#component-1" aria-label="Anchor" data-anchorjs-icon="#"></a>
</h2>
<!-- End Heading -->
<!-- Card -->
<div class="card">
<!-- Header -->
<div class="card-header">
<!-- Nav -->
<ul class="nav nav-segment" id="navTab1" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="nav-resultTab1" href="#nav-result1" data-bs-toggle="pill" data-bs-target="#nav-result1" role="tab" aria-controls="nav-result1" aria-selected="true">Preview</a>
</li>
<li class="nav-item">
<a class="nav-link" id="nav-htmlTab1" href="#nav-html1" data-bs-toggle="pill" data-bs-target="#nav-html1" role="tab" aria-controls="nav-html1" aria-selected="false">HTML</a>
</li>
</ul>
<!-- End Nav -->
</div>
<!-- End Header -->
<!-- Tab Content -->
<div class="tab-content" id="navTabContent1">
<div class="tab-pane fade p-4 show active" id="nav-result1" role="tabpanel" aria-labelledby="nav-resultTab1">
<!-- Accordion -->
<div class="border-top pt-7">
<div class="row mb-4">
<div class="col-8">
<h3 class="mb-0">Course content</h3>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<span class="small">186 lectures</span>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">24:10:28</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
<!-- End Row -->
<!-- Accordion -->
<div class="accordion accordion-btn-icon-start">
<!-- Accordion Item -->
<div class="accordion-item">
<div class="accordion-header" id="headingBasicsOne">
<a class="accordion-button" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseOne" aria-expanded="true" aria-controls="accordionCourseOne">
<div class="flex-grow-1 ps-3">
<div class="row">
<div class="col-8">
Course overview
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<span class="small text-muted fw-normal">5 lectures</span>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small text-muted fw-normal">15:32</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
</a>
</div>
<div id="accordionCourseOne" class="accordion-collapse collapse show" aria-labelledby="headingBasicsOne">
<div class="accordion-body">
<!-- List Group -->
<div class="list-group list-group-flush list-group-no-gutters">
<!-- Item -->
<div class="list-group-item">
<div class="row">
<div class="col-8">
<a class="d-flex" href="#">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Course introduction</span>
</div>
</a>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<a class="small" href="#">Preview</a>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="text-primary small">06:39</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item">
<div class="row">
<div class="col-8">
<a class="d-flex" href="#">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Course curriculum overview</span>
</div>
</a>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<a class="small" href="#">Preview</a>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="text-primary small">04:00</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item">
<div class="row">
<div class="col-8">
<a class="d-flex" href="#">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Python 2 versus Python 3</span>
</div>
</a>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<a class="small" href="#">Preview</a>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="text-primary small">06:39</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
</div>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Accordion Item -->
<!-- Accordion Item -->
<div class="accordion-item">
<div class="accordion-header" id="headingBasicsTwo">
<a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseTwo" aria-expanded="false" aria-controls="accordionCourseTwo">
<div class="ps-3">Python setup</div>
</a>
</div>
<div id="accordionCourseTwo" class="accordion-collapse collapse" aria-labelledby="headingBasicsTwo">
<div class="accordion-body">
<!-- List Group -->
<div class="list-group list-group-flush list-group-no-gutters">
<!-- Item -->
<div class="list-group-item">
<div class="row">
<div class="col-8">
<a class="d-flex" href="#">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Course line courses</span>
</div>
</a>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<a class="small" href="#">Preview</a>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="text-primary small">08:15</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item">
<div class="row">
<div class="col-8">
<a class="d-flex" href="#">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Installing Python (Step by step)</span>
</div>
</a>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<a class="small" href="#">Preview</a>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="text-primary small">08:18</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item">
<div class="row">
<div class="col-8">
<a class="d-flex" href="#">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Running Python code</span>
</div>
</a>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<a class="small" href="#">Preview</a>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="text-primary small">17:50</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Getting the notebooks and the course material</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">02:22</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Git and Github overview (Optional)</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">02:49</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
</div>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Accordion Item -->
<!-- Accordion Item -->
<div class="accordion-item">
<div class="accordion-header" id="headingBasicsThree">
<a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseThree" aria-expanded="false" aria-controls="accordionCourseThree">
<div class="ps-3">Python object and data structure courses</div>
</a>
</div>
<div id="accordionCourseThree" class="accordion-collapse collapse" aria-labelledby="headingBasicsThree">
<div class="accordion-body">
<!-- List Group -->
<div class="list-group list-group-flush list-group-no-gutters">
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Introduction to Python Data Types</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">04:02</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item">
<div class="row">
<div class="col-8">
<a class="d-flex" href="#">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Python numbers</span>
</div>
</a>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<a class="small" href="#">Preview</a>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="text-primary small">04:11</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Numbers: Simple Arithmetic</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">1 question</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Numbers - FAQ</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">02:49</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Numbers Quiz</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">3 questions</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
</div>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Accordion Item -->
<!-- Accordion Item -->
<div class="accordion-item">
<div class="accordion-header" id="headingBasicsFour">
<a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseFour" aria-expanded="false" aria-controls="accordionCourseFour">
<div class="ps-3">Python comparison operators</div>
</a>
</div>
<div id="accordionCourseFour" class="accordion-collapse collapse" aria-labelledby="headingBasicsFour">
<div class="accordion-body">
<!-- List Group -->
<div class="list-group list-group-flush list-group-no-gutters">
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Comparison Operators in Python</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">03:26</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Chaining Comparison Operators in Python with Logical Operators</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">05:42</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-lightning-charge-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Comparison Operators Quiz</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">5 questions</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
</div>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Accordion Item -->
<!-- Accordion Item -->
<div class="accordion-item">
<div class="accordion-header" id="headingBasicsFive">
<a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseFive" aria-expanded="false" aria-controls="accordionCourseFive">
<div class="ps-3">Python statements</div>
</a>
</div>
<div id="accordionCourseFive" class="accordion-collapse collapse" aria-labelledby="headingBasicsFive">
<div class="accordion-body">
<!-- List Group -->
<div class="list-group list-group-flush list-group-no-gutters">
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">If Elif and Else Statements in Python</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">09:06</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">For Loops in Python</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">18:17</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">While Loops in Python</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">10:35</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Useful Operators in Python</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">16:08</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">List Comprehensions in Python</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">11:26</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Python Statements Test Overview</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">02:27</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Python Statements Test Solutions</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">07:19</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
</div>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Accordion Item -->
<!-- Accordion Item -->
<div class="accordion-item">
<div class="accordion-header" id="headingBasicsSix">
<a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseSix" aria-expanded="false" aria-controls="accordionCourseSix">
<div class="ps-3">Modules and packages</div>
</a>
</div>
<div id="accordionCourseSix" class="accordion-collapse collapse" aria-labelledby="headingBasicsSix">
<div class="accordion-body">
<!-- List Group -->
<div class="list-group list-group-flush list-group-no-gutters">
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">If Elif and Else Statements in Python</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<span class="small">3 lectures</span>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">29:10</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Pip Install and PyPi</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">07:46</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Modules and Packages</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">11:39</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
</div>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Accordion Item -->
<!-- Accordion Item -->
<div class="accordion-item">
<div class="accordion-header" id="headingBasicsSeven">
<a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseSeven" aria-expanded="false" aria-controls="accordionCourseSeven">
<div class="ps-3">Errors and exceptions handling</div>
</a>
</div>
<div id="accordionCourseSeven" class="accordion-collapse collapse" aria-labelledby="headingBasicsSeven">
<div class="accordion-body">
<!-- List Group -->
<div class="list-group list-group-flush list-group-no-gutters">
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Errors and exceptions handling</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
<span class="small">5 lectures</span>
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">45:14</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Errors and Exception Handling</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">17:19</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Errors and Exceptions Homework</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">01:30</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Errors and Exception Homework - Solutions</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">05:16</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Pylint Overview</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">11:36</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
<!-- Item -->
<div class="list-group-item text-muted">
<div class="row">
<div class="col-8">
<div class="d-flex">
<div class="flex-shrink-0">
<i class="bi-play-circle-fill small"></i>
</div>
<div class="flex-grow-1 ms-2">
<span class="small">Running tests with the Unittest Library</span>
</div>
</div>
</div>
<!-- End Col -->
<div class="col-4 text-end">
<div class="row">
<div class="col-lg-6">
</div>
<!-- End Col -->
<div class="col-lg-6">
<span class="small">09:33</span>
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
<!-- End Col -->
</div>
</div>
<!-- End Item -->
</div>
<!-- End List Group -->
</div>
</div>
</div>
<!-- End Accordion Item -->
</div>
<!-- End Accordion -->
<!-- Link -->
<div class="mt-3">
<a class="link small">2 more sections</a>
</div>
<!-- End Link -->
</div>
<!-- End Accordion -->
</div>
<div class="tab-pane fade" id="nav-html1" role="tabpanel" aria-labelledby="nav-htmlTab1">
<pre>
<code class="language-markup" data-lang="html">
&lt;!-- Accordion --&gt;
&lt;div class="border-top pt-7 mt-7"&gt;
&lt;div class="row mb-4"&gt;
&lt;div class="col-8"&gt;
&lt;h3 class="mb-0"&gt;Course content&lt;/h3&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;186 lectures&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;24:10:28&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;!-- Accordion --&gt;
&lt;div class="accordion accordion-btn-icon-start"&gt;
&lt;!-- Accordion Item --&gt;
&lt;div class="accordion-item"&gt;
&lt;div class="accordion-header" id="headingBasicsOne"&gt;
&lt;a class="accordion-button" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseOne" aria-expanded="true" aria-controls="accordionCourseOne"&gt;
&lt;div class="flex-grow-1 ps-3"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
Course overview
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small text-muted fw-normal"&gt;5 lectures&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small text-muted fw-normal"&gt;15:32&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;div id="accordionCourseOne" class="accordion-collapse collapse show" aria-labelledby="headingBasicsOne"&gt;
&lt;div class="accordion-body"&gt;
&lt;!-- List Group --&gt;
&lt;div class="list-group list-group-flush list-group-no-gutters"&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;a class="d-flex" href="#"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Course introduction&lt;/span&gt;
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;a class="small" href="#"&gt;Preview&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="text-primary small"&gt;06:39&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;a class="d-flex" href="#"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Course curriculum overview&lt;/span&gt;
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;a class="small" href="#"&gt;Preview&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="text-primary small"&gt;04:00&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;a class="d-flex" href="#"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Python 2 versus Python 3&lt;/span&gt;
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;a class="small" href="#"&gt;Preview&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="text-primary small"&gt;06:39&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;/div&gt;
&lt;!-- End List Group --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Accordion Item --&gt;
&lt;!-- Accordion Item --&gt;
&lt;div class="accordion-item"&gt;
&lt;div class="accordion-header" id="headingBasicsTwo"&gt;
&lt;a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseTwo" aria-expanded="false" aria-controls="accordionCourseTwo"&gt;
&lt;div class="ps-3"&gt;Python setup&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;div id="accordionCourseTwo" class="accordion-collapse collapse" aria-labelledby="headingBasicsTwo"&gt;
&lt;div class="accordion-body"&gt;
&lt;!-- List Group --&gt;
&lt;div class="list-group list-group-flush list-group-no-gutters"&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;a class="d-flex" href="#"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Course line courses&lt;/span&gt;
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;a class="small" href="#"&gt;Preview&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="text-primary small"&gt;08:15&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;a class="d-flex" href="#"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Installing Python (Step by step)&lt;/span&gt;
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;a class="small" href="#"&gt;Preview&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="text-primary small"&gt;08:18&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;a class="d-flex" href="#"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Running Python code&lt;/span&gt;
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;a class="small" href="#"&gt;Preview&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="text-primary small"&gt;17:50&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Getting the notebooks and the course material&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;02:22&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Git and Github overview (Optional)&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;02:49&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;/div&gt;
&lt;!-- End List Group --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Accordion Item --&gt;
&lt;!-- Accordion Item --&gt;
&lt;div class="accordion-item"&gt;
&lt;div class="accordion-header" id="headingBasicsThree"&gt;
&lt;a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseThree" aria-expanded="false" aria-controls="accordionCourseThree"&gt;
&lt;div class="ps-3"&gt;Python object and data structure courses&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;div id="accordionCourseThree" class="accordion-collapse collapse" aria-labelledby="headingBasicsThree"&gt;
&lt;div class="accordion-body"&gt;
&lt;!-- List Group --&gt;
&lt;div class="list-group list-group-flush list-group-no-gutters"&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Introduction to Python Data Types&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;04:02&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;a class="d-flex" href="#"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Python numbers&lt;/span&gt;
&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;a class="small" href="#"&gt;Preview&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="text-primary small"&gt;04:11&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Numbers: Simple Arithmetic&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;1 question&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Numbers - FAQ&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;02:49&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Numbers Quiz&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;3 questions&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;/div&gt;
&lt;!-- End List Group --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Accordion Item --&gt;
&lt;!-- Accordion Item --&gt;
&lt;div class="accordion-item"&gt;
&lt;div class="accordion-header" id="headingBasicsFour"&gt;
&lt;a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseFour" aria-expanded="false" aria-controls="accordionCourseFour"&gt;
&lt;div class="ps-3"&gt;Python comparison operators&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;div id="accordionCourseFour" class="accordion-collapse collapse" aria-labelledby="headingBasicsFour"&gt;
&lt;div class="accordion-body"&gt;
&lt;!-- List Group --&gt;
&lt;div class="list-group list-group-flush list-group-no-gutters"&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Comparison Operators in Python&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;03:26&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Chaining Comparison Operators in Python with Logical Operators&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;05:42&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-lightning-charge-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Comparison Operators Quiz&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;5 questions&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;/div&gt;
&lt;!-- End List Group --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Accordion Item --&gt;
&lt;!-- Accordion Item --&gt;
&lt;div class="accordion-item"&gt;
&lt;div class="accordion-header" id="headingBasicsFive"&gt;
&lt;a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseFive" aria-expanded="false" aria-controls="accordionCourseFive"&gt;
&lt;div class="ps-3"&gt;Python statements&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;div id="accordionCourseFive" class="accordion-collapse collapse" aria-labelledby="headingBasicsFive"&gt;
&lt;div class="accordion-body"&gt;
&lt;!-- List Group --&gt;
&lt;div class="list-group list-group-flush list-group-no-gutters"&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;If Elif and Else Statements in Python&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;09:06&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;For Loops in Python&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;18:17&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;While Loops in Python&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;10:35&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Useful Operators in Python&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;16:08&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;List Comprehensions in Python&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;11:26&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Python Statements Test Overview&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;02:27&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Python Statements Test Solutions&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;07:19&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;/div&gt;
&lt;!-- End List Group --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Accordion Item --&gt;
&lt;!-- Accordion Item --&gt;
&lt;div class="accordion-item"&gt;
&lt;div class="accordion-header" id="headingBasicsSix"&gt;
&lt;a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseSix" aria-expanded="false" aria-controls="accordionCourseSix"&gt;
&lt;div class="ps-3"&gt;Modules and packages&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;div id="accordionCourseSix" class="accordion-collapse collapse" aria-labelledby="headingBasicsSix"&gt;
&lt;div class="accordion-body"&gt;
&lt;!-- List Group --&gt;
&lt;div class="list-group list-group-flush list-group-no-gutters"&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;If Elif and Else Statements in Python&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;3 lectures&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;29:10&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Pip Install and PyPi&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;07:46&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Modules and Packages&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;11:39&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;/div&gt;
&lt;!-- End List Group --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Accordion Item --&gt;
&lt;!-- Accordion Item --&gt;
&lt;div class="accordion-item"&gt;
&lt;div class="accordion-header" id="headingBasicsSeven"&gt;
&lt;a class="accordion-button collapsed" role="button" data-bs-toggle="collapse" data-bs-target="#accordionCourseSeven" aria-expanded="false" aria-controls="accordionCourseSeven"&gt;
&lt;div class="ps-3"&gt;Errors and exceptions handling&lt;/div&gt;
&lt;/a&gt;
&lt;/div&gt;
&lt;div id="accordionCourseSeven" class="accordion-collapse collapse" aria-labelledby="headingBasicsSeven"&gt;
&lt;div class="accordion-body"&gt;
&lt;!-- List Group --&gt;
&lt;div class="list-group list-group-flush list-group-no-gutters"&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Errors and exceptions handling&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;5 lectures&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;45:14&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Errors and Exception Handling&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;17:19&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Errors and Exceptions Homework&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;01:30&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Errors and Exception Homework - Solutions&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;05:16&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Pylint Overview&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;11:36&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;!-- Item --&gt;
&lt;div class="list-group-item text-muted"&gt;
&lt;div class="row"&gt;
&lt;div class="col-8"&gt;
&lt;div class="d-flex"&gt;
&lt;div class="flex-shrink-0"&gt;
&lt;i class="bi-play-circle-fill small"&gt;&lt;/i&gt;
&lt;/div&gt;
&lt;div class="flex-grow-1 ms-2"&gt;
&lt;span class="small"&gt;Running tests with the Unittest Library&lt;/span&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-4 text-end"&gt;
&lt;div class="row"&gt;
&lt;div class="col-lg-6"&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;div class="col-lg-6"&gt;
&lt;span class="small"&gt;09:33&lt;/span&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;!-- End Row --&gt;
&lt;/div&gt;
&lt;!-- End Col --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Item --&gt;
&lt;/div&gt;
&lt;!-- End List Group --&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;!-- End Accordion Item --&gt;
&lt;/div&gt;
&lt;!-- End Accordion --&gt;
&lt;!-- Link --&gt;
&lt;div class="mt-3"&gt;
&lt;a class="link small"&gt;2 more sections&lt;/a&gt;
&lt;/div&gt;
&lt;!-- End Link --&gt;
&lt;/div&gt;
&lt;!-- End Accordion --&gt;
</code>
</pre>
</div>
</div>
<!-- End Tab Content -->
</div>
<!-- End Card -->
</div>
<!-- End Content -->
</main>
<!-- ========== END MAIN CONTENT ========== -->
<!-- ========== SECONDARY CONTENTS ========== -->
<!-- Go To -->
<a class="js-go-to go-to position-fixed" href="javascript:;" style="visibility: hidden;"
data-hs-go-to-options='{
"offsetTop": 700,
"position": {
"init": {
"right": "2rem"
},
"show": {
"bottom": "2rem"
},
"hide": {
"bottom": "-2rem"
}
}
}'>
<i class="bi-chevron-up"></i>
</a>
<!-- ========== END SECONDARY CONTENTS ========== -->
<!-- JS Implementing Plugins -->
<script src="../assets/js/vendor.min.js"></script>
<!-- JS Front -->
<script src="../assets/js/theme.min.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF HEADER
// =======================================================
new HSHeader('#header').init()
// INITIALIZATION OF NAV SCROLLER
// =======================================================
new HsNavScroller('.js-nav-scroller', {
delay: 400,
offset: 140
})
// INITIALIZATION OF LISTJS COMPONENT
// =======================================================
HSCore.components.HSList.init('#snippetsSearch')
const snippetsSearch = HSCore.components.HSList.getItem('snippetsSearch')
// GET JSON FILE RESULTS
// =======================================================
fetch('../assets/json/snippets-search.json')
.then(response => response.json())
.then(data => {
snippetsSearch.add(data)
})
// INITIALIZATION OF GO TO
// =======================================================
new HSGoTo('.js-go-to')
})()
</script>
</body>
</html>