FELIX-2188 Remove old admin.css and admin.js CSS and script and provide a new admin_compat.css providing parts of the former admin.css so as to render as much as possible of old plugins somewhat nice.

git-svn-id: https://svn.apache.org/repos/asf/felix/trunk@922227 13f79535-47bb-0310-9956-ffa450edef68
diff --git a/webconsole/src/main/resources/res/ui/admin.css b/webconsole/src/main/resources/res/ui/admin.css
deleted file mode 100644
index 6bc0085..0000000
--- a/webconsole/src/main/resources/res/ui/admin.css
+++ /dev/null
@@ -1,595 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-/*
- * The admin.css is currently a collection of a lot of CSS styles, which should
- * be cleaned up for more appropriate and targeted stylings.
- *
- * This stylesheet is loaded by the AbstractWebConsolePlugin before the
- * stylesheet addressed by the BrandingPlugin.getMainStyleSheet() method, which
- * is the webconsole.css by default.
- *
- * See also http://felix.apache.org/site/branding-the-web-console.html
- */
-
-
-#claim {
-    color: white;
-    background-color: black;
-    padding: 2px 10px 2px 10px;
-}
-
-#claim p {
-    margin: 0;
-    padding: 0;
-}
-
-#claim a {
-    color: #C5E2EE;
-    text-decoration: none;
-}
-
-/*
-.claimcell A:link {
-	color: #C5E2EE;
-	text-decoration: none;
-}
-
-.claimcell A:visited {
-	color: #C5E2EE;
-	text-decoration: none;
-}
-*/
-#claim a:hover {
-    color: #99FF33;
-    border-bottom: 1px solid;
-}
-
-#claim a:active {
-    color: #FFFFFF;
-}
-
-/* old styles */
-table {
-    text-align: left;
-}
-
-table.content {
-    clear: both;
-    font-size: 10px;
-    line-height: 13px;
-    border: 0px solid #66dd44;
-    border-top: 1px solid #cccccc;
-    padding: 0px;
-    margin: 0px;
-    margin-top: 26px;
-    margin-bottom: 26px;
-    text-align: left;
-}
-
-tr {
-    border-left: 1px solid #cccccc;  
-    border-right: 1px solid #cccccc;  
-}
-
-/*
- * Disable left and right border on content table rows. Opera 10 and IE 7
- * would otherwise render the left and right borders inherited from the tr
- * definition
- */
-tr.content {
-    border-left: none;  
-    border-right: none;  
-}
-
-td.content {
-    color: #333333;
-    border: 0px solid #66dd44;
-    border-bottom: 1px solid #cccccc;
-    vertical-align: middle;
-    padding: 5px;
-}
-
-td.aligntop {
-    vertical-align: top;
-}
-
-td.content img {
-    width: 10px;
-    height: 10px;
-}
-
-td.disabled {
-    color: #999999;
-}
-
-th.content {
-    color: #333333;
-    border: 0px solid #66dd44;
-    border-bottom: 1px solid #cccccc;
-    text-align: left;
-    padding: 5px;
-    padding-left: 10px;
-}
-
-.right {
-    text-align: right;
-}
-.center {
-    text-align: center;
-}
-
-th.container {
-    color: #6181A9;
-    background-color: #f0f0f0;
-}
-
-th.important {
-    color: #B81833;
-}
-
-.important {
-    color: #B81833;
-}
-
-#maintable { /* postion: absolute; */
-    font-size: 10px;
-    line-height: 13px;
-    border: 1px solid #000000;
-    padding: 0px;
-    margin: 0px;
-}
-
-.toolcell {
-    font-size: 10px;
-    color: #999999;
-    line-height: 10px;
-    background-color: #000000;
-    height: 18px;
-    padding: 0px;
-    padding-bottom: 1px;
-    text-align: left;
-}
-
-.toolcell A:link {
-    color: #C5E2EE;
-    text-decoration: none;
-}
-
-.toolcell A:visited {
-    color: #C5E2EE;
-    text-decoration: none;
-}
-
-.toolcell A:hover {
-    color: #99FF33;
-    text-decoration: none;
-    border-bottom: 1px solid;
-}
-
-.toolcell A:active {
-    color: #FFFFFF;
-    text-decoration: none;
-}
-
-.leadcell {
-    margin: 0px;
-    padding: 0px;
-    border: 0px solid #000000;
-    width: 718px;
-    height: 100px;
-    background-image: url(../imgs/banner_left.jpg);
-    vertical-align: top;
-}
-
-.leadcelltext {
-    position: absolute;
-    border: 0px solid #000000;
-    font-size: 26px;
-    line-height: 32px;
-    margin-top: 5px;
-    margin-left: 8px;
-    color: #ffffff;
-    vertical-align: top;
-}
-
-.logocell {
-    border-left: 1px solid #000000;
-    width: 239px;
-    background-image: url(../imgs/banner_right.jpg);
-}
-
-#technavcell {
-    font-size: 10px;
-    font-weight: bold;
-    border: 0px solid #000000;
-    border-top: 1px solid #000000;
-    height: 21px;
-    background-color: #6181A9;
-}
-
-/*
-#technav A:link {
-	float: left;
-	display: block;
-	color: #ffffff;
-	border: 0px solid #000000;
-	border-right: 1px solid #000000;
-	height: 21px;
-	text-decoration: none;
-	padding: 0px 10px 0px 10px;
-	background-color: #6181A9;
-}
-
-#technav A:visited {
-	float: left;
-	display: block;
-	color: #ffffff;
-	border-right: 1px solid #000000;
-	height: 21px;
-	text-decoration: none;
-	padding: 0px 10px 0px 10px;
-	background-color: #6181A9;
-}
-
-#technav A:hover {
-	float: left;
-	display: block;
-	color: #ffffff;
-	border-right: 1px solid #000000;
-	height: 21px;
-	text-decoration: none;
-	padding: 0px 10px 0px 10px;
-	background-color: #000000;
-}
-
-#technav A:active {
-	float: left;
-	display: block;
-	color: #ffffff;
-	border-right: 1px solid #000000;
-	height: 21px;
-	text-decoration: none;
-	padding: 0px 10px 0px 10px;
-	background-color: #6181A9;
-}
-*/
-.techcontentcell {
-    border: 0px solid #000000;
-    border-top: 1px solid #000000;
-}
-
-.relatedcell {
-    border-left: 1px solid #000000;
-    border-top: 1px solid #000000;
-    background-color: #EBF0F6;
-}
-
-/* CENTRAL CONTENT AREA STYLING */
-.content {
-    position: relative;
-    margin: 25px;
-    font-size: 11px;
-    line-height: 16px;
-    color: #000000;
-}
-
-.content A:link {
-    color: #336600;
-    text-decoration: underline;
-}
-
-.content A:visited {
-    color: #666666;
-    text-decoration: underline;
-}
-
-.content A:hover {
-    color: #ffffff;
-    background-color: #336600;
-    text-decoration: none;
-}
-
-.content A:active {
-    color: #ffffff;
-    background-color: #000000;
-    text-decoration: none;
-}
-
-body {
-	background-color: white;
-}
-
-/* TEXT STYLING */ /*
-h1, h2, h3, h4, h5, h6, p
-
-	{
-	margin: 0px;
-	margin-bottom: 8px;
-	font-size: 11px;
-	line-height: 16px;
-	font-weight:bold;
-	}
-
-*/ /*
-h1
-	{
-	color: #000000;
-	margin-top: 32px;
-	clear: left;
-	}
-
-
-h2
-	{
-	color: #336699;
-	}
-
-
-h3
-	{
-	color: #336699;
-	}
-*/ /*
-p
-	{
-	font-size: 11px;
-	line-height: 16px;
-	font-weight: normal;
-	color: #000000;
-	}
-*/ /* FORMS */
-form {
-    font-size: 9px;
-    border-top: 0px solid #000000;
-    border-bottom: 0px solid #000000;
-    border-left: 0px solid #000000;
-    border-right: 0px solid #000000;
-    margin: 0;
-    padding: 0;
-    clear: left;
-}
-
-select,textarea {
-    font-family: Verdana, Arial, Helvetica, san-serif;
-    font-size: 9px;
-    font-weight: normal;
-    display: block;
-    float: left;
-    padding-top: 3px;
-    margin-bottom: 10px;
-}
-
-.input {
-    font-family: Verdana, Arial, Helvetica, san-serif;
-    font-size: 9px;
-    font-weight: normal;
-    color: #184054;
-    background-color: #f0f0f0;
-    border: 1px solid #999999;
-    border-bottom: 1px solid #cccccc;
-    border-right: 1px solid #cccccc;
-}
-
-.multiselect {
-    display: block;
-}
-
-.fileinput {
-    font-family: Verdana, Arial, Helvetica, san-serif;
-    font-size: 9px;
-    font-weight: normal;
-    color: #184054;
-}
-
-.submit {
-    cursor: default;
-    width: 60px;
-    font-family: Verdana, Arial, Helvetica, san-serif;
-    font-size: 10px;
-    font-weight: bold;
-    background-color: #f0f0f0;
-    height: 20px;
-    padding: 0px;
-    padding-bottom: 1px;
-    margin: 0px;
-    border: 1px solid #cccccc;
-    border-bottom: 1px solid #666666;
-    border-right: 1px solid #666666;
-}
-
-input.important {
-    background-color: #B81833;
-    color: #ffffff;
-}
-
-select {
-    color: #184054;
-    background-color: #f0f0f0;
-    border: 0px solid #999999;
-}
-
-textarea {
-    color: #184054;
-    background-color: #f0f0f0;
-    width: 234px;
-    height: 100px;
-    border: 1px solid #999999;
-    border-bottom: 1px solid #cccccc;
-    border-right: 1px solid #cccccc;
-}
-
-.clearleft {
-    clear: left;
-}
-
-.clearboth {
-    clear: both;
-}
-
-.checkradio {
-    background-color: #ffffff;
-    width: 20px;
-    padding: 0px;
-    padding-bottom: 10px;
-    margin: 0px;
-    margin-top: 2px;
-    border: 0px solid #999999;
-}
-
-.checkradiotext {
-    font-size: 9px;
-    font-weight: normal;
-    line-height: 11px;
-    width: 100px;
-    color: #000000;
-    padding: 0px;
-    padding-bottom: 10px;
-    margin: 0px;
-    margin-top: 4px;
-    border: 0px solid #999999;
-}
-
-div.buttons {
-    background-color: #6181A9;
-    height: 30px;
-    text-align: right;
-    vertical-align: middle;
-    padding-right: 10px;
-    padding-top: 8px;
-    color: #F0F0F0;
-    font-size: 10px;
-}
-div.buttons select {
-    font-family: Verdana, Arial, Helvetica, san-serif;
-    font-size: 9px;
-    font-weight: normal;
-    display: inline;
-    float:none;
-}
-div.button {
-    display: inline-block;
-    margin-left: 10px;
-}
-div.fullwidth {
-    width: 100%;
-}
-div.statusline {
-    margin-top: 10px;
-    background-color: #F5F5F5;
-    padding-left: 10px;
-    border: 1px solid #CCCCCC;
-    font-family: Verdana, Arial, Helvetica, san-serif;
-    font-size: 11px;
-    font-weight: normal;
-    color: #222222;
-    line-height: 19px;
-    margin-bottom: 10px;
-}
-div.table {
-	margin-left: 1px;
-}
-div.tablelayout {
-}
-
-/* tables */
-table.tablelayout {
-	border-left: 1px solid #6181A9;
-    border-right: 1px solid #6181A9;
-    border-collapse: collapse;
-	font-family:arial;
-    background-color: #CDCDCD;
-    font-size: 8pt;
-    width: 100%;
-    text-align: left;
-}
-table.tablelayout tbody tr {
-    border-left: 1px solid #6181A9;
-    border-right: 1px solid #6181A9;
-}
-
-table.tablelayout thead tr th, table.tablelayout tfoot tr th {
-    background-color: #e6EEEE;
-    border: 1px solid #6181A9;
-    font-size: 8pt;
-    padding: 4px;
-}
-table.tablelayout thead tr .header {
-    background-image: url(../imgs/bg.gif);
-    background-repeat: no-repeat;
-    background-position: center right;
-    cursor: pointer;
-}
-table.tablelayout tbody td {
-    color: #3D3D3D;
-    border-top: 1px solid #6181A9;
-    border-bottom: 1px solid #6181A9;
-    padding: 4px;
-    background-color: #FFF;
-    vertical-align: top;
-}
-table.tablelayout tbody tr.odd td {
-    background-color:#F0F0F6;
-}
-table.tablelayout thead tr .headerSortUp {
-    background-image: url(../imgs/asc.gif);
-}
-table.tablelayout thead tr .headerSortDown {
-    background-image: url(../imgs/desc.gif);
-}
-table.tablelayout thead tr .headerSortDown, table.tablelayout thead tr .headerSortUp {
-background-color: #8dbdd8;
-}
-.col_Id {
-    width: 40px;
-}
-.col_Status {
-	width: 50px;
-}
-.col_Actions {
-    width: 121px;
-}
-
-/** Added for new Install stuff */
-#plugin_content {
-    margin-top: 26px;
-    margin-bottom: 26px;
-}
-.contentheader {
-    border: 0px solid #66dd44;
-    border-bottom: 1px solid #cccccc;
-    text-align: left;
-    padding: 5px;
-    padding-left: 10px;
-    color: #6181A9;
-    background-color: #f0f0f0;
-}
-.contentline {
-	padding-top: 15px;
-	padding-left:10px;
-    clear: both;
-    width: 100%;
-}
-.contentleft {
-    padding-left: 9px;
-    float: left;
-    width:110px;
-}
-.contentright {
-    display: inline;
-    width: 225px;
-}
diff --git a/webconsole/src/main/resources/res/ui/admin.js b/webconsole/src/main/resources/res/ui/admin.js
deleted file mode 100644
index 52d0c2c..0000000
--- a/webconsole/src/main/resources/res/ui/admin.js
+++ /dev/null
@@ -1,159 +0,0 @@
-/*
- * Licensed to the Apache Software Foundation (ASF) under one or more
- * contributor license agreements.  See the NOTICE file distributed with
- * this work for additional information regarding copyright ownership.
- * The ASF licenses this file to You under the Apache License, Version 2.0
- * (the "License"); you may not use this file except in compliance with
- * the License.  You may obtain a copy of the License at
- *
- *      http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-
-/* shuts down server after [num] seconds */
-function shutdown(num, formname, elemid) {
-	var elem;
-	var canCount = document.getElementById;
-	if (canCount) {
-	    elem = document.getElementById(elemid);
-	    canCount = (typeof(elem) != "undefined" && typeof(elem.innerHTML) != "undefined");
-	}
-	var secs=" second";
-	var ellipsis="...";
-	if (num > 0) {
-		if (num != 1) {
-			secs+="s";
-		}
-		if (canCount) {
-		    elem.innerHTML=num+secs+ellipsis;
-		}
-		setTimeout('shutdown('+(--num)+', "'+formname+'", "'+elemid+'")',1000);
-	} else {
-	    document[formname].submit();
-	}
-}
-
-/* aborts server shutdown and redirects to [target] */
-function abort(target) {
-    top.location.href=target;
-}
-
-/* checks if values of [pass1] and [pass2] match */
-function checkPasswd(form, pass0, pass1, pass2) {
-    var check = false;
-    check = (form[pass0].value != form[pass1].value);
-    if (!check) {
-        alert("Old and new password must be different.");
-        form[pass1].value="";
-        form[pass2].value="";
-        form[pass1].focus();
-    }
-    check = (form[pass1].value == form[pass2].value);
-    if (!check) {
-        alert("Passwords did not match. Please type again.");
-        form[pass1].value="";
-        form[pass2].value="";
-        form[pass1].focus();
-    }
-    return check;
-}
-
-/* displays a date in the user's local timezone */
-function localDate(time) {
-    var date = time ? new Date(time) : new Date();
-    document.write(date.toLocaleString());
-}
-
-//-----------------------------------------------------------------------------
-// Ajax Support
-
-// request object, do not access directly, use getXmlHttp instead
-var xmlhttp = null;
-function getXmlHttp() {
-	if (xmlhttp) {
-		return xmlhttp;
-	}
-	
-	if (window.XMLHttpRequest) {
-		xmlhttp = new XMLHttpRequest();
-	} else if (window.ActiveXObject) {
-		try {
-			xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
-		} catch (ex) {
-			try {
-				xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
-			} catch (ex) {
-			}
-		}
-	}
-	
-	return xmlhttp;
-}
-
-function sendRequest(/* String */ method, /* url */ url, /* function */ callback) {
-    var xmlhttp = getXmlHttp();
-    if (!xmlhttp) {
-        return;
-    }
-    
-    if (xmlhttp.readyState < 4) {
-    	xmlhttp.abort();
-  	}
-  	
-  	if (!method) {
-  		method = 'GET';
-  	}
-  	
-  	if (!url) {
-  		url = document.location;
-  	} else if (url.charAt(0) == '?') {
-  		url = document.location + url;
-    }
-  	
-    priv_callback = callback;
-
-    xmlhttp.open(method, url);
-    
-    // set If-Modified-Since way back in the past to prevent
-    // using any content from the cache
-    xmlhttp.setRequestHeader("If-Modified-Since", new Date(0));
-    
-    xmlhttp.onreadystatechange = handleResult;
-    xmlhttp.send(null);
-  	
-}
-
-var priv_callback = null;
-
-function handleResult() {
-    var xmlhttp = getXmlHttp();
-    if (!xmlhttp || xmlhttp.readyState != 4) {
-        return;
-    }
-    
-    var result = xmlhttp.responseText;
-    if (!result) {
-        return;
-    }
-
-    var theCallBack = priv_callback;
-    priv_callback = null;
-    
-	if (theCallBack) {
-	    try
-        {
-            var obj = eval('(' + result + ')');
-	       theCallBack(obj);
-        }
-        catch (e)
-        {
-            // error evaluating response, don't care ...
-        }
-	}
-}
diff --git a/webconsole/src/main/resources/res/ui/admin_compat.css b/webconsole/src/main/resources/res/ui/admin_compat.css
new file mode 100644
index 0000000..53e891c
--- /dev/null
+++ b/webconsole/src/main/resources/res/ui/admin_compat.css
@@ -0,0 +1,177 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/*
+ * The admin.css is currently a collection of a lot of CSS styles, which should
+ * be cleaned up for more appropriate and targeted stylings.
+ *
+ * This stylesheet is loaded by the AbstractWebConsolePlugin before the
+ * stylesheet addressed by the BrandingPlugin.getMainStyleSheet() method, which
+ * is the webconsole.css by default.
+ *
+ * See also http://felix.apache.org/site/branding-the-web-console.html
+ */
+
+/*******************************************************************************
+ * The content and container classes were previously used to uniformly render
+ * tables (before the tablelayout class has been added below).
+ * For backwards compatibility we keep these classes for now to enable
+ * existing plugins to still render somewhat nice.
+ */
+table.content {
+    clear: both;
+    font-size: 10px;
+    line-height: 13px;
+    border: 1px solid #AAAAAA;
+    padding: 0px;
+    margin: 0px;
+    margin-top: 26px;
+    margin-bottom: 26px;
+    text-align: left;
+}
+
+tr.content {
+}
+
+td.content {
+    color: #333333;
+    border-bottom: 1px solid #cccccc;
+    vertical-align: middle;
+    padding: 5px;
+}
+
+td.aligntop {
+    vertical-align: top;
+}
+
+td.content img {
+    width: 10px;
+    height: 10px;
+}
+
+td.disabled {
+    color: #999999;
+}
+
+th.content {
+    color: #333333;
+    border-bottom: 1px solid #cccccc;
+    text-align: left;
+    padding: 5px;
+    padding-left: 10px;
+    font-weight: bold;
+}
+
+.right {
+    text-align: right;
+}
+.center {
+    text-align: center;
+}
+
+th.container {
+    color: #6181A9;
+    background-color: #f0f0f0;
+}
+
+th.important {
+    color: #B81833;
+}
+
+.important {
+    color: #B81833;
+}
+
+.clearleft {
+    clear: left;
+}
+
+.clearboth {
+    clear: both;
+}
+/******************************************************************************/
+
+
+/*******************************************************************************
+ * The tablelayout class hass been used recently to render tables in a uniform
+ * way. Some existing plugins might still use the tablelayout class.
+ */
+table.tablelayout {
+    border-left: 1px solid #6181A9;
+    border-right: 1px solid #6181A9;
+    border-collapse: collapse;
+    font-family:arial;
+    background-color: #CDCDCD;
+    font-size: 8pt;
+    width: 100%;
+    text-align: left;
+}
+table.tablelayout tbody tr {
+    border-left: 1px solid #6181A9;
+    border-right: 1px solid #6181A9;
+}
+
+table.tablelayout thead tr th, table.tablelayout tfoot tr th {
+    background-color: #e6EEEE;
+    border: 1px solid #6181A9;
+    font-size: 8pt;
+    padding: 4px;
+}
+table.tablelayout thead tr .header {
+    background-image: url(../imgs/bg.gif);
+    background-repeat: no-repeat;
+    background-position: center right;
+    cursor: pointer;
+}
+table.tablelayout tbody td {
+    color: #3D3D3D;
+    border-top: 1px solid #6181A9;
+    border-bottom: 1px solid #6181A9;
+    padding: 4px;
+    background-color: #FFF;
+    vertical-align: top;
+}
+table.tablelayout tbody tr.odd td {
+    background-color:#F0F0F6;
+}
+table.tablelayout thead tr .headerSortUp {
+    background-image: url(../imgs/asc.gif);
+}
+table.tablelayout thead tr .headerSortDown {
+    background-image: url(../imgs/desc.gif);
+}
+table.tablelayout thead tr .headerSortDown, table.tablelayout thead tr .headerSortUp {
+background-color: #8dbdd8;
+}
+/******************************************************************************/
+
+
+/*******************************************************************************
+ * The statusline class was the predecessor to the current status line setup
+ * using the JQuery UI statline and ui-state-highlight classes.
+ * This backwards compatible statusline class is configured as a copy of the
+ * basic theme statline/ui-state-highlight classes.
+ */
+div.statusline {
+    margin-bottom:0.5em !important;
+    margin-top:0.5em !important;
+    padding:0.2em;
+    background:#FBF9EE url(images/ui-bg_glass_55_fbf9ee_1x400.png) repeat-x scroll 50% 50%;
+    border:1px solid #FCEFA1;
+    color:#363636;
+}
+/******************************************************************************/
diff --git a/webconsole/src/main/resources/templates/main_header.html b/webconsole/src/main/resources/templates/main_header.html
index 1805e6b..73a3410 100644
--- a/webconsole/src/main/resources/templates/main_header.html
+++ b/webconsole/src/main/resources/templates/main_header.html
@@ -23,9 +23,10 @@
 	<script src="{2}/res/lib/jquery.cookies-2.2.0.js" type="text/javascript"></script>
 	<script src="{2}/res/lib/jquery.tablesorter-2.0.3.js" type="text/javascript"></script>
 	<script src="{2}/res/lib/support.js" type="text/javascript"></script>
-
-	<!-- temporary here - for compatibility untill all plugins are refactored -->
-	<!-- <script src="{2}/res/ui/admin.js" type="text/javascript"></script> -->
+	
+	   
+    <!-- FELIX-2188: backwards compatibility CSS -->
+    <link href="{2}/res/ui/admin_compat.css" rel="stylesheet" type="text/css" />
 </head>
 
 <body class="ui-widget">