zzos/react-native-devtools-frontend
1
0
Fork 0
mirror of https://github.com/react/react-native-devtools-frontend.git synced 2026-10-01 01:38:07 +08:00
Code Issues Packages Projects Releases Wiki Activity
6,677 Commits 43 Branches 79 Tags
bbdf7342fee4e6ff7425b6646475fa586bbc8e2d
Commit Graph
12 Commits
Author SHA1 Message Date
Mathias Bynens d6b8815430 Simplify textToIconResolver map population 
Bug: chromium:1139945
Change-Id: I322d003db0e1aa8ffc73f1c8ae14f72670a94650
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2525954
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
Commit-Queue: Mathias Bynens <mathias@chromium.org>
 2020-11-09 13:28:37 +00:00
Alex Rudenko e47dd24ea7 Add align-items: center icon 
Bug: 1139945
Change-Id: I19af9a45df70b0a553c6d4b0a746d56db8364b07
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2525940
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
 2020-11-09 09:51:16 +00:00
Alex Rudenko 9d599b26cd Add icons for align-content and remove icons for start/end for now 
Adding the icons for normal/initial/revert/unset values for
align-content and removing start/end icons for now because
it might be confusing given that start/end is supported for grid
but not for flexbox.

Bug: 1139945
Change-Id: Idff3941d03dc8e576242f7cda467b150ae646005
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2520830
Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
 2020-11-06 14:52:02 +00:00
Alex Rudenko aa14597ebc Show icons for align-content:start|end 
This CL adds icons for align-content:start|end values which are not
supported in Chromium yet. They are expected to work in the same way
as the flex-start|flex-end for align-content (tested in Firefox).
Also, it fixes a bug in align-content icon positioning for row-reverse
and column-reverse flex directions and adds a few tests.

Bug: 1139945
Change-Id: I34419fcc9fc9ab7a9ea506bbc7e6f3830f0c9497
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2519696
Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
 2020-11-05 08:31:11 +00:00
Alex Rudenko 62e571e6bb Add align-self icons to the Styles panel 
This CL adds item-level icons for the align-self property.
The position of the icon is the same as the position of the
align-items icons for the parent node. Parent node's styles
are, therefore, used when a parent node is available.
Parent node's computed styles are cached as well.

Screenshot: https://i.imgur.com/OAD4eqS.png
Bug: 1139945
Change-Id: I83000ced65b92b75976e8733b54dfd134694b271
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2518043
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-11-04 14:06:38 +00:00
Alex Rudenko 89cf59f82a Add baseline icons for flexbox properties in the Styles panel 
Screenshot: https://i.imgur.com/2h8TFbA.png

Bug: 1139945
Change-Id: Ieb39f713826b867ee0241baa8fecbd1aeb2dd86d
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2516339
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
 2020-11-03 11:09:26 +00:00
Alex Rudenko ef0d950655 Add align-items icons to the styles panel 
This CL adds new icons for several align-items properties
that are adjusted based on the flex-direction, direction and
writing-mode.

Screenshot: https://i.imgur.com/tBKPbru.png
Bug: 1139945
Change-Id: I883f7b835da5dd5e6e948817859060ae0ccaef56
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2512226
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
 2020-11-02 16:38:00 +00:00
Alex Rudenko 5d35d2afdd Add justify-content icons to the styles panel 
This CL adds new icons for several justify-content properties
that are adjusted based on the flex-direction, direction and
writing-mode.

Screenshot: https://i.imgur.com/fG1Qr3G.png

Bug: 1139945
Change-Id: I3bfa5812238a0f19cd1ceb849341a4194e70988e
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2509580
Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
Reviewed-by: Changhao Han <changhaohan@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
 2020-11-02 15:33:00 +00:00
Alex Rudenko 66af8a4f3d Add align-content icons to the styles panel 
This CL adds new icons for several align-content properties
that are adjusted based on the flex-direction, direction and
writing-mode.

Screenshot: https://i.imgur.com/bT8tRdM.png

Bug: 1139945
Change-Id: I1854fa15049d191f91e14b2623c7c37d376e3663
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2505905
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Changhao Han <changhaohan@chromium.org>
Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
 2020-10-30 07:35:05 +00:00
Alex Rudenko de52def693 Add icons for global CSS keywords 
If I am not mistaken, CSS keywords like initial, revert, unset and
inherit should always result in the "row" value for flex-direction.
In that case, I think it makes sense to add icons for these values
as well.
Also, this CL contains minor style improvements.

Bug: 1139945
Change-Id: Ia349413a1c26ba0364d586af49d7d3ef25dd851b
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2498225
Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
 2020-10-27 12:29:57 +00:00
Alex Rudenko 875a33f832 Icons for all flex-direction values 
This CL adds icons for the flex-direction values: column, column-reverse
and row-reverse. Additionally, it refactors the icon rendering logic
into two parts: determining actual direction for row and column
values and handling of the icon rotation according to the direction.

Bug: 1139945
Change-Id: Ie7a5677963c77c482837735fc4e7c90d3801b451
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2498220
Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
 2020-10-26 10:05:35 +00:00
Alex Rudenko 4504e3a359 Show icons explaining flexbox-direction:row in Styles panel 
This CL adds an icon for the flex-direction: row property that
shows up when editing the styles. The icon is automatically rotated
based on the element's direction. The feature is behind a new experiment
flag called cssFlexboxFeatures.

Video: https://i.imgur.com/EE9LKj1.mp4
Backend CL for metrics: https://crrev.com/c/2485268

Bug: 1139945
Change-Id: I674215f62b2de6fd2f14884974eda186ad39ce3e
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2485081
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
Reviewed-by: Changhao Han <changhaohan@chromium.org>
Reviewed-by: Mathias Bynens <mathias@chromium.org>
 2020-10-23 13:34:31 +00:00