search

freedomofpress / securedrop-client

a Qt-based GUI for SecureDrop journalists 📰🗞️
GNU Affero General Public License v3.0
41 stars 39 forks source link

Add drop shadows #587

Open sssoleileraaa opened 5 years ago

sssoleileraaa commented 5 years ago

Description

Add drop shadows to match Zeplin screen. These screens have all the drop shadow values you need: https://app.zeplin.io/project/5c807ea562f734bd2756b243/screen/5cca0214ece43c348461f1d1 https://app.zeplin.io/project/5c807ea562f734bd2756b243/screen/5ca2a8fdb48fa83d9e5c7f48

The message (vs reply) speech bubble does not show it in the screen with the conversation view but there is also a dropshadow at the top of the speech bubble (see https://app.zeplin.io/project/5c807ea562f734bd2756b243/screen/5cd3b87518e9f734ae0218bb).

The components that have drop shadows in Zeplin are (in rough order of priority):

Also, remove the drop shadow from all buttons. Currently the sign-in button has shadowing.

For an example of how to implement dropshadows in Qt, see: https://github.com/freedomofpress/securedrop-client/blob/master/securedrop_client/gui/widgets.py#L626-L632

sssoleileraaa commented 5 years ago

@ninavizz could you make these public screens for the hackathon plz?

eloquence commented 4 years ago

Marked as stretch for beta (changes with higher usability impact like active states take priority) but part of the polish that would be nice to get in.

sssoleileraaa commented 3 years ago

@ninavizz will re-examine the login text box shadowing, so we can start on the others first, and we agreed that the username drop-down list is not currently a priority and doesn't need to be considered in this design.

ninavizz commented 3 years ago

Otay! See Zeplin here, for new specs for the full client (not login pane) view. Have also backchanneled with Allie on Slack, to discuss—and will be pairing implement final polishes.

A: Shadow for the top barre extends from the left-most edge to the right-most edge. B: Message bubble extends 1px below top barre, and also has its own dropshadow. C1: The Source List also casts a left shadow over the Branding Barre. Not sure if this is included in the Branding Barre’s artwork, tho. C2: The last message in the Source List, also has its own shadow below it.

See Journalist and Source messages in conversation pane, for their shadows.

sssoleileraaa commented 3 years ago

@ninavizz any update on how login textboxes should look wrt shadowing?

ninavizz commented 3 years ago

@creviera I edited the top comment to put a strike-through on the textboxes dropshadows. For now, I'm ok letting them be.

I'd like to revisit the text boxes more generally, when we do #416. The Textbox I created for Find By Codename's control is quite different from that on the Login Page, because its interaction is so different—but I'd like to unify them a bit. Apologies for taking so long to reply to your ping on this issue, but let's omit the dropshadow on the Login Pane's text boxes for this issue. I'll make mention to follow-up with it on 416.