mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-10-08 19:04:45 +00:00
Bug 556145 - Use opacity instead of GrayText for ::-moz-placeholder UA's style. r=bz,davidb
This commit is contained in:
parent
f7ee629089
commit
8644ce2020
@ -110,11 +110,6 @@ select option, select optgroup {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
input::-moz-placeholder,
|
||||
textarea::-moz-placeholder {
|
||||
color: GrayText;
|
||||
}
|
||||
|
||||
select:not([size]):not([multiple]),
|
||||
select[size="0"],
|
||||
select[size="1"],
|
||||
|
@ -148,6 +148,7 @@
|
||||
|
||||
.devtools-searchinput > .textbox-input-box > .textbox-input::-moz-placeholder {
|
||||
color: hsl(208,10%,66%);
|
||||
opacity: 1.0;
|
||||
}
|
||||
|
||||
/* Close button */
|
||||
|
@ -428,6 +428,7 @@ input.name:focus {
|
||||
}
|
||||
|
||||
input.name::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
font-style: italic !important;
|
||||
color: transparent;
|
||||
background-image: url(chrome://browser/skin/tabview/edit-light.png);
|
||||
|
@ -1954,6 +1954,7 @@ window[tabsontop="false"] richlistitem[type~="action"][actiontype="switchtab"][s
|
||||
}
|
||||
|
||||
#editBMPanel_tagsField > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
color: #bbb;
|
||||
}
|
||||
|
||||
|
@ -153,6 +153,7 @@
|
||||
}
|
||||
|
||||
.devtools-searchinput > .textbox-input-box > .textbox-input::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
color: hsl(208,10%,66%);
|
||||
}
|
||||
|
||||
|
@ -420,6 +420,7 @@ input.name:focus {
|
||||
}
|
||||
|
||||
input.name::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
font-style: italic !important;
|
||||
color: transparent;
|
||||
background-image: url(chrome://browser/skin/tabview/edit-light.png);
|
||||
|
@ -294,6 +294,7 @@
|
||||
|
||||
#navigator-toolbox[tabsontop=false] html|*.urlbar-input:not(:-moz-lwtheme)::-moz-placeholder,
|
||||
#navigator-toolbox[tabsontop=false] .searchbar-textbox > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input:not(:-moz-lwtheme)::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
|
@ -1245,6 +1245,7 @@ toolbar[mode=full] .toolbarbutton-1 > .toolbarbutton-menubutton-button {
|
||||
|
||||
html|*.urlbar-input:-moz-lwtheme::-moz-placeholder,
|
||||
.searchbar-textbox:-moz-lwtheme > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
|
@ -159,6 +159,7 @@
|
||||
}
|
||||
|
||||
.devtools-searchinput > .textbox-input-box > .textbox-input::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
color: hsl(208,10%,66%);
|
||||
}
|
||||
|
||||
|
@ -443,6 +443,7 @@ input.name:focus {
|
||||
}
|
||||
|
||||
input.name::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
font-style: italic !important;
|
||||
color: transparent;
|
||||
background-image: url(chrome://browser/skin/tabview/edit-light.png);
|
||||
|
@ -1,5 +1,6 @@
|
||||
<?xml version="1.0"?>
|
||||
<?xml-stylesheet href="chrome://global/skin" type="text/css"?>
|
||||
<?xml-stylesheet href="placeholder-reset.css" type="text/css"?>
|
||||
|
||||
<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
|
||||
xmlns:html="http://www.w3.org/1999/xhtml"
|
||||
|
8
editor/reftests/xul/placeholder-reset.css
Normal file
8
editor/reftests/xul/placeholder-reset.css
Normal file
@ -0,0 +1,8 @@
|
||||
@namespace url('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul');
|
||||
@namespace html url('http://www.w3.org/1999/xhtml');
|
||||
|
||||
/* We need to have a non-transparent placeholder so we can test it. */
|
||||
html|input::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
color: graytext;
|
||||
}
|
@ -16,6 +16,7 @@
|
||||
}
|
||||
|
||||
:-moz-any(input, textarea)::-moz-placeholder {
|
||||
opacity: 1.0;
|
||||
font: -moz-list;
|
||||
font-family: mono;
|
||||
font-style: italic;
|
||||
|
@ -1,4 +1,5 @@
|
||||
input::-moz-placeholder,
|
||||
input.ref {
|
||||
color: green;
|
||||
opacity: 1.0;
|
||||
}
|
||||
|
@ -1,4 +1,5 @@
|
||||
textarea::-moz-placeholder,
|
||||
textarea.ref {
|
||||
color: green;
|
||||
opacity: 1.0;
|
||||
}
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!-- Test: placeholder should be used by input password elements -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<body>
|
||||
<input type="password" value="" placeholder="my placeholder">
|
||||
</body>
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!-- Test: placeholder should be used by input text elements -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<body>
|
||||
<input type="text" value="" placeholder="my placeholder">
|
||||
</body>
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!-- Test: placeholder should be used by textarea elements -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<body>
|
||||
<textarea placeholder="my placeholder"></textarea>
|
||||
</body>
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<!-- Test: when unfocused, if value='', newest placeholder should be shown -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<script type="text/javascript">
|
||||
function focusPlaceholder()
|
||||
{
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!-- Test: placeholder shouldn't show new lines ( version) -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<body>
|
||||
<input type="text" value="" placeholder="my placeholder">
|
||||
</body>
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!-- Test: placeholder shouldn't show new lines ( version) -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<body>
|
||||
<input type="text" value="" placeholder="my placeholder">
|
||||
</body>
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<!-- Test: placeholder shouldn't show new lines (\r version) -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<script type="text/javascript">
|
||||
function setPlaceholder()
|
||||
{
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<!-- Test: placeholder shouldn't show new lines (\n version) -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<script type="text/javascript">
|
||||
function setPlaceholder()
|
||||
{
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<!-- Test: placeholder has to be used if set via javascript -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<script type="text/javascript">
|
||||
function setPlaceholder()
|
||||
{
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<!-- Test: placeholder has to be used if set via javascript -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<script type="text/javascript">
|
||||
function setPlaceholder()
|
||||
{
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html class="reftest-wait">
|
||||
<!-- Test: placeholder has to be shown if value is reseted via javascript -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<script type="text/javascript">
|
||||
function setValue()
|
||||
{
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!-- Test placeholder behavior when textarea is too small -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<body>
|
||||
<textarea cols="5" rows="3" placeholder="my placeholder"></textarea>
|
||||
</body>
|
||||
|
@ -1,6 +1,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<!-- Test placeholder behavior when input is too small -->
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<body>
|
||||
<input type="text" size="5" value="" placeholder="my placeholder">
|
||||
</body>
|
||||
|
@ -1,5 +1,6 @@
|
||||
<!DOCTYPE html>
|
||||
<html dir='rtl'>
|
||||
<link rel='stylesheet' type='text/css' href='placeholder-style.css'>
|
||||
<body>
|
||||
<input placeholder='foo'>
|
||||
<textarea placeholder='foo'></textarea>
|
||||
|
@ -1,4 +1,10 @@
|
||||
textarea.placeholder,
|
||||
input.placeholder {
|
||||
input.placeholder,
|
||||
input::-moz-placeholder,
|
||||
textarea::-moz-placeholder {
|
||||
/* Unfortunately, we can't style the <input> or <textarea> text so we can't
|
||||
set it to opacity: 0.54; which means we have to revert the style to
|
||||
something that doesn't include an opacity. */
|
||||
color: GrayText;
|
||||
opacity: 1.0;
|
||||
}
|
||||
|
@ -169,7 +169,7 @@ textarea::-moz-placeholder {
|
||||
*/
|
||||
pointer-events: none !important;
|
||||
|
||||
color: GrayText;
|
||||
opacity: 0.54;
|
||||
}
|
||||
|
||||
textarea::-moz-placeholder {
|
||||
|
@ -141,11 +141,6 @@ select option, select optgroup {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
input::-moz-placeholder,
|
||||
textarea::-moz-placeholder {
|
||||
color: GrayText;
|
||||
}
|
||||
|
||||
select:not([size]):not([multiple]),
|
||||
select[size="0"],
|
||||
select[size="1"],
|
||||
|
@ -133,11 +133,6 @@ select option, select optgroup {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
input::-moz-placeholder,
|
||||
textarea::-moz-placeholder {
|
||||
color: GrayText;
|
||||
}
|
||||
|
||||
select:not([size]):not([multiple]),
|
||||
select[size="0"],
|
||||
select[size="1"],
|
||||
|
@ -133,11 +133,6 @@ textarea,
|
||||
background: white -moz-linear-gradient(top, rgba(115,115,115,0.5) 0, rgba(215,215,215,0.5) 3px, rgba(255,255,255,0.2) 16px);
|
||||
}
|
||||
|
||||
input::-moz-placeholder,
|
||||
textarea::-moz-placeholder {
|
||||
color: GrayText;
|
||||
}
|
||||
|
||||
select:not([size]):not([multiple]),
|
||||
select[size="0"],
|
||||
select[size="1"],
|
||||
|
@ -31,11 +31,6 @@ html|*.textbox-textarea {
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
html|*.textbox-input::-moz-placeholder,
|
||||
html|*.textbox-textarea::-moz-placeholder {
|
||||
color: GrayText;
|
||||
}
|
||||
|
||||
.textbox-contextmenu {
|
||||
cursor: default;
|
||||
}
|
||||
|
@ -36,11 +36,6 @@ html|*.textbox-textarea {
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
html|*.textbox-input::-moz-placeholder,
|
||||
html|*.textbox-textarea::-moz-placeholder {
|
||||
color: GrayText;
|
||||
}
|
||||
|
||||
.textbox-contextmenu {
|
||||
cursor: default;
|
||||
}
|
||||
|
@ -32,11 +32,6 @@ html|*.textbox-textarea {
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
html|*.textbox-input::-moz-placeholder,
|
||||
html|*.textbox-textarea::-moz-placeholder {
|
||||
color: GrayText;
|
||||
}
|
||||
|
||||
.textbox-contextmenu {
|
||||
cursor: default;
|
||||
}
|
||||
|
@ -329,6 +329,7 @@
|
||||
|
||||
#header-search > .textbox-input-box > html|*.textbox-input::-moz-placeholder {
|
||||
color: #5C6470;
|
||||
opacity: 1.0;
|
||||
}
|
||||
|
||||
.view-header {
|
||||
|
@ -36,11 +36,6 @@ html|*.textbox-textarea {
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
html|*.textbox-input::-moz-placeholder,
|
||||
html|*.textbox-textarea::-moz-placeholder {
|
||||
color: GrayText;
|
||||
}
|
||||
|
||||
.textbox-contextmenu {
|
||||
cursor: default;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user