Commit 7026290d authored by yPhil's avatar yPhil
Browse files

UI: Yet another feedControls ergonomics paradigm: New FlexBox concept OK

parent 0cdefa7a
......@@ -501,6 +501,7 @@ button > i {
max-height: var(--var-header-height);
display: flex;
flex-direction:row;
/* align-content: stretch; */
padding:0;
}
......@@ -547,50 +548,28 @@ button > i {
flex-grow: 0;
flex-shrink: 0;
flex-basis: 0px;
overflow:hidden;
white-space: nowrap;
overflow: hidden;
cursor:pointer;
background-color: var(--color-qua) !important;
}
.mobHeader .feedControls .controlsToggle:hover {
color: var(--color-ter) !important;
}
.openControls {
left:0 !important;
}
.openControls i {
transform: rotate(180deg);
}
.mobHeader .feedControls .controlsToggle {
position:relative;
display: inline-block;
height:var(--var-header-height);
background-color: var(--color-qua) !important;
margin: 0 5px 0 0;
font-size: var(--var-controls-toggle-size);
text-align: center;
}
display: flex;
/* flex-direction:row; */
.mobHeader .feedControls .controlsToggle:hover {
background-color: var(--bg-color-pri);
/* background-color: var(--color-qua) !important; */
}
.mobHeader .feedControls div {
margin: 1px 1px 1px 0;
flex: 1 100%;
margin: 2px;
/* flex: 1 100%; */
}
.feedControl {
cursor:pointer;
font-size: var(--var-controls-font-size);
}
.feedControl:hover {
color: var(--ui-color-sec) !important;
}
.mobHeader .ui-button {
padding: 0 !important;
}
......
......@@ -81,25 +81,14 @@ MOB.feed = {
var $controlsToggleDiv = $('<div class="controlsToggle">');
var $myControlsToggleDiv = $('<div class="myControlsToggleDiv">');
var $selectDiv = $('<div class="feedSelect">').button();
var $deleteDiv = $('<div class="feedDelete">').button();
var $selectDiv = $('<div class="feedSelect">');
var $deleteDiv = $('<div class="feedDelete">');
var $titleDiv = $('<div class="feedTitle truncate" data-content="">');
var $prefsDiv = $('<div class="prefs">').button();
var $reloadDiv = $('<div class="reload" title="Click to reload ' + url + '">').button();
var $prefsDiv = $('<div class="prefs">');
var $reloadDiv = $('<div class="reload" title="Click to reload ' + url + '">');
$feedToggle.appendTo($toggleDiv);
$controlsToggleDiv.click(function() {
var $controls = $(this).parent();
var $controlsIcon = $(this).find('i');
// $controlsIcon.removeClass('icon-left-open').addClass('icon-right-open');
// $controlsIcon.toggleClass('right');
$('.feedControls').not($controls).removeClass('openControls');
$controls.toggleClass('openControls');
});
$myControlsToggleDiv.click(function() {
var $controls = $(this).next();
......
Markdown is supported
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