"?" - Contextual help overlay looks unbalanced

[tbsbdr]

Steps to reproduce

1. click on the contextual helper ex. on "Share with people" or "Share via link"

All bold, padding looks unbalanced

padding looks unbalanced

padding and font sizes look unbalanced

Expected behaviour

• look & feel should be aligned to the design
• added X as an optional option to close the overlay (nice to have)
• figma link: https://www.figma.com/file/EqAiB1wY7cYaMaitjyzup3/Current-oC-Web-UI-Kit-(WIP)?node-id=2214%3A223165

Actual behaviour

Contextual help overlay looks unbalanced

[tbsbdr]

update: added "Access Details" screenshot

[tbsbdr]

update: added figma link

[AlexAndBear]

@tbsbdr
I know some work is required, but could you make simple screens like that
with all contextual helpers you want to have changed?

You can find the existing c-helpers here:
packages/web-app-files/src/helpers/contextualHelpers.js

[AlexAndBear]

ODS change is here - owncloud/owncloud-design-system#2271
Now we need to apply the changes in web

[tbsbdr]

could you make simple screens

👍 will do. thx for the ODS Change

[tbsbdr]

@pmaier1 can you tell if the helper texts are helpful (and correct)? Would appreciate your opinion. The "helpers" appear on click of one of the "?")

1) Helper Share via link

2) Helper Share with people

3) Helper Access details

(outlook - we could show more details in the future. currently this is mainly used to keep the shares-list clean, i.e. let not so important infos take a backseat here in the Access details)

4) Helper Indirect links

5) Helper Space Members

[AlexAndBear]

@tbsbdr 😍
Can you provide a link to the texts so I can copy them after @pmaier1 gave feedback ?

[AlexAndBear]

Note: Access details is no oc-ct-helper but oc-drop needs to be adjusted with the same style

[pmaier1]

Nice! Some remarks:

4. There are also indirect user shares. Are those covered as well?
5. Space managers also have full editor permissions and can manage space properties like description, disable/enable, delete

[tbsbdr]

1) Helper Share via link

Texts:

Select who can access links

Only invited people can access
Account and login is required. Only people from the list "Invited people" can access.

Everyone with the link
No login required. Everyone with the link can access. If you share this link with people from the list "Invited people", they need to login so that their individual assigned permissions can take effect. If they are not logged-in, the permissions of the link take effect.

Learn more (https://doc.owncloud.com/webui/next/owncloud_web/web_for_users.html#sharing)

2) Helper Share with people

Texts:

Invite specific people

Enter a name or group to share this item.

Subfolders
If you share a folder, all of its contents and subfolders will be shared as well.

Notification
Invited people will be notified via email or in-app notification.

Incognito
Invited people can not see who else has access.

“via folder”
The “via folder” is shown next to a share, if access has already been given via a parent folder. Click on the “via folder” to edit the share on its parent folder.

Learn more (https://doc.owncloud.com/webui/next/owncloud_web/web_for_users.html#sharing)

3) Helper Access details

(outlook - we could show more details in the future. currently this is mainly used to keep the shares-list clean, i.e. let not so important infos take a backseat here in the Access details)

Texts

• Name
• Additional info
• Access expires ("No" or <Date>)
• Shared on
• Invited by
• Recent view or download of the share ("Never" or <Date>)

Learn more (Will be documented as soon as we extend the infos)

4) Helper Indirect links

Texts:

What are indirect links?

Indirect links are links giving access by a parent folder.

How to edit indirect links
Indirect links can only be edited in their parent folder. Click on the folder icon below the link to navgate to the parent folder.

Learn more (https://doc.owncloud.com/webui/next/owncloud_web/web_for_users.html#sharing)

5) Helper Space Members

Texts:

Add members to this Space

Enter a name to add people or groups as members to this Space.

What members can do
Members can see who else has access to this space and can access all files in this space. Read or write permissions can be set by the member’s role such as “Viewer” or “Editor”.

What Space managers can do
Members with the Manager role can edit all properties and content of a Space, such as adding or removing members, sharing subfolders with non-members, or creating links to share.

Learn more (https://doc.owncloud.com/webui/next/owncloud_web/web_for_users.html#sharing)

Note on "Learn more" links

• I would already set the links although the docu is not written in detail for all the items.
• Setting the links should also make users aware that there is a docu
• Settings the links should give us a push to document the items i.e. give those items prio as they are not self-explanatory via the ui.
• Links should be updated to more specific anchors as soon as we have them written / documented (currently they only link to #sharing -anchor) 

cc @EParzefall @mmattel please take notice that we have those contextual helpers "?"

[tbsbdr]

Note: Access details is no oc-ct-helper but oc-drop needs to be adjusted with the same style

@janackermann yep, noticed that as well. I thought it's a good idea to unify all kinds of "Informational ui" towards the enduser so that they don't need recognise too many different kinds of "informational ui" elements.

@pmaier1 

1. There are also indirect user shares. Are those covered as well?

added it to the "share with people" helper text

1. Space managers also have full editor permissions and can manage space properties like description, disable/enable, delete

Updated the text accordingly: texted it more examplarily "..such as..." to communicate implicity that the helper text is not the docu and should not taken as as comprehensive feature description.

[tbsbdr]

"Access details" helpers will get tackeled in #7340