From 3d2b7b44d582f72c8ca94b9afbe14cf0cd9e711d Mon Sep 17 00:00:00 2001
From: cuom1999 <lephuocdinh99@gmail.com>
Date: Thu, 2 Jun 2022 17:29:00 -0500
Subject: [PATCH] Add blog hover

---
 resources/blog.scss                 |  3 +++
 templates/three-column-content.html | 14 +++++++-------
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/resources/blog.scss b/resources/blog.scss
index 95e313c..09e49a7 100644
--- a/resources/blog.scss
+++ b/resources/blog.scss
@@ -202,6 +202,9 @@
     background-image: -webkit-linear-gradient(bottom, gray, lightgray 3%, transparent 8%, transparent 100%);
     padding-bottom: 0;
 }
+.pre-expand-blog:hover {
+    background-color: #f3f3f3;
+}
 @media (max-width: 799px) {
     .left-sidebar-header {
         display: none;
diff --git a/templates/three-column-content.html b/templates/three-column-content.html
index 4e54d12..3913a89 100644
--- a/templates/three-column-content.html
+++ b/templates/three-column-content.html
@@ -20,18 +20,18 @@
                 if (url === '#') return;
                 window.location.href = url;
             });
-            $('.blog-description').on('click', function() {
-                var max_height = $(this).css('max-height');
+            $('.blog-box').on('click', function() {
+                var $description = $(this).children('.blog-description');
+                var max_height = $description.css('max-height');
                 if (max_height !== 'fit-content') {
-                    $(this).css('max-height', 'fit-content');
-                    $(this).parent().css('background-image', 'inherit')
-                        .css('padding-bottom', '0.5em');
+                    $description.css('max-height', 'fit-content');
                     $(this).css('cursor', 'auto');
+                    $(this).removeClass('pre-expand-blog');
                 }
             })
-            $('.blog-description').each(function() {
+            $('.blog-box').each(function() {
                 if ($(this).prop('scrollHeight') > $(this).height() ) {
-                    $(this).parent().addClass('pre-expand-blog');
+                    $(this).addClass('pre-expand-blog');
                     $(this).css('cursor', 'pointer');
                 }
             });