Commit Graph

6800 Commits

Author SHA1 Message Date
Martin Brennan
dc0bf90069
UX: Apply admin UI guidelines to Reports pages (#30684)
Applies the admin UI guidelines from
https://meta.discourse.org/t/creating-consistent-admin-interfaces/326780
to the reports list and single report page for admins.


![image](https://github.com/user-attachments/assets/2431901f-0225-4658-b408-ab0865d022e6)

![image](https://github.com/user-attachments/assets/6f9e531b-8fec-405f-8429-151fd261ee2c)

---------

Co-authored-by: Ella <ella.estigoy@gmail.com>
2025-01-14 13:22:08 +10:00
Ella E.
9ce2ad14d1
FIX: Set fixed width for email group chooser dropdown to prevent resizing based on content (#30740)
This PR addresses an issue where the dropdown container width was
inconsistent, resizing based on its content.

**Changes included:**
- Added a fixed width for the dropdown container.
- Adjusted margin spacing by applying it to the `.identifier` class
instead of `.name`. This prevents awkward spacing when either contains a
large number of characters.

Internal topic: /t/143862
2025-01-13 19:00:09 -07:00
Penar Musaraj
11cc931a64
DEV: Improve composer positioning on tablets (#30745)
Followup to 07e5f89.

See report https://meta.discourse.org/t/-/346876
2025-01-13 15:04:06 -05:00
Kris
f23e196b4f
UX: Switch button focus state to focus-visible (#30744)
From https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible:

> The :focus-visible pseudo-class applies while an element matches the
[:focus](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus)
pseudo-class and the UA ([User
Agent](https://developer.mozilla.org/en-US/docs/Glossary/User_agent))
determines via heuristics that the focus should be made evident on the
element. (Many browsers show a "focus ring" by default in this case.)

This change switches buttons over to `:focus-visible` which shouldn't
change much, except for situations where focus state may linger in cases
when it's not desired, like the tracking button here for example:


![image](https://github.com/user-attachments/assets/57aaa193-0960-4757-a461-47fdcca7de2a)


When using `focus-visible` the `focus` state is no longer visible after
a tap, but the focus state will still appear when using keyboard
navigation or assistive technology like VoiceOver, as seen here:


<img
src="https://github.com/user-attachments/assets/62398532-3e05-4979-91a4-d3ddeb4758cb"
width="300" />
2025-01-13 14:05:51 -05:00
Régis Hanol
79b68bc32b
FIX: show both group's full name & name when they differ (#30672)
In the groups page (/g) where we list all the groups, we were only
showing one group "name" per group. If a full name was set, we would
show it, otherwise we would show the group's "display name".

This was somewhat inconsistent because we only show the group's names
in all the various controls we use to filter/search by group.

Plus we used a slightly different logic when displaying the names of a
group on the "group page".

So I updated the "GroupsInfo" component to show either 1 or 2 names
depending on whether a full name is set, and it's different from the
display name or the name of the group.

I used this component in the "group page" so the names will be
consistent between the "groups page" and the "group page".

Also renamed the "GroupsInfo" component to "GroupInfo" since it only
ever deals with 1 group at a time.

Ref - https://meta.discourse.org/t/-/345415

---

## When "full name" differs from the "group's name"

(cf. `@admins`, `@staff`, and `@moderators`)

<img width="1250" alt="Screenshot 2025-01-09 at 15 56 29"
src="https://github.com/user-attachments/assets/f8a0ecdd-2715-40d9-a1ed-26288f638d9f"
/>

## When "full name" is the same as the "group's name"

When `unicode` is allowed in usernames, then the group's full name is
the same as the group's name, so we only show one name.

<img width="1249" alt="Screenshot 2025-01-09 at 16 25 53"
src="https://github.com/user-attachments/assets/03438fbd-04f1-4672-91d5-bd6af2b32475"
/>
2025-01-13 11:28:29 +01:00
David Battersby
47c8197ea1
FEATURE: add drafts dropdown menu (#30277)
This change adds a new dropdown trigger next to the "New Topic" button.
When clicked a menu will display a list of topic/post drafts that can be
clicked to resume the draft within the composer.

The "New Topic" button will no longer change text to show "Open Draft"
when a draft topic exists, it will still attempt to load the existing
draft if one exists (this will change later when we support multiple
drafts in a separate PR).

The "My Posts" link in desktop sidebar will now be "My Drafts" and only
appear when the current user has existing drafts.
2025-01-13 13:33:57 +04:00
Penar Musaraj
07e5f8907e
DEV: Consolidate mobile positioning strategies on mobile and iPad (#30241)
This removes some longstanding Safari iOS positioning hacks and refactors the mobile positioning strategy across Safari, Chrome and Firefox. See PR descriptions for more details. 

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
2025-01-10 11:00:15 -05:00
David Taylor
ce97e51b63
UX: Improve git blob oneboxes (#30694)
Rearranges the info at the top of github/gitlab 'blob' oneboxes to make them easier to read
2025-01-10 11:49:36 +00:00
Martin Brennan
690ffcf1d5
UX: Add DPageHeader to watched words and color palettes (#30686)
Part of our admin UI consistency efforts, this is a stop-gap
until we can do a further UI review of these pages.
2025-01-10 15:32:10 +10:00
Ted Johansson
4a78999b6f
DEV: Add new admin UI header to site texts page (#30689)
This adds the new admin UI header to the site texts page.
2025-01-10 13:19:14 +08:00
Ted Johansson
b1bae9b785
FIX: Add back missing API key 'peek' step (#30683)
In #30096 we converted the API keys UI to follow the new admin UI guidelines.

During this conversion, the step where you get a chance to copy the API key after creating, was lost due to a rebase mistake.

This re-introduces it.
2025-01-10 10:21:22 +08:00
Joffrey JAFFEUX
d91c48cece
FIX: correct emoji picker size in modal (#30675)
Following a change in b1e40d04b9 the width of the picker has been reduced in modals when it should have been reduced only when NOT in a modal.
2025-01-09 21:53:49 +01:00
Kris
d9c992bfdd
UX: follow-up sidebar variable fixes for c398933 (#30676) 2025-01-09 15:53:29 -05:00
Kris
c39893364b
DEV: fix and improve sidebar CSS variables (#30673) 2025-01-09 14:18:05 -05:00
Joffrey JAFFEUX
b1e40d04b9
FIX: emoji picker followups (#30670)
This pull request is doing the following changes:

prevents clicking on a section to scroll the document body
do not show favorites section if empty
do not close the user-status modal on emoji selection
giving its own context for user-status picker, that way if you frequently use same emojis for the picker they will always be in favorites
2025-01-09 14:27:48 +01:00
Gary Pendergast
138b02448b
FIX: Improve the user badge alignment on mobile devices. (#30665)
Due to more explicit CSS flex arrangement on mobile devices, user badges were being shoved out of alignment. This change nudges them back into line.
2025-01-09 17:26:45 +11:00
Ted Johansson
590b3e11fb
DEV: Convert admin API keys to conform to UI guidelines (#30660)
Re-opening of #30096. It was reverted because it was missing a sidebar link to Webhooks in the admin panel.
2025-01-09 10:57:40 +08:00
Sérgio Saquetim
e5d6ca0451
DEV: Fix triple click selection in WebKit derived browsers (#30628)
On WebKit-based browsers, triple clicking on the last paragraph of a post won't stop at the end of the paragraph, leaking the selection into the following nodes until it finds a non-empty node.

This commit introduces a workaround to fix this behavior.
2025-01-08 19:14:15 -03:00
Mark VanLandingham
4da7904ffd
REVERT: "DEV: Convert admin API keys to conform to UI guidelines"
This reverts commit d9ddc25808.

I noticed that Webhook admin UI is now inaccessible through the subheader
2025-01-08 11:03:40 -06:00
Ella E.
3f729b23bc
UX: Align silence reason header text with content alignment (#30639) 2025-01-08 04:42:42 -07:00
Joffrey JAFFEUX
6740a340ca
DEV: unifies emoji picker (#28277)
The chat emoji picker is renamed emoji-picker, and the old emoji-picker is removed.

This commit doesn't attempt to fully rework a new emoji-picker but instead tries to migrate everything to one picker (the chat one) and add small changes.

Other notable changes:
- all the favorite emojis code has been mixed into one service which is able to store one state per context, favorites emojis will be stored for all topics, and for each chat channel. Meaning that if you always use a specific emoji in a channel, it will only show as favorite emoji in this channel.
- a lot of static code has been removed which should improve initial load perf of discourse. Initially this code was around to improve the performance of the emoji picker rendering.
- the emojis are now stored, once the full list has been loaded, if you close and reopen the picker it won't have to load them again.

List of components:

- `<EmojiPicker />` will render a button which will open a dropdown
- `<EmojiPickerContent />` represents the content of the dropdown alone, it's useful when you want to render a picker from an action which is not the default picker button
- `<EmojiPickerDetached />` just a simple wrapper over `<EmojiPickerContent />` to make it easier to use it with `this.menu.show(...)`

---------

Co-authored-by: Renato Atilio <renatoat@gmail.com>
2025-01-08 11:41:36 +01:00
Ted Johansson
d9ddc25808
DEV: Convert admin API keys to conform to UI guidelines (#30096)
This PR updates the admin API keys page to follow the Admin UI Guidelines. In addition it modernizes all the JavaScript involved in this admin area.
2025-01-08 18:11:38 +08:00
Sam
9cf78ba195
FEATURE: show silence reason when viewing silenced users (#30635)
This adds the Silence Reason column to silenced user lists.

This feature helps combat large spam attacks cause you can quickly see
why a user was silenced and then bulk act on all the silenced users
2025-01-08 16:04:19 +11:00
Martin Brennan
c1a46995a7
FIX: Wizard improvements post-merge part 1 (#30612)
* FIX: Wizard improvements post-merge part 1

Followup 3135f472e2

Fixes the following:

* On mobile, the Styling step was very narrow
* When clicking Next on the Styling step after previously
  selecting Hot, we got an error

Also makes the following UX improvements for the preview:

* Use different topic titles for Latest and Hot
* Also make Hot view and reply numbers higher

This helps differentiate the two previews.

* DEV: Review fixes
2025-01-07 17:01:05 +10:00
Krzysztof Kotlarek
51a444ab53
FIX: consistent delete button for admin panel (#30592)
Move the delete button to more options to follow guide https://meta.discourse.org/t/creating-consistent-admin-interfaces/326780#p-1605522-h-5d-table-26
2025-01-07 14:05:45 +11:00
Ella E.
fd909dd348
UX: Refactor nav stack active element (#30601)
* UX: Add a grey background and bold text to highlight the active element in the nav stack
2025-01-06 18:14:17 -07:00
Kris
f0ac25cf35
UX: adjust mobile to avoid progress bar jitter (#30591) 2025-01-06 17:57:24 -05:00
Kris
116c3f7f8d
UX: improve table hover states, fix table button margin issue (#30585) 2025-01-06 13:59:48 -05:00
Kris
1ae341fa38
UX: only show red count in IP lookup when greater than 0 (#30584) 2025-01-06 11:58:12 -05:00
David Taylor
486ff2a564
UX: Do not anchor scroll on topic navigation/map (#30580)
topic-navigation and topic-map appear in the DOM before the post stream, and are then rearranged with CSS grid. That means that, if they are entirely within the viewport, and does not have a fixed/sticky position, then they will be chosen as the browser's scroll anchor point.

We never want these elements to be used as the anchor, so we can set `overflow-anchor: none`.

https://meta.discourse.org/t/344386/16
2025-01-06 10:13:29 +00:00
Krzysztof Kotlarek
407fa69778
UX: admins embedding page follows admin ux guideline (#30122)
Conversion of /admin/customize/embedding page to follow admin UX guidelines.
2025-01-06 13:01:08 +11:00
Bryce Huhtala
dacb5d5d33
UX: use em for code font-size (#30547) 2025-01-03 13:09:29 -05:00
Bryce Huhtala
b3772e23bf
UX: inherit font-size for code in headings (#30536)
* UX: inherit font-size for code in headings

* UX: use descendant selector

* FIX: linting
2025-01-02 13:30:01 -05:00
Ella E.
e04af92740
UX: Add highlight for active nav in admin secondary sidebar (#30486)
This PR makes the secondary sidebar in the admin UI more consistent
navigation experience:

* Added a coloured background for links on hover
* Replaced the bold text and line style with a distinct background
highlight, ensuring it complements the admin sidebar while maintaining
its own identity
* Bringing in arrow indicators to match the active navigation state in
the category settings

### Before
<img width="488" alt="image"
src="https://github.com/user-attachments/assets/aa843766-0ed7-435a-8880-6f0598aa4782"
/>


### After
<img width="475" alt="image"
src="https://github.com/user-attachments/assets/ec31bab9-0f51-4757-ab06-95a961ae17ee"
/>
2025-01-01 23:50:16 -07:00
Martin Brennan
3135f472e2
FEATURE: Improve wizard quality and rearrange steps (#30055)
This commit contains various quality improvements to
our site setup wizard, along with some rearrangement of
steps to improve the admin setup experience and encourage
admins to customize the site early to avoid "all sites look the
same" sentiment.

#### Step rearrangement

* “Your site is ready” from 3 → 4
* “Logos” from 4 → 5
* “Look and feel” from 5 → 3

#### Font selector improvements

Changes the wizard font selector dropdown to show
a preview of all fonts with a CSS class so you don't
have to choose the font to get a preview.

Also makes the fonts appear in alphabetical order.

#### Preview improvements

Placeholder text changed from lorem ipsum to actual topic titles,
category names, and post content. This makes it feel more "real".

Fixes "undefined" categories. Added a date to the topic timeline.

Fixes button rectangles and other UI elements not changing in
size when the font changed, leading to cut off text which looked super
messy. Also fixed some font color issues.

Fixed table header alignment for Latest topic list.

#### Homepage style selector improvements

Limited the big list of homepage styles to Latest, Hot, Categories with latest topics,
and Category boxes based on research into the most common options.

#### Preview header

Changed the preview header to move the hamburger to the left
and add a chat icon

#### And more!

Changed the background of the wizard to use our branded blob style.
2025-01-02 09:28:23 +10:00
Penar Musaraj
2ff3f44b95
DEV: User page layout backwards compatibility (#30515)
Followup to #30499, fixes CSS for older browsers.
2024-12-31 11:43:49 -05:00
Penar Musaraj
2ffcb94c8b
A11Y: Fix screen reader access to user directory (#30499) 2024-12-31 08:10:00 +11:00
Sérgio Saquetim
b728b74c49
DEV: Add showLogin action to post menu buttons and prevent text selection (#30500)
This commit adds `showLogin` as an available action to the post menu buttons. They can use this action to show the login form when there is no user logged in.

It also adds a small CSS tweak to prevent the content from the post menu to being user selectable. This was causing small UX issues in touch devices.
2024-12-30 15:57:07 -03:00
Jordan Vidrine
def0d13cd9
UX: Hide before-header-panel-outlet on login page (#30472) 2024-12-27 06:07:29 -06:00
chapoi
61e5431d2a
Hide before-header-panel-outlet on signup/login pages (#30432) 2024-12-26 01:39:26 +01:00
Jordan Vidrine
e90a92b298
fix (#30452) 2024-12-23 14:30:58 -06:00
chapoi
5b989fd5ae
UX: add highlight for active nav in category settings (#30428) 2024-12-23 06:10:48 +01:00
chapoi
4cf2f5d98a
UX: fix misalignment + remove border-radius of topic progress element (#30427) 2024-12-23 04:17:23 +01:00
Kris
fa0ad0306c
UX: improve link copy status transition (#30401) 2024-12-20 14:12:13 -05:00
Keegan George
380910aedd
DEV: Cleanup todos from codebase (#30394)
This PR involves cleaning up the codebase from my (@keegangeorge's) todos. 

In particular:
- Remove Form Template related todos (these are no longer in the roadmap)
- Remove old left-over AI summarization related code after moving to AI (https://github.com/discourse/discourse-ai/pull/658)
- Update one form template related spec
2024-12-19 18:22:33 -08:00
Martin Brennan
fa9606016c
UX: Site setting filter background inconsistencies (#30393)
Followup 203f93bcaf

This commit makes sure the background for all the admin
site settings filters (including the filter input and
override checkbox) is consistent no matter what the theme,
as it currently changes based on theme.
2024-12-20 10:51:35 +10:00
Kris
2a3f0f3bef
UX: refactor IP lookup using DMenu to improve layout and positioning (#30374) 2024-12-19 14:49:36 -05:00
Keegan George
d886c55f63
DEV: Reusable post-list component (#30312)
This update adds a  _new_ `<PostList />` component, along with it's child components (`<PostListItem/>` and `<PostListItemDetails />`). This new generic component can be used to show a list of posts.

It can be used like so:
```js
/**
 * A component that renders a list of posts
 *
 * @component PostList
 *
 * @args {Array<Object>} posts - The array of post objects to display
 * @args {Function} fetchMorePosts - A function that fetches more posts. Must return a Promise that resolves to an array of new posts.
 * @args {String} emptyText (optional) - Custom text to display when there are no posts
 * @args {String|Array} additionalItemClasses (optional) - Additional classes to add to each post list item
 * @args {String} titleAriaLabel (optional) - Custom Aria label for the post title
 * 
*/
```
```hbs
<PostList
    @posts={{this.posts}}
    @fetchMorePosts={{this.loadMorePosts}}
    @emptyText={{i18n "custom_identifier.empty"}}
    @additionalItemClasses="custom-class"
 />
```
2024-12-19 09:20:25 -08:00
Martin Brennan
553784f919
DEV: Delete AdminPageHeader and AdminPageSubheader components (#30337)
No longer needed because of https://github.com/discourse/discourse/pull/30146
and there are plugin PRs to remove other traces of it
2024-12-19 12:47:14 +10:00
Krzysztof Kotlarek
fdb6634fa9
FEATURE: settings tab for permalinks (#30192)
Setting tab should be added to permalinks so admins do not need to have left `/permalinks`.

A new component called `AreaSetting` was added to avoid duplications and
simplify adding settings to other sections.
2024-12-19 10:40:34 +11:00