Commit 8ecb3aa9 authored by Zac Wood's avatar Zac Wood

chevron changes direction on expand

parent e84ff52f
Pipeline #3372 passed with stage
in 2 minutes and 12 seconds
// Place all the behaviors and hooks related to the matching controller here.
// All this logic will automatically be available in application.js.
const sectionWithCrn = crn => document.getElementById('search-list').querySelector(`[data-crn="${crn}"]`);
/**
* Either adds or removes a section from the cart depending on
* if it is currently in the cart.
......@@ -24,11 +22,17 @@ const addOrRemoveFromCart = async (event, sectionNode) => {
*/
const toggleSections = course => {
const sections = course.querySelector('.sections');
const chev = $(course.querySelector('#course-chevron'));
const label = course.querySelector('#chevron-label');
if (sections.style.display === 'flex') {
sections.style.display = 'none';
chev.addClass('fa-chevron-down').removeClass('fa-chevron-up');
label.innerText = 'Expand';
} else {
sections.style.display = 'flex';
chev.addClass('fa-chevron-up').removeClass('fa-chevron-down');
label.innerText = 'Minimize';
}
};
......
......@@ -8,10 +8,11 @@
}
.section-item.selected {
transition: 0.15s;
background-color: lightgreen;
}
.section-item.selected:hover {
transition: 0.15s;
background-color: red;
background-color: rgba(255, 0, 0, 0.6);
}
......@@ -24,8 +24,7 @@
<div class="icon">
<i class="fa fa-bars"></i>
</div>
<!-- TODO: FIX THIS -->
<%#= "#{course.section_count}" %> <%= course.course_sections.count %> sections
<%= course.course_sections.count %> sections
</div>
</div>
<p class="description"><%= course.description %></p>
......@@ -37,8 +36,8 @@
<% end %>
<div class="d-block" style="text-align: center">
<p style="margin-bottom:-4px; font-size: 10px;">Expand</p>
<i class="fas fa-chevron-down"></i>
<p id="chevron-label" style="margin-bottom:-4px; font-size: 10px;">Expand</p>
<i id="course-chevron" class="fas fa-chevron-down"></i>
</div>
<!-- List of Course Sections -->
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment