lucaspalomodevelop/core
1
0
Fork 0
mirror of https://github.com/lucaspalomodevelop/core.git synced 2026-03-17 10:04:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

ui: the neverending tab story #1922

Browse Source
This commit is contained in:
Franco Fichtner 2017-11-21 08:50:54 +00:00
parent 2826d6206e
commit a58dcf7cdf
4 changed files with 23 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/opnsense/mvc/app/views/OPNsense/Diagnostics/systemhealth.volt
View File

@ -196,7 +196,7 @@
rrd_name = subitem + '-' + category;
// create dropdown menu
tabs+='<a data-toggle="dropdown" href="#" class="dropdown-toggle pull-right visible-lg-inline-block visible-md-inline-block visible-xs-inline-block visible-sm-inline-block" role="button" style="border-left: 1px dashed lightgray;">';
tabs+='<a data-toggle="dropdown" href="#" class="dropdown-toggle pull-right visible-lg-inline-block visible-md-inline-block visible-xs-inline-block visible-sm-inline-block" role="button">';
tabs+='<b><span class="caret"></span></b>';
tabs+='</a>';
tabs+='<a data-toggle="tab" onclick="$(\'#'+rrd_name+'\').click();" class="visible-lg-inline-block visible-md-inline-block visible-xs-inline-block visible-sm-inline-block" style="border-right:0px;"><b>'+category[0].toUpperCase() + category.slice(1)+'</b></a>';
@ -208,12 +208,12 @@
subitem=data["data"][category][count];
rrd_name = subitem + '-' + category;
if (subitem==active_subitem) {
tabs += '<li class="active"><a data-toggle="tab" class="rrd-item" onclick="getdata(\''+rrd_name+'\',0,0,120,0);" id="'+rrd_name+'"><i class="fa fa-check-square"></i> ' + subitem[0].toUpperCase() + subitem.slice(1) + '</a></li>';
if (subitem==active_subitem && category==active_category) {
tabs += '<li class="active"><a data-toggle="tab" class="rrd-item" onclick="getdata(\''+rrd_name+'\',0,0,120,0);" id="'+rrd_name+'">' + subitem[0].toUpperCase() + subitem.slice(1) + '</a></li>';
rrd=rrd_name;
getdata(rrd_name,0,0,120,false,0); // load initial data
} else {
tabs += '<li><a data-toggle="tab" class="rrd-item" onclick="getdata(\''+rrd_name+'\',0,0,120,0);" id="'+rrd_name+'"><i class="fa fa-check-square"></i> ' + subitem[0].toUpperCase() + subitem.slice(1) + '</a></li>';
tabs += '<li><a data-toggle="tab" class="rrd-item" onclick="getdata(\''+rrd_name+'\',0,0,120,0);" id="'+rrd_name+'">' + subitem[0].toUpperCase() + subitem.slice(1) + '</a></li>';
}
}
tabs+='</ul>';
@ -228,7 +228,7 @@
var rrd_item_name = $(this).attr('id').split('-')[0].toLowerCase();
$.map(data, function(value, key){
if (key.toLowerCase() == rrd_item_name) {
rrd_item.html('<i class="fa fa-check-square"></i> ' + value['descr']);
rrd_item.html(value['descr']);
}
});
@ -579,9 +579,7 @@
</script>
<div class="content-box tab-content">
<div class="tab-content">
<div id="tab_1" class="tab-pane fade in">
<div class="panel panel-primary">
<div class="panel-heading panel-heading-sm">
@ -597,7 +595,6 @@
<div class="col-md-12"></div>
<div class="col-md-4">
<b>{{ lang._('Zoom level') }}:</b>
<form onChange="UpdateOptions()">
<div class="btn-group btn-group-xs" data-toggle="buttons" id="zoom">
<!-- The zoom buttons are generated based upon the current dataset -->
@ -606,7 +603,6 @@
</div>
<div class="col-md-2">
<b>{{ lang._('Inverse') }}:</b>
<form onChange="UpdateOptions()">
<div class="btn-group btn-group-xs" data-toggle="buttons">
<label class="btn btn-default active">
@ -621,7 +617,6 @@
</div>
<div class="col-md-4">
<b>{{ lang._('Resolution') }}:</b>
<form onChange="UpdateOptions()">
<div class="btn-group btn-group-xs" data-toggle="buttons">
<label class="btn btn-default active">
@ -641,7 +636,6 @@
</div>
<div class="col-md-2">
<b>{{ lang._('Show Tables') }}:</b>
<form onChange="UpdateOptions()">
<div class="btn-group btn-group-xs" data-toggle="buttons">
<label class="btn btn-default active">
@ -657,11 +651,8 @@
</div>
</div>
</div>
</div>
<!--<div id="stepsize"></div>-->
<!-- place holder for the chart itself -->
<div class="panel panel-default">
<div class="panel-heading">
@ -707,8 +698,6 @@
</div>
</div>
</div>
</div>
<div id="chart_details_table" class="col-md-12" style="display: none;">
@ -716,7 +705,6 @@
<div class="panel-heading">
<h3 class="panel-title">
{{ lang._('Current View - Details') }}
</h3>
</div>
<div class="panel-body">
@ -743,7 +731,6 @@
<div class="table-responsive">
<table class="table table-condensed table-hover table-striped">
<thead>
<tr id="table_view_heading" class="active">
<!-- Dynamic data -->
@ -755,8 +742,6 @@
</table>
</div>
</div>
</div>
</div>
</div>

