You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@royale.apache.org by ca...@apache.org on 2019/09/25 22:03:56 UTC
[royale-docs] branch master updated: add semitransparante bakground
layer when sidebar is open
This is an automated email from the ASF dual-hosted git repository.
carlosrovira pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/royale-docs.git
The following commit(s) were added to refs/heads/master by this push:
new 36fad33 add semitransparante bakground layer when sidebar is open
36fad33 is described below
commit 36fad332615a70c0b7de19ed4f3cd8cf68443da0
Author: Carlos Rovira <ca...@apache.org>
AuthorDate: Thu Sep 26 00:03:48 2019 +0200
add semitransparante bakground layer when sidebar is open
---
_layouts/docpage.html | 5 +++--
_sass/sidebar.sass | 14 ++++++++++++++
2 files changed, 17 insertions(+), 2 deletions(-)
diff --git a/_layouts/docpage.html b/_layouts/docpage.html
index cd13018..6cd8cc6 100644
--- a/_layouts/docpage.html
+++ b/_layouts/docpage.html
@@ -40,7 +40,7 @@ limitations under the License.
<title>{{page.title}}</title>
</head>
-<body class="page">
+<body class="page" id="main">
{% include header.html %}
<div class="toc_and_doc">
@@ -81,12 +81,13 @@ limitations under the License.
if(toc.classList.contains("open"))
{
titanic.items[0].off();
+ main.classList.remove("noscroll");
toc.classList.remove("open");
-
}
else
{
titanic.items[0].on();
+ main.classList.add("noscroll");
toc.classList.add("open");
}
}
diff --git a/_sass/sidebar.sass b/_sass/sidebar.sass
index f2a077e..8309fb1 100644
--- a/_sass/sidebar.sass
+++ b/_sass/sidebar.sass
@@ -82,6 +82,20 @@
.open
//right: 0px
transform: translateX(0%)
+ .noscroll
+ pointer-events: none
+ position: fixed
+ &::before
+ background-color: rgba(0,0,0,0.65)
+ position: absolute
+ content: ""
+ top: 0
+ left: 0
+ width: 100%
+ height: 100%
+ will-change: opacity
+ transition: opacity 0.4s 0ms
+
.sidebar
display: flex