From 0b5d4ee03a468e5aaa80fe69c4e6264a340538b1 Mon Sep 17 00:00:00 2001
From: Konstantinos Platis <konstantinos.platis@cern.ch>
Date: Tue, 12 Jan 2021 14:43:18 +0000
Subject: [PATCH] Fix mega menu items not being clickable when boxes are in
background (z-index issue)
---
CHANGELOG.md | 1 +
patterns/molecules/media/css/media.component.css | 2 +-
patterns/molecules/media/sass/media.component.scss | 2 +-
patterns/molecules/preview-card/css/component-preview-card.css | 2 +-
.../molecules/preview-card/sass/component-preview-card.scss | 2 +-
5 files changed, 5 insertions(+), 4 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 032433ba..a636a66a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
## [2.7.9] - 12/01/2021
- Add id attribute in section (row) component generated from title
+- Fix mega menu items not being clickable when boxes are in background (z-index issue)
## [2.7.8] - 17/12/2020
diff --git a/patterns/molecules/media/css/media.component.css b/patterns/molecules/media/css/media.component.css
index dfe4cc4e..7937252a 100755
--- a/patterns/molecules/media/css/media.component.css
+++ b/patterns/molecules/media/css/media.component.css
@@ -39,7 +39,7 @@
padding: 30px 40px;
cursor: pointer; }
.component-media-content .box-link {
- z-index: 1000;
+ z-index: 100;
position: absolute;
top: 0;
left: 0;
diff --git a/patterns/molecules/media/sass/media.component.scss b/patterns/molecules/media/sass/media.component.scss
index 2f709191..971d5811 100755
--- a/patterns/molecules/media/sass/media.component.scss
+++ b/patterns/molecules/media/sass/media.component.scss
@@ -56,7 +56,7 @@
cursor: pointer;
.box-link{
- z-index: 1000;
+ z-index: 100;
position: absolute;
top: 0;
left: 0;
diff --git a/patterns/molecules/preview-card/css/component-preview-card.css b/patterns/molecules/preview-card/css/component-preview-card.css
index 4035291a..bf30ce10 100644
--- a/patterns/molecules/preview-card/css/component-preview-card.css
+++ b/patterns/molecules/preview-card/css/component-preview-card.css
@@ -48,7 +48,7 @@
background-position: center;
background-size: auto 70%; */ }
.component-preview-cards .box-link {
- z-index: 1000;
+ z-index: 100;
position: absolute;
top: 0;
left: 0;
diff --git a/patterns/molecules/preview-card/sass/component-preview-card.scss b/patterns/molecules/preview-card/sass/component-preview-card.scss
index 49f86c43..8932b75c 100644
--- a/patterns/molecules/preview-card/sass/component-preview-card.scss
+++ b/patterns/molecules/preview-card/sass/component-preview-card.scss
@@ -61,7 +61,7 @@
background-size: auto 70%; */
.box-link{
- z-index: 1000;
+ z-index: 100;
position: absolute;
top: 0;
left: 0;
--
GitLab