зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1585216 - Propagate the inner text field's baseline as the baseline for a number input. r=dholbert
Differential Revision: https://phabricator.services.mozilla.com/D48588 --HG-- extra : moz-landing-system : lando
This commit is contained in:
Mats Palmgren
Родитель
5716f36a6c
Коммит
25361a123b
|
|
@ -419,7 +419,7 @@ nsresult nsNumberControlFrame::SetFormProperty(nsAtom* aName,
|
|||
return GetTextFieldFrame()->SetFormProperty(aName, aValue);
|
||||
}
|
||||
|
||||
HTMLInputElement* nsNumberControlFrame::GetAnonTextControl() {
|
||||
HTMLInputElement* nsNumberControlFrame::GetAnonTextControl() const {
|
||||
return HTMLInputElement::FromNode(mTextField);
|
||||
}
|
||||
|
||||
|
|
@ -574,6 +574,25 @@ bool nsNumberControlFrame::ShouldUseNativeStyleForSpinner() const {
|
|||
spinDownFrame, STYLES_DISABLING_NATIVE_THEMING);
|
||||
}
|
||||
|
||||
bool nsNumberControlFrame::GetNaturalBaselineBOffset(
|
||||
WritingMode aWM, BaselineSharingGroup aGroup, nscoord* aBaseline) const {
|
||||
if (StyleDisplay()->IsContainLayout()) {
|
||||
return false;
|
||||
}
|
||||
nsIFrame* inner = GetAnonTextControl()->GetPrimaryFrame();
|
||||
nscoord baseline;
|
||||
DebugOnly<bool> hasBaseline = inner->GetNaturalBaselineBOffset(
|
||||
aWM, BaselineSharingGroup::First, &baseline);
|
||||
MOZ_ASSERT(hasBaseline);
|
||||
nsPoint offset = inner->GetOffsetToIgnoringScrolling(this);
|
||||
baseline += aWM.IsVertical() ? offset.x : offset.y;
|
||||
if (aGroup == BaselineSharingGroup::Last) {
|
||||
baseline = BSize(aWM) - baseline;
|
||||
}
|
||||
*aBaseline = baseline;
|
||||
return true;
|
||||
}
|
||||
|
||||
void nsNumberControlFrame::AppendAnonymousContentTo(
|
||||
nsTArray<nsIContent*>& aElements, uint32_t aFilter) {
|
||||
// Only one direct anonymous child:
|
||||
|
|
|
|||
|
|
@ -67,6 +67,10 @@ class nsNumberControlFrame final : public nsContainerFrame,
|
|||
virtual nsresult AttributeChanged(int32_t aNameSpaceID, nsAtom* aAttribute,
|
||||
int32_t aModType) override;
|
||||
|
||||
bool GetNaturalBaselineBOffset(mozilla::WritingMode aWM,
|
||||
BaselineSharingGroup aGroup,
|
||||
nscoord* aBaseline) const override;
|
||||
|
||||
// nsIAnonymousContentCreator
|
||||
virtual nsresult CreateAnonymousContent(
|
||||
nsTArray<ContentInfo>& aElements) override;
|
||||
|
|
@ -116,7 +120,7 @@ class nsNumberControlFrame final : public nsContainerFrame,
|
|||
mHandlingInputEvent = aHandlingEvent;
|
||||
}
|
||||
|
||||
HTMLInputElement* GetAnonTextControl();
|
||||
HTMLInputElement* GetAnonTextControl() const;
|
||||
|
||||
/**
|
||||
* If the frame is the frame for an nsNumberControlFrame's anonymous text
|
||||
|
|
|
|||
|
|
@ -0,0 +1,62 @@
|
|||
<!DOCTYPE HTML>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<html><head>
|
||||
<meta charset=utf-8>
|
||||
<title>Reference baseline alignment of inline-grid with an INPUT type=number item</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<style>
|
||||
|
||||
.grid {
|
||||
display: inline-block;
|
||||
line-height: 0;
|
||||
border: 5px solid;
|
||||
padding: 1px 0 3px 0;
|
||||
margin: 11px 0;
|
||||
}
|
||||
|
||||
input { -webkit-appearance:none; inline-size:4ch; }
|
||||
|
||||
.big {
|
||||
font-size: 4em;
|
||||
}
|
||||
|
||||
.small {
|
||||
font-size: 0.2em;
|
||||
}
|
||||
|
||||
.vlr { writing-mode: vertical-lr; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div>
|
||||
<span class="big">B</span>
|
||||
<div class="grid"><input type="number" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>B</span>
|
||||
<div class="grid"><input class="big" type="number" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div class="vlr">
|
||||
<div>
|
||||
<span class="big">B</span>
|
||||
<div class="grid"><input type="number" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>B</span>
|
||||
<div class="grid"><input class="big" type="number" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
<!DOCTYPE HTML>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<html><head>
|
||||
<meta charset=utf-8>
|
||||
<title>Test baseline alignment of inline-grid with an INPUT type=number item</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-align/">
|
||||
<link rel="match" href="grid-item-input-type-number-ref.html">
|
||||
<style>
|
||||
|
||||
.grid {
|
||||
display: inline-grid;
|
||||
border: 5px solid;
|
||||
padding: 1px 0 3px 0;
|
||||
margin: 11px 0;
|
||||
}
|
||||
|
||||
input { -webkit-appearance:none; inline-size:4ch; }
|
||||
|
||||
.big {
|
||||
font-size: 4em;
|
||||
}
|
||||
|
||||
.small {
|
||||
font-size: 0.2em;
|
||||
}
|
||||
|
||||
.vlr { writing-mode: vertical-lr; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div>
|
||||
<span class="big">B</span>
|
||||
<div class="grid"><input type="number" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>B</span>
|
||||
<div class="grid"><input class="big" type="number" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div class="vlr">
|
||||
<div>
|
||||
<span class="big">B</span>
|
||||
<div class="grid"><input type="number" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>B</span>
|
||||
<div class="grid"><input class="big" type="number" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
<!DOCTYPE HTML>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<html><head>
|
||||
<meta charset=utf-8>
|
||||
<title>Reference baseline alignment of inline-grid with an INPUT type=text item</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<style>
|
||||
|
||||
.grid {
|
||||
display: inline-block;
|
||||
line-height: 0;
|
||||
border: 5px solid;
|
||||
padding: 1px 0 3px 0;
|
||||
margin: 11px 0;
|
||||
}
|
||||
|
||||
input { -webkit-appearance:none; inline-size:4ch; }
|
||||
|
||||
.big {
|
||||
font-size: 4em;
|
||||
}
|
||||
|
||||
.small {
|
||||
font-size: 0.2em;
|
||||
}
|
||||
|
||||
.vlr { writing-mode: vertical-lr; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div>
|
||||
<span class="big">B</span>
|
||||
<div class="grid"><input value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>B</span>
|
||||
<div class="grid"><input class="big" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div class="vlr">
|
||||
<div>
|
||||
<span class="big">B</span>
|
||||
<div class="grid"><input value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>B</span>
|
||||
<div class="grid"><input class="big" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,63 @@
|
|||
<!DOCTYPE HTML>
|
||||
<!--
|
||||
Any copyright is dedicated to the Public Domain.
|
||||
http://creativecommons.org/publicdomain/zero/1.0/
|
||||
-->
|
||||
<html><head>
|
||||
<meta charset=utf-8>
|
||||
<title>Test baseline alignment of inline-grid with an INPUT type=text item</title>
|
||||
<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-align/">
|
||||
<link rel="match" href="grid-item-input-type-text-ref.html">
|
||||
<style>
|
||||
|
||||
.grid {
|
||||
display: inline-grid;
|
||||
border: 5px solid;
|
||||
padding: 1px 0 3px 0;
|
||||
margin: 11px 0;
|
||||
}
|
||||
|
||||
input { -webkit-appearance:none; inline-size:4ch; }
|
||||
|
||||
.big {
|
||||
font-size: 4em;
|
||||
}
|
||||
|
||||
.small {
|
||||
font-size: 0.2em;
|
||||
}
|
||||
|
||||
.vlr { writing-mode: vertical-lr; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div>
|
||||
<span class="big">B</span>
|
||||
<div class="grid"><input value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>B</span>
|
||||
<div class="grid"><input class="big" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div class="vlr">
|
||||
<div>
|
||||
<span class="big">B</span>
|
||||
<div class="grid"><input value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>B</span>
|
||||
<div class="grid"><input class="big" value="9"></div>
|
||||
<span class="small">B</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Загрузка…
Ссылка в новой задаче