Commit Graph

239 Commits

Author SHA1 Message Date
majordwarf e2ef46d0fb css: Use SCSS nesting in settings.scss for `.table`. 2020-05-20 11:31:34 -07:00
majordwarf 83f68f6710 css: Reorder settings.scss to put `.table` next to each other. 2020-05-20 11:31:34 -07:00
majordwarf f324298be2 css: Use SCSS nesting in settings.scss for `.admin-realm-form`. 2020-05-20 11:31:34 -07:00
majordwarf 3b5c7a27f4 css: Reorder settings.scss to put `.admin-realm-form` alongside. 2020-05-20 11:31:34 -07:00
majordwarf ec709a715b css: Use SCSS nesting in settings.scss for emoji's `input[type=text]`. 2020-05-20 11:31:34 -07:00
majordwarf fbed5b3853 css: Merge `#emoji-file-name` ruleset in settings.scss. 2020-05-20 11:31:34 -07:00
majordwarf 2ee5b282d6 css: Use SCSS nesting in settings.scss for `button`. 2020-05-20 11:31:34 -07:00
majordwarf f4e8086fbd css: Use SCSS nesting for `.control-label`. 2020-05-20 11:31:34 -07:00
majordwarf 0b709f770b css: Use SCSS nesting for `.edit-alert-word-buttons`. 2020-05-20 11:31:34 -07:00
majordwarf 0aabd97900 css: Use SCSS nesting in settings.scss for `.modal`. 2020-05-20 11:31:34 -07:00
majordwarf 16e069a735 css: Reorder settings.scss to put `.modal` next to each other. 2020-05-20 11:31:34 -07:00
majordwarf c47b21a1a7 css: Use SCSS nesting in settings.scss for `#settings_page`. 2020-05-20 11:31:34 -07:00
majordwarf ca5da9c8f4 css: Reorder settings.scss to put `#settings_page` next to each other. 2020-05-20 11:30:12 -07:00
majordwarf e4187f3abb css: Use SCSS nesting in settings.scss for `#api_key_buttons`. 2020-05-20 11:25:36 -07:00
majordwarf 2f2e3f4879 css: Use SCSS nesting in settings.scss for `.emojiset_choices`. 2020-05-20 11:25:36 -07:00
majordwarf 468efcf319 css: Use SCSS nesting in settings.scss for `#alert_words_list`. 2020-05-20 11:25:36 -07:00
majordwarf d857437319 css: Reorder settings.scss to put `#alert_word_list` next to each other. 2020-05-20 11:25:36 -07:00
majordwarf 9008fbfc05 css: Use SCSS nesting in settings.scss for `.edit_bot_form`. 2020-05-20 11:25:36 -07:00
majordwarf b85f587eac css: Use SCSS nesting in settings.scss for `.bots_list`. 2020-05-20 11:25:36 -07:00
majordwarf ad623a3bc3 css: Reorder settings.scss to put `.bot_list` next to each other. 2020-05-20 11:25:36 -07:00
majordwarf e544fd1994 css: Use SCSS nesting in settings.scss for `.control-label-disabled`. 2020-05-20 11:25:36 -07:00
majordwarf 990358abc5 css: Use SCSS nesting in settings.scss for `#account-settings`. 2020-05-20 11:25:35 -07:00
majordwarf 71415e5b89 css: Use SCSS nesting in settings.scss for `#settings_page`. 2020-05-20 11:25:35 -07:00
majordwarf aff0129a6a css: Reorder settings.scss to put `#settings_page` next to each other. 2020-05-20 11:25:35 -07:00
Rohitt Vashishtha 4d14ba41ba dropdown-list-widget: Properly handle disabled state.
We wrap the [reset] anchor tag in a button so that we can set 'disabled'
attribute on it. We change the styles to hide the [reset] button and the
pencil icon when the widget is disabled.

