DMC/scipro
7
0
Fork 0
Code Issues44 Pull Requests6 Actions Projects1 Releases Wiki Activity

Improvements to css, new handling of IE-quirks that doesn't

Browse Source 
require separate css files and acceptable rendering of the tab-menu
when many tabs are used

Change-Id: I823baa49faf95d9314e1606a1e4eb41d6c4c1383
This commit is contained in:
mpeters 2011-07-13 15:29:09 +02:00
parent 36d8b0b3ce
commit 505520ef99
5 changed files with 43 additions and 35 deletions
src/main
java/se/su/dsv/scipro/basepages
BasePage.html
webapp
css
scipro-ie.cssscipro.css
images
tab_bg.pngtab_bg_ie9.png

25
src/main/java/se/su/dsv/scipro/basepages/BasePage.html

@ -1,6 +1,13 @@
<!DOCTYPE html>
<html lang="en"
xmlns:wicket="http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd">
<!--[if lt IE 7]> <html class="ie ie6 lte9 lte8 lte7"> <![endif]-->
<!--[if IE 7]> <html class="ie ie7 lte9 lte8 lte7"> <![endif]-->
<!--[if IE 8]> <html class="ie ie8 lte9 lte8"> <![endif]-->
<!--[if IE 9]> <html class="ie ie9 lte9"> <![endif]-->
<!--[if gt IE 9]> <html> <![endif]-->
<!--[if !IE]><!-->
<html lang="en" xmlns:wicket="http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd">
<!--<![endif]-->
<head>
<meta charset="UTF-8" />
<title wicket:id="pageTitle">SciPro DSV</title>
@ -16,9 +23,7 @@
<!-- <link href='http://fonts.googleapis.com/css?family=Vollkorn' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=Ubuntu:regular,bold' rel='stylesheet' type='text/css' /> -->
<!--<link rel="stylesheet" href="css/scipro.css" media="screen,projection" />-->
<!--[if lte IE 9]>
<link rel="stylesheet" href="css/scipro-ie.css" media="screen,projection" />
<![endif]-->
<!-- <link type="text/css" href="css/smoothness/jquery-ui-1.8.10.custom.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.10.custom.min.js"></script> -->
@ -30,4 +35,12 @@
<wicket:child />
</div>
</body>
</html>
</html>
<!--[if gt IE 9]> </html> <![endif]-->
<!--[if IE 9]> </html> <![endif]-->
<!--[if IE 8]> </html> <![endif]-->
<!--[if IE 7]> </html> <![endif]-->
<!--[if lt IE 7]> </html> <![endif]-->

9
src/main/webapp/css/scipro-ie.css

@ -1,9 +0,0 @@
#main-nav .current a,
#main-nav li:hover > a {
behavior: url('border-radius.htc');
}
/* Checked styles for IE(9) */
span.hilight > input[type=radio]:checked + label { background-color: PaleGreen;}
span.hilight > input[type=checkbox]:checked + label { background-color: PaleGreen;}

44
src/main/webapp/css/scipro.css

@ -438,22 +438,28 @@ ul.multiobject-selected-list li {
.tab-menu {
float:left;
width:100%;
background: url("../images/tab_bg.gif") repeat-x bottom;
font-size:93%;
background: url("../images/tab_bg.png");
font-size: 11px;
line-height:normal;
}
.ie9 .tab-menu {
background: url("../images/tab_bg_ie9.png") !important;
}
.tab-menu ul {
margin:0;
padding: 0px 10px 0;
padding: 0 10px 0;
list-style:none;
}
.tab-menu li {
float:left;
background:url("../images/tab_left.gif") no-repeat left top;
margin:0;
padding:0 0 0 9px;
margin:2px 0 0 0;
padding:0px 0 0 9px;
border-bottom: 1px solid #78645A;
}
.tab-menu a {
float:left;
display:block;
@ -465,8 +471,8 @@ ul.multiobject-selected-list li {
}
.tab-menu img {
height: 14px;
vertical-align:middle;
height: 12px;
vertical-align:middle;
}
/* Commented Backslash Hack
@ -476,13 +482,14 @@ ul.multiobject-selected-list li {
.tab-menu a:hover {
color:#333;
}
.tab-menu #current {
.tab-menu .current {
background-image:url("../images/tab_left_on.gif");
border-bottom: 1px solid white !important;
}
.tab-menu #current a {
.tab-menu .current a {
background-image:url("../images/tab_right_on.gif");
color:#333;
padding-bottom:5px;
}
.vertical-menu ul {
@ -508,7 +515,7 @@ ul.multiobject-selected-list li {
background-color: #eeeeee;
}
.vertical-menu #current a {
.vertical-menu .current a {
color: black;
background-color: #DDE7EE;
}
@ -540,7 +547,7 @@ ul.multiobject-selected-list li {
border-bottom-color: black;
}
.horizontal-menu #current a {
.horizontal-menu .current a {
border-bottom-color: #2DB300;
}
@ -795,14 +802,11 @@ span.hilight > input + label:hover, span.hilight > input:focus + label {
color: #2C7AD0;
}
/* Highlight checked form components, IE-specific variant in scipro-ie.css */
span.hilight > input[type=radio]:checked + label {
text-shadow: lime 0px 0px 5px;
}
span.hilight > input[type=checkbox]:checked + label {
text-shadow: lime 0px 0px 5px;
}
/* Highlight checked form components, IE9-specific variant below, older IE's don't work */
span.hilight > input[type=radio]:checked + label { text-shadow: lime 0px 0px 5px; }
span.hilight > input[type=checkbox]:checked + label { text-shadow: lime 0px 0px 5px; }
.ie9 span.hilight > input[type=radio]:checked + label { background-color: PaleGreen; }
.ie9 span.hilight > input[type=checkbox]:checked + label { background-color: PaleGreen; }
.question-feedback {
margin-left: 1.5em;

BIN
src/main/webapp/images/tab_bg.png Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 180 B

BIN
src/main/webapp/images/tab_bg_ie9.png Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 185 B