8
src/opnsense/mvc/app/views/OPNsense/Proxy/index.volt
View File

@ -208,13 +208,15 @@ POSSIBILITY OF SUCH DAMAGE.
{% endfor %}
<li role="presentation" class="dropdown {% if mainForm['activetab']|default("") == active_subtab %}active{% endif %}">
<a data-toggle="dropdown" href="#" class="dropdown-toggle pull-right visible-lg-inline-block visible-md-inline-block visible-xs-inline-block visible-sm-inline-block" role="button" style="border-left: 1px dashed lightgray;">
<a data-toggle="dropdown" href="#" class="dropdown-toggle pull-right visible-lg-inline-block visible-md-inline-block visible-xs-inline-block visible-sm-inline-block" role="button">
<b><span class="caret"></span></b>
</a>
<a data-toggle="tab" href="#subtab_{{tab['subtabs'][0][0]}}" class="visible-lg-inline-block visible-md-inline-block visible-xs-inline-block visible-sm-inline-block" style="border-right:0px;"><b>{{tab[1]}}</b></a>
<a data-toggle="tab" onclick="$('#subtab_item_{{tab['subtabs'][0][0]}}').click();" class="visible-lg-inline-block visible-md-inline-block visible-xs-inline-block visible-sm-inline-block" style="border-right:0px;"><b>{{tab[1]}}</b></a>
<ul class="dropdown-menu" role="menu">
{% for subtab in tab['subtabs']|default({})%}
<li class="{% if mainForm['activetab']|default("") == subtab[0] %}active{% endif %}"><a data-toggle="tab" href="#subtab_{{subtab[0]}}"><i class="fa fa-check-square"></i> {{subtab[1]}}</a></li>
<li class="{% if mainForm['activetab']|default("") == subtab[0] %}active{% endif %}">
<a data-toggle="tab" id="subtab_item_{{subtab[0]}}" href="#subtab_{{subtab[0]}}">{{subtab[1]}}</a>
</li>
{% endfor %}
</ul>
</li>

8
src/opnsense/www/themes/opnsense/assets/stylesheets/main.scss
View File

@ -362,6 +362,11 @@ body{
border-bottom: none;
}
.dropdown-menu > li > a,
.dropdown-header {
padding: 3px 10px;
}
.nav-tabs {
margin-right: 1px;
border-bottom: 1px solid darken(map-get($colors, bordergrey), 30%);
@ -399,7 +404,6 @@ body{
border-right: 1px solid darken(map-get($colors, bordergrey), 30%);
border-top: 1px solid darken(map-get($colors, bordergrey), 30%);
border-left: 1px solid darken(map-get($colors, bordergrey), 30%);
border-bottom: 1px solid darken(#FBFBFB, 5%);
}
.nav-tabs > li > a.visible-lg-inline-block:not(.pull-right) {
@ -410,7 +414,7 @@ body{
.nav-tabs > li > a.visible-lg-inline-block.pull-right {
border-left: 0px !important;
padding-left: 0px !important;
padding-left: 5px !important;
padding-right: 10px !important;
}

9
src/opnsense/www/themes/opnsense/build/css/main.css
View File

@ -5649,6 +5649,10 @@ body {
.collapse .list-group-item:last-child {
border-bottom: none; }
.dropdown-menu > li > a,
.dropdown-header {
padding: 3px 10px; }
.nav-tabs {
margin-right: 1px;
border-bottom: 1px solid #999999; }
@ -5680,8 +5684,7 @@ body {
.nav-tabs > li.active > a:focus {
border-right: 1px solid #999999;
border-top: 1px solid #999999;
border-left: 1px solid #999999;
border-bottom: 1px solid #eeeeee; }
border-left: 1px solid #999999; }
.nav-tabs > li > a.visible-lg-inline-block:not(.pull-right) {
border-top-right-radius: 0px !important;
@ -5690,7 +5693,7 @@ body {
.nav-tabs > li > a.visible-lg-inline-block.pull-right {
border-left: 0px !important;
padding-left: 0px !important;
padding-left: 5px !important;
padding-right: 10px !important; }
.nav-tabs.nav-justified {