We also need to call `e.preventDefault()` in the event handler since now
the anchor tag behaves as a button.
2020-05-20 09:51:38 -07:00
Rohitt Vashishtha da22f3b961 dropdown-list-widget: Refactor styles to use SCSS scopes. 2020-05-19 15:13:28 -07:00
majordwarf 587b5473c2 css: Use SCSS nesting in settings.scss for `input`. 2020-05-12 23:17:27 -07:00
majordwarf cd2cf1a1aa css: Reorder settings.scss for `input` and remove unused rulesets. 2020-05-12 23:17:27 -07:00
majordwarf 298d2c5a17 css: Use SCSS nesting in settings.scss for `.input-group`. 2020-05-12 23:17:27 -07:00
majordwarf 03a95cfe49 css: Use SCSS nesting in settings.scss for `.dynamic-input`. 2020-05-12 23:17:27 -07:00
majordwarf 1384050683 css: Use SCSS nesting for child elements of `.dynamic-input`. 2020-05-12 23:17:27 -07:00
majordwarf 5af7665b3c css: Reorder `.dynamic-input` to put next to each other. 2020-05-12 23:17:27 -07:00
majordwarf 6371f0109c Use: SCSS nesting in settings.scss for `.table` in `#admin-user-list`. 2020-05-12 23:17:27 -07:00
majordwarf 70ef0e9232 css: Use SCSS nesting in settings.scss for `.settings-info-icon`. 2020-05-12 23:17:27 -07:00
majordwarf 796d3c2e7f css: Use SCSS nesting in settings.scss for `#settings_content`. 2020-05-12 23:17:27 -07:00
majordwarf 806269fc40 css: Reorder `#settings_content` to put next to each other. 2020-05-12 23:17:27 -07:00
majordwarf f6b3aa4e8b css: Use SCSS nesting for avatar, logo and icon selectors. 2020-05-12 23:17:27 -07:00
majordwarf 8543750d43 css: Reorder avatar, logo and icon selection next to each other. 2020-05-12 23:17:27 -07:00
majordwarf cc21c45c7a css: Refactor `.inline-block` in settings.scss. 2020-05-12 23:17:27 -07:00
majordwarf 02516c6f69 css: Use SCSS nesting in settings.scss for `.user-avatar-selection`. 2020-05-12 23:17:27 -07:00
majordwarf 895945b165 css: Reorder `.user-avatar-selection` to put next to each other. 2020-05-12 23:17:27 -07:00
majordwarf aed2450cc0 css: Use SCSS nesting in settings.scss for `label`. 2020-05-12 23:17:27 -07:00
majordwarf bc6baa9f2b css: Reorder `label` next to put next to each other. 2020-05-12 23:17:27 -07:00
Steve Howell d5cadbcec2 user settings: Separate code for bot form.
When editing a bot, there are only two fields
that are similar to humans--full name and
email--which are trivial.

Before this commit we used a single codepath
to build the human form and the bot form.

Now we have two simple codepaths.

The tricky nature of the code had already led
to ugly things for the bot codepath that
fortunately weren't user facing, but which
were distracting:

    - For bots we would needlessly set things
      like is_admin, is_guest in the template
      data.

    - For bots we would needlessly try to update
      custom profile fields.

The code that differs between bots and humans
is nontrivial, and the code was both hard to read
and hard to improve:

    - Humans don't have bot owners.

    - Bots don't have custom profile fields.

The bot-owner code is nontrivial for performance
reasons.  In a big realm there are tens of thousands
of potential bot owners.  We avoid the most egregious
performance problems (i.e we don't have multiple
copies of the dropdown), but we may still want
to refine that (at least adding a spinner).

The custom-profile-fields code is nontrivial due
to the dynamic nature of custom profile fields,
which can bring in specialized widgets like
pill fields.

Now each form corresponds to a single endpoint:

    * human -> /json/users
    * bot -> /json/bots

Before we had a lot of conditional logic in
the template, the code to build to views, and
the code to submit the data.  Now everything is
much flatter.

The human code is still a bit messy (more work
coming on that), but the bot code is fairly
pristine.  All three components of the bot code
fit on a page, and there are no conditionals:

    - admin_bot_form.hbs
    - open_bot_form
    - handle_bot_form

We may want to grow out the bot code a bit
to allow admins to do more things, such as
adding services, and this will be easier now.
It would also be easier for us now to share
widgets with the per-user bot settings.

Note that the form for editing human data will
continue to be invoked from two panels:

    - Users
    - Deactivated users

There are some minor differences between
users and deactivated users, but the shape of
the data is the same for both, so that's still
all one codepath.

We eliminate `reset_edit_user` here, since
it was never used.

One nice thing about these forms was that they
had very little custom CSS attached to them
(at form-level specificity), and it turned out
all the custom CSS was for the human-specific
form.
2020-05-09 10:22:37 -07:00
vaibhavrajsingh2001 a3d51ae9af regression: Add minimum height to custom user field textbox.
Also, if the width of the texbox increased too much, the avatar icon
would move below. Fixed by setting max-width that matches the width of
the other textboxes.

Fixes: #14826
2020-05-01 11:00:56 -07:00
Pranav 43b0acdae8 settings: Use & selector reference to correctly style alerts.
The alert-error class styling was not being applied to alert-notifications
because of incorrect styling. The alert-notifications and the
alert-error classes were applied to the same element, whereas the CSS
expected the alert-error class to be applied to children of the class
with alert-notifications. Fixed this by using the parent-selector
reference '&' to correctly select the styling.
2020-04-30 16:13:49 -07:00
vaibhavrajsingh2001 bde965aed0 user settings: Correct overflow behaviour of custom user field.
Fixes: #14816
2020-04-30 12:54:20 -07:00
Jagan 805ac2475b settings: Redesign edit bot form.
This removes the weird edit-bot sidebar, replacing it with a modal,
matching our edit-user widget (and various similar ones).

Fixes #13644 by removing the buggy code.
2020-04-28 23:08:45 -07:00
Rohitt Vashishtha 5098944afc settings: Consolidate CSS of all dropdown widgets. 2020-04-22 17:57:16 -07:00
jagansivam28 0de77cabb0 settings UI: Add brighness on hover effect for "X" icon in upload avatar.
Increase brightness on hover effect for "X" icon in upload
avatar area is added and change the text to "delete profile picture"
while hovering over "X" icon in the avatar upload area.
2020-04-21 13:27:55 -07:00
Jagan e5d6e2e44f settings UI: Fix hovering bug in "Uploaded files" settings.
While Hovering over some cell of the tables in settings Tab
increase the cell width since we are using the pseudo-Element `:: after`
the bug is fixed by adding `position: absolute;`.
fixes #14559
2020-04-17 11:35:31 -07:00
Abhishek-Balaji b40bd56f3e alert settings: Change style of alert words list.
Narrowing the list of words by reducing margin and padding.
Also reducing the width to 50% of the previous value.
2020-04-15 17:56:14 -07:00
Abhishek-Balaji 52e0063deb alert settings: Move alert word form on top and sort alert words.
The form for entering alert words has been moved above the list
of words.
The list of words will be presented alphabetically rather than
time of addition.
2020-04-15 17:56:14 -07:00
Jagan 8ae34eaa12 settings UI: Make the settings avatar delete/edit UI slicker.
Added UI support for uploding the new profile picture by
clicking on the avatar rather than a button.
Added new spinner for loading indication while uploading
a new avatar over the avatar area.
Fixes #10255
2020-04-15 15:15:57 -07:00
Rohitt Vashishtha f9caf522f0 markdown: Allow setting a default language for code blocks.
This adds a new realm setting: default_code_block_language.

This PR also adds a new widget to specify a language, which
behaves somewhat differently from other widgets of the same
kind; instead of exposing methods to the whole module, we
just create a single IIFE that handles all the interactions
with the DOM for the widget.

We also move the code for remapping languages to format_code
function since we want to preserve the original language to
decide if we override it using default_code_clock_language.

Fixes #14404.
2020-04-09 16:02:02 -07:00
Tim Abbott e84d5ae2a5 settings: Improve styling of emoji in admin table.
This styles the emoji in the administrator table to look exactly how
they'll look in a real message, aside from being a bit bigger.
2020-04-08 14:43:20 -07:00
Yash Rathore d6fddad440
settings: Use % width for checkbox labels in small narrows. (#14448)
This fixes the responsive design for most of our settings pages.

Fixes #14426.
2020-04-03 11:40:02 -07:00
Ryan Rehman 412eb6f1cb css: Refactor `.alert-notification`.
Since each element containing the `.alert-notification`
class has a predefined area that wont overlap with any
other element, we make changes to the CSS so that it
just stays hidden until the text appears.
2020-04-01 14:40:41 -07:00
Ryan Rehman 95c97e4a46 css: Use SCSS nesting for `.alert-notification`.
We also remove the `#settings_page` container as there
are plans to reuse the above class in the stream edit
page as well.
2020-04-01 14:40:41 -07:00
Ryan Rehman 9cb2475b53 notification_settings: Display streams that differ.
The user has an option for setting global
notification settings as well as the same settings
for individual streams. Currently the user has to
keep track of each unmatched stream and then visit
each individual stream whose settings he wants to
update.

Thus this adds a dedicated UI table allowing the user
to view and update the notifications of the specific
streams which differs from the global settings.
It is located on the same page where the user defined
global notification settings can be modified.

Fixes #9228.
2020-03-31 15:57:47 -07:00
Pragati Agrawal dd13136371 settings: Migrate notification checkboxes to table format.
Here we have migrated checkboxes of all general notifications to the table.
By general notifications we mean, Mobile, Email, Desktop audio, and visual
notifications.

This is a part of a bigger migration to simply our notifications setting
changing infrastructure for all streams and individual streams. Later we
will add more row to this for different categories of notifications in
addition to the current ones ("Streams" and "PMs, mentions, alerts").

Fixes: #12182.
2020-03-25 17:45:59 -07:00
Divyanshu Agrawal c0e19ed905 settings page: Change cursor for date input to 'pointer'.
Currently, the cursor for the date input field in the settings page
is 'not-allowed' as it has the disabled attribute because we want
users to pick the date from the date picker. But this leads to
confusion whether the field is editable at all.

Change the cursor to 'pointer' to make it clear that the field has
a click action associated with it.
2020-03-05 11:10:42 -08:00
Ryan Rehman 5d7669e57e stream settings: Add links to /help/ for stream type settings. 2020-02-18 10:53:46 -08:00
Anders Kaseorg 27fac76da8 styles: Move media queries into the files they override.
Webpack code splitting will make the inclusion order of CSS files less
obvious, and we need to guarantee that these rules follow the rules
they override.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-28 15:39:17 -07:00
YashRE42 5329d24849 settings page: Align permission "Discard" option.
In 50545a3 we made an incomplete revert of some style changes from
7b8da9b, this commit reverts the "x" to "fa fa-times" and also fixes an
alignment issue for the "Discard" box in chrome.
Fixes #13233.
2019-10-07 11:58:24 -07:00
YashRE42 7d46da0fce acount_settings: Fix position of avatar source.
The avatar source was misspositioned when avatar changes were disabled.
This also repositions the "X" for when avatar changes are allowed.
Fixes #12524.
2019-09-30 11:10:56 -07:00
YashRE42 10fd5db190 account-settings: Lighten user avatar source. 2019-09-30 11:10:56 -07:00
Tim Abbott 8b5df88596 css: Make label CSS usable outside settings model.
We intend to use it in the "manage streams" modal as well.
2019-09-05 11:48:32 -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
Yashashvi Dave 166d4ce630 custom fields: Change field alert notifications style in user settings. 2019-08-25 20:57:27 -07:00
Thomas Ip d86299309a org settings: Reduce the width occupied by the actions column in tables. 2019-08-22 13:13:24 -07:00
Thomas Ip 808641a603 css: Tweak sortable list styling to make sortable columns more obvious. 2019-08-21 16:50:22 -07:00
Thomas Ip e309168d11 org settings: Make linkifiers table sortable. 2019-08-21 16:50:22 -07:00
Pragati Agrawal c29b197ec7 org settings: Replace usage of ids with classes for upload button. 2019-08-21 15:49:25 -07:00
Pragati Agrawal a6cd0b8788 org settings: Use `realm-logo-img` class as identifier of realm logo image.
This replaces previously being used ids, `realm-settings-logo` and
`realm-settings-night-logo` with a common class `realm-logo-img`.
2019-08-21 15:49:25 -07:00
Pragati Agrawal eedcdf7f3b settings/styles: Reorder `.settings-section .table-striped` to same place. 2019-08-18 12:44:40 -07:00
Pragati Agrawal 78d6ecfa08 settings/styles: Use `.settings-section` for settings `.table-striped`.
We have used `.settings-section .table-striped` for other rules to refer the same elements
which are referred by `#settings_page .table-striped`.
2019-08-18 12:44:40 -07:00
Pragati Agrawal aac9a7a4b1 settings/styles: Remove redundant rules for `.table-striped thead th`.
This rule is already specified at
 `.settings-section .table-striped thead th`.
2019-08-18 12:44:40 -07:00
Pragati Agrawal a858d51a85 settings/styles: Nest all `.settings-section` rules. 2019-08-18 12:44:40 -07:00
Pragati Agrawal 9acd8caa59 settings/styles: Remove redundant specificity. 2019-08-18 12:44:40 -07:00
Pragati Agrawal 2c846774c0 settings/styles: Reorder styles in more sensible order.
Rather just putting rules in any order it makes more sense to have an order
of basic to more advanced/specific CSS.
2019-08-18 12:44:40 -07:00
Pragati Agrawal 94d867cd11 settings/scss: Reorder `.settings-section` to have them in same place. 2019-08-18 12:44:40 -07:00
Pragati Agrawal b0b1435a18 settings/scss: Remove now redundant `settings-wrapper` class.
No class like this is rendered to page.
2019-08-18 12:44:40 -07:00
Pragati Agrawal 378c1a5994 settings/scss: Reorder to have `.settings-section-title` at same place. 2019-08-18 12:44:40 -07:00
Pragati Agrawal 13d5a21430 settings/scss: Nest many rules inside `#user-groups`. 2019-08-16 10:47:33 -07:00
Pragati Agrawal 44d6123c26 settings/scss: Nest `.user-group` inside `#user-groups`. 2019-08-16 10:46:12 -07:00
Pragati Agrawal df31238fb7 settings/scss: Make `#user-groups .user-group` rules at same place. 2019-08-16 10:46:12 -07:00
Thomas Ip cbae51db63 settings: Move API key form into its own modal.
The modal is rendered dynamically to avoid password managers
inserting passwords into the input field too aggressively.

Fixes #12523.
2019-08-14 10:50:45 -07:00
Wyatt Hoodes f623540409 data export: Add UI to trigger data export.
This commit serves as the frontend piece for the "public export"
webapp feature.

Fixes: #11930
2019-08-12 18:21:38 -07:00
Yashashvi Dave 440975e369 org settings: Fix background color in custom user profile datepicker field.
Fixes part of #11453
2019-07-29 15:06:35 -07:00
Yashashvi Dave e55afc2629 user settings: Update alert message element in change-full-name modal. 2019-07-25 13:33:44 -07:00
Yashashvi Dave e1dacb99df user settings: Update alert message element in change-email modal. 2019-07-25 13:33:44 -07:00
Yashashvi Dave b3b480709d user settings: Update alert-msg-elem in change password modal. 2019-07-25 13:33:44 -07:00
Yashashvi Dave 5506b16fa8 user settings: Add separate alert-save widget for profile custom fields.
Fixes part of #12748
2019-07-25 13:33:44 -07:00
Rishi Gupta 7d8d0b2284 settings: Update upgrade text and styling.
When we add Plus, the first sentence should change to "Available on Zulip
Standard and Plus".

I copied the styling of .tip out of expediency, but it's also possible that
long term we'll want only 1 tip-like box styling.

The hover styling is a bit random, but I tried to copy other hover styles I
found in settings.scss.

Note that this renames .upgrade_realm_plan_type_suggestion to .upgrade-tip.
2019-07-21 14:32:36 -07:00
YashRE42 7867830e14 settings: Adjust styling of ? icons. 2019-07-17 17:47:08 -07:00
Cynthia Lin 94bbc32a92 user settings: Improve visibility of delete profile picture icon in light mode. 2019-07-15 13:49:00 -07:00
Cynthia Lin ec4c996361 user settings: Darken area outside of non-square profile avatars on hover. 2019-07-15 13:49:00 -07:00
David Wood 9bace3f2cd notifications: Allow only notifiable in unread count.
This commit adds a new setting to the user's notification settings that
will change the behaviour of the unread count in the title bar and
desktop application.

When enabled, the title bar will show the count of unread private messages
and mentions. When disabled, the title bar will act as before, showing
the total number of unread messages.

Fixes #1736.
2019-07-13 15:49:04 -07:00