Pretty hackish for now since this is presumably going to all
be redone with Font Awesome icons in not too long.
(imported from commit 497d6cf18d7a8d6014a20c08d66d88c324478e55)
* renamed the 'icon-star' style to 'icon-vector-star' to keep backwards compatibility for icon-* classes
* changed relevant styles in zephyr.css; added FontAwesome assets
* changed relevant CSS classes in base.html, left-sidebar.html, ui.js, message.handlebars
* added new fonts.css to start consolidating all font-based assets
* added fonts.css to PIPELINE_CSS in settings.py under 'portico' and 'app'
* modified the stars test suite to reflect new star icon class name.
(imported from commit 3116fcfd4b5fb4edecd457da554fea616bb7081b)
Previously it was centered with respect to its enclosing div, which
looked slightly off.
(imported from commit a56ca3e9f20e9b01236b58be7a279d28b97e74bc)
This was causing the spacing to be extra-spacious.
We only need the extra space at the bottom of a
--- Subscribed to stream x ---
message.
Also, add this space (and style things more nicely) with CSS --
<center> has been deprecated since HTML 4.01.
(imported from commit b5500bdf67bdcca5f4e5b2d3bbd76846b3961254)
This is a V1 of this feature. For now, the only way to expand is by narrowing
to the stream---future revisions may add a manual toggle if it is found to be
useful.
Additionally, showing per-subject unread counts will be coming in a future revision
as well.
(imported from commit fb5df0d27e928fa3b0f32b9ff2c1c508202cf7e5)
Previously it was centered with respect to its enclosing div, which
looked slightly off.
(imported from commit da64f33551b500857bb91cb3ece959aafc9b1eb0)
This should hopefully cause the page not to scroll around when we load
a giant block of emoji, because now the size of the emoji is known
before it finishes loading.
(imported from commit f566437edd725f6084c6a10c6230fd36e8d12346)
This should make their size totally known to the DOM,
which should prevent jumpiness when they load.
(imported from commit 564d920014f5bc52c217adf54c2f5bab6ba625e0)
This uses the unauthed v1 of the Twitter API, which is going to go
away soon, but it's fine as an interim measure.
(imported from commit 709a250271321f5479854a363875c9da43e6382d)
We now add the my_fullname class to the entry for you in the sidebar so
that we can automatically update this element when changing your name.
This closes trac #979.
(imported from commit f1473d6bb6f18810311d42c85d4b57aab9966498)
We also grey out the box to prevent the user from clicking twice.
This closes trac #1030.
(imported from commit eec810e3fbc5b7c9350c2d91e448fb27d4c856f8)
This simplifies a bunch of fragile resizing logic in our code,
and also addresses the Chrome Canary bug where clicking in the
searchbox causes the navbar to get huge.
This fixes Trac #764 and Trac #1039
(imported from commit fc8c3995109de384b71dfba2b986a8500ff7f08d)
Now when the font increases, so will the size of the emoji. (1.4em
seems to be 20px at our default settings, so this doesn't change the
size of the emoji for any of our existing people).
(imported from commit edb0b590f00bfbad0355a41b1f995335cf0e9e07)
It's not quite what the CUSTOMER4 person wanted, but
I think it scratches the itch.
This fixes Trac #1023
(imported from commit 9186499c8f6bacb230a2d1ed6d5ca7ffa7416ac3)
To be fully responsive, we can basically never specify the width of
our container in a fixed number of pixels; otherwise we'll run into
the situation where there's an inordinate amount of wasted space on
our left and right.
So everything needs to change from, e.g. row to row-fluid,
and that has a whole cascading series of changes that that implies.
(imported from commit 7e2771d916f429548c65c0a00fc4c11397054656)
If this is not the case, then you can't actually click the
"Press Enter to send" checkbox in the composebox (or anything
in the space occupied by where the popup will go).
This actually is not a perfect solution because that area still
remains unclickable for anything else. (In particular, for example,
scroll a message's "Info" link and then try to click on it -- you
can't! The click is captured by the #notifications-area div.)
http://www.vinylfox.com/forwarding-mouse-events-through-layers/
proposes an alternative more general way of dealing with this,
but it seems like a real pain.
This fixes Trac #1017.
(imported from commit 9cfde1cfff63ab32ae7d129980c47567e221eac3)
I kind of expect this to work, and hopefully this'll help with
people getting stuck on the "Settings" page in the tutorial.
(imported from commit 1159d884dcd331bcfb74864a0176fa293e8c3714)
This keeps the name to the right of the bullet even if it overflows
onto two lines.
Fixes#909.
(imported from commit 60528bb30c2d9e29687b773abc76c18369a8a068)
This fixes Trac #912.
My guess is that 'overflow: hidden hidden' was just being interpreted
as no setting on the overflow, which is why this was broken.
Regardless, this fix seems to work in Firefox and Chrome.
(imported from commit a08ddc5db97ee1e8a65a278c0d278e823afae65d)
(And to let you know that it's OK that you have no messages.)
This fixes Trac #850 for the case where you first log in.
(imported from commit 47741856e34f67bfc2cc91bdc21def75ab6fe09d)
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)
Waseem Daher
Leo Franchi
Jessica McKellar
Allen Rabinovich
Jeff Arnold
Zev Benjamin
Tim Abbott
Keegan McAllister
Luke Faraone
Reid Barton
Jacob Hurwitz
Tyler Hallada