diff options
Diffstat (limited to 'layout')
12 files changed, 166 insertions, 0 deletions
diff --git a/layout/reftests/forms/input/datetime/reftest.list b/layout/reftests/forms/input/datetime/reftest.list index 0ce2002bd..a62d56c7c 100644 --- a/layout/reftests/forms/input/datetime/reftest.list +++ b/layout/reftests/forms/input/datetime/reftest.list @@ -11,3 +11,14 @@ skip-if(!Android&&!B2G&&!Mulet) == time-simple-unthemed.html time-simple-untheme # type change skip-if(Android||B2G||Mulet) == to-time-from-other-type-unthemed.html time-simple-unthemed.html skip-if(Android||B2G||Mulet) == from-time-to-other-type-unthemed.html from-time-to-other-type-unthemed-ref.html + +# content should not overflow on small width/height +skip-if(Android) == time-small-width.html time-small-width-ref.html +skip-if(Android) == time-small-height.html time-small-height-ref.html +skip-if(Android) == time-small-width-height.html time-small-width-height-ref.html + +# content (text) should be left aligned +skip-if(Android) == time-content-left-aligned.html time-content-left-aligned-ref.html + +# reset button should be right aligned +skip-if(Android) fails-if(styloVsGecko) == time-reset-button-right-aligned.html time-reset-button-right-aligned-ref.html # bug 1372062 diff --git a/layout/reftests/forms/input/datetime/time-content-left-aligned-ref.html b/layout/reftests/forms/input/datetime/time-content-left-aligned-ref.html new file mode 100644 index 000000000..ad8be9adc --- /dev/null +++ b/layout/reftests/forms/input/datetime/time-content-left-aligned-ref.html @@ -0,0 +1,9 @@ +<!DOCTYPE html> +<html> + <body> + <input type="time" style="width: 200px;"> + <!-- div to cover the right area --> + <div style="display:block; position:absolute; background-color:black; + top:0px; left:40px; width:200px; height:100px;"></div> + </body> +</html> diff --git a/layout/reftests/forms/input/datetime/time-content-left-aligned.html b/layout/reftests/forms/input/datetime/time-content-left-aligned.html new file mode 100644 index 000000000..aa910cddf --- /dev/null +++ b/layout/reftests/forms/input/datetime/time-content-left-aligned.html @@ -0,0 +1,9 @@ +<!DOCTYPE html> +<html> + <body> + <input type="time" style="width: 50px;"> + <!-- div to cover the right area --> + <div style="display:block; position:absolute; background-color:black; + top:0px; left:40px; width:200px; height:100px;"></div> + </body> +</html> diff --git a/layout/reftests/forms/input/datetime/time-reset-button-right-aligned-ref.html b/layout/reftests/forms/input/datetime/time-reset-button-right-aligned-ref.html new file mode 100644 index 000000000..3d36f2068 --- /dev/null +++ b/layout/reftests/forms/input/datetime/time-reset-button-right-aligned-ref.html @@ -0,0 +1,9 @@ +<!DOCTYPE html> +<html> + <body> + <input type="time" value="10:00" style="float: right; color: white;"> + <!-- div to cover the left area --> + <div style="display:block; position:absolute; background-color:black; + top:0px; right:30px; width:500px; height:100px;"></div> + </body> +</html> diff --git a/layout/reftests/forms/input/datetime/time-reset-button-right-aligned.html b/layout/reftests/forms/input/datetime/time-reset-button-right-aligned.html new file mode 100644 index 000000000..72d5cc140 --- /dev/null +++ b/layout/reftests/forms/input/datetime/time-reset-button-right-aligned.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<html> + <body> + <input type="time" value="10:00" style="width: 150px; float: right; + color: white;"> + <!-- div to cover the left area --> + <div style="display:block; position:absolute; background-color:black; + top:0px; right:30px; width:500px; height:100px;"></div> + </body> +</html> diff --git a/layout/reftests/forms/input/datetime/time-small-height-ref.html b/layout/reftests/forms/input/datetime/time-small-height-ref.html new file mode 100644 index 000000000..fcda93df9 --- /dev/null +++ b/layout/reftests/forms/input/datetime/time-small-height-ref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> + <head> + <style> +input { + width: 200px; + height: 5px; + outline: 1px dotted black; + /* Disable baseline alignment, so that our y-position isn't influenced by the + * choice of font inside of input: */ + vertical-align: top; +} + </style> + </head> + <body> + <input> + </body> +</html> diff --git a/layout/reftests/forms/input/datetime/time-small-height.html b/layout/reftests/forms/input/datetime/time-small-height.html new file mode 100644 index 000000000..3044822fe --- /dev/null +++ b/layout/reftests/forms/input/datetime/time-small-height.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> + <head> + <style> +input { + width: 200px; + height: 5px; + outline: 1px dotted black; + color: white; + /* Disable baseline alignment, so that our y-position isn't influenced by the + * choice of font inside of input: */ + vertical-align: top; +} + </style> + </head> + <body> + <input type="time"> + </body> +</html> diff --git a/layout/reftests/forms/input/datetime/time-small-width-height-ref.html b/layout/reftests/forms/input/datetime/time-small-width-height-ref.html new file mode 100644 index 000000000..0979243db --- /dev/null +++ b/layout/reftests/forms/input/datetime/time-small-width-height-ref.html @@ -0,0 +1,18 @@ +<!DOCTYPE html> +<html> + <head> + <style> +input { + width: 8px; + height: 8px; + outline: 1px dotted black; + /* Disable baseline alignment, so that our y-position isn't influenced by the + * choice of font inside of input: */ + vertical-align: top; +} + </style> + </head> + <body> + <input> + </body> +</html> diff --git a/layout/reftests/forms/input/datetime/time-small-width-height.html b/layout/reftests/forms/input/datetime/time-small-width-height.html new file mode 100644 index 000000000..a221b2819 --- /dev/null +++ b/layout/reftests/forms/input/datetime/time-small-width-height.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> + <head> + <style> +input { + width: 8px; + height: 8px; + outline: 1px dotted black; + color: white; + /* Disable baseline alignment, so that our y-position isn't influenced by the + * choice of font inside of input: */ + vertical-align: top; +} + </style> + </head> + <body> + <input type="time"> + </body> +</html> diff --git a/layout/reftests/forms/input/datetime/time-small-width-ref.html b/layout/reftests/forms/input/datetime/time-small-width-ref.html new file mode 100644 index 000000000..2379c7080 --- /dev/null +++ b/layout/reftests/forms/input/datetime/time-small-width-ref.html @@ -0,0 +1,19 @@ +<!DOCTYPE html> +<html> + <head> + <style> +input { + width: 10px; + height: 1.5em; + outline: 1px dotted black; + background: white; + /* Disable baseline alignment, so that our y-position isn't influenced by the + * choice of font inside of input: */ + vertical-align: top; +} + </style> + </head> + <body> + <input> + </body> +</html> diff --git a/layout/reftests/forms/input/datetime/time-small-width.html b/layout/reftests/forms/input/datetime/time-small-width.html new file mode 100644 index 000000000..f76f7fdfa --- /dev/null +++ b/layout/reftests/forms/input/datetime/time-small-width.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> + <head> + <style> +input { + width: 10px; + height: 1.5em; + outline: 1px dotted black; + color: white; + background: white; + /* Disable baseline alignment, so that our y-position isn't influenced by the + * choice of font inside of input: */ + vertical-align: top; +} + </style> + </head> + <body> + <input type="time"> + </body> +</html> diff --git a/layout/style/res/forms.css b/layout/style/res/forms.css index f045540b1..e7566e183 100644 --- a/layout/style/res/forms.css +++ b/layout/style/res/forms.css @@ -1135,3 +1135,8 @@ input[type="number"] > div > div > div:hover { /* give some indication of hover state for the up/down buttons */ background-color: lightblue; } + +input[type="date"], +input[type="time"] { + overflow: hidden !important; +} |