Commit Graph

10 Commits

Author SHA1 Message Date
Andres Suarez
79023ee190 Update copyright headers from Facebook to Meta
Reviewed By: bhamodi

Differential Revision: D33331422

fbshipit-source-id: 016e8dcc0c0c7f1fc353a348b54fda0d5e2ddc01
2021-12-27 14:31:45 -08:00
3rdp
c4577bfee2 Fix dark diff background colors (#3065)
Summary:
Bug fix. Currenty Flipper provides incorrect red and green diff colors in Dark theme, this PR fixes the issue. Light theme colors are the same.

Closes https://github.com/facebook/flipper/issues/3011

## Changelog

Color theme fix: make diff background colors be defined in theme LESS files

Pull Request resolved: https://github.com/facebook/flipper/pull/3065

Test Plan:
I used [redux-debugger](https://github.com/jk-gan/flipper-plugin-redux-debugger) plugin to test this as this is what I actually use for debugging Redux in React Native projects with Flipper. Here's a [React Native app](https://github.com/3rdp/flipper-redux-debugger-app) that I put together for testing purposes.

Light theme:
![lime2 light](https://user-images.githubusercontent.com/8898635/141799686-8b94655f-2501-46f9-9b28-d9ba8aeee222.png)

Dark theme:
![lime2](https://user-images.githubusercontent.com/8898635/141799710-fbd008a5-28cc-46f3-abf7-6b90fd85facb.png)

Reviewed By: mweststrate

Differential Revision: D32529276

Pulled By: passy

fbshipit-source-id: 3d11edaf1112444bb106521b6b30db4a4c2b8202
2021-11-18 06:22:17 -08:00
Michel Weststrate
8a7323b9f8 Render plugin list
Summary:
This diff adds the rough navigation to open pugins, there are some rough egdes still, and tests will be added later, but wanted to keep diffs small, and land the feature early to get some initial dogfooding going on early.

Note that we now also show all disabled plugins to help people with trouble shooting.

Reviewed By: nikoant

Differential Revision: D24418411

fbshipit-source-id: 1402d69efe2e52bc2c81336cfb4f4c9928ea4d80
2020-10-22 09:41:11 -07:00
Michel Weststrate
f14a724fa5 Device plugin list
Summary:
Render a plugin list

Will add tests once the entire feature is complete

Reviewed By: cekkaewnumchai

Differential Revision: D24079897

fbshipit-source-id: db7250ff612b67ab18dfcacdcb9c44dab596933d
2020-10-20 03:24:46 -07:00
Chaiwat Ekkaewnumchai
6d1da5bb42 Add Login Component
Summary:
- Add Sandy renderer for `SignInSheet`
- Change background color for default button

Reviewed By: mweststrate

Differential Revision: D24112100

fbshipit-source-id: a602c920c24dd039697834aaba3c79e79f04481e
2020-10-07 03:12:30 -07:00
Chaiwat Ekkaewnumchai
93c897820b Change Typography Size
Summary:
Typography on Sandy! The designed typography is [here in Figma](https://www.figma.com/file/4e6BMdm2SuZ1L7FSuOPQVC/Flipper?node-id=238%3A172)

Current deflects
- cannot find component for 'body - small' and 'meta'
- don't know how to set 'link secondary hover' as designed

Reviewed By: mweststrate

Differential Revision: D23869256

fbshipit-source-id: efb1475749cebad529b502458d1b15bd445bb346
2020-09-23 17:59:46 -07:00
Pascal Hartig
bc0bcda300 Fix license headers for less files
Summary: Failing OSS requirements due to missing headers right now: P143086435

Reviewed By: mweststrate

Differential Revision: D23843532

fbshipit-source-id: 759daefbec641d59adff6ecee8d06dd90c7a6b5b
2020-09-23 09:46:21 -07:00
Michel Weststrate
694d4e0e33 Expose theme from JavaScript
Summary:
This diff fixes two problems when further theming Flipper:

1. All shades of gray where defined in terms of black/white + transparency. Converted all colors to non transparent to make sure they stack well.
2. The color theme defined in less aren't available as javascript colors. It is possible to achieve that through setting up a babel parser that parses the less files and exposes them to JS. But since we have modern stack, figured that exposing all theme variables as CSS variables as well is a much simpler setup.

Reviewed By: passy

Differential Revision: D23756558

fbshipit-source-id: e92be1f66b11c2c9c400fc1622cb8a493cc4c2a5
2020-09-17 04:05:09 -07:00
Michel Weststrate
ef4379e847 Implemented basic Flipper theme, [Flipper] Setup initial layout and siderail
Summary:
This setups the first bits of the Sandy Layout, and has a styled siderail according to the design, that does absolutely nothing.

{gif:0sa60r8c}

Reviewed By: cekkaewnumchai

Differential Revision: D23655313

fbshipit-source-id: e30278aeae0913e231ad105a9afb55c74c6a3370
2020-09-17 04:05:09 -07:00
Michel Weststrate
908a8bab1e Setup Ant.design
Summary:
allow-large-files

This makes the Ant.design component library available to Flipper

The CSS setup is unconventional, in the sense that the normal way to do this is to use a webpack loader to dynamically load the right less files, and a babel transform to automatically import the style sheets.

Since we use Metro, which is not very suitable for transforming non-JS(like) files, I figured that the simplest thing is to pre-compile the entire less theme. Which should be fine since we shouldn't be changing the less files very often, and since we don't ship a website, it is probably not too bad to have the full ANT theme for now in there, even though we don't use all components. It is 600 K of css. In the next diff the CSS is loaded conditionally, only if Sandy is enabled.

If the CSS turns out to be too big we can optimise this later to only import CSS for components we use by doing some Metro magic, but it doesn't seem to be trivial (that is, I couldn't get in to work in < 2 hours).

Reviewed By: cekkaewnumchai

Differential Revision: D23625855

fbshipit-source-id: 3ba810b2221dc0c7b719f66310e590c7748cf239
2020-09-17 04:05:08 -07:00