mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-02-24 23:48:13 -05:00
Merge pull request #4193 from PaulAdamDavis/less-animations
Less Animations
This commit is contained in:
commit
3bb2152248
3 changed files with 33 additions and 17 deletions
|
@ -14,6 +14,25 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Show/hide content list & preview on mobile
|
||||||
|
.content-list {
|
||||||
|
&.show-menu {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
&.show-content {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-preview {
|
||||||
|
&.show-menu {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
&.show-content {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.content-list {
|
.content-list {
|
||||||
width: 33%;
|
width: 33%;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
|
@ -31,7 +50,6 @@
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.content-filter {
|
.content-filter {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 300;
|
z-index: 300;
|
||||||
|
@ -55,7 +73,6 @@
|
||||||
color: #fff !important; // getting overridden by floatingheader
|
color: #fff !important; // getting overridden by floatingheader
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.content-list-content {
|
.content-list-content {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
|
@ -173,18 +190,16 @@
|
||||||
width: 67%;
|
width: 67%;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom:0;
|
bottom: 0;
|
||||||
top:0;
|
top: 0;
|
||||||
right:0;
|
right: 0;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
-webkit-overflow-scrolling: touch;
|
-webkit-overflow-scrolling: touch;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
|
|
||||||
@media (max-width: 900px) {
|
@media (max-width: 900px) {
|
||||||
width: auto;
|
width: 100%;
|
||||||
left: 100%;
|
border: none;
|
||||||
right: -100%;
|
|
||||||
margin-left: 15px;
|
|
||||||
border:none;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.unfeatured {
|
.unfeatured {
|
||||||
|
|
|
@ -80,7 +80,9 @@
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
-webkit-overflow-scrolling: touch;
|
-webkit-overflow-scrolling: touch;
|
||||||
|
|
||||||
transition: transform $side-outlet-transition-duration cubic-bezier(0.1, 0.7, 0.1, 1);
|
@media (min-width: 901px) {
|
||||||
|
transition: transform $side-outlet-transition-duration cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||||
|
}
|
||||||
|
|
||||||
&.outlet-pane-out-left {
|
&.outlet-pane-out-left {
|
||||||
transform: translate3d(-100%, 0px, 0px);
|
transform: translate3d(-100%, 0px, 0px);
|
||||||
|
|
|
@ -6,16 +6,15 @@ var PostsView = MobileParentView.extend({
|
||||||
|
|
||||||
// Mobile parent view callbacks
|
// Mobile parent view callbacks
|
||||||
showMenu: function () {
|
showMenu: function () {
|
||||||
$('.js-content-list').animate({right: '0', left: '0', 'margin-right': '0'}, 300);
|
$('.js-content-list').addClass('show-menu').removeClass('show-content');
|
||||||
$('.js-content-preview').animate({right: '-100%', left: '100%', 'margin-left': '15px'}, 300);
|
$('.js-content-preview').addClass('show-menu').removeClass('show-content');
|
||||||
},
|
},
|
||||||
showContent: function () {
|
showContent: function () {
|
||||||
$('.js-content-list').animate({right: '100%', left: '-100%', 'margin-right': '15px'}, 300);
|
$('.js-content-list').addClass('show-content').removeClass('show-menu');
|
||||||
$('.js-content-preview').animate({right: '0', left: '0', 'margin-left': '0'}, 300);
|
$('.js-content-preview').addClass('show-content').removeClass('show-menu');
|
||||||
},
|
},
|
||||||
showAll: function () {
|
showAll: function () {
|
||||||
$('.js-content-list').removeAttr('style');
|
$('.js-content-list, .js-content-preview').removeClass('show-menu show-content');
|
||||||
$('.js-content-preview').removeAttr('style');
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
Loading…
Add table
Reference in a new issue