161 lines
4.3 KiB
HTML
161 lines
4.3 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<!--
|
|
Copyright 2008 The Closure Library Authors. All Rights Reserved.
|
|
|
|
Use of this source code is governed by the Apache License, Version 2.0.
|
|
See the COPYING file for details.
|
|
-->
|
|
<!--
|
|
-->
|
|
<head>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<title>
|
|
Closure Unit Tests - CSS Object Model helper
|
|
</title>
|
|
<script src="../../base.js">
|
|
</script>
|
|
<script>
|
|
goog.require('goog.debug.DevCssTest');
|
|
</script>
|
|
<style>
|
|
@import "devcss_test_import_1.css";
|
|
|
|
.css-style-1 {
|
|
background-color: rgb(173,216,230); /* lightblue */
|
|
padding: 10px;
|
|
}
|
|
.css-style-2 {
|
|
display: block;
|
|
background-color: transparent;
|
|
margin-top: 1px;
|
|
margin-left: 1px;
|
|
padding: 10px;
|
|
}
|
|
.css-style-3 {
|
|
background-color: orange;
|
|
padding: 10px;
|
|
}
|
|
|
|
.compound1.compound2 {
|
|
-goog-ie6-selector: ".compound1_compound2";
|
|
background-color: rgb(255,192,203); /* aka pink */
|
|
}
|
|
|
|
.USERAGENT-OPERA .css-style-2,
|
|
.USERAGENT-GECKO .css-style-2,
|
|
.USERAGENT-MOBILE .css-style-2 {
|
|
background-color: rgb(255,192,203); /* aka pink */
|
|
}
|
|
|
|
.USERAGENT-OPERA .css-style-2,
|
|
.USERAGENT-WEBKIT-GTE255 .css-style-2,
|
|
.USERAGENT-MOBILE .css-style-2 {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.USERAGENT-OPERA .css-style-2,
|
|
.USERAGENT-WEBKIT-LTE200 .css-style-2,
|
|
.USERAGENT-MOBILE .css-style-2 {
|
|
margin-left: 15px;
|
|
}
|
|
.USERAGENT-GECKO #devcss-gecko-1,
|
|
.USERAGENT-GECKO #devcss-gecko-2 {
|
|
background-color: rgb(255,192,203); /* aka pink */
|
|
}
|
|
.USERAGENT-IE-8 #devcss-ie8-1,
|
|
.USERAGENT-IE-8 #devcss-ie8-2 {
|
|
background-color: rgb(255,192,203); /* aka pink */
|
|
}
|
|
#devcss-test-ie6 {
|
|
background-color: purple;
|
|
}
|
|
.USERAGENT-IE-6 #devcss-test-ie6 {
|
|
background-color: rgb(255,192,203); /* aka pink */
|
|
}
|
|
</style>
|
|
<style>
|
|
@import "devcss_test_import_2.css";
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="devcss-test-2" class="css-style-2">
|
|
<ul>
|
|
<li>
|
|
Should end up background-color:rgb(255, 192, 203) aka pink.
|
|
</li>
|
|
<li>
|
|
Should end up with margin-top: 20px; margin-left: 15px;
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<div id="devcss-test-ie6">
|
|
<ul>
|
|
<li>
|
|
Should end up background-color:rgb(255, 192, 203) aka pink, not black or purple.
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<!--
|
|
TODO(user): Re-enable if we ever come up with a way to make imports
|
|
work.
|
|
<div id="devcss-test-importfixer-1" class="css-style-3">
|
|
<ul>
|
|
<li>
|
|
Should end up yellow from the first import of
|
|
devcss_test_import_2.css, overriding the previous orange setting and
|
|
ignoring the second import of devcss_test_import_1.css which would set
|
|
it grey.
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div id="devcss-test-importfixer-2" class="css-style-1">
|
|
<ul>
|
|
<li>
|
|
Should end up lightblue, which is a revert back to the setting in this
|
|
test file, after disabling the second import of
|
|
devcss_test_import_1.css
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
-->
|
|
<br>
|
|
<br>
|
|
<div id="devcss-ie8-1">
|
|
This element should be pink for IE8.
|
|
</div>
|
|
<div id="devcss-ie8-2">
|
|
This element should also be pink for IE8.
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<div id="devcss-gecko-1">
|
|
This element should be pink for Gecko.
|
|
</div>
|
|
<div id="devcss-gecko-2">
|
|
This element should also be pink for Gecko.
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<div id="devcss-test-compound1" class="compound1">
|
|
This (class="compound1") should have no bg.
|
|
</div>
|
|
<div id="devcss-test-compound2" class="compound2">
|
|
This (class="compound2") should have no bg.
|
|
</div>
|
|
<div id="devcss-test-compound1-2" class="compound1 compound2 compound1_compound2">
|
|
This (class="compound1 compound2 compound1_compound2") should have
|
|
a pink bg for IE6.
|
|
</div>
|
|
<br>
|
|
<br>
|
|
<input id="devcss-test-combined1" type="hidden" class="ie6-1 ie6-2">
|
|
<input id="devcss-test-combined2" type="hidden" class="ie6-3 ie6-1 ie6-2">
|
|
<input id="devcss-test-notcombined1" type="hidden" class="ie6-1">
|
|
<input id="devcss-test-notcombined2" type="hidden" class="ie6-2">
|
|
<input id="devcss-test-notcombined3" type="hidden" class="ie6-3">
|
|
</body>
|
|
</html>
|