diff options
author | Thibaud Lepretre <thibaud.lepretre@gmail.com> | 2019-07-29 18:55:55 +0300 |
---|---|---|
committer | Thibaud Lepretre <thibaud.lepretre@gmail.com> | 2021-08-11 15:02:17 +0300 |
commit | 039f7373e585ee32d9dfec4e56feb5261d31ad3c (patch) | |
tree | e901a2769f13fb94b21ba92108054bf202a39406 /src/scss/components/_post.scss | |
parent | 03d39e34aa2324c509b2e6187a2932f01bca075f (diff) |
Revamp sidebar translation
Use `transform: translate3d` as much as possible instead of `width` for better performance (really visibile on slow device like phone)
Diffstat (limited to 'src/scss/components/_post.scss')
-rwxr-xr-x | src/scss/components/_post.scss | 19 |
1 files changed, 18 insertions, 1 deletions
diff --git a/src/scss/components/_post.scss b/src/scss/components/_post.scss index b0a34bb..92a377d 100755 --- a/src/scss/components/_post.scss +++ b/src/scss/components/_post.scss @@ -3,6 +3,7 @@ width: 100%; display: inline-block; vertical-align: top; + @include sidebar-slide-animation; .post-header { .post-title { @@ -69,6 +70,22 @@ } } +@media #{$large-only} { + .post { + &.pushed { + @include prefix(transform, translate3d(-#{map-get($sidebar, lg-screen-width) / 2}, 0, 0), 'webkit' 'moz'); + } + } +} + +@media #{$xlarge-and-up} { + .post { + &.pushed { + @include prefix(transform, translate3d(-#{map-get($sidebar, xlg-screen-width) / 2}, 0, 0), 'webkit' 'moz'); + } + } +} + // Increase font size of the post's title on large screen (only for single post view) @media #{$large-and-up} { .post { @@ -85,4 +102,4 @@ .post-content { font-size: 1.7rem; } -}
\ No newline at end of file +} |