Initial commit
|
After Width: | Height: | Size: 129 KiB |
|
After Width: | Height: | Size: 8.3 KiB |
|
After Width: | Height: | Size: 129 KiB |
|
After Width: | Height: | Size: 33 KiB |
|
After Width: | Height: | Size: 37 KiB |
|
After Width: | Height: | Size: 80 B |
|
After Width: | Height: | Size: 79 B |
|
After Width: | Height: | Size: 79 B |
|
After Width: | Height: | Size: 79 B |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 974 B |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 4.5 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 3.2 KiB |
|
After Width: | Height: | Size: 827 B |
|
After Width: | Height: | Size: 822 B |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 1.2 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 2.7 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 3.0 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 2.6 KiB |
|
After Width: | Height: | Size: 3.4 KiB |
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 2.5 KiB |
|
After Width: | Height: | Size: 2.9 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 2.4 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 2.0 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 2.1 KiB |
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 1.6 KiB |
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 230 KiB |
|
After Width: | Height: | Size: 4.2 KiB |
|
After Width: | Height: | Size: 435 B |
|
After Width: | Height: | Size: 5.5 KiB |
@@ -0,0 +1,69 @@
|
||||
body {
|
||||
background-image : url(../graphics/contentpage/overview_wtr.jpg);
|
||||
}
|
||||
|
||||
.page { min-height : 700px; }
|
||||
|
||||
/* show the "selected" image for this page */
|
||||
#navigation-links a#overview img, #navigation-links a#overview:hover img { background-image : url(../graphics/icons/ctool/overview48sel.gif); }
|
||||
|
||||
/*
|
||||
* Set up the Overview links to be displayed in two columns
|
||||
* that are centered in the middle of the page.
|
||||
*/
|
||||
|
||||
#overview-links {
|
||||
text-align : left;
|
||||
width : 760px;
|
||||
/* To center in Moz (have to use text-align for IE) */
|
||||
margin : 0px auto;
|
||||
}
|
||||
|
||||
#overview-links a {
|
||||
width : 370px;
|
||||
text-align : left;
|
||||
margin-left : 5px;
|
||||
margin-right : 5px;
|
||||
margin-top : 5px;
|
||||
margin-bottom : -20px;
|
||||
vertical-align : top;
|
||||
}
|
||||
|
||||
#overview-links > a { vertical-align : middle; }
|
||||
|
||||
#overview-links a img {
|
||||
height : 57px;
|
||||
width : 57px;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
#overview-links a .link-label {
|
||||
display : block;
|
||||
width : 300px;
|
||||
position : relative;
|
||||
top : -50px;
|
||||
left : 60px;
|
||||
}
|
||||
|
||||
#overview-links a p .text {
|
||||
display : block;
|
||||
width : 300px;
|
||||
position : relative;
|
||||
top : -45px;
|
||||
left : 53px;
|
||||
}
|
||||
|
||||
/* Special case for Mozilla, because the links are displayed
|
||||
in 1 vertical column instead of 2 centered columns */
|
||||
#overview-links > a { width : 700px; }
|
||||
#overview-links a > .link-label { width : 700px; }
|
||||
#overview-links a p > .text { width : 700px; }
|
||||
|
||||
#overview-links a:hover { border-right : 5px; }
|
||||
|
||||
a#basics img { background-image : url(../graphics/icons/obj48/wbbasics_obj.gif); }
|
||||
a#basics:hover img { background-image : url(../graphics/icons/obj48/wbbasicshov_obj.gif); }
|
||||
|
||||
a#team img { background-image : url(../graphics/icons/obj48/teamsup_obj.gif); }
|
||||
a#team:hover img { background-image : url(../graphics/icons/obj48/teamsuphov_obj.gif); }
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
|
||||
overview.layout.ncolumns = 2
|
||||
overview.page-content.overview-links.layout.vspacing = 35
|
||||
|
||||
overview.page-content.overview-links.basics.link-icon = css/graphics/icons/obj48/wbbasics_obj.gif
|
||||
overview.page-content.overview-links.team.link-icon = css/graphics/icons/obj48/teamsup_obj.gif
|
||||
overview.page-content.overview-links.layout.ncolumns = 2
|
||||
|
||||
overview.subtitle-id = overview/page-content/page-title
|
||||
overview.description-id = overview/page-content/page-description
|
||||
@@ -0,0 +1,181 @@
|
||||
/*
|
||||
* Set up general font colours, sizes, etc. Some of these will override
|
||||
* settings from the shared CSS
|
||||
*/
|
||||
|
||||
.intro-header H1 {
|
||||
font-size : 18pt;
|
||||
}
|
||||
|
||||
#page-links a .link-label, #action-links a .link-label {
|
||||
font-size : 13pt;
|
||||
font-weight : 600;
|
||||
color : #E5E5E5;
|
||||
}
|
||||
|
||||
#page-links a p .text, #action-links a p .text {
|
||||
font-size : 13pt;
|
||||
font-weight : 500;
|
||||
color : #E5E5E5;
|
||||
}
|
||||
|
||||
/*
|
||||
* Set up the content for the root page.
|
||||
*/
|
||||
|
||||
body {
|
||||
min-width : 770px;
|
||||
/* since IE doesn't support min-width, use expression */
|
||||
width:expression(document.body.clientWidth < 770? "770px": "auto" );
|
||||
background-image : url(graphics/rootpage/background.jpg);
|
||||
background-repeat : no-repeat;
|
||||
background-position : top left;
|
||||
background-color : #7169D1;
|
||||
}
|
||||
|
||||
#root {
|
||||
background-image : url(graphics/rootpage/brandmark.gif);
|
||||
background-repeat : no-repeat;
|
||||
background-position : bottom left;
|
||||
min-height : 450px;
|
||||
height : 100%;
|
||||
height : expression(document.body.clientHeight < 450? "450px": "100%" );
|
||||
}
|
||||
|
||||
/*
|
||||
* Set up the navigation bar. It should be centered in the middle
|
||||
* of the page
|
||||
*/
|
||||
|
||||
#links-background {
|
||||
background-image : url(graphics/rootpage/dots.gif);
|
||||
background-repeat : repeat-x;
|
||||
width : 100%;
|
||||
height : 177px;
|
||||
margin-top : 18%;
|
||||
margin-bottom : auto;
|
||||
text-align : center;
|
||||
}
|
||||
|
||||
/* specify a width for Moz so we can center.
|
||||
* **Important** If additional links are added, we will have to increase this width
|
||||
* to accomodate them, otherwise they will wrap to a new line
|
||||
*/
|
||||
|
||||
#links-background > #page-links {
|
||||
width : 33em;
|
||||
margin : 0 auto;
|
||||
}
|
||||
|
||||
#page-links {
|
||||
position : relative;
|
||||
top : 50px;
|
||||
}
|
||||
|
||||
#page-links a {
|
||||
position : relative;
|
||||
width : 86px;
|
||||
margin-left : 1em;
|
||||
margin-right : 1em;
|
||||
text-align : center;
|
||||
vertical-align : top;
|
||||
}
|
||||
|
||||
/* float left for Moz so the items all appear inline */
|
||||
|
||||
#page-links > a {
|
||||
float : left;
|
||||
position : relative;
|
||||
}
|
||||
|
||||
#page-links a img {
|
||||
height : 82px;
|
||||
width : 82px;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
/* remove the hover image from the flow of the document,
|
||||
so it doesn't take up space and change the position
|
||||
of the link label and descriptions */
|
||||
|
||||
#page-links a .background-image {
|
||||
position : absolute;
|
||||
}
|
||||
|
||||
/* properly align the link label and text based on class (left vs. right) */
|
||||
|
||||
#page-links a:hover {
|
||||
/* This is needed for IE to force the hover pseudo selectors below to work.*/
|
||||
padding : 0 em;
|
||||
}
|
||||
|
||||
/* Hide both the label and the description of the link and remove them from static HTML flow, until user hovers over link */
|
||||
|
||||
/* First, set the width of both the label and the description to a max of 15 em. */
|
||||
|
||||
/* This can be changed when translated to different country locals. */
|
||||
#page-links a span {
|
||||
width : 16em;
|
||||
}
|
||||
|
||||
/* Set up left links orientation first. */
|
||||
|
||||
#page-links a.left:link .link-label,
|
||||
#page-links a.left:visited .link-label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#page-links a.left:hover .link-label,
|
||||
#page-links a.left:focus .link-label,
|
||||
#page-links a.left:active .link-label {
|
||||
text-align: left;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top : 120 %;
|
||||
left : 0;
|
||||
}
|
||||
|
||||
/* hide description and remove it from static HTML flow, until user hovers over link */
|
||||
|
||||
#page-links a.left:link .text,
|
||||
#page-links a.left:visited .text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#page-links a.left:hover .text,
|
||||
#page-links a.left:focus .text,
|
||||
#page-links a.left:active .text {
|
||||
text-align: left;
|
||||
display: block;
|
||||
position: absolute;
|
||||
left : 0;
|
||||
top: 145%;
|
||||
}
|
||||
|
||||
/* Set up right links orientation now. */
|
||||
|
||||
#page-links a.right:link .link-label,
|
||||
#page-links a.right:visited .link-label {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#page-links a.right:hover .link-label,
|
||||
#page-links a.right:focus .link-label,
|
||||
#page-links a.right:active .link-label {
|
||||
text-align: right;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top : 120 %;
|
||||
right : 0;
|
||||
}
|
||||
|
||||
/* hide description and remove it from static HTML flow, until user hovers over link */
|
||||
|
||||
#page-links a.right:link .text,
|
||||
#page-links a.right:visited .text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#page-links a.right:hover .text,
|
||||
#page-links a.right:focus .text,
|
||||
#page-links a.right:active .text {
|
||||
@@ -0,0 +1,29 @@
|
||||
|
||||
root.links-background.page-links.overview.link-icon = css/graphics/icons/etool/overview72.gif
|
||||
root.links-background.page-links.tutorials.link-icon = css/graphics/icons/etool/tutorials72.gif
|
||||
root.links-background.page-links.samples.link-icon= css/graphics/icons/etool/samples72.gif
|
||||
root.links-background.page-links.news.link-icon = css/graphics/icons/etool/whatsnew72.gif
|
||||
root.action-links.workbench.link-icon = css/graphics/icons/etool/wb48.gif
|
||||
|
||||
root.links-background.page-links.overview.hover-icon = css/graphics/icons/ctool/overview72.gif
|
||||
root.links-background.page-links.tutorials.hover-icon = css/graphics/icons/ctool/tutorials72.gif
|
||||
root.links-background.page-links.samples.hover-icon = css/graphics/icons/ctool/samples72.gif
|
||||
root.links-background.page-links.news.hover-icon = css/graphics/icons/ctool/whatsnew72.gif
|
||||
root.action-links.workbench.hover-icon = css/graphics/icons/ctool/wb48.gif
|
||||
|
||||
|
||||
root.links-background.page-links.overview.small-link-icon = css/graphics/icons/etool/overview48.gif
|
||||
root.links-background.page-links.tutorials.small-link-icon = css/graphics/icons/etool/tutorials48.gif
|
||||
root.links-background.page-links.samples.small-link-icon = css/graphics/icons/etool/samples48.gif
|
||||
root.links-background.page-links.news.small-link-icon = css/graphics/icons/etool/whatsnew48.gif
|
||||
root.action-links.workbench.small-link-icon = css/graphics/icons/etool/wb48.gif
|
||||
|
||||
root.links-background.page-links.overview.small-hover-icon = css/graphics/icons/ctool/overview48.gif
|
||||
root.links-background.page-links.tutorials.small-hover-icon = css/graphics/icons/ctool/tutorials48.gif
|
||||
root.links-background.page-links.samples.small-hover-icon = css/graphics/icons/ctool/samples48.gif
|
||||
root.links-background.page-links.news.small-hover-icon = css/graphics/icons/ctool/whatsnew48.gif
|
||||
root.action-links.workbench.small-hover-icon = css/graphics/icons/ctool/wb48.gif
|
||||
|
||||
root.layout.ncolumns = 1
|
||||
root.links-background.page-links.layout.hspacing = 40
|
||||
root.layout.vspacing = 35
|
||||
@@ -0,0 +1,94 @@
|
||||
body {
|
||||
background-image : url(../graphics/contentpage/samples_wtr.jpg);
|
||||
}
|
||||
|
||||
.page { min-height : 700px; }
|
||||
|
||||
/* show the "selected" image for this page */
|
||||
#navigation-links a#samples img, #navigation-links a#samples:hover img { background-image : url(../graphics/icons/ctool/samples48sel.gif); }
|
||||
|
||||
/* Lay out the real content of the samples page: */
|
||||
|
||||
.samples-group {
|
||||
width : 750px;
|
||||
/* To center in Moz (have to use text-align for IE) */
|
||||
margin : 0px auto;
|
||||
margin-bottom : 10px;
|
||||
text-align : left;
|
||||
float : none;
|
||||
clear : both;
|
||||
}
|
||||
|
||||
.samples-group H4 { margin-top : 10px; }
|
||||
|
||||
.sample-link {
|
||||
width : 360px;
|
||||
text-align : left;
|
||||
margin-left : 5px;
|
||||
margin-right : 5px;
|
||||
margin-top : 10px;
|
||||
margin-bottom : -30px;
|
||||
vertical-align : top;
|
||||
}
|
||||
|
||||
/* specialize the swt samples group to be spread over only 1 column */
|
||||
#swt .sample-link {
|
||||
width : 720px;
|
||||
}
|
||||
|
||||
.samples-group > .sample-link {
|
||||
float : left;
|
||||
height : 150px;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
|
||||
.sample-link .link-label {
|
||||
display : block;
|
||||
width : 300px;
|
||||
position : relative;
|
||||
top : -50px;
|
||||
left : 60px;
|
||||
}
|
||||
|
||||
#swt .sample-link .link-label {
|
||||
width : 600px;
|
||||
}
|
||||
|
||||
.sample-link p .text {
|
||||
display : block;
|
||||
width : 300px;
|
||||
position : relative;
|
||||
top : -45px;
|
||||
left : 53px;
|
||||
}
|
||||
|
||||
#swt .sample-link .text {
|
||||
width : 620px;
|
||||
}
|
||||
|
||||
.sample-link img {
|
||||
height : 56px;
|
||||
width : 56px;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
.sample-link:hover { border-right : 0px; }
|
||||
|
||||
|
||||
#swt .sample-link img {
|
||||
background-image : url(../graphics/icons/obj48/samplered_obj.gif);
|
||||
}
|
||||
|
||||
#swt .sample-link:hover img {
|
||||
background-image : url(../graphics/icons/obj48/sampleredhov_obj.gif);
|
||||
}
|
||||
|
||||
#workbench .sample-link img {
|
||||
background-image : url(../graphics/icons/obj48/samplepurp_obj.gif);
|
||||
}
|
||||
|
||||
#workbench .sample-link:hover img {
|
||||
background-image : url(../graphics/icons/obj48/samplepurphov_obj.gif);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
|
||||
|
||||
samples.link-icon = css/graphics/icons/obj48/samplepurp_obj.gif
|
||||
samples.page-content.swt.swt-examples.link-icon = css/graphics/icons/obj48/samplered_obj.gif
|
||||
|
||||
samples.page-content.layout.vspacing = 40
|
||||
samples.page-content.swt.layout.ncolumns = 2
|
||||
samples.page-content.swt.layout.vspacing = 30
|
||||
samples.page-content.swt.layout.hspacing = 30
|
||||
samples.page-content.workbench.layout.ncolumns = 2
|
||||
samples.page-content.workbench.layout.vspacing = 30
|
||||
samples.page-content.workbench.layout.hspacing = 30
|
||||
|
||||
description-style-id = group-description
|
||||
samples.subtitle-id = samples/page-content/page-title
|
||||
samples.description-id = samples/page-content/page-description
|
||||
@@ -0,0 +1,264 @@
|
||||
/*
|
||||
* Set up general fonts, sizes and colors
|
||||
*/
|
||||
body { font-family : Arial, sans-serif; }
|
||||
|
||||
H1, H2, H3, H4, p, a { color : #4D4D4D; }
|
||||
|
||||
.intro-header H1 {
|
||||
font-size : 16pt;
|
||||
font-weight : normal;
|
||||
color : #E5E5E5;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size : 13pt;
|
||||
font-weight : normal;
|
||||
color : #7B8694;
|
||||
}
|
||||
/* For regular div labels */
|
||||
H4 .div-label {
|
||||
font-size : 10pt;
|
||||
font-weight : bold;
|
||||
}
|
||||
|
||||
/* For the main page content's title */
|
||||
#content-header H4 .div-label {
|
||||
font-size : 14pt;
|
||||
font-weight : normal;
|
||||
color : #8C96A2;
|
||||
float : none;
|
||||
clear : both;
|
||||
}
|
||||
|
||||
.page-description {
|
||||
font-size : 10pt;
|
||||
float : none;
|
||||
clear : both;
|
||||
}
|
||||
|
||||
a {
|
||||
font-weight : bold;
|
||||
text-decoration : none;
|
||||
color : #4D4D4D;
|
||||
}
|
||||
|
||||
a .link-label {
|
||||
font-size : 10pt;
|
||||
font-weight : normal;
|
||||
}
|
||||
|
||||
#navigation-links a .link-label {
|
||||
font-size : 9pt;
|
||||
font-weight : normal;
|
||||
color : #E5E5E5;
|
||||
}
|
||||
|
||||
a .text {
|
||||
font-size : 8pt;
|
||||
font-weight : normal;
|
||||
}
|
||||
|
||||
p .group-description {
|
||||
font-size : 10pt;
|
||||
font-weight : normal;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* Set up other general properties like padding/margins
|
||||
*/
|
||||
html, body { width : 100%; height : 100%; }
|
||||
|
||||
html, body, div, h1, h4, p, a { margin : 0px; padding : 0px; }
|
||||
|
||||
.intro-header H1 { padding-top : 10px; margin-left : 10px; }
|
||||
|
||||
/* For regular div labels */
|
||||
#page-content div H4 {
|
||||
padding : 10px;
|
||||
padding-bottom : 0px;
|
||||
}
|
||||
|
||||
/* For the main page content's div label */
|
||||
#page-content #content-header H4 {
|
||||
padding-bottom : 10px;
|
||||
padding-top : 0px;
|
||||
}
|
||||
|
||||
/* special case for Mozilla's main content-header label.
|
||||
Mozilla 1.4 needs more room at the top */
|
||||
#page-content > #content-header H4 { padding-top : 10px; }
|
||||
|
||||
/* Needed in IE to get shift+tab to show the active image properly */
|
||||
a:active {
|
||||
border : solid 0px;
|
||||
}
|
||||
|
||||
a img {
|
||||
border-width : 0;
|
||||
background-repeat : no-repeat;
|
||||
}
|
||||
|
||||
/*
|
||||
* to get scrollbars working in both IE and Mozilla
|
||||
*/
|
||||
html,body { overflow: auto; }
|
||||
html>body { overflow: visible; }
|
||||
|
||||
/*
|
||||
* Set up the body, decorative background, and navigation for the content
|
||||
* pages.
|
||||
* Note: the root page handles its own background and navigation; these
|
||||
* settings primarily apply to the content pages
|
||||
*/
|
||||
body {
|
||||
background-color : #FFFFFF;
|
||||
background-repeat : no-repeat;
|
||||
background-position : bottom right;
|
||||
}
|
||||
|
||||
#background-image {
|
||||
width : 100%;
|
||||
min-width : 770px;
|
||||
height : 164px;
|
||||
background-image : url(graphics/contentpage/background.jpg);
|
||||
background-repeat : no-repeat;
|
||||
background-position : top left;
|
||||
position : absolute;
|
||||
top : 0px;
|
||||
z-index : -100;
|
||||
}
|
||||
|
||||
#curve-image {
|
||||
width : 100%;
|
||||
height : 164px;
|
||||
position : absolute;
|
||||
top : 0px;
|
||||
background-image : url(graphics/contentpage/backgroundcurve.gif);
|
||||
background-repeat : no-repeat;
|
||||
background-position : top center;
|
||||
margin : 0;
|
||||
padding : 0;
|
||||
}
|
||||
|
||||
.intro-header { background-color : transparent; z-index : 100;}
|
||||
|
||||
body, .page{
|
||||
min-width : 770px;
|
||||
/* since IE doesn't support min-width, try expression */
|
||||
width:expression(document.body.clientWidth < 770? "770px": "auto" );
|
||||
min-height : 425px;
|
||||
height : 100%;
|
||||
height : expression(document.body.clientHeight < 425? "425px": "100%" );
|
||||
}
|
||||
|
||||
.page {
|
||||
background-image : url(graphics/contentpage/wordmark.gif);
|
||||
background-repeat : no-repeat;
|
||||
background-position : bottom left;
|
||||
min-height : 475px;
|
||||
}
|
||||
|
||||
#page-content {
|
||||
background-repeat : no-repeat;
|
||||
background-position : bottom right;
|
||||
height : 70%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Lay out the navigation links
|
||||
* (Root page does something similar for its navigation)
|
||||
*/
|
||||
#navigation-links {
|
||||
position : relative;
|
||||
left : 10px;
|
||||
top : 5px;
|
||||
height : 60;
|
||||
width : 98%;
|
||||
}
|
||||
|
||||
#navigation-links a {
|
||||
padding-left : 5px;
|
||||
padding-right : 5px;
|
||||
float : left;
|
||||
text-align : center;
|
||||
}
|
||||
|
||||
#navigation-links a img {
|
||||
height : 52px;
|
||||
width : 52px;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
#navigation-links a .link-label { display : block; margin-top : 5px;}
|
||||
|
||||
#navigation-links a .text { display : none; }
|
||||
|
||||
#navigation-links a:hover,
|
||||
#navigation-links a:focus
|
||||
#navigation-links a:active { border-right : 0px;}
|
||||
|
||||
/* properties for each of the navigation-links */
|
||||
#navigation-links a#overview img { background-image : url(graphics/icons/etool/overview48.gif); }
|
||||
#navigation-links a#overview:hover img,
|
||||
#navigation-links a#overview:focus img,
|
||||
#navigation-links a#overview:active img { background-image : url(graphics/icons/ctool/overview48.gif); }
|
||||
/*#navigation-links a#overview:active img { background-image : url(graphics/icons/ctool/overview48sel.gif); }*/
|
||||
|
||||
#navigation-links a#tutorials img { background-image : url(graphics/icons/etool/tutorials48.gif); }
|
||||
#navigation-links a#tutorials:hover img,
|
||||
#navigation-links a#tutorials:active img,
|
||||
#navigation-links a#tutorials:focus img { background-image : url(graphics/icons/ctool/tutorials48.gif); }
|
||||
/*#navigation-links a#tutorials:active img { background-image : url(graphics/icons/ctool/tutorials48sel.gif); }*/
|
||||
|
||||
#navigation-links a#samples img { background-image : url(graphics/icons/etool/samples48.gif); }
|
||||
#navigation-links a#samples:hover img,
|
||||
#navigation-links a#samples:active img,
|
||||
#navigation-links a#samples:focus img { background-image : url(graphics/icons/ctool/samples48.gif); }
|
||||
/*#navigation-links a#samples:active img { background-image : url(graphics/icons/ctool/samples48sel.gif); }*/
|
||||
|
||||
#navigation-links a#news img { background-image : url(graphics/icons/etool/whatsnew48.gif); }
|
||||
#navigation-links a#news:hover img,
|
||||
#navigation-links a#news:focus img,
|
||||
#navigation-links a#news:active img { background-image : url(graphics/icons/ctool/whatsnew48.gif); }
|
||||
/*#navigation-links a#news:active img { background-image : url(graphics/icons/ctool/whatsnew48sel.gif); }*/
|
||||
|
||||
#navigation-links a#workbench { position : absolute; right : 0px; top : -35px; text-align : right;}
|
||||
#navigation-links a#workbench .text { display : none; }
|
||||
#navigation-links a#workbench img { background-image : url(graphics/icons/etool/wb48.gif); width : 53px; height : 53px;}
|
||||
#navigation-links a#workbench:hover img,
|
||||
#navigation-links a#workbench:focus img,
|
||||
#navigation-links a#workbench:active img { background-image : url(graphics/icons/ctool/wb48.gif); }
|
||||
|
||||
/*
|
||||
* Lay out the page title and description
|
||||
*/
|
||||
h1, p { margin-left : 10px; } /* required in mozilla so the page description is properly indented */
|
||||
|
||||
/* position the page content so that the page title overlays the bottom
|
||||
* of the background image, but make sure the content is always on top
|
||||
* (using z-index) */
|
||||
#page-content {
|
||||
float : none;
|
||||
clear : both;
|
||||
text-align : center;
|
||||
margin-top : 35px;
|
||||
}
|
||||
|
||||
.page > #page-content { margin-top : 50px; }
|
||||
|
||||
#page-content p {
|
||||
padding-bottom : 15px;
|
||||
text-align : left;
|
||||
float : none;
|
||||
clear : both;
|
||||
}
|
||||
|
||||
#page-content #content-header H4, .page-description {
|
||||
text-align : left;
|
||||
margin-right : 10px;
|
||||
float : none;
|
||||
clear : both;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,121 @@
|
||||
/*
|
||||
* Set up general font colours, sizes, etc. Some of these will override
|
||||
* settings from the shared CSS
|
||||
*/
|
||||
.intro-header H1 {
|
||||
font-size : 15pt;
|
||||
}
|
||||
|
||||
#page-links a .link-label, #action-links a .link-label {
|
||||
font-size : 10pt;
|
||||
font-weight : 600;
|
||||
color : #E5E5E5;
|
||||
}
|
||||
|
||||
#page-links a p .text, #action-links a p .text {
|
||||
font-size : 10pt;
|
||||
font-weight : 500;
|
||||
color : #E5E5E5;
|
||||
}
|
||||
|
||||
/*
|
||||
* Set up the content for the standby page.
|
||||
*/
|
||||
body {
|
||||
min-width : 230px;
|
||||
/* since IE doesn't support min-width, use expression */
|
||||
width:expression(document.body.clientWidth < 230? "230px": "auto" );
|
||||
background-image : url(graphics/rootpage/background.jpg);
|
||||
background-repeat : no-repeat;
|
||||
background-position : top left;
|
||||
background-color : #7169D1;
|
||||
}
|
||||
|
||||
.page {
|
||||
background-image : url(graphics/rootpage/brandmark.gif);
|
||||
background-repeat : no-repeat;
|
||||
background-position : bottom left;
|
||||
min-width : 230px;
|
||||
/* since IE doesn't support min-width, use expression */
|
||||
width:expression(document.body.clientWidth < 230? "230px": "auto" );
|
||||
min-height : 610px;
|
||||
height : 100%;
|
||||
height : expression(document.body.clientHeight < 450? "450px": "100%" );
|
||||
}
|
||||
|
||||
/*
|
||||
* Set up the navigation bar. It should be centered in the middle
|
||||
* of the page
|
||||
*/
|
||||
|
||||
#links-background {
|
||||
width : 100%;
|
||||
margin-top : 10%;
|
||||
margin-bottom : auto;
|
||||
text-align : center;
|
||||
}
|
||||
|
||||
#page-links a {
|
||||
display : block;
|
||||
width : 220px;
|
||||
text-align : left;
|
||||
margin-left : auto;
|
||||
margin-right : auto;
|
||||
margin-top : 0px;
|
||||
vertical-align : top;
|
||||
}
|
||||
#page-links a span, #page-links a p {
|
||||
display : block;
|
||||
width : 160px;
|
||||
margin : 0px;
|
||||
padding : 0px;
|
||||
}
|
||||
|
||||
#page-links a .link-label {
|
||||
position : relative;
|
||||
left : 60px;
|
||||
top : -50px;
|
||||
}
|
||||
|
||||
#page-links a p .text {
|
||||
position : relative;
|
||||
left : 60px;
|
||||
top : -50px;
|
||||
|
||||
}
|
||||
|
||||
#page-links a img {
|
||||
height : 52px;
|
||||
width : 52px;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
#page-links a:hover,
|
||||
#page-links a:focus,
|
||||
#page-links a:active { border : 0px; }
|
||||
|
||||
#page-links a:hover p,
|
||||
#page-links a:focus p,
|
||||
#page-links a:active p { margin : 0px; padding : 0px; }
|
||||
|
||||
/* properties for each of the page-links */
|
||||
a#overview img { background-image : url(graphics/icons/etool/overview48.gif); }
|
||||
a#overview:hover img,
|
||||
a#overview:focus img,
|
||||
a#overview:active img { background-image : url(graphics/icons/ctool/overview48.gif); }
|
||||
|
||||
a#tutorials img { background-image : url(graphics/icons/etool/tutorials48.gif); }
|
||||
a#tutorials:hover img,
|
||||
a#tutorials:focus img,
|
||||
a#tutorials:active img { background-image : url(graphics/icons/ctool/tutorials48.gif); }
|
||||
|
||||
a#samples img { background-image : url(graphics/icons/etool/samples48.gif); }
|
||||
a#samples:hover img,
|
||||
a#samples:focus img,
|
||||
a#samples:active img { background-image : url(graphics/icons/ctool/samples48.gif); }
|
||||
|
||||
a#news img { background-image : url(graphics/icons/etool/whatsnew48.gif); }
|
||||
a#news:hover img,
|
||||
a#news:focus img,
|
||||
a#news:active img { background-image : url(graphics/icons/ctool/whatsnew48.gif); }
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
standby.links-background.page-links.overview.link-icon = css/graphics/icons/etool/overview72.gif
|
||||
standby.links-background.page-links.tutorials.link-icon = css/graphics/icons/etool/tutorials72.gif
|
||||
standby.links-background.page-links.samples.link-icon= css/graphics/icons/etool/samples72.gif
|
||||
standby.links-background.page-links.news.link-icon = css/graphics/icons/etool/whatsnew72.gif
|
||||
|
||||
|
||||
standby.links-background.page-links.overview.hover-icon = css/graphics/icons/ctool/overview72.gif
|
||||
standby.links-background.page-links.tutorials.hover-icon = css/graphics/icons/ctool/tutorials72.gif
|
||||
standby.links-background.page-links.samples.hover-icon = css/graphics/icons/ctool/samples72.gif
|
||||
standby.links-background.page-links.news.hover-icon = css/graphics/icons/ctool/whatsnew72.gif
|
||||
|
||||
|
||||
standby.links-background.page-links.layout.vspacing = 30
|
||||
standby.layout.vspacing = 35
|
||||
standby.show-link-description = false
|
||||
standby.show-home-page-navigation = false
|
||||
@@ -0,0 +1,5 @@
|
||||
|
||||
tutorials.page-content.layout.vspacing = 40
|
||||
|
||||
tutorials.subtitle-id = tutorials/page-content/page-title
|
||||
tutorials.description-id = tutorials/page-content/page-description
|
||||
@@ -0,0 +1,79 @@
|
||||
body {
|
||||
background-image : url(../graphics/contentpage/tutorials_wtr.jpg);
|
||||
}
|
||||
|
||||
.page { min-height : 700px; }
|
||||
|
||||
/* show the "selected" image for this page */
|
||||
#navigation-links a#tutorials img, #navigation-links a#tutorials:hover img { background-image : url(../graphics/icons/ctool/tutorials48sel.gif); }
|
||||
|
||||
/*
|
||||
* Set up the content of the tutorials page into two
|
||||
* columns that are centered in the page
|
||||
*/
|
||||
|
||||
|
||||
/* a group of tutorial links */
|
||||
.tutorials-group {
|
||||
/* To center in Moz (have to use text-align for IE) */
|
||||
margin-left : auto;
|
||||
margin-right : auto;
|
||||
width : 750px;
|
||||
margin-bottom : 30px;
|
||||
float : none;
|
||||
clear : both;
|
||||
text-align : left;
|
||||
}
|
||||
|
||||
.tutorials-link {
|
||||
width : 360px;
|
||||
text-align : left;
|
||||
margin-left : 5px;
|
||||
margin-right : 5px;
|
||||
margin-top : 10px;
|
||||
margin-bottom : -20px;
|
||||
vertical-align : top;
|
||||
}
|
||||
|
||||
.tutorials-group > .tutorials-link {
|
||||
float : left;
|
||||
height : 150px;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
|
||||
.tutorials-link img {
|
||||
height : 57px;
|
||||
width : 57px;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
.tutorials-group h4 {
|
||||
float : none;
|
||||
clear : both;
|
||||
}
|
||||
|
||||
p #group-description {
|
||||
padding-bottom : 10px;
|
||||
float : none;
|
||||
clear : both;
|
||||
}
|
||||
|
||||
.tutorials-link .link-label {
|
||||
display : block;
|
||||
width : 300px;
|
||||
position : relative;
|
||||
top : -50px;
|
||||
left : 60px;
|
||||
}
|
||||
|
||||
|
||||
.tutorials-link p .text {
|
||||
display : block;
|
||||
width : 300px;
|
||||
position : relative;
|
||||
top : -45px;
|
||||
left : 53px;
|
||||
}
|
||||
|
||||
.tutorials-link:hover { border-right : 0px; }
|
||||
@@ -0,0 +1,17 @@
|
||||
|
||||
news.page-content.news-links.layout.ncolumns = 2
|
||||
news.page-content.news-links.layout.vspacing = 30
|
||||
|
||||
news.page-content.news-links.new-and-noteworthy.link-icon = css/graphics/icons/obj48/new_obj.gif
|
||||
news.page-content.news-links.migration.link-icon = css/graphics/icons/obj48/migrate_obj.gif
|
||||
news.page-content.news-links.updates.link-icon = css/graphics/icons/obj48/updates_obj.gif
|
||||
news.page-content.news-links.eclipse.link-icon = css/graphics/icons/obj48/community_obj.gif
|
||||
|
||||
news.page-content.noteworthy-links.layout.ncolumns = 2
|
||||
news.page-content.noteworthy-links.layout.vspacing = 15
|
||||
news.page-content.news-links.layout.vspacing = 15
|
||||
news.page-content.layout.vspacing = 40
|
||||
|
||||
news.link-icon = css/graphics/icons/obj48/new_obj.gif
|
||||
|
||||
news.subtitle-id = news/page-content/page-title
|
||||
@@ -0,0 +1,129 @@
|
||||
body {
|
||||
background-image : url(../graphics/contentpage/whatsnew_wtr.jpg);
|
||||
}
|
||||
|
||||
.page { min-height : 500px; }
|
||||
|
||||
/* show the "selected" image for this page */
|
||||
#navigation-links a#news img, #navigation-links a#news:hover img { background-image : url(../graphics/icons/ctool/whatsnew48sel.gif); }
|
||||
|
||||
/*
|
||||
* Set up the content of the Whats New page to be displayed in
|
||||
* two columns that are centered in the middle of the page.
|
||||
*/
|
||||
|
||||
#noteworthy-links {
|
||||
text-align : left;
|
||||
width : 760px;
|
||||
/* To center in Moz (have to use text-align for IE) */
|
||||
margin: 0px auto;
|
||||
}
|
||||
|
||||
#noteworthy-links a {
|
||||
width : 370px;
|
||||
text-align : left;
|
||||
margin-left : 5px;
|
||||
margin-right : 5px;
|
||||
margin-top : 5px;
|
||||
margin-bottom : -20px;
|
||||
vertical-align : top;
|
||||
}
|
||||
|
||||
#noteworthy-links > a { vertical-align : middle; }
|
||||
|
||||
#noteworthy-links a img {
|
||||
height : 57px;
|
||||
width : 57px;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
#noteworthy-links a .link-label {
|
||||
display : block;
|
||||
width : 300px;
|
||||
position : relative;
|
||||
top : -50px;
|
||||
left : 60px;
|
||||
}
|
||||
|
||||
#noteworthy-links a p .text {
|
||||
display : block;
|
||||
width : 300px;
|
||||
position : relative;
|
||||
top : -45px;
|
||||
left : 53px;
|
||||
}
|
||||
|
||||
/* Special case for Mozilla, because the links are displayed
|
||||
in 1 vertical column instead of 2 centered columns */
|
||||
#noteworthy-links > a { width : 700px; }
|
||||
#noteworthy-links a > .link-label { width : 700px; }
|
||||
#noteworthy-links a p > .text { width : 700px; }
|
||||
|
||||
#noteworthy-links a:hover { border-right : 5px; }
|
||||
|
||||
#noteworthy-links a img { background-image : url(../graphics/icons/obj48/new_obj.gif); }
|
||||
#noteworthy-links a:hover img { background-image : url(../graphics/icons/obj48/newhov_obj.gif); }
|
||||
|
||||
|
||||
#news-links {
|
||||
text-align : left;
|
||||
width : 760px;
|
||||
/* To center in Moz (have to use text-align for IE) */
|
||||
margin: 0px auto;
|
||||
}
|
||||
|
||||
#news-links a {
|
||||
width : 370px;
|
||||
text-align : left;
|
||||
margin-left : 5px;
|
||||
margin-right : 5px;
|
||||
margin-top : 5px;
|
||||
margin-bottom : -20px;
|
||||
vertical-align : top;
|
||||
}
|
||||
|
||||
#news-links > a { vertical-align : middle; }
|
||||
|
||||
#news-links a img {
|
||||
height : 57px;
|
||||
width : 57px;
|
||||
vertical-align : middle;
|
||||
}
|
||||
|
||||
#news-links a .link-label {
|
||||
display : block;
|
||||
width : 300px;
|
||||
position : relative;
|
||||
top : -50px;
|
||||
left : 60px;
|
||||
}
|
||||
|
||||
#news-links a p .text {
|
||||
display : block;
|
||||
width : 300px;
|
||||
position : relative;
|
||||
top : -45px;
|
||||
left : 53px;
|
||||
}
|
||||
|
||||
/* Special case for Mozilla, because the links are displayed
|
||||
in 1 vertical column instead of 2 centered columns */
|
||||
#news-links > a { width : 700px; }
|
||||
#news-links a > .link-label { width : 700px; }
|
||||
#news-links a p > .text { width : 700px; }
|
||||
|
||||
#news-links a:hover { border-right : 5px; }
|
||||
|
||||
a#new-and-noteworthy img { background-image : url(../graphics/icons/obj48/new_obj.gif); }
|
||||
a#new-and-noteworthy:hover img { background-image : url(../graphics/icons/obj48/newhov_obj.gif); }
|
||||
|
||||
a#migration img { background-image : url(../graphics/icons/obj48/migrate_obj.gif); }
|
||||
a#migration:hover img { background-image : url(../graphics/icons/obj48/migratehov_obj.gif); }
|
||||
|
||||
a#updates img { background-image : url(../graphics/icons/obj48/updates_obj.gif); }
|
||||
a#updates:hover img { background-image : url(../graphics/icons/obj48/updateshov_obj.gif); }
|
||||
|
||||
a#eclipse img { background-image : url(../graphics/icons/obj48/community_obj.gif); }
|
||||
a#eclipse:hover img { background-image : url(../graphics/icons/obj48/communityhov_obj.gif); }
|
||||
|
||||
|
||||