Improve: Aside slider: close slider when click on the outside of slider (#4061)

* CSS + PHTML

* give some grey background

* fixed whitespace

* fixed RTL

* close area just for mobile view

1 files changed, 17 insertions, 0 deletions

diff --git a/p/themes/base-theme/template.css b/p/themes/base-theme/template.css
index d6c7f3337..5238ebbdb 100644
--- a/p/themes/base-theme/template.css
+++ b/p/themes/base-theme/template.css
@@ -664,6 +664,10 @@ input[type="search"] {
 	vertical-align: top;
 }
 
+.aside + .close-aside {
+	display: none;
+}
+
 /*=== Aside main page */
 .aside_feed .category .title {
 	width: calc(100% - 35px);
@@ -1431,6 +1435,19 @@ input:checked + .slide-container .properties {
 		display: inline-block;
 	}
 
+	.aside:target + .close-aside {
+		background: rgba(0, 0, 0, 0.2);
+		display: block;
+		font-size: 0;
+		position: fixed;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		cursor: pointer;
+		z-index: 99;
+	}
+
 	.nav_mobile {
 		display: block;
 	}