From a9d96a1aaf8ac630689e4f9836b7131346dde396 Mon Sep 17 00:00:00 2001
From: ChloeLiang <nliangxin@gmail.com>
Date: Thu, 12 Aug 2021 18:56:26 +0800
Subject: [PATCH] Update hover effect for online course icon

---
 _includes/online-courses.html | 4 ++--
 _sass/components/card.scss    | 6 ++++++
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/_includes/online-courses.html b/_includes/online-courses.html
index a4f86b803..928e06430 100644
--- a/_includes/online-courses.html
+++ b/_includes/online-courses.html
@@ -57,12 +57,12 @@ <h2><span>Online Courses</span></h2>
         <div class="card-text">
           <h4>
             {% if course.coursera-page %}
-              <a href="{{course.coursera-page}}">
+              <a class="course-icon" href="{{course.coursera-page}}">
                 <img src="/resources/img/frontpage/coursera-icon.png" alt="">
               </a>
             {% endif %}
             {% if course.edx-page %}
-              <a href="{{course.edx-page}}">
+              <a class="course-icon" href="{{course.edx-page}}">
                 <img src="/resources/img/frontpage/edx-icon.png" alt="">
               </a>
             {% endif %}
diff --git a/_sass/components/card.scss b/_sass/components/card.scss
index 67a660b65..8ce1cf495 100755
--- a/_sass/components/card.scss
+++ b/_sass/components/card.scss
@@ -62,6 +62,12 @@
 
         line-height: normal;
 
+        &:hover {
+            .course-icon {
+                transform: scale(1.2);
+            }
+        }
+
         .card-text {
 
             margin-left: 0;