aitzol/Plume
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update _header.scss

Browse Source 
The menu does not open on iOS Safari because of how it can't handle translateZ, and needs an -webkit specific prefix for the @keyframes property for the animation to work. This PR fixes the issue.
This commit is contained in:
Marek Ľach 2021-01-10 18:32:21 +01:00 committed by GitHub
parent f33b057961
commit b059fb48fc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
assets/themes/default/_header.scss
View File

@ -19,7 +19,7 @@ body > header {
a {
transform: skewX(15deg);
display: flex;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
@ -204,8 +204,10 @@ body > header {
display: block;
position: absolute;
left: 50%;
transform: translate(-50%, 0);
transform: translateZ(0);
transform: translate(-50%, 0);
transform: translateZ(0);
-webkit-transform: none !important;
opacity: 0;
font-size: 0.9em;
white-space: nowrap;
@ -217,7 +219,8 @@ body > header {
i { margin-bottom: 0.75em; }
.mobile-label {
opacity: 1;
transform: translate(-50%, 80%);
transform: translate(-50%, 80%);
-webkit-transform: translate(-50%) 80%);
}
}
}
@ -237,6 +240,18 @@ body > header {
opacity: 1;
}
}
@-webkit-keyframes menuOpening {
from {
-webkit-transform: scaleX(0);
transform-origin: 'left';
opacity: 0;
}
to {
-webkit-transform: scaleX(1);
transform-origin: 'left';
opacity: 1;
}
}
body > header {
flex-direction: column;