This isn't perfect, because if, e.g. the stream list is super short,
it still takes up lots of space that the user list might want to use,
but it's an acceptable first pass solution, in my view.
(imported from commit 669737d769258c089b40ffea4abee3229902e857)
This lets us clean up the HTML a little bit in preparation
for a later change which will cause the stream and people
lists to scroll independently of one another.
Also it feels a bit more fun.
(imported from commit b3b49149d7ec2960fd752fe50b41e55d363c1a98)
Hopefully the text and link-like styling will make it more clear that this
feature exists.
The sender's name is still clickable, but loses the link-like styling since the
popover isn't about the sender. The space between the sender's name and this
link is now active as well.
We also remove the sender's email address that was previously visible on hover.
It's not hard for the name + email + actions link + timestamp to be too long
for one line. The email is still present in the popover.
(imported from commit 3a85f199c42102cac0d217543db0a539935e2914)
We now set a CSS class on the hovered message, which is used to
control email address visibility.
(imported from commit 787e24f71f20aa3a6452e57b94f5ca1a4c8bc32f)
The message timestamp is now always clickable, and the popover contains the
full long-form date and time. This addresses one problem from usability
testing (see #470).
(imported from commit ad502dff128ad1c934fc0d3faaf5e2931c91c37e)
Introduced in d19991c7. //-style comments aren't supported in CSS.
This was causing update-prod-static to fail with a stack overflow.
(imported from commit 4cb11a7025e8fef32c852d691fccf18a5ad3b955)
Make sure they still stand out against the grey background.
It's less clear that we should do this for private messages as well, but it
seems fine for now.
Fixes#658.
(imported from commit 4c750208b5f2697e91c1c4fa7365d2744260c6f2)
1) Make the search hotkey (/) no longer clear the search box
2) Vertically center the "Search..." placeholder
(imported from commit 02dee6b72c4457e160f57d8604164e15e62f5f28)
This is to make the loading_indicator_text height closer to
loading_indicidator_spinner's height.
(imported from commit 062973e9c09b005601c5c943ce65dc97eeee179f)
This is really the first step of implementing the "Oppa Gmail Style!"
redesign, and is largely an HTML/CSS-based change, with some
slight JS tweaks to deal with things being renamed or being no
longer necessary.
(imported from commit e05adc283ea066f0f90009cf712c4f3657c2485a)
If you create a spinner in a hidden element and then show the
element, the spinner is placed differently than if you had created
the spinner while the element was visible. This commit makes it so
that we never create spinners while their parent is hidden.
(imported from commit a21e68976d70fcceece30ee35f5e7cf6f9490497)
This allows us to use a uniform style across all our spinners. It
also cuts down on boilerplate HTML.
(imported from commit 9879f38e0f1ca8edd40a937753811e329447262d)
So that it is, in fact, navigable via keyboard shortcut. It's not the
most beautiful way to do this; in the ideal world the layout would be
more properly responsive and could fill up the screen for you when you
have the room for it.
The issue is that the version of Bootstrap we're running doesn't
easily allow for variable-sized modals, and the hassle of showing
and hiding a div manually didn't seem worth it.
The pixel sizes are specified manually as well, in a way that
isn't particularly responsive, because of a few competing
desires:
1) For them to appear side-by-side when wide enough
2) For them to stack when not wide enough
3) The fact that they're awkwardly between a span2 and a span3,
so we can't just use the Bootstrap responsive layout stuff
Finally, the diff here is best viewed with -w. (I also swapped the
order of Narrowing and Navigation, which unfortunately clutters the
diff.)
(imported from commit 62cfa7959d48ce515562713eb48f9d9b33c8cc16)
I'd like to phase this out in favor of something you actually
see only when you don't use Tab-Enter, but that's more challenging
than I'm prepared to tackle right this second.
(imported from commit eeda53b0ed69d0e528b00ea9e7c7a20edb35df34)
Accomplished by:
- Hiding the stream/PM selector
- Eliminating the "tab to send" reminder
- Moving send and formatting links to the right
- Reducing the size of the 'subject' box
- Generally tightening up whitespace
To be fixed later in this series:
- A Tab-Enter reminder
- Completely eliminating the stream/PM selector
(imported from commit 7efe04adcbe373f99a36d3ba23b32944c17aa099)
It can easily cost an entire line, and the information is available by
clicking on the sender's name. Plus on a phone, you can't hover
anyways.
Annoyingly, this tends to put the popover partly off the window, but
there must be a way to fix that separately.
(imported from commit 19334cb067981b323e300245654c83c8e545fb2e)
Watching new users, I've seen them not notice the pointer and
mix. Give them a little more hinting about what message is selected.
(imported from commit c98e22dcef881ed7400071ec438a6e91d6cd3d9e)
I don't view this as a complete solution to
Trac #466 - Make the fact that you are narrowed more apparent,
but it's a start.
(I think a real solution would have to give you something that
helps you make the determination of "Is this view narrowed?"
when you come back to your computer, and this animation does not
help you do that.)
(imported from commit eb3646f3f3a4e25a43266e9146308633fd997eb2)
And change the color to a more thematically appropriate blue.
The shadow pointer is sort of confusing; we should really provide some
different sort of indication that your pointer is potentially moving
on narrow-and-unnarrow. (I think my fade-in-fade-out later in this
commit series is a not-bad first crack at this.)
Resolves Trac #472 - Dual pointers in narrowed view can be confusing
(imported from commit 2450517d99de85ade1c0e98c5510b59e70282451)
For whatever reason, specifying a percentage for bottom_whitespace
seems to cause issues in some browsers, including Firefox 17
and the Firefox Nightlies.
This is a bit confusing to me, since bottom_whitespace is basically
immediately resized by resizehandler initially anyway. But hey.
(imported from commit 93da101edeb6f16b01a92aed775e9117c0295086)
CSS height percentage was not working because parent div has an undefined
height, so instead it is set to 40% of the window height on resize (and initial
load) via JavaScript.
Fixes trac ticket #24.
(imported from commit 2c6a8489585c4bf70c44469ce8628264ec3fbc36)
Hopefully this will make things slightly more discoverable;
the previous solution (putting a prompt in the initial text)
was not that discoverable.
(imported from commit f6a7fce1bfd27bda412522768e981b2ffc39f474)
feedback-bot and zephyr_mirror will need to be updated and restarted
when this is deployed to prod.
(imported from commit fe2b524424c174bcb1b717a851a5d3815fda3f69)
The tabindex on this link doesn't actually do anything, because of the Safari
tab workaround. I added it anyway in case we remove that workaround later.
(imported from commit 11f31f2561907300b350c11732be88589d736f94)
This should address the catherio/tibbetts feedback of the name
breaking oddly across the middle of their name.
One notable change introduced by this commit is: If your name is very
long, e.g., "Waseemio Daherioian", it gets cut off. (On Firefox, it
gets rendered as "Waseemio Daherioia...", and on Chrome it gets no
ellipsis at all.)
The current behavior is that the long name actually overflows into
the main text area, which I think is worse.
(imported from commit 668cb30bc2326c255b229f4f19f29be473bdc1e8)
This is nearly perfect, modulo two things:
1. If you have a search active and you resize the window, the search
box resize doesn't take effect until you exit the search.
2. In super-narrow windows (<380px), the searchbox overshoots
the message area slightly.
I don't regard either as huge issues -- I'll probably fix#1
eventually.
(imported from commit 4900fb9783cc9f447315b0892bd3505f5c31ce15)
If we don't do this, we get all kinds of nasty shadowing where
references to 'search.whatever' seem to be references to the
HTML input element, rather than our search.js module.
(imported from commit 4e4b562ddf895baea9619316d9fab27ae5e9fc4e)
Personals are now just private messages between two people (which
sometimes manifests as a private message with one recipient). The
new message type on the send path is 'private'. Note that the receive
path still has 'personal' and 'huddle' message types.
(imported from commit 97a438ef5c0b3db4eb3e6db674ea38a081265dd3)
This clarifies that clicking on any of those three pieces of
information will pop up the user info tooltip.
(imported from commit 1e57550d66acbb2e8d5d244d2997bbd394c334c3)
This reverts commit 429e055d3eca65af8bc0fe58481a7becf9ced66a.
There is some inconsistency between the names 'huddle' and 'personal' that is
breaking things.
(imported from commit 4c81853fca9d88d13ce8f23e2d6884c33cdc57d2)
This reverts commit 074011dfe7dfa4d3cb331b32fc6cf465f98d095f. For
some reason this introduces some buggy behavior, and if anything I
should debug it more locally first.
(imported from commit 182193e6bb466a5668c2bb64e41712a793fa7ca2)