Skip to content

Commit

Permalink
[css-ui] Test appearance <compat> values and 'auto'
Browse files Browse the repository at this point in the history 
Follows
w3c/csswg-drafts#3545
w3c/csswg-drafts#3546
  • Loading branch information
@zcorpan
zcorpan committed Jan 22, 2019
1 parent e4e6eee commit 5f30469
Show file tree
Hide file tree
Showing 15 changed files with 416 additions and 0 deletions.
28 changes: 28 additions & 0 deletions css/css-ui/appearance-auto-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: auto</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="auto is supported.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: auto; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
24 changes: 24 additions & 0 deletions css/css-ui/appearance-auto-ref.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>Reference: appearance: auto</title>
<style>
#container { width: 500px; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-button-bevel-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: button-bevel</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="button-bevel is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: button-bevel; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-checkbox-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: checkbox</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="checkbox is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: checkbox; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-listbox-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: listbox</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="listbox is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: listbox; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-menulist-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: menulist</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="menulist is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: menulist; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-menulist-button-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: menulist-button</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="menulist-button is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: menulist-button; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-meter-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: meter</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="meter is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: meter; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-progress-bar-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: progress-bar</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="progress-bar is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: progress-bar; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-push-button-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: push-button</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="push-button is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: push-button; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-radio-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: radio</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="radio is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: radio; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-searchfield-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: searchfield</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="searchfield is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: searchfield; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
28 changes: 28 additions & 0 deletions css/css-ui/appearance-slider-horizontal-001.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Basic User Interface Test: appearance: slider-horizontal</title>
<link rel="help" href="https://drafts.csswg.org/css-ui-4/#appearance-switching">
<meta name="assert" content="slider-horizontal is an alias to auto.">
<link rel="match" href="appearance-auto-ref.html">
<style>
#container { width: 500px; }
#container > * { -webkit-appearance: none; -webkit-appearance: slider-horizontal; }
</style>
<div id="container">
<a>a</a>
<button>button</button>
<input type="text" value="input-text">
<input type="search" value="input-search">
<textarea>textarea</textarea>
<input type="button" value="input-button">
<input type="submit" value="input-submit">
<input type="reset" value="input-reset">
<input type="range">
<input type="checkbox">
<input type="radio">
<input type="color">
<select><option>select</option></select>
<select multiple><option>select-multiple</option></select>
<meter value=0.5></meter>
<progress value=0.5></progress>
</div>
Loading

0 comments on commit 5f30469

Please sign in to comment.