On Sun, Jul 8, 2018 at 4:51 PM, Greg Sheremeta <gshereme@redhat.com> wrote:
Hi all,We are actively moving away from GWT and towards react [https://reactjs.org/] in webadmin, so the CSS needs to be in a place where both can access it.
Right, whenever you need to add new UI bits (i.e. as part of implementing some feature) into WebAdmin - please do so via the ovirt-engine-ui-extensions project if possible. It's an oVirt UI plugin meant to contain various types of UI extensions, including the Dashboard (and effectively replacing the ovirt-engine-dashboard dependency in 4.3/master Engine).
If you need to modify some existing WebAdmin dialog and the change is not trivial, please consider the possibility to re-implement bits of (or even the entire) dialog in React. We have already implemented a new version of "Migrate VM(s)" dialog within the ui-extensions project [1] - it will soon replace the corresponding GWT dialog code. What seems too complex in GWT/Java doesn't have to be that complex in React/JavaScript!
And if the given UI component is important/useful enough, we can contribute it to patternfly-react and use it in other projects as necessary. (For example, sharing common UI components with VM Portal.)
Moving forward, please avoid using any and all of GWT's CSS features when working in webadmin. This new(ish) place is sass: [https://github.com/oVirt/ovirt-engine/tree/master/ ]frontend/brands/ovirt-brand/ src/main/sass Sass is easy to use, and hopefully the structure makes sense.So --don't use<ui:style>nor addStyleNames="{style.whatever}"> instead,<g:FlowPanel ui:field="xyz" addStyleNames="prefix_className"> more examples here [1](prefix == the sass file name)
Currently, most WebAdmin CSS is baked into the GWT application - using <ui:style> scopes it to the given widget. As Greg wrote above, moving forward, we'd like to share the common styling between core UI and other projects - and we can do it via Engine branding infra. For example:
contains all styles as declared in:
/path/to/ovirt-engine/frontend/brands/ovirt-brand/src/main/sass/common.scss
Note: "ovirt-brand" is the name of the default branding package. This is generally how we can facilitate CSS sharing, produced by core UI and consumed by others. As for the opposite direction (common CSS produced by others and consumed by core UI and/or others), we could add new branding package to contain the extra CSS.
For programmatic manipulation, simply hardcode style names in Java code and don't use GWT's Style:widget.addClassName("notif_someClassName") etc.Best wishes,GregSass package:
_______________________________________________
Devel mailing list -- devel@ovirt.org
To unsubscribe send an email to devel-leave@ovirt.org
Privacy Statement: https://www.ovirt.org/site/privacy-policy/
oVirt Code of Conduct: https://www.ovirt.org/community/about/community- guidelines/
List Archives: https://lists.ovirt.org/archives/list/devel@ovirt.org/ message/ G4XP5R7RPVNRCDDAX56EM3DK4BVXWJ F2/
