shaba/one
1
0
Fork 0
mirror of https://github.com/OpenNebula/one.git synced 2025-03-23 22:50:09 +03:00
Code Releases Wiki Activity

feature #2746: Fix layout for small screen size

Browse Source
This commit is contained in:
Daniel Molina 2014-03-17 10:04:52 +01:00
parent e58b6ea7da
commit 60192acc0a
3 changed files with 29 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/sunstone/public/js/plugins/dashboard-tab.js
View File

@ -28,13 +28,13 @@ var widgets = {
"storage" : '<fieldset>\
<legend class="span-dashboard"><i class="fa fa-upload"></i> '+tr("Storage")+'</legend>\
<div class="row totals-info">\
<div class="large-6 columns text-right">\
<div class="small-6 large-6 columns text-right">\
<h4 class="subheader">\
<span class="total_images subheader"/><br>\
<span class="size_images subheader"/>\
</h4>\
</div>\
<div class="large-6 columns text-left">\
<div class="small-6 large-6 columns text-left">\
<h4 class="subheader">\
<small>'+tr("IMAGES")+'</small><br>\
<small>'+tr("USED")+'</small>\
@ -45,13 +45,13 @@ var widgets = {
"users" : '<fieldset>\
<legend class="span-dashboard"><i class="fa fa-user"></i> '+tr("Users")+'</legend>\
<div class="row totals-info">\
<div class="large-6 columns text-right">\
<div class="small-6 large-6 columns text-right">\
<h4 class="subheader">\
<span class="subheader total_users"/><br>\
<span class="subheader total_groups"/>\
</h4>\
</div>\
<div class="large-6 columns text-left">\
<div class="small-6 large-6 columns text-left">\
<h4 class="subheader">\
<small>'+tr("USERS")+'</small><br>\
<small>'+tr("GROUPS")+'</small>\
@ -62,13 +62,13 @@ var widgets = {
"network" : '<fieldset>\
<legend class="span-dashboard"><i class="fa fa-sitemap"></i> '+tr("Network")+'</legend>\
<div class="row totals-info">\
<div class="large-6 columns text-right">\
<div class="small-6 large-6 columns text-right">\
<h4 class="subheader">\
<span class="total_vnets subheader"/><br>\
<span class="addresses_vnets subheader"/>\
</h4>\
</div>\
<div class="large-6 columns text-left">\
<div class="small-6 large-6 columns text-left">\
<h4 class="subheader">\
<small>'+tr("VNETS")+'</small><br>\
<small>'+tr("USED IPs")+'</small>\
@ -79,8 +79,8 @@ var widgets = {
"hosts" : '<fieldset class="dashboard-panel">\
<legend class="span-dashboard"><i class="fa fa-hdd-o"></i> '+tr("Hosts")+'</legend>\
<div class="row totals-info">\
<div class="large-3 columns centered">\
<div class="large-6 columns text-right">\
<div class="small-3 large-3 columns centered">\
<div class="small-6 large-6 columns text-right">\
<h4 class="subheader">\
<span class="total_hosts subheader"/><br>\
<span class="on_hosts subheader success-color"/><br>\
@ -88,7 +88,7 @@ var widgets = {
<span class="error_hosts subheader alert-color"/><br>\
</h4>\
</div>\
<div class="large-6 columns text-left">\
<div class="small-6 large-6 columns text-left">\
<h4 class="subheader">\
<small>'+tr("TOTAL")+'</small><br>\
<small class="success-color">'+tr("ON")+'</small><br>\
@ -97,26 +97,26 @@ var widgets = {
</h4>\
</div>\
</div>\
<div class="large-9 columns">\
<div class="small-9 large-9 columns">\
<div class="row graph_legend text-left">\
<div class="large-4 columns">\
<div class="small-4 large-4 columns">\
<h4 class="subheader text-center"><small>'+tr("CPU")+'</small></h4>\
</div>\
<div class="large-4 columns">\
<div class="small-4 large-4 columns">\
<span class="label allocated radius">'+tr("Allocated")+'</span>&emsp;\
<span class="label real radius">'+tr("Real")+'</span>&emsp;\
<span class="label total radius">'+tr("Total")+'</span>\
</div>\
<div class="large-4 columns">\
<div class="small-4 large-4 columns">\
<h4 class="subheader"><small>'+tr("MEMORY")+'</small></h4>\
</div>\
</div>\
<div class="row">\
<div class="large-6 columns">\
<div class="small-6 large-6 columns">\
<div class="large-12 columns centered graph" id="dash_host_cpu_graph" style="height: 100px;">\
</div>\
</div>\
<div class="large-6 columns">\
<div class="small-6 large-6 columns">\
<div class="large-12 columns centered graph" id="dash_host_mem_graph" style="height: 100px;">\
</div>\
</div>\
@ -127,8 +127,8 @@ var widgets = {
"vms" : '<fieldset class="dashboard-panel">\
<legend class="span-dashboard"><i class="fa fa-cloud"></i> '+tr("Virtual Machines")+'</legend>\
<div class="row totals-info">\
<div class="large-3 columns">\
<div class="large-6 columns text-right">\
<div class="small-3 large-3 columns">\
<div class="small-6 large-6 columns text-right">\
<h4 class="subheader">\
<span class="subheader total_vms"/><br>\
<span class="subheader active_vms success-color"/><br>\
@ -136,7 +136,7 @@ var widgets = {
<span class="subheader failed_vms alert-color"/>\
</h4>\
</div>\
<div class="large-6 columns text-left">\
<div class="small-6 large-6 columns text-left">\
<h4 class="subheader">\
<small>'+tr("TOTAL")+'</small><br>\
<small class="success-color">'+tr("ACTIVE")+'</small><br>\
@ -145,21 +145,21 @@ var widgets = {
</h4>\
</div>\
</div>\
<div class="large-9 columns">\
<div class="small-9 large-9 columns">\
<div class="row graph_legend text-center">\
<div class="large-6 columns">\
<div class="small-6 large-6 columns">\
<h4 class="subheader"><small>'+tr("NET DOWNLOAD SPEED")+'</small></h4>\
</div>\
<div class="large-6 columns">\
<div class="small-6 large-6 columns">\
<h4 class="subheader"><small>'+tr("NET UPLOAD SPEED")+'</small></h4>\
</div>\
</div>\
<div class="row">\
<div class="large-6 columns">\
<div class="small-6 large-6 columns">\
<div class="large-12 columns centered graph" id="dash_vm_net_rx_graph" style="height: 100px;">\
</div>\
</div>\
<div class="large-6 columns">\
<div class="small-6 large-6 columns">\
<div class="large-12 columns centered graph" id="dash_vm_net_tx_graph" style="height: 100px;">\
</div>\
</div>\
@ -188,12 +188,12 @@ $(document).ready(function(){
$dashboard = $('#dashboard-tab', main_tabs_context);
$.each(Config.dashboardWidgets('widgets_three_per_row'), function(id, widget){
var html = '<div class="large-4 columns">'+widgets[widget]+'</div>';
var html = '<div class="small-4 large-4 columns">'+widgets[widget]+'</div>';
$('#three_per_row', $dashboard).append(html);
})
$.each(Config.dashboardWidgets('widgets_two_per_row'), function(id, widget){
var html = '<div class="large-6 columns">'+widgets[widget]+'</div>';
var html = '<div class="small-6 large-6 columns">'+widgets[widget]+'</div>';
$('#two_per_row', $dashboard).append(html);
})

4
src/sunstone/public/js/sunstone.js
View File

@ -483,11 +483,11 @@ function insertTab(tab_name){
*/
if (tab_info.buttons) {
tab_content_str += '<div class="row">\
<div class="large-9 columns">\
<div class="small-9 large-9 columns">\
<div class="action_blocks">\
</div>\
</div>\
<div class="large-3 columns only-right-list">'
<div class="small-3 large-3 columns only-right-list">'
if (tab_info.search_input) {
tab_content_str += tab_info.search_input;

4
src/sunstone/views/index.erb
View File

@ -71,7 +71,7 @@
</head>
<body class="antialiased row">
<div class="row collapse" style="height:100%;">
<div class="large-2 columns left-content">
<div class="small-2 large-2 columns left-content">
<div class="row left-header">
<div class="large-12 columns">
<img src="<%= view['small_logo'] %>"/>
@ -82,7 +82,7 @@
</div>
</div>
<div class="large-10 columns right-content">
<div class="small-10 large-10 columns right-content">
<div class="row user-zone-container"><div class="user-zone-info"></div></div>
<div class="row right-header">
</div>