NaNtic/sao-base
1
0
Fork 0
mirror of https://github.com/NaN-tic/sao-base.git synced 2023-12-14 03:13:01 +01:00
Code Issues Projects Releases Wiki Activity

Stick navbar of tab

Browse source 
review23561004
This commit is contained in:
C?dric Krier 2015-10-22 11:41:56 +02:00
parent 123665b2ee
commit e0cb5136e4
2 changed files with 56 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
src/sao.less
View file

@ -1,12 +1,20 @@
@import "variables";
.navbar {
z-index: @zindex-navbar;
}
.tab-form {
& .toolbar {
& nav.toolbar {
margin-bottom: 1px;
& ul.nav > li > a {
padding-right: 0px;
}
}
& nav.toolbar.affix {
top: @navbar-height + 1px;
z-index: @zindex-navbar - 1;
}
}
.nav-tabs > li .close {
@ -14,6 +22,15 @@
font-size: 18px;
}
@media screen and (max-width: 768px) {
.tab-form {
.navbar-nav > li {
float: left;
width: 50%;
}
}
}
input[type='color'] {
& .btn {
height: @line-height-base;

41
src/tab.js
View file

@ -15,13 +15,12 @@
'class': this.class_
});
this.title = jQuery('<h4/>').appendTo(this.el);
if (this.info_bar) {
this.el.append(this.info_bar.el);
}
this.create_toolbar().appendTo(this.el);
var toolbar = this.create_toolbar().appendTo(this.el);
this.title = toolbar.find('a.navbar-brand');
},
set_menu: function(menu) {
this.menu_def.forEach(function(definition) {
@ -53,6 +52,7 @@
'<nav class="navbar navbar-default toolbar" role="navigation">' +
'<div class="container-fluid">' +
'<div class="navbar-header">' +
'<a class="navbar-brand" href="#"></a>' +
'<button type="button" class="navbar-toggle collapsed" ' +
'data-toggle="collapse" ' +
'data-target="#navbar-' + this.id + '">' +
@ -112,6 +112,22 @@
// TODO tooltip
};
this.toolbar_def.forEach(add_button.bind(this));
var tabs = jQuery('#tabs');
toolbar.affix({
'target': tabs.parent(),
'offset': {
'top': function() {
return tabs.find('.nav-tabs').height();
}
}
});
toolbar.on('affixed.bs.affix', function() {
Sao.Tab.affix_set_with(toolbar);
});
toolbar.on('affixed-top.bs.affix affixed-bottom.bs.affix',
function() {
Sao.Tab.affix_unset_width(toolbar);
});
return toolbar;
},
close: function() {
@ -140,6 +156,25 @@
}
});
Sao.Tab.affix_set_with = function(toolbar) {
var width = jQuery(toolbar.parent()).width();
toolbar.css('width', width);
};
Sao.Tab.affix_unset_width = function(toolbar) {
toolbar.css('width', '');
};
jQuery(window).resize(function() {
jQuery('.toolbar').each(function(i, toolbar) {
toolbar = jQuery(toolbar);
toolbar.affix('checkPosition');
if (toolbar.hasClass('affix')) {
Sao.Tab.affix_set_with(toolbar);
} else {
Sao.Tab.affix_unset_width(toolbar);
}
});
});
Sao.Tab.counter = 0;
Sao.Tab.tabs = [];
Sao.Tab.tabs.close = function(warning) {