Commit Graph

683 Commits

Author SHA1 Message Date
Tim Abbott 3bf5c647d9 css: Remove black background for signin logo. 2017-05-11 09:00:23 -07:00
Brock Whittaker f651c7fb18 user-profile: Add mobile-responsive styling.
This changes the styling of the user profile popup to be responsive
to mobile devices. In this case it is converted to a modal form using
flex to center it on devices with screen sizes under 768px in width.

Fixes #4669.
2017-05-10 16:49:42 -07:00
Tim Abbott c2a11655ef css: Decrease stream padding in left sidebar. 2017-05-10 09:45:40 -07:00
Tim Abbott 3d5350408b css: Fix vertical alignment of global filter counts.. 2017-05-09 19:17:33 -07:00
Tim Abbott 60a81fef43 design: Restore font color in left sidebar to #333.
This fixes a major complaint with the left sidebar styling.
2017-05-09 19:00:46 -07:00
Brock Whittaker 7dbf0c8811 Normalize left and right sidebar font size.
This normalizes the left and right sidebar font size to be 0.89rem.
2017-05-09 18:54:10 -07:00
Brock Whittaker 242eb9b346 portico-sidebar: Fix sidebar logo to be current logo.
This fixes the sidebar logo to be the current zulip logo rather
than a mockup of a potential logo that was from the redesign.
2017-05-09 18:48:33 -07:00
Brock Whittaker 3fd3ae4199 Restyle /hello/ page.
This restyles the /hello/ page to be the new portico branding.
2017-05-09 16:31:57 -07:00
derAnfaenger d63fdf5bc6 Fix Twitter bot breaking layout with long words/links.
Long words and links now get automatically broken down in the
'twitter-tweet' div; prevents a message box overflow.

Fixes #4659.
2017-05-08 09:56:35 -07:00
Brock Whittaker c8902d5d71 settings: Make settings overlay more responsive.
This doesn't completely fix settings responsiveness, but it's a big
step along the way.  Outstanding issues include:

1. When switching tabs from settings to organization, it will launch
the first item which is more annoying in this view since it brings you
into that tab. Haven’t decided on an elegant solution to this yet.

2. Sidebar scrolling doesn’t work. I have to restructure how the top
section and bottom sections of content are displayed to fix this.
Likely by enforcing min-height of 100% - bottom height on the top piece.

3. Most of it is actually reasonably responsive but some isn’t, and
should be fixed on a case-by-case.
2017-05-05 13:42:09 -07:00
Brock Whittaker 1bb260325c settings: Improve general table styling.
This generally makes the tables that have thead attributes look
uniform with the tables that use the first tbody column as a thead.
2017-05-04 16:43:34 -07:00
Tim Abbott b0bd501c0d portico: Remove now-unused hello-footer code. 2017-05-04 16:09:12 -07:00
Brock Whittaker d21e1ccc1c Unify styling on password reset flow pages. 2017-05-04 16:09:12 -07:00
Brock Whittaker 55b1d480ec Fix avatar sizing issue.
The avatars were previously their natural width, however the avatars
should always be 100% width since the height and width of the images
are known to always be equal.
2017-05-04 16:09:12 -07:00
Brock Whittaker 736701f900 Add account_send_confirm styling. 2017-05-04 16:09:12 -07:00
Brock Whittaker 48ac49385e Fix lack of uniformity with box content layout.
The various portico pages had various styling differences that made
them less consistent when responsive.
2017-05-04 16:09:12 -07:00
Brock Whittaker 89242da269 Remove .footer_padder in favor of proper screen tolerances.
This removes the .footer_padder element in favor of just having correct
min/max heights and margins on the footers.
2017-05-04 16:09:12 -07:00
Brock Whittaker 58d00af6c3 portico-pages: Fix flex height issues with content.
This fixes the existing issue where the titles of content is chopped
off when the screen height is too small.
2017-05-04 16:09:12 -07:00
derAnfaenger 37a8a43cc4 Change cursor to pointer when hovering over streams.
Before this commit, hovering over the blank area of a stream
would not reflect its "clickability". This behavior is
inconsistent with other clickable lists, such as the user sidebar.
This commit changes the cursor to a pointer when hovering over a
stream and removes annoying pointer-default-pointer changes when
hovering with the mouse over multiple users in the user sidebar.
2017-05-04 15:55:51 -07:00
Brock Whittaker ed4866b9f9 message-feed: Improve scroll perf by removing scaling on emojis.
This removes scaling from the emojis by changing the background size to
a lower value and then allowing for the widths and heights of the
emojis to be proportionally smaller.

The transform: scale property would cause many more repaints in Chrome
and other browsers than should have been necessary which would render
messages above and below the feed light grey boxes that would
momentarily flash as blank before filling with content.

Modified by tabbott to use a percentage in the background-size.

Fixes #4660.
2017-05-03 14:49:47 -07:00
Tim Abbott b20a24875a emoji: Switch to using iamcal sprite sheets for reactions and pickers.
Without changing how we render emoji in messages or changing the data
set used for emoji names, this switches us to the superior
percentage-based system for choosing which emoji from the spritesheet
to select and the iamcal sprite sheets.

It requires some small changes to CSS to ensure emoji are centered
properly in the new design.

Based on Harshit Gupta's work on "Interrelated emoji infrastructure changes".
2017-05-03 13:30:42 -07:00
Cory Lynch 5d6724345a Fix scrollbar stylining for reactions picker.
Scrollbar previously collapsed when searching for
emoji and became misaligned. Fixed in CSS.
2017-05-02 14:23:26 -07:00
Tim Abbott 07db233ffd register: Remove long-unused company-email HTML/CSS. 2017-05-01 17:18:03 -07:00
Rohitt Vashishtha 47eb19331d ux: Display error on login/registration if no auth backends are enabled.
Also makes a small tweak to CSS to ensure the styling is consistent on
the two pages.

Fixes #4525.
2017-05-01 17:17:37 -07:00
Brock Whittaker 2fafc6bec5 Change streams subscriber lists to render progressively. 2017-05-01 16:56:54 -07:00
Brock Whittaker 4e980ad545 Change <thead> styling in settings containers.
Tables were previously improperly using the <tbody> to show the headers
so it was not obvious that the styling for <thead> did not represent
the styling of the rest of the tables anymore, so this normalizes
the styling to be consistent with how it looked when the first row
was in the <tbody>.
2017-05-01 16:56:54 -07:00
Brock Whittaker 3ff55034fe admin: Restyle administration checkboxes to match new style.
This restyles the administration checkboxes to look similar to those
that are currently present in the settings section.
2017-05-01 16:01:36 -07:00
Jack Zhang df817f12f4 emoji: Rename reaction-popover to emoji-popover.
The name emoji-popover should now be more appropiate, as there's no more
need to distinguish between reacting to messages and composing messages.
2017-04-30 15:15:33 -07:00
Jack Zhang a9505654da emoji: Replace the old compose emoji picker with the reactions picker.
This removes the old compose emoji picker in its entirety, changing
the few callbacks needed to launch the reactions-style emoji picker
instead and hook it up properly.

Callbacks for reactions and composing messages are distinguished by
selecting for, respectively, the .reaction and .composition classes.

Fixes #4122.
2017-04-30 15:14:42 -07:00
Cory Lynch e972453a73 message edit: Remove Topic and Content labels.
Removed the components from the template and
cleaned up the relevant css.

Fixes #4562
2017-04-28 20:57:06 -07:00
Rishi Gupta cf90fed418 stats: Remove users_today from Active Users.
It's technically the number of users yesterday. Also, "number of active
users today" suggests something like daily actives today, whereas this graph
currently shows 2-week actives.
2017-04-28 16:15:07 -07:00
Tim Abbott 6c9daf7c3b alerts: Clean up network error messages a bit. 2017-04-28 12:58:30 -07:00
Brock Whittaker c7cb20d873 alerts: Polish .alert-box .alert styling.
This polishes the styling on the alerts inside of the .alert-box to
have more appropriate colors, margins, and padding.
2017-04-28 12:50:04 -07:00
Cory Lynch 81a575e4d5 Add cleanup for resize listeners on message editing.
I changed the watch_manual_resize function to return the listener
functions it creates, and then these are used to remove the event
listeners before the edit box is hidden.
2017-04-28 12:15:34 -07:00
Cory Lynch f9d1bff167 Fix textarea resize for editing messages.
Reusing code from the main compose_message component so that resizing now
behaves correctly. This means that when the user tries to resize vertically,
the autoresize code is disabled, and the textbox reverts to manual resizing.
Fixes #4573
2017-04-28 12:15:34 -07:00
Brock Whittaker dcc2b3a900 left-sidebar: Restructure <a> to cover the <li>.
This restructures the <a> tag to be clickable essentially anywhere
within the <li> tags, unlike before where due to it being “inline”, you
had to hover over the text in particular.
2017-04-28 09:56:15 -07:00
Brock Whittaker e7ac6710e9 Resize <li> text and align icons.
This resizes the text of the line items to be 5% larger and aligns
the #global_filters icons to be centered vertically.
2017-04-28 09:56:15 -07:00
Brock Whittaker 7afbc9ddd6 Redesign login and registration pages.
This completes a major redesign of the Zulip login and registration
pages, making them look much more slick and modern.

Major features include:
* Display of the realm name, description and icon on the login page
  and registration pages in the subdomains case.
* Much slicker looking buttons and input fields.
* A new overall style for the exterior of these portico pages.
2017-04-26 18:04:05 -07:00
Brock Whittaker 6e512dddcb left-sidebar: Make <li> height and icon size consistent.
This makes the height of the list-items all 24px and changes
the home icon to be a slightly larger 16px instead of 14px which
looked visually smaller than the other icons.
2017-04-26 17:13:03 -07:00
Tim Abbott b43385ec34 Shrink max display width of topics.
This fixes an issue with topic names overlapping in the left sidebar.
While we're doing that, it makes sense to shrink the maximum size of
the topic input box, to discourage sending with topics that will be
cut off.
2017-04-25 17:51:47 -07:00
Brock Whittaker 3d64d190c1 Change right sidebar unread counts to be rounded.
This changes the right sidebar unread count styling to match the left
sidebar styling — in that they all now should have a 4px border radius
on the edges of the unread count blocks.
2017-04-25 17:47:36 -07:00
Brock Whittaker c506a92d05 left-sidebar: Restyle to have new look.
This restyles the color swatches to either be locks or hashes,
and changes the notifications to be rounded rather than squared.
2017-04-25 17:47:36 -07:00
digi0ps 8fb9d2bff3 settings: Redesign settings/administration panel buttons.
This redesigns all the ugly bold-colored buttons in the settings and
administration pages.
2017-04-25 16:33:59 -07:00
digi0ps 1cc9cb969b sidebar: Make topic name width consistent. 2017-04-25 11:58:33 -07:00
digi0ps eb852ef19e sidebar: Move chevron in the stream list further from the scrollbar.
Previously, the chevrons were too close to the scrollbar. This commit
fixes that by moving it farther from the scrollbar.
2017-04-25 11:58:33 -07:00
Harshit Bansal 6cb03ea78e frontend: Add UI necessary to change emoji set.
Note that this code is disabled until the infrastructure for the
feature can be finished.

Tweaked by tabbott to use slightly cleaner names for the various sets.
2017-04-24 22:31:30 -07:00
Tim Abbott b3c8562bd9 css: Remove use of under-specified 'thin' borders.
This was causing buggy behavior in our emoji reactions when zoomed to
200%.
2017-04-20 15:07:26 -07:00
Tim Abbott f3c36147d9 /me: Fix alignment of name with non-/me messages. 2017-04-20 14:58:22 -07:00
Brock Whittaker 323ff6edca /me: Fix presentation and markup for /me statuses.
This fixes the /me elements to be display inline-block and inline
rather than display block with top and left properties.

This also fixes an unrelated issue with emoji reactions not being
able to be clicked on with /me messages.

Fixes: #4218.
2017-04-20 14:36:17 -07:00
Brock Whittaker 3041480600 message-edit: Fade in message on update.
When a message update comes back from the server and replaces an
old message, it should fade in. There are two components to the fade:

1. The message fades in from opacity: 0 =>  1.
2. The "edited" text will transform from X: -10 => X: 0.
2017-04-19 22:14:58 -07:00