Improve layout

This commit is contained in:
Eike Foken
2011-04-17 23:08:03 +02:00
parent 19939ff095
commit 24ae39d4e9
6 changed files with 73 additions and 48 deletions

1
.gitignore vendored
View File

@@ -1,3 +1,4 @@
.buildpath .buildpath
.project .project
.settings/ .settings/
*.xcf

View File

@@ -21,3 +21,11 @@
</head> </head>
<body> <body>
<div id="header">
<?=img(array('src' => 'assets/images/logo.png', 'style' => 'margin-left: 5px'));?>
<div style="float: right; margin-top: 15px; margin-right: 10px; color: #ccc;">
<?=anchor('auth/settings', "Einstellungen", array('style' => 'padding: 5px;'));?> |
<?=anchor('auth/logout', "Logout", array('style' => 'padding: 5px;'));?>
</div>
</div>

View File

@@ -1,45 +1,46 @@
<?php $this->load->view('header'); ?> <?php $this->load->view('header'); ?>
<script type="text/javascript"> <script type="text/javascript">
var layoutLeft1 = new Ext.tree.TreePanel({ var projectPanel = new Ext.tree.TreePanel({
region: 'north', id: 'project-tree',
region: 'west',
title: "Projekte", title: "Projekte",
height: 250, height: 400,
bodyStyle: 'margin-bottom: 6px;', bodyStyle: 'margin-bottom: 6px;',
autoScroll: true, autoScroll: true,
enableDD: false, rootVisible: true,
rootVisible: false, lines: false,
id: 'treePanel', tbar: [{
icon: BASE_PATH + 'assets/images/icons/box--plus.png',
text: "Neues Projekt",
scope: this
},{
id: 'delete',
icon: BASE_PATH + 'assets/images/icons/box--minus.png',
text: "Entfernen",
scope: this
}],
root: { root: {
text: "Projekte", text: "Meine Projekte",
expanded: true, expanded: true,
nodeType: 'async',
children: [{ children: [{
text: 'Projekt 1', text: 'Projekt 1',
expanded: false leaf: true
}, { }, {
text: 'Projekt 2', text: 'Projekt 2',
expanded: false, leaf: true
}] }]
} }
}); });
var layoutLeft2 = new Ext.Panel({ var layoutLeft2 = new Ext.Panel({
region: 'center', region: 'west',
margin: '10 0 0 0', margin: '10 0 0 0',
autoScroll: true, autoScroll: true,
bodyStyle: 'padding: 10px; background: #eee;', bodyStyle: 'padding: 10px; background: #eee;',
html: 'Test' html: 'Test'
}); });
var toolbarCenter = new Ext.Toolbar({
items: ['->', {
icon: BASE_PATH + 'assets/images/icons/minus-circle.png',
text: 'Logout',
handler: logout
}]
});
var panelCenter = new Ext.TabPanel({ var panelCenter = new Ext.TabPanel({
xtype: 'tabpanel', xtype: 'tabpanel',
resizeTabs: false, resizeTabs: false,
@@ -65,36 +66,34 @@ var layoutCenter = new Ext.Panel({
margins: '0 5 5 0', margins: '0 5 5 0',
activeItem: 0, activeItem: 0,
border: true, border: true,
tbar: toolbarCenter,
items: [panelCenter] items: [panelCenter]
}); });
var layoutMain = new Ext.Viewport({ var layoutMain = new Ext.Viewport({
layout: 'border', layout: 'border',
renderTo: Ext.getBody(),
items: [{ items: [{
height: 46,
region: 'north', region: 'north',
autoHeight: true, xtype: 'box',
height: 100, el: 'header',
border: false, border: false
html: '<div id="header">Scattport</div>',
margins: '0 0 5 0',
style: 'margin-bottom: 4px;'
}, { }, {
region: 'west', region: 'west',
baseCls: 'x-plain', baseCls: 'x-plain',
xtype: 'panel', xtype: 'panel',
autoHeight: true, autoHeight: true,
width: 180, width: 190,
minWidth: 190,
maxWidth: 300,
border: false, border: false,
split: true, split: true,
margins: '0 0 0 5', margins: '0 0 0 5',
items: [layoutLeft1, layoutLeft2] items: [projectPanel, layoutLeft2]
}, layoutCenter] }, layoutCenter]
}); });
function logout() { function logout() {
Ext.Ajax.request({ $.ajax({
url: BASE_URL + 'auth/do_logout', url: BASE_URL + 'auth/do_logout',
method: 'post', method: 'post',
success: function(xhr) { success: function(xhr) {
@@ -102,8 +101,8 @@ function logout() {
} }
}); });
} }
layoutMain.show();
</script> </script>
<div id="main"></div>
<?php $this->load->view('footer'); ?> <?php $this->load->view('footer'); ?>

View File

@@ -1,13 +1,30 @@
body { body {
background: #7f99be; font: normal 12px "Trebuchet MS", Arial, sans-serif;
}
html, body {
margin: 0;
padding: 0;
border: 0 none;
overflow: hidden;
height: 100%;
width: 100%;
}
a {
color: #4b6b94;
text-decoration: none;
}
a:hover {
color: #999;
text-decoration: underline;
} }
#header { #header {
border-bottom: 1px solid #666; height: 46px;
background: #1e4176; }
padding: 5px;
color: #fff; .x-viewport body {
font-size: 20px; background: #ededed url('../images/back.png') repeat-x !important;
font-weight: bold;
font-family: 'Trebuchet MS', sans-serif;
} }

BIN
assets/images/back.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 219 B

BIN
assets/images/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB