From b540ea56888a4677bd70544b9f43c8c8e1cd9c42 Mon Sep 17 00:00:00 2001 From: tbrehm <t.brehm@ispconfig.org> Date: Sun, 25 Oct 2009 05:49:49 -0400 Subject: [PATCH] Fixed: FS#940 - Interface is squished in Google Chrome --- interface/web/themes/default/templates/main.tpl.htm | 238 +++++++++++++++-------------- interface/web/themes/default/css/screen/basemod.css | 235 ++++++++++++++-------------- 2 files changed, 242 insertions(+), 231 deletions(-) diff --git a/interface/web/themes/default/css/screen/basemod.css b/interface/web/themes/default/css/screen/basemod.css index d60257c..b4270f9 100644 --- a/interface/web/themes/default/css/screen/basemod.css +++ b/interface/web/themes/default/css/screen/basemod.css @@ -1,116 +1,119 @@ -@charset "UTF-8"; -/** - * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework - * - * (en) Screen layout for YAML - ISPConfig 3: default theme - * (de) Bildschirmlayout f�r YAML - ISPConfig 3: default theme - * - * @copyright Copyright 2005-2008, Dirk Jesse - * @license CC-A 2.0 (http://creativecommons.org/licenses/by/2.0/), - * YAML-C (http://www.yaml.de/en/license/license-conditions.html) - * @link http://www.yaml.de - * @package yaml - * @version 3.0.6 - * @revision $Revision: 202 $ - * @lastmodified $Date: 2008-06-07 14:29:18 +0200 (Sa, 07 Jun 2008) $ - */ - -@media screen, projection -{ - /*------------------------------------------------------------------------------------------------------*/ - - /** - * (en) Formatting YAML's basic layout elements - * (de) Gestaltung des YAML Basis-Layouts - */ - - /* (en) Marginal areas & page background */ - /* (de) Randbereiche & Seitenhintergrund */ - body { background: #EEEEEE url("../../images/screen_bg.png") repeat-x top left fixed; padding: 10px 0; } - - /* (en) Centering layout in old IE-versions */ - /* (de) Zentrierung des Layouts in alten IE-versionen */ - body { text-align: center; } - #page_margins { text-align:left; margin: 0 auto; } - - /* (en) Layout: width, background, borders */ - /* (de) Layout: Breite, Hintergrund, Rahmen */ - #page_margins { min-width: 980px; max-width: 80%; background: #fff; display: table;} - #page{ padding: 10px; } - - /* (en) Designing main layout elements */ - /* (de) Gestaltung der Hauptelemente des Layouts */ - #header { - color: #faf0e6; - padding: 15px 2em 1em 20px; - background: #9a9a9a url(../../images/header_bg.png) repeat-x top left; - } - - /* (en) Text Alignment for #topnav content */ - /* (de) Textausrichtung für #topnav Inhalte */ - #topnav { text-align: left; } - - /* (en) Absolute positioning only within #header */ - /* (de) Absolute Positionierung erfolgt nur innerhalb von #header */ - #header #topnav { - position: absolute; - top: 0px; - left: 0px; - } - - /* (en) Text Alignment for #topnav content */ - /* (de) Textausrichtung für #topnav Inhalte */ - #topsubnav { text-align: right; } - - /* (en) Absolute positioning only within #header */ - /* (de) Absolute Positionierung erfolgt nur innerhalb von #header */ - #header #topsubnav { - position:absolute; - top: 10px; - right: 10px; - } - - /* (en) adjustment of main navigation */ - /* (de) Anpassung der Hauptnavigation */ - #nav ul { margin-left: 200px; } - #nav_main { background: #9a9a9a repeat-x top left; } - - #main { background: #fff;padding:10px 0; } - - #footer { - color:#666; - background: #f9f9f9; - padding: 10px 20px; - border-top: 5px #efefef solid; - font-size: 0.8em; - text-align: center; - } - - /*------------------------------------------------------------------------------------------------------*/ - - /** - * (en) Formatting content container - * (de) Formatierung der Inhalts-Container - * - * |-------------------------------| - * | #header | - * |-------------------------------| - * | #col1 | #col3 | #col2 | - * | 25% | flexible | 25% | - * |-------------------------------| - * | #footer | - * |-------------------------------| - */ - - - #col1 { width: 25%; } - #col1_content { padding: 10px 10px 10px 20px; } - - #col2 { width: 25%; } - #col2_content { padding: 10px 20px 10px 10px; } - - #col3 { margin: 0 25%; } - #col3_content { padding: 10px; } - - /*------------------------------------------------------------------------------------------------------*/ -} +@charset "UTF-8"; +/** + * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework + * + * (en) Screen layout for YAML - ISPConfig 3: default theme + * (de) Bildschirmlayout fr YAML - ISPConfig 3: default theme + * + * @copyright Copyright 2005-2008, Dirk Jesse + * @license CC-A 2.0 (http://creativecommons.org/licenses/by/2.0/), + * YAML-C (http://www.yaml.de/en/license/license-conditions.html) + * @link http://www.yaml.de + * @package yaml + * @version 3.0.6 + * @revision $Revision: 202 $ + * @lastmodified $Date: 2008-06-07 14:29:18 +0200 (Sa, 07 Jun 2008) $ + */ + +@media screen, projection +{ + /*------------------------------------------------------------------------------------------------------*/ + + /** + * (en) Formatting YAML's basic layout elements + * (de) Gestaltung des YAML Basis-Layouts + */ + + /* (en) Marginal areas & page background */ + /* (de) Randbereiche & Seitenhintergrund */ + body { background: #EEEEEE url("../../images/screen_bg.png") repeat-x top left fixed; padding: 10px 0; } + + /* (en) Centering layout in old IE-versions */ + /* (de) Zentrierung des Layouts in alten IE-versionen */ + body { text-align: center; } + #page_margins { text-align:left; margin: 0 auto; } + + /* (en) Layout: width, background, borders */ + /* (de) Layout: Breite, Hintergrund, Rahmen */ + /*WARNING: ADded a overrode for this setting in main.tpl with javascript to target non chrome browsers, + This has to be changed too in case that page_margins get changed. Reason: Chrome does not support the + display: table; attribute correctly*/ + #page_margins { min-width: 980px; max-width: 80%; background: #fff;} + #page{ padding: 10px; } + + /* (en) Designing main layout elements */ + /* (de) Gestaltung der Hauptelemente des Layouts */ + #header { + color: #faf0e6; + padding: 15px 2em 1em 20px; + background: #9a9a9a url(../../images/header_bg.png) repeat-x top left; + } + + /* (en) Text Alignment for #topnav content */ + /* (de) Textausrichtung für #topnav Inhalte */ + #topnav { text-align: left; } + + /* (en) Absolute positioning only within #header */ + /* (de) Absolute Positionierung erfolgt nur innerhalb von #header */ + #header #topnav { + position: absolute; + top: 0px; + left: 0px; + } + + /* (en) Text Alignment for #topnav content */ + /* (de) Textausrichtung für #topnav Inhalte */ + #topsubnav { text-align: right; } + + /* (en) Absolute positioning only within #header */ + /* (de) Absolute Positionierung erfolgt nur innerhalb von #header */ + #header #topsubnav { + position:absolute; + top: 10px; + right: 10px; + } + + /* (en) adjustment of main navigation */ + /* (de) Anpassung der Hauptnavigation */ + #nav ul { margin-left: 200px; } + #nav_main { background: #9a9a9a repeat-x top left; } + + #main { background: #fff;padding:10px 0; } + + #footer { + color:#666; + background: #f9f9f9; + padding: 10px 20px; + border-top: 5px #efefef solid; + font-size: 0.8em; + text-align: center; + } + + /*------------------------------------------------------------------------------------------------------*/ + + /** + * (en) Formatting content container + * (de) Formatierung der Inhalts-Container + * + * |-------------------------------| + * | #header | + * |-------------------------------| + * | #col1 | #col3 | #col2 | + * | 25% | flexible | 25% | + * |-------------------------------| + * | #footer | + * |-------------------------------| + */ + + + #col1 { width: 25%; } + #col1_content { padding: 10px 10px 10px 20px; } + + #col2 { width: 25%; } + #col2_content { padding: 10px 20px 10px 10px; } + + #col3 { margin: 0 25%; } + #col3_content { padding: 10px; } + + /*------------------------------------------------------------------------------------------------------*/ +} diff --git a/interface/web/themes/default/templates/main.tpl.htm b/interface/web/themes/default/templates/main.tpl.htm index 8e22384..49a89d1 100644 --- a/interface/web/themes/default/templates/main.tpl.htm +++ b/interface/web/themes/default/templates/main.tpl.htm @@ -1,115 +1,123 @@ -<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" - "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> -<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> -<head> - <title><tmpl_var name="app_title"> <tmpl_var name="app_version"></title> - <meta http-equiv="Content-Type" content="text/html; charset=<tmpl_var name="html_content_encoding">"/> - <link href="themes/default/css/central.css" rel="stylesheet" type="text/css"/> - <!--[if lte IE 7]> - <link href="themes/default/css/patches/central.css" rel="stylesheet" type="text/css" /> - <![endif]--> - <!--[if lte ie 6]> - <style type="text/css" media="screen"> - /* - Move these to your IE specific stylesheet if possible - */ - .uniForm, - .uniForm fieldset, - .uniForm .ctrlHolder, - .uniForm .formHint, - .uniForm .buttonHolder, - .uniForm .ctrlHolder .multiField, - .uniForm .inlineLabel{ zoom:1; } - - .uniForm .inlineLabels label, .uniForm .inlineLabels .label, - .uniForm .blockLabels label, .uniForm .blockLabels .label, - .uniForm .inlineLabel span{ padding-bottom: .2em; } - - .uniForm .inlineLabel input, - .uniForm .inlineLabels .inlineLabel input, - .uniForm .blockLabels .inlineLabel input{ margin-top: -.3em; } - </style> - <![endif]--> - <!--[if gt ie 6]> - <style type="text/css" media="screen"> - /* - Move these to your IE specific stylesheet if possible - */ - .uniForm, - .uniForm fieldset, - .uniForm .ctrlHolder, - .uniForm .formHint, - .uniForm .buttonHolder, - .uniForm .ctrlHolder .multiField, - .uniForm .inlineLabel{ zoom:1; } - - .uniForm .inlineLabels label, .uniForm .inlineLabels .label, - .uniForm .blockLabels label, .uniForm .blockLabels .label, - .uniForm .inlineLabel span{ padding-bottom: .2em; } - - .uniForm .inlineLabel input, - .uniForm .inlineLabels .inlineLabel input, - .uniForm .blockLabels .inlineLabel input{ margin-top: -.3em; } - </style> - <![endif]--> - <link rel="shortcut icon" href="/themes/default/images/favicon.ico" /> - <script type="text/javascript" src="js/yui/yahoo/yahoo-min.js"></script> - <script type="text/javascript" src="js/yui/connection/connection-min.js"></script> - <script type="text/javascript" src="js/scrigo.js.php"></script> - <script type="text/javascript" src="js/uni-form/jquery.js"></script> - <script type="text/javascript" src="js/uni-form/uni-form.jquery.js"></script> -</head> -<body onload="loadInitContent()"> - <div id="page_margins"> - <div id="page"> - <div id="header"> - <div id="topsubnav"> - <!-- start: skip link navigation --> - <a class="skip" href="#navigation" title="skip link">Skip to the navigation</a><span class="hideme">.</span> - <a class="skip" href="#content" title="skip link">Skip to the content</a><span class="hideme">.</span> - <!-- end: skip link navigation --> - <span><a href="#logout" onclick="loadContent('login/logout.php');">LOGOUT</a><!-- | <a href="#" onclick="capp('help')">Help</a> | <a href="#">Imprint</a>--></span> - </div> - <h1 id="ir-HeaderLogo" class="swap"><span>ISPConfig 3</span></h1> - <span>hosting control panel</span> - </div> - <!-- begin: main navigation #nav --> - <div id="nav"> - <a id="navigation" name="navigation"></a> - <!-- skiplink anchor: navigation --> - <div id="nav_main"> - <div id="topNav"> </div> - </div> - </div> - <!-- end: main navigation --> - <!-- begin: main content area #main --> - <div id="main"> - <!-- begin: #col1 - first float column --> - <div id="col1"> - <div id="col1_content" class="clearfix"> - <div id="sideNav"> </div> - </div> - </div> - <!-- end: #col1 --> - <!-- begin: #col3 static column --> - <div id="col3"> - <div id="col3_content" class="clearfix"> - <a id="content" name="content"></a> - <!-- skiplink anchor: Content --> - <form method="post" action="" id="pageForm" name="pageForm" enctype="multipart/form-data" class="uniForm"> - <div id="pageContent"><!-- AJAX CONTENT --></div> - </form> - </div> - <div id="ie_clearing"> </div> - <!-- End: IE Column Clearing --> - </div> - <!-- end: #col3 --> - </div> - <!-- end: #main --> - <!-- begin: #footer --> - <div id="footer"> - Powered by <a href="<tmpl_var name="app_link">" target="_blank"><tmpl_var name="app_title"> <tmpl_var name="app_version"></a> - </div><!-- end: #footer --> - </div> -</body> -</html> +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" + "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> +<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> +<head> + <title><tmpl_var name="app_title"> <tmpl_var name="app_version"></title> + <meta http-equiv="Content-Type" content="text/html; charset=<tmpl_var name="html_content_encoding">"/> + <link href="themes/default/css/central.css" rel="stylesheet" type="text/css"/> + <!--[if lte IE 7]> + <link href="themes/default/css/patches/central.css" rel="stylesheet" type="text/css" /> + <![endif]--> + <!--[if lte ie 6]> + <style type="text/css" media="screen"> + /* + Move these to your IE specific stylesheet if possible + */ + .uniForm, + .uniForm fieldset, + .uniForm .ctrlHolder, + .uniForm .formHint, + .uniForm .buttonHolder, + .uniForm .ctrlHolder .multiField, + .uniForm .inlineLabel{ zoom:1; } + + .uniForm .inlineLabels label, .uniForm .inlineLabels .label, + .uniForm .blockLabels label, .uniForm .blockLabels .label, + .uniForm .inlineLabel span{ padding-bottom: .2em; } + + .uniForm .inlineLabel input, + .uniForm .inlineLabels .inlineLabel input, + .uniForm .blockLabels .inlineLabel input{ margin-top: -.3em; } + </style> + <![endif]--> + <!--[if gt ie 6]> + <style type="text/css" media="screen"> + /* + Move these to your IE specific stylesheet if possible + */ + .uniForm, + .uniForm fieldset, + .uniForm .ctrlHolder, + .uniForm .formHint, + .uniForm .buttonHolder, + .uniForm .ctrlHolder .multiField, + .uniForm .inlineLabel{ zoom:1; } + + .uniForm .inlineLabels label, .uniForm .inlineLabels .label, + .uniForm .blockLabels label, .uniForm .blockLabels .label, + .uniForm .inlineLabel span{ padding-bottom: .2em; } + + .uniForm .inlineLabel input, + .uniForm .inlineLabels .inlineLabel input, + .uniForm .blockLabels .inlineLabel input{ margin-top: -.3em; } + </style> + <![endif]--> + <link rel="shortcut icon" href="/themes/default/images/favicon.ico" /> + <script type="text/javascript" src="js/yui/yahoo/yahoo-min.js"></script> + <script type="text/javascript" src="js/yui/connection/connection-min.js"></script> + <script type="text/javascript" src="js/scrigo.js.php"></script> + <script type="text/javascript" src="js/uni-form/jquery.js"></script> + <script type="text/javascript" src="js/uni-form/uni-form.jquery.js"></script> + <script language="JavaScript" type="text/javascript"> + var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1; + if(!is_chrome) { + var style = document.createElement('style'); + style.innerHTML = '#page_margins { min-width: 980px; max-width: 80%; background: #fff; display: table;}'; + document.getElementsByTagName("head")[0].appendChild(style); + } + </script> +</head> +<body onload="loadInitContent()"> + <div id="page_margins"> + <div id="page"> + <div id="header"> + <div id="topsubnav"> + <!-- start: skip link navigation --> + <a class="skip" href="#navigation" title="skip link">Skip to the navigation</a><span class="hideme">.</span> + <a class="skip" href="#content" title="skip link">Skip to the content</a><span class="hideme">.</span> + <!-- end: skip link navigation --> + <span><a href="#logout" onclick="loadContent('login/logout.php');">LOGOUT</a><!-- | <a href="#" onclick="capp('help')">Help</a> | <a href="#">Imprint</a>--></span> + </div> + <h1 id="ir-HeaderLogo" class="swap"><span>ISPConfig 3</span></h1> + <span>hosting control panel</span> + </div> + <!-- begin: main navigation #nav --> + <div id="nav"> + <a id="navigation" name="navigation"></a> + <!-- skiplink anchor: navigation --> + <div id="nav_main"> + <div id="topNav"> </div> + </div> + </div> + <!-- end: main navigation --> + <!-- begin: main content area #main --> + <div id="main"> + <!-- begin: #col1 - first float column --> + <div id="col1"> + <div id="col1_content" class="clearfix"> + <div id="sideNav"> </div> + </div> + </div> + <!-- end: #col1 --> + <!-- begin: #col3 static column --> + <div id="col3"> + <div id="col3_content" class="clearfix"> + <a id="content" name="content"></a> + <!-- skiplink anchor: Content --> + <form method="post" action="" id="pageForm" name="pageForm" enctype="multipart/form-data" class="uniForm"> + <div id="pageContent"><!-- AJAX CONTENT --></div> + </form> + </div> + <div id="ie_clearing"> </div> + <!-- End: IE Column Clearing --> + </div> + <!-- end: #col3 --> + </div> + <!-- end: #main --> + <!-- begin: #footer --> + <div id="footer"> + Powered by <a href="<tmpl_var name="app_link">" target="_blank"><tmpl_var name="app_title"> <tmpl_var name="app_version"></a> + </div><!-- end: #footer --> + </div> +</body> +</html> -- Gitblit v1.9.1