Skip to content

Commit 3c8c05b

Browse files
pxlcoderpxlcoder
committed
[iOS][FCR] Add new look for buttons in their default state
https://bugs.webkit.org/show_bug.cgi?id=219446 <rdar://problem/71904353> Reviewed by Wenson Hsieh. Controls with a button-like appearance include <button> and <input> elements with the following type attributes: “button”, “submit”, “reset”, and “file”. All of these have the same default appearance, with the exception of "submit", which has a darker background and lighter text color than the others. Note that styles for additional states (pressed, disabled) will be added once final specifications are obtained. * css/formControlsIOS.css: (input:matches([type="button"], [type="submit"], [type="reset"]), input[type="file"]::-webkit-file-upload-button, button): (input:matches([type="button"], [type="reset"]), input[type="file"]::-webkit-file-upload-button, button): (input[type="submit"]): * rendering/RenderThemeIOS.mm: (WebCore::RenderThemeIOS::paintPushButtonDecorations): The old button appearance painted a gradient over the button background. This gradient is no longer necessary under the new design. Canonical link: https://commits.webkit.org/232088@main git-svn-id: https://svn.webkit.org/repository/webkit/trunk@270403 268f45cc-cd09-0410-ab3c-d52691b4dbfc
1 parent cc07f74 commit 3c8c05b

3 files changed

Lines changed: 51 additions & 0 deletions

File tree

‎Source/WebCore/ChangeLog‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,30 @@
1+
2020-12-03 Aditya Keerthi <akeerthi@apple.com>
2+
3+
[iOS][FCR] Add new look for buttons in their default state
4+
https://bugs.webkit.org/show_bug.cgi?id=219446
5+
<rdar://problem/71904353>
6+
7+
Reviewed by Wenson Hsieh.
8+
9+
Controls with a button-like appearance include <button> and <input>
10+
elements with the following type attributes: “button”, “submit”,
11+
“reset”, and “file”. All of these have the same default appearance,
12+
with the exception of "submit", which has a darker background and
13+
lighter text color than the others.
14+
15+
Note that styles for additional states (pressed, disabled) will be
16+
added once final specifications are obtained.
17+
18+
* css/formControlsIOS.css:
19+
(input:matches([type="button"], [type="submit"], [type="reset"]), input[type="file"]::-webkit-file-upload-button, button):
20+
(input:matches([type="button"], [type="reset"]), input[type="file"]::-webkit-file-upload-button, button):
21+
(input[type="submit"]):
22+
* rendering/RenderThemeIOS.mm:
23+
(WebCore::RenderThemeIOS::paintPushButtonDecorations):
24+
25+
The old button appearance painted a gradient over the button background.
26+
This gradient is no longer necessary under the new design.
27+
128
2020-12-03 Fujii Hironori <Hironori.Fujii@sony.com>
229

330
GraphicsContextGLOpenGL: Rename IOSurfaceTextureTarget to drawingBufferTextureTarget

‎Source/WebCore/css/formControlsIOS.css‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,4 +58,23 @@ input[type="search"]::-webkit-search-results-button {
5858
-webkit-mask-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 73 73"><path fill="darkgray" d="M29.6875 59.375c6.2988 0 12.1094-1.953 16.9434-5.3222l17.334 17.334c.9277.9277 2.1484 1.3672 3.418 1.3672 2.7343 0 4.7362-2.0996 4.7362-4.7852 0-1.2695-.4394-2.4902-1.3672-3.418L53.5644 47.3145c3.6622-4.9316 5.8106-11.0352 5.8106-17.627C59.375 13.3301 46.045 0 29.6875 0 13.3301 0 0 13.3301 0 29.6875 0 46.045 13.33 59.375 29.6875 59.375zm0-7.2753c-12.2559 0-22.4121-10.1563-22.4121-22.4122 0-12.3046 10.1562-22.4121 22.4121-22.4121C41.9922 7.2754 52.1 17.3829 52.1 29.6875c0 12.256-10.1078 22.4122-22.4125 22.4122z"/></svg>');
5959
}
6060

61+
input:matches([type="button"], [type="submit"], [type="reset"]), input[type="file"]::-webkit-file-upload-button, button {
62+
border: initial;
63+
font: 11px system-ui;
64+
font-weight: bold;
65+
}
66+
67+
/* FIXME: Use semantic colors once final specifications are obtained. */
68+
/* FIXME: Add styles for additional button states once final specifications are obtained. */
69+
70+
input:matches([type="button"], [type="reset"]), input[type="file"]::-webkit-file-upload-button, button {
71+
background-color: rgb(235, 245, 255);
72+
color: rgb(22, 122, 255);
73+
}
74+
75+
input[type="submit"] {
76+
background-color: rgb(22, 122, 255);
77+
color: white;
78+
}
79+
6180
#endif

‎Source/WebCore/rendering/RenderThemeIOS.mm‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1077,6 +1077,11 @@ static bool shouldUseConvexGradient(const Color& backgroundColor)
10771077

10781078
void RenderThemeIOS::paintPushButtonDecorations(const RenderObject& box, const PaintInfo& paintInfo, const IntRect& rect)
10791079
{
1080+
#if ENABLE(IOS_FORM_CONTROL_REFRESH)
1081+
if (box.settings().iOSFormControlRefreshEnabled())
1082+
return;
1083+
#endif
1084+
10801085
GraphicsContextStateSaver stateSaver(paintInfo.context());
10811086
FloatRect clip = addRoundedBorderClip(box, paintInfo.context(), rect);
10821087

0 commit comments

Comments
 (0)