Commit Graph

51 Commits

Author SHA1 Message Date
Kris
98afea4748
UX: adjust sidebar modal styles, consolidate css (#22444)
This gets all the related CSS into the common file, and removes desktop and mobile variants.

This also makes some general styling adjustments.
2023-07-07 06:54:47 +08:00
Alan Guo Xiang Tan
82d6420e31
PERF: Paginate loading of tags in edit nav menu tags modal (#22380)
What is the problem?

Before this change, we were relying on the  `/tags` endpoint which 
returned all the tags that are visible to a give user on the site leading to potential performance problems. 
The attribute keys of the response also changes based on the `tags_listed_by_group` site setting. 

What is the fix?

This commit fixes the problems listed above by creating a dedicate `#list` action in the
`TagsController` to handle the listing of the tags in the edit
navigation menu tags modal. This is because the `TagsController#index`
action was created specifically for the `/tags` route and the response
body does not really map well to what we need. The `TagsController#list`
action added here is also much safer since the response is paginated and
we avoid loading a whole bunch of tags upfront.
2023-07-04 11:36:39 +08:00
Alan Guo Xiang Tan
fe294ab1a7
DEV: Switch edit nav menu tags/categories modal to component (#22401)
Why this change?

A new component based API for modals was introduced in
b3a23bd9d6. This commit moves the edit
navigation menu tags and categories modal to the new API.
2023-07-04 09:45:21 +08:00
Alan Guo Xiang Tan
75b402f07c
UX: Fix position of filters in edit categories/tags nav menu modals (#22292)
Why this change?

We want the position of the filters to remain fixed when scrolling
through the list of categories or tags. Otherwise, the user has to
scroll all the way back to othe top in order to access the filters when
the list of categories or tags is large.
2023-06-27 12:52:42 +08:00
Alan Guo Xiang Tan
303fcf303c
FEATURE: Add dropdown to filter by selected in edit nav menu modal (#22251)
What does this change do?

This change adds a dropdown filter that allows a user to filter by
selected or unselected categories/tags in the edit navigation menu
modal.

For the categories modal, parent categories that do not match the
dropdown filter will be displayed as disabled since those parent
categories need to be displayed to maintain the hieracy of the child
child categories.
2023-06-23 10:29:00 +08:00
Alan Guo Xiang Tan
6e3f3dff86
DEV: Refactor edit tags/categories modal to reduce duplication (#22240)
Why this change?

There was alot of duplication between the edit navigation menu tags/categories modal which
was making it hard to introduce new changes as the work had to be
duplicated into multiple places.

This commit mainly extracts the duplicated code into common components
such that it is easier to make styling changes across both modals.
2023-06-23 08:28:55 +08:00
Alan Guo Xiang Tan
609562be3e
FEATURE: Add input filter for editing tags in navigation menu modal (#22216)
What does this change do?

This commit adds an input filter to filter through the tag checkboxes in the
modal to edit tags that are shown in the user's navigation menu. The
filtering is a simple matching of the given filter term against the
names of the tags.
2023-06-21 10:59:56 +08:00
Alan Guo Xiang Tan
08d8bd9f43
FEATURE: Add modal for editing tags in navigation menu (#22214)
What does this change do?

This change is a first pass for adding a modal used to edit tags that appears in
the navigation menu. As the feature is being worked on in phases, it is
currently hidden behind the `new_edit_sidebar_categories_tags_interface_groups` site setting.

The following features will be worked on in future commits:

1. Input filter to filter through the tgas
2. Button to reset tag selection to default navigation menu tags site
   settings
3. Button to deselect all current selection
2023-06-21 09:09:56 +08:00
Alan Guo Xiang Tan
853bce2abc
UX: Allow users to filter categories in edit sidebar categories modal (#21996)
What does this change do?

This change is a continuation of
2191b879c6 and adds an input filter to the
edit sidebar categories modal which the user can use to filter through
the list of categories by the category's name.

Note that if a child category is being shown, all of its ancestors will
be shown even if the names of the ancestors do not match the given
filter. This is to ensure that we continue to display the hierarchy of a
child category even if the parent category does not match the filter.
2023-06-08 12:54:51 +08:00
Kris
1d9f195207
UX: adjust various avatars due to size changes (#21890) 2023-06-01 11:17:44 -04:00
Joffrey JAFFEUX
73488f2f33
FIX: uses popper for cards 2023-01-30 21:12:30 +01:00
Natalie Tay
fda834d01c
Revert "DEV: uses popperjs for positioning user and group card (#20063)" (#20072)
This reverts commit 335c3f4621.
2023-01-31 02:51:05 +08:00
Joffrey JAFFEUX
335c3f4621
DEV: uses popperjs for positioning user and group card (#20063)
Behavior should be very similar but the code is simplified and it should fix various bugs where the card was showing out of screen even if we had available space.
2023-01-30 14:15:10 +01:00
Jarek Radosz
4170b9bb58
DEV: Use more css vars (#18561)
Followup to #18518

This time it's mostly line-height vars and a couple of other uncommon vars.
2022-10-12 16:05:42 +02:00
Jarek Radosz
ea326906e3
DEV: Use css var font sizes (#18518)
For consistency and and the ability to change all font sizes at once in the dev tools
2022-10-12 15:31:59 +02:00
Jordan Vidrine
2b974d4992
DEV: Add additional outlet to user-card next to message button (#16300) 2022-03-28 11:56:43 -05:00
Penar Musaraj
593f3e5dd8
UX: Styling changes to global banner (#16191) 2022-03-15 16:19:55 +01:00
Jarek Radosz
ceed48f321
UX: Make banner full-width (#15038) 2021-11-22 19:43:45 +01:00
Bianca Nenciu
ee87d8c93b
FEATURE: Make max number of favorite configurable (#13480)
It used to be hardcoded to 2 and now it uses max_favorite_badges site
setting. When zero, it disables favorite badges.
2021-06-22 18:58:03 +03:00
Kris
5e97946f9f
UX: improve user card control layout for long text (#12770) 2021-04-20 18:34:33 -04:00
Kris
fcf674f106
UX: Prevent badges on usercards from overflowing (#12037) 2021-02-11 13:41:58 -05:00
Penar Musaraj
303f229e98
DEV: Use indexes when importing SCSS from a folder (#11591)
By default, SCSS does not support globbing. This removes our magic and uses index files to import all files in a folder.
2020-12-30 15:29:10 -05:00
David Taylor
ac80109705
DEV: Improve user card styling extensibility (#10508)
- Add a metadata-row class
- Remove wrapper tags from user-card-after-metadata and user-card-before-badges outlets
- Correct max-height for mobile card
2020-08-24 11:02:40 +01:00
Penar Musaraj
c937afc75e
FEATURE: automatic dark mode (#10341)
A first step to adding automatic dark mode color scheme switching. Adds a new SCSS file at `color_definitions.scss` that serves to output all SCSS color variables as CSS custom properties. And replaces all SCSS color variables with the new CSS custom properties throughout the stylesheets. 

This is an alpha feature at this point, can only be enabled via console using the `default_dark_mode_color_scheme_id` site setting.
2020-08-03 22:57:10 -04:00
Penar Musaraj
25dcc577ae
DEV: More color transformation refactoring 2020-07-29 12:01:12 -04:00
Kris
490939a1c9 UX: Truncate long badge names in the mobile usercard 2020-07-01 21:39:40 -04:00
Kris
d0a7f15764 Usercard buttons on mobile should utilize full width 2020-06-12 16:24:25 -04:00
Joffrey JAFFEUX
5d792483f0
UI: various select-kit dropdown tweaks/cleaning (#9922) 2020-05-29 11:11:28 +02:00
Joffrey JAFFEUX
4be45bec7e
UI: homogenise topic-footer-mobile-dropdown styles (#9919) 2020-05-29 08:34:19 +02:00
Joffrey JAFFEUX
31d1468922
UX: reworks various menus to homogenize them (#9905)
- bookmark modal menu
- topic-footer-mobile-dropdown
- post-admin-menu
- topic-admin-menu
- quick-access menus
- toolbar-popup-menu
2020-05-29 08:05:21 +02:00
Joffrey JAFFEUX
bd0abddf6f
UX: attempts to have a better use of available space with sk (#9639) 2020-05-05 12:59:47 +02:00
Kris
f9a44488e9 UX: Right align notification item time, adjust mobile space, consolodate 2020-04-27 23:19:15 -04:00
Kris
cd5b7109d0 UX: Cap height of user fields on mobile user-cards, add line-clamp mixin 2020-02-14 16:19:11 -05:00
David Taylor
8d50f092b5
DEV: Use classes for styling user and group cards (#8913)
Styling based on element-ids, it is impossible for themes/plugins to display multiple cards on a single page. Using classes is a more flexible approach. The element-ids are maintained for backwards compatibility with existing plugins/themes.
2020-02-13 09:58:17 +00:00
Joffrey JAFFEUX
0431942f3d
DEV: select-kit 2 (#7998)
This new iteration of select-kit focuses on following best principales and disallowing mutations inside select-kit components. A best effort has been made to avoid breaking changes, however if you content was a flat array, eg: ["foo", "bar"] You will need to set valueProperty=null and nameProperty=null on the component.

Also almost every component should have an `onChange` handler now to decide what to do with the updated data. **select-kit will not mutate your data by itself anymore**
2020-02-03 14:22:14 +01:00
Mark VanLandingham
8c4ffaea1b
FEATURE: Modal for profile featured topic & admin wrench refactor (#8545) 2019-12-16 08:41:34 -08:00
Mark VanLandingham
14cb386f1e
FEATURE: Featured topic for user profile & card (#8461) 2019-12-09 11:15:47 -08:00
Kris
b066a4128d Adding a text-overflow: ellipsis; mixin and related cleanup 2019-11-06 14:00:29 -05:00
Joe
9510f3d737 card buttons should truncate if there isn't enough space (#7290) 2019-03-31 11:16:40 +02:00
Joe
ec2123809f FEATURE: user and group cards on mobile (#7246) 2019-03-25 13:37:17 +01:00
Joffrey JAFFEUX
6c195640b9
FEATURE: adds an API to register topic footer buttons 2019-02-07 14:43:33 +01:00
Kris
db32d29eaa UX: Refactoring topic statuses for consistent icon sizes & colors 2018-12-06 19:22:04 -05:00
Penar Musaraj
be56f18cdd
Replace deprecated dropdown-button with DropdownSelectBoxComponent (#6451) 2018-10-05 09:48:17 -04:00
Joffrey JAFFEUX
174d392e5a
DEV: adds prettier (#5956)
Run `prettier --write "app/assets/stylesheets/**/*.scss" "plugins/**/*.scss"` after making sure you installed it with `yarn`

It's recommended to configure your editor to run prettier on file save.
2018-06-08 11:49:31 +02:00
Kris
5fc2dd8b8d group name alignment in user-stream 2018-05-08 21:35:53 -04:00
Kris
15268a47b0 Prevent group-member-info from wrapping 2018-05-03 21:00:24 -04:00
Guo Xiang Tan
0a567d0176 UX: Add mobile template for group members page. 2018-03-22 20:59:30 +08:00
Kris
0ec1dc9237 UX: Improving badge page layout 2018-03-02 12:43:01 -05:00
Kris
dc2d9f05dc removing scale-color, first pass 2017-10-13 11:57:10 -04:00
minusfive
611d62e4a5 Cleanup, deduplicate, debug user css, separated user-info component css 2017-09-01 06:32:27 -07:00