122 lines
2.8 KiB
Plaintext
122 lines
2.8 KiB
Plaintext
{% include "header" %}
|
|
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
|
|
|
<main class="np-main np-catalog np-subpage-container np-max-width">
|
|
<div class="np-catalog-header-wrapper catalog-header-wrapper">
|
|
|
|
<div class="np-catalog-header">
|
|
<div class="np-resource-title catalog-title">Catalog</div>
|
|
</div>
|
|
<form action="{% route search %}" method="get" data-test="desktop-search" class="catalog-search-wrapper">
|
|
<input
|
|
aria-label="search_topics"
|
|
class="np-header-font-background-color catalog-search"
|
|
type="text"
|
|
name="q"
|
|
placeholder="Search Topics"
|
|
/>
|
|
<i class="far fa-search search-icon"></i>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="filter-buttons-container">
|
|
{% include "filter_by_product", page: 'Homepage' %}
|
|
|
|
{% capture label %}{% t shared.filters.by_category %}{% endcapture %}
|
|
{% if current_school.filterable_categories.any? %}
|
|
{%
|
|
include "filter_by_category",
|
|
label: label
|
|
%}
|
|
{% endif %}
|
|
</div>
|
|
|
|
{% assign renderPopular = false %}
|
|
{% assign totalCount = 0 %}
|
|
{% if courses.enrolled.any? %}
|
|
{% for course in courses.enrolled %}
|
|
{% if course.properties.most_popular == true %}
|
|
{% assign totalCount = totalCount | plus : 1 %}
|
|
{% assign renderPopular = true %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
{% endif %}
|
|
|
|
{% if renderPopular == true %}
|
|
{%- comment -%} {% if totalCount > 3 %}
|
|
{% include "popular_courses_carousel" %}
|
|
{% else %}
|
|
{% endif %} {%- endcomment -%}
|
|
{% include "popular_courses_non_carousel" %}
|
|
{% endif %}
|
|
|
|
{% if courses.enrolled.any? %}
|
|
{% include "courses_catalog" %}
|
|
{% else %}
|
|
{% capture message %}
|
|
{% t shared.zero_state.courses.catalog,
|
|
key: current_school.course_vocabulary
|
|
%}
|
|
{% endcapture %}
|
|
|
|
{% include "courses_zero_state", message: message %}
|
|
{% endif %}
|
|
|
|
</main>
|
|
{% include "footer" %}
|
|
|
|
<style>
|
|
.catalog-header-wrapper{
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.catalog-title{
|
|
color: #000000;
|
|
font-size: 32px;
|
|
font-weight: 400;
|
|
line-height: 25px;
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.catalog-search-wrapper{
|
|
position: relative;
|
|
}
|
|
|
|
.catalog-search{
|
|
border: 1px solid #D9D9D9;
|
|
height: 60px;
|
|
padding-left: 75px;
|
|
width: 100%;
|
|
}
|
|
|
|
.search-icon{
|
|
left: 30px;
|
|
position: absolute;
|
|
top: 23px;
|
|
}
|
|
|
|
.homepage-resource-header{
|
|
color: #000000;
|
|
font-size: 24px;
|
|
font-weight: 600;
|
|
line-height: 25px;
|
|
margin-bottom: 12px
|
|
}
|
|
|
|
@media screen and (min-width: 768px){
|
|
.np-catalog-courses{
|
|
margin: 0;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.np-subpage-container{
|
|
padding: 50px 24px 184px;
|
|
}
|
|
|
|
.dropdown-menu{
|
|
left: 0;
|
|
right: unset;
|
|
}
|
|
}
|
|
</style> |