Commit Graph

344 Commits

Author SHA1 Message Date
Alexandra Ciobica 8828ef72fe portico: Add hover styling to `Atlassian migration guide` on /hello.
I changed the element to be  a `p` instead of `div` because the styling
for `a`s inside paragraphs is already there and the element should
anyway be a paragraph.

Fixes part of #12853.
2019-09-17 11:59:22 -07:00
Alexandra Ciobica 5b64a27597 portico: Add hover behavior for app icons on /hello. 2019-09-17 11:55:23 -07:00
Alexandra Ciobica b94ea6553b portico: Fix gradient on /hello. 2019-09-17 11:55:23 -07:00
Alexandra Ciobica 9bb7249c42 portico: Add hover behaviour to `Take the tour` button on /hello. 2019-09-17 11:55:23 -07:00
Anders Kaseorg 4de3bbeafa styles: Finish removing manual antialiasing configuration.
Followup from commit ddb965110f.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-08-30 14:51:52 -07:00
Anders Kaseorg abbd8a7f45 styles: Remove most vendor-prefixed CSS attributes.
Many of them are now automatically generated by autoprefixer, while
others are unnecessary based on .browserslistrc, and some were just
wrong (the linear-gradient based checkerboard pattern in lightbox has
been broken in Firefox for a while).

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-08-30 14:51:52 -07:00
Anders Kaseorg d312d04510 styles: Replace Sass with PostCSS.
It’s about as fast as node-sass (faster, according to their
benchmarks) and more flexible.  Autoprefixer is neat: we can now go
delete all our -moz-, -webkit-, etc. lines and have them autogenerated
as necessary based on .browserslistrc.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-08-29 16:35:51 -07:00
Alexandra Ciobica 96cdfd676b css: Add bottom margin to titles in the register pages. 2019-08-18 12:57:25 -07:00
Alexandra Ciobica f7e88fb2c1 css: Add color variables to integrations.scss. 2019-08-15 16:12:15 -07:00
Alexandra Ciobica 43d11285fa css: Add background to integrations categories. 2019-08-15 16:12:15 -07:00
Alexandra Ciobica da9a092d39 css: Refactor integrations to use SCSS nesting.
While refactoring, I tested all the rules and removed the CSS that was
not needed or duplicated.

I removed the `$("#integration-list-link").css('display', 'block');` and
moved it to css because there is no case in which the back link is
hidden.
2019-08-15 16:12:15 -07:00
Alexandra Ciobica 84e0327d10 integrations: Fix arrangement of left sidebar `back to list` button.
I rearranged the elements of the left sidebar in HTML in order to appear
in the order they are displayed and removed the absolute positioning,
because it was not needed if the elements are arranged correctly. I used
`flex` display to arrange them on column.

I removed the styling that positioned the elements absolutely.

Then I tweaked the margins in order to make the elements look good.

Fixes: #12929
2019-08-15 16:12:15 -07:00
Alexandra Ciobica 4c08a840d0 accounts/go: Change class of bottom text to be consistent.
I changed the class of the two bottom texts to use the same styling as
(`/new` and `/complete/github`)
2019-08-08 11:12:51 -07:00
Alexandra Ciobica 196185db03 css: Remove unused css from register page.
After removing the `bottom-text` from `new organization`, this css from
the register page is not used anymore.
2019-08-08 11:12:51 -07:00
Alexandra Ciobica eb6c5e1962 auth: Style the GitHub auth email selection page.
I added the `white-box` as it was in the other similar pages
(`/accounts/go`).

In order to be able to style it better, I removed the buttons and added
`div`s instead, then added click handler for submitting the form.

If the email is associated to a Zulip account, the avatar of the account
is displayed and the text `Log in`, otherwize a `+` sign is
displayed and the text `Create new account`.
2019-08-08 11:12:51 -07:00
Alexandra Ciobica e5e45c9a25 auth: Change page title and add description for the list.
I changed the class of the title in order to use the same styling as the
 other similar pages (like `/accounts/go` or `/login`).

Changed the related test.
2019-08-08 11:12:51 -07:00
Rishi Gupta a0ebd9276d portico: Fix bug with .warn on /integrations.
Was causing an extra 10px of margin-top on .warn.

In general styles applied to .tip and .keyboard-tip should also be applied
to .warn.
2019-08-05 17:33:05 -07:00
Alexandra Ciobica 13bdc655c9 css: Fix `ol`s on integrations.
Apparently, the 30px width we allocated to the bullets was
insufficient with the larger font size there.

Edit by tabbott: better to just increase it to 32px everywhere.
2019-07-25 15:08:07 -07:00
Alexandra Ciobica 999209020f portico: Move `code-section` rules to `markdown.scss`.
`code-section` is a feature of the markdown system, therefore the
associated CSS should be in the `markdown.scss` file. I also refactored
to use SCSS nesting.
2019-07-25 15:04:09 -07:00
Alexandra Ciobica 8fef764960 css: Make help page height selector from 500px viewport more specific. 2019-07-25 15:04:09 -07:00
Alexandra Ciobica 428a5c0d26 css: Change `font-size` of markdown text on why-zulip and integrations. 2019-07-25 15:04:09 -07:00
Alexandra Ciobica 4e29721385 css: Remove duplicated css rules.
These rules are no longer needed after the addition of `.markdown` class
 on the `why-zulip` pages.
2019-07-25 15:04:09 -07:00
Alexandra Ciobica 295cbc8535 css: Refactor `markdown.scss` to use SCSS nesting. 2019-07-25 15:04:09 -07:00
Alexandra Ciobica 7a22111601 css: Move markdown CSS into separate file. 2019-07-25 15:04:09 -07:00
Alexandra Ciobica d2466e15cb css: Remove duplicated `integrations` selectors and fix styling.
I added the `@media (max-width: 500px)` because the text from the inner
content was gong outside the white background on mobile because of the
height of the `.markdown` class for this viewport.

I moved this `.integration-instructions .help-content h3 { margin: 20px
0 ; }` from the `portico.scss` because it should be in `integrations
.scss`.

I removed the `#hubot-integrations` because I didn't find that id
anywhere.

I removed `.portico-landing.integrations ol ul` because `.markdown`
takes care of that left spacing.
2019-07-25 15:04:09 -07:00
Alexandra Ciobica 93c98e6d9a css: Remove duplicated selectors from `why-zulip`. 2019-07-25 15:04:09 -07:00
Anders Kaseorg 82828bdba4 HTML validation: Remove invalid <button href> attribute.
For .start-button, Bootstrap carousel already supports <button
data-target> as a valid alternative to <button href>.  For
.call-to-action, the margin is decreased to exactly offset the lack of
margin collapsing with display: inline-block.  There should be no
visual change.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-23 16:16:22 -07:00
Alexandra Ciobica 1c7db8eb9a css: Fix why-zulip images.
The addition of `.markdown` class added border and shadow on images,
which does not look good on the landing page.
2019-07-23 15:00:54 -07:00
Cynthia Lin e37f529e6a portico: Add and use .button class for links requiring button styling.
Buttons cannot be nested in anchor links because that is invalid HTML.
To make links look like buttons, create a .button class that inherits
styling from buttons and apply them to the necessary links.

Fixes #6126.
2019-07-22 17:28:38 -07:00
Harshit Bansal bf14a0af4d auth: Migrate google auth to python-social-auth.
This replaces the two custom Google authentication backends originally
written in 2012 with using the shared python-social-auth codebase that
we already use for the GitHub authentication backend.  These are:

* GoogleMobileOauth2Backend, the ancient code path for mobile
  authentication last used by the EOL original Zulip Android app.

* The `finish_google_oauth2` code path in zerver/views/auth.py, which
  was the webapp (and modern mobile app) Google authentication code
  path.

This change doesn't fix any known bugs; its main benefit is that we
get to remove hundreds of lines of security-sensitive semi-duplicated
code, replacing it with a widely trusted, high quality third-party
library.
2019-07-21 20:51:34 -07:00
Cynthia Lin 7bb5162fc7 portico: Refactor button selectors to use SCSS nesting. 2019-07-18 11:54:30 -07:00
Cynthia Lin 0f44608974 portico: Reorder button selectors in preparation for SCSS nesting. 2019-07-18 11:54:30 -07:00
Cynthia Lin 7c1b6aa5a8 portico: Remove style selector for superflous button.grey-transparent.
There is no element with the .grey-transparent class in the current
codebase, so it is likely legacy and thus unnecessary.
2019-07-18 11:54:30 -07:00
Rishi Gupta 8b729cc5fb portico: Add links from /features to /help.
I left out the top section ("Beautiful messaging") because the styling would
have to be different.
2019-07-10 17:39:27 -07:00
Yashashvi Dave d3e83483c8 static/js/common: Add `Ctrl` key mapping to `Cmd` for MacOS. 2019-07-08 20:07:49 -07:00
Anders Kaseorg b709eeb4d1 third: Remove zocial.
It’s unused since commit 7afbc9ddd6
(#4531).

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 15:04:58 -07:00
Shubham Padia 80a3651cf3 auth: Let user choose emails in GitHub auth.
Previously, our Github authentication backend just used the user's
primary email address associated with GitHub, which was a reasonable
default, but quite annoying for users who have several email addresses
associated with their GitHub account.

We fix this, by adding a new screen where users can select which of
their (verified) GitHub email addresses to use for authentication.

This is implemented using the "partial" feature of the
python-social-auth pipeline system.

Each email is displayed as a button. Clicking on that button chooses
the email. The email value is stored in a hidden input above the
button. The `primary_email` is displayed on top followed by
`verified_non_primary_emails`. Backend name is also passed as
`backend` to the template, which in our case is GitHub.

Fixes #9876.
2019-06-23 21:27:04 -07:00
Aman Agrawal 904422d8bc css: Convert colors from rgba to hsla format. 2019-06-20 11:34:59 -07:00
Aman Agrawal 3e589cf65e css: Convert colors from rgb to hsl format.
Note that we are not converting the stream colors.
2019-06-20 11:34:34 -07:00
Alexandra Ciobica fbfd5d577a integrations: Move the css for the integrations page into a separate file.
The integrations page had css in both `landing-page.scss` and
`portico.scss`.  With this commit, the styles are mostly unified into
a single separate file.
2019-06-12 17:42:22 -07:00
Alexandra Ciobica ab02fb81c5 css: Remove unused portico css.
This *-page-header CSS all dates from a nearly-original version of the
portico design system, and hasn't been functional in years.
2019-06-12 17:41:50 -07:00
Alexandra Ciobica 13d78e9da7 integrations: Make header of integrations/docs on mobile look good.
Change the display from `block` to `flex` in order to be able to
arrange the elements as wanted. Reset the css of the header elements
only for the description view. Add `font-size: 1.2em` because the font
doesn't need resizing in this case, it needs resizing only when the
title is in the box.

Removed the `padding-bottom` from the `nav` on mobile because it
overlaps the new header and you cannot click the back button from the
integrations.

Fixes: #12365.
2019-06-12 17:33:53 -07:00
Alexandra Ciobica 869c5ce27b integrations: Change integrations content.
We remove the title from `errbot` integration documentation so that
all documentations have the same style.  See
https://github.com/zulip/python-zulip-api/pull/515 for a similar
change to integrations where the docs live elsewhere in version control.

We also remove the `margin: 0` from the instruction tip because where
the tip is followed by a list, there is no space between the two; this
change doesn't mess up the other places where the tip is used.
2019-06-12 17:33:00 -07:00
Vaibhav 9096affe77 css: Move stylesheets not included in the app to another directory.
This moves all the stylesheets like stats, billing etc. to another
directory called `static/styles/portico/`, matching the directory
structure of our JavaScript.
2019-06-12 16:59:52 -07:00