search

blindnet-io / product-management

Repository dedicated for reporting bugs, ideas for improvements, and new features
6 stars 0 forks source link

Blindnet responsiveness #956

Closed tibastral closed 2 years ago

tibastral commented 2 years ago
Screenshot 2022-09-16 at 14 24 51

Hey, I don't understand why the content of the app is overlapped by the menu (on the left), and why it doesn't work on mobile. Could you explain please ? Thank you (https://www.perficient.com/insights/research-hub/mobile-vs-desktop-usage)

nweldev commented 2 years ago

There are indeed two important issues here:

  1. (Edit: my bad, I misunderstood the screenshot, this has nothing to do with Storybook actually) The menu in the devkit-simple-tutorial demo isn't properly styled for big screens.
  2. The PRCI and DCI web components have been initially developed in a non-responsive way for demonstration purposes. Rewriting of the styles for progressiveness is in progress (ping @jboileau99 for more details if needed)

Thank you for this feedback. We have defined a higher priority for those issues and will keep you posted here.

nweldev commented 2 years ago

The first issue ("the content of the app is overlapped by the menu") should be solved by https://github.com/blindnet-io/privacy-components-web/pull/152 in the next release of Privacy Components for the Web.

The more advanced one ("it doesn't work on mobile") is progressively addressed while building the next version, but will be really covered by https://github.com/blindnet-io/privacy-components-web/issues/153.

Styles are defined in each component via the static styles property using lit css tagged template literals (cf. lit.dev > styling. Example: https://github.com/blindnet-io/privacy-components-web/blob/develop/packages/prci/src/BldnPrivRequest.ts#L40-L88. I'll be happy to support you at every step if you wanna make a contribution to help us fix this issue.

nweldev commented 2 years ago

Closing as a duplicate of https://github.com/blindnet-io/privacy-components-web/pull/152 and https://github.com/blindnet-io/privacy-components-web/issues/153.