Commit aaaa11ae authored by yPhil's avatar yPhil
Browse files

UI: New feedControls interaction

parent 1f2946a5
......@@ -481,3 +481,68 @@ p.dialog-warning {
button > i {
margin-right: .3em !important;
}
/* Feed controls */
.truncate {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.mobHeader {
cursor:grab;
/* min-height:20px; */
height:26px;
max-height:26px;
display: flex;
padding:0;
overflow: hidden;
}
.mobHeader > div {
flex: 0 0 auto;
}
.mobHeader .feedToggle {
flex: 0 0 auto;
margin: .2rem;
}
.mobHeader .feedTitle {
flex: 3 3 auto;
margin: .2rem;
}
.mobHeader .feedControls {
position:relative;
flex: 0 0 auto;
display: flex;
text-align:right;
background-color: red !important;
padding:.2rem;
/* min-width:80px; */
/* align-items:flex-start; */
/* align-content:flex-start; */
/* justify-content: flex-end; */
/* padding:0; */
}
.mobHeader .feedControls div {
flex: 1 100%;
}
.feedControl {
font-size: 1em !important;
}
.mobHeader .ui-button {
padding: 0 !important;
margin: 0 0 0 .2em !important;
}
.mobHeader .feedControls div i.ui-button:first-child {
margin: 0 !important;
}
......@@ -171,61 +171,6 @@ li.feed {
margin: 0;
}
.truncate {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.mobHeader {
cursor:grab;
/* min-height:20px; */
max-height:18px;
display: flex;
padding:.2rem;
}
.mobHeader > div {
flex: 0 0 auto;
}
.mobHeader .feedToggle {
flex: 0 0 auto;
margin: 0 .2rem 0 0;
}
.mobHeader .feedTitle {
flex: 3 3 auto;
}
.mobHeader .feedControls {
flex: 0 0 auto;
display: flex;
text-align:right;
/* min-width:80px; */
/* align-items:flex-start; */
/* align-content:flex-start; */
/* justify-content: flex-end; */
/* padding:0; */
}
.mobHeader .feedControls div {
flex: 1 100%;
}
.feedControl {
font-size: 1em !important;
}
.mobHeader .ui-button {
padding: 0 !important;
margin: 0 0 0 .2em !important;
}
.mobHeader .feedControls div i.ui-button:first-child {
margin: 0 !important;
}
.selected {
opacity: 0.5;
}
......
......@@ -83,7 +83,10 @@ MOB.feed = {
$header.hover (
function() {
$(this).find('.feedControls').slideDown('fast');
// $(this).find('.feedControls').slideDown('fast');
// $(this).find('.feedControls').show('slide', {direction: 'right'}, 100);
$(this).find('.feedControls').animate({'left': '0'}, 1000);
var iconImg = $feedToggle.css('background-image');
......@@ -92,7 +95,8 @@ MOB.feed = {
$(this).data('img',iconImg);
},
function() {
$(this).find('.feedControls').slideUp('slow');
// $(this).find('.feedControls').hide('slide', {direction: 'right'}, 600);
$(this).find('.feedControls').animate({'left': '80px'}, 1000);
$feedToggle.removeClass('arrow');
......
......@@ -99,7 +99,7 @@
MOB.tab.populate(JSON.parse(MOB.prefs.readConfig('tabs')));
$tabs.find('div.feedControls').slideUp();
// $tabs.find('div.feedControls').slideUp();
});
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment