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>
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>
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.
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
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`.
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.
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.
`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.
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.
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>
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.
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.
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.
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.
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.
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.
This moves all the stylesheets like stats, billing etc. to another
directory called `static/styles/portico/`, matching the directory
structure of our JavaScript.