Kris
13a2ca8b09
UX: update px spacing to em for proportionality ( #27108 )
2024-05-21 13:13:38 -04:00
Joffrey JAFFEUX
f752851030
FIX: mobile modal tweaks ( #27073 )
...
- removes `will-change: auto;` which is a performance hack which should be avoided and is probably causing more harm than good here
- lowers swipe velocity to 0.4 to ensure the modal can be dismissed with the thumb
- uses JS CSS animate API to animate the backdrop opacity
- uses the height of the modal container to have more precise values when computing backdrop opacity
- animate the modal container instead of the wrapper
- removes a useless template-lint-disable directive
- simplify the closing animation
- various small code tweaks to limit indirection
2024-05-19 15:43:03 +02:00
Jan Cernik
7bc7ad45bb
UX: Merge the redesign experiment for embedded replies ( #26876 )
...
This PR merges the [design experiment](https://meta.discourse.org/t/embedded-replies-feedback/290538 ) based on the [Custom embedded replies component](https://meta.discourse.org/t/custom-embedded-replies/272670 ) created by [Don](https://meta.discourse.org/u/don/summary )
---------
Co-authored-by: Jordan Vidrine <jordan@jordanvidrine.com>
2024-05-08 18:00:17 +02:00
Joffrey JAFFEUX
cf8b81771f
DEV: implements <DropdownMenu /> ( #26917 )
...
DropdownMenu component is meant as a way to describe the content of menus.
Syntax:
```
<DropdownMenu as |dm|>
<dm.item class="test">
First
</dm.item>
<dm.divider class="foo" />
<dm.item class="bar">
Second
</dm.item>
</DropdownMenu>
```
2024-05-08 09:08:42 +02:00
Jan Cernik
8dd883d4e5
DEV: Refactor topic admin menu to use <DMenu>
( #26678 )
...
* DEV: Refactor topic admin menu to use `<DMenu>`
This PR also introduces a new plugin API to add buttons to the topic admin menu
```javascript
api.addTopicAdminMenuButton((topic) => {
return {
action: () => {
alert('Sunrise!');
},
icon: 'sun',
className: 'sunrise-button',
label: 'actions.rise',
};
});
```
The plugins that needed to be updated are:
- [discourse-zoom](https://github.com/discourse/discourse-zoom/pull/73 )
- [discourse-salesforce](https://github.com/discourse/discourse-salesforce/pull/74 )
- [discourse-topic-noindex](https://github.com/discourse/discourse-topic-noindex/pull/11 )
2024-04-29 12:44:38 -03:00
Kris
b971efed8c
UX: dynamic spacing for summarization buttons ( #26690 )
2024-04-22 09:49:00 -04:00
Joffrey JAFFEUX
17c92b4b2a
UX: shows the bookmark menu improvements
...
This commit adds a new option `@modalForMobile` for `<DMenu />` which allows to display a `<DModal />` when expanding a menu on mobile.
This commit also adds a `@views` options to toasts which is an array accepting `['mobile', 'desktop']` and will control if the toast is show on desktop and/or mobile.
Finally this commit allows to hide the progressBar even if the toast is set to `@autoClose=true`. This is controlled through the `@showProgressBar` option.
2024-04-08 08:18:50 +02:00
Kris
b35da59865
UX: adjustments for experimental bulk select menu ( #26474 )
2024-04-02 18:01:21 -04:00
Joffrey JAFFEUX
f7b73f3d70
UX: improves modal on mobile ( #26055 )
...
This commit mainly improves three things:
- slide up/down animation of the modals on mobile, also allowing swipe down to close the modal
- body scroll locked modals, it means that only the body of the modal can scroll
- a new `<:headerPrimaryAction>` block for `d-modal` which when present will move the cancel button to the left of the modal title, and this primary action to the right of the title
2024-03-22 16:29:32 +01:00
David Taylor
8b935e5b33
Revert "UX: Make input sizing consistent across all browsers ( #26159 )" ( #26295 )
...
This reverts commit d0d4a363d4
. This causes issues for people that have specified explicit font sizes in their browser - reverting while we investigate. https://meta.discourse.org/t/300374
2024-03-21 17:54:11 +00:00
David Taylor
d0d4a363d4
UX: Make input sizing consistent across all browsers ( #26159 )
...
Previously we had an iOS-specific sizing rule which would increase inputs to `1.07em`, which would bring them over the 16px 'zoom on focus' threshold in some (but technically, not all) situations.
This commit does two things:
1. Updates the sizing rule from `1.07em` to `max(1em, 16px)`. Essentially: use the cascaded font size, unless it is smaller than 16px
2. Applies that sizing rule on all platforms. This will make Discourse design/theming more consistent across different devices
It also removes some associated CSS rules which no longer make sense.
2024-03-20 16:23:44 +00:00
David Battersby
d5b944f1de
FEATURE: add chat direct message button to user profile ( #26135 )
...
This change adds the chat direct message button to user profiles, similarly to how we use it within the user card.
2024-03-18 11:17:37 +08:00
Kris
f65a5c5f02
UX: clean up invite buttons ( #26068 )
2024-03-07 10:50:11 -05:00
Kris
5c1147adf3
UX: Move top dismiss button from topics
to d-navigation
( #26032 )
2024-03-05 15:43:07 -05:00
Kris
e408f4ff95
DEV: remove various unused CSS ( #25994 )
2024-03-01 16:51:26 -05:00
Kris
653b2e4678
DEV: remove unneeded buttons mobile CSS ( #25992 )
2024-03-01 16:42:02 -05:00
Kris
9421997866
DEV: remove old bootstrap alert CSS ( #25991 )
2024-03-01 16:03:34 -05:00
Kris
ccf0fdaa81
UX: improve group email setting wrap, cleanup styles ( #25985 )
2024-03-01 12:34:55 -05:00
Kris
8503d3afe1
UX: improve advanced search wrapping, remove mobile stylesheet ( #25975 )
2024-02-29 18:07:18 -05:00
Kris
40eea40d69
UX: clean up tag info styles, remove mobile stylesheet ( #25973 )
2024-02-29 17:48:47 -05:00
Kris
db2f5ae51b
UX: simplify styles for image uploader ( #25970 )
2024-02-29 14:39:00 -05:00
Kris
47b8e98cf7
UX: enable badge title on mobile, style cleanup ( #25968 )
2024-02-29 13:55:13 -05:00
chapoi
9ce2c20ab0
UX: make sure a-tag uses border radius var ( #25882 )
2024-02-26 16:17:04 +01:00
Isaac Janzen
21f23cc032
DEV: Convert header to glimmer ( #25214 )
...
Here is a breakdown of the changes that will be implemented in this PR.
# Widgets -> Glimmer
Obviously, the intention of the todo here is to convert the header from widgets to glimmer. This PR splits the respective widgets as so:
### widgets/site-header.js
```mermaid height=200
flowchart TB
A[widgets/site-header.js]
A-->B[components/glimmer-site-header.gjs]
```
### widgets/header.js and children
```mermaid height=200
flowchart TB
A[widgets/header.js]
A-->B[components/glimmer-header.gjs]
B-->C[glimmer-header/contents.gjs]
C-->D[./auth-buttons.gjs]
C-->E[./icons.gjs]
C-->F[./user-menu-wrapper.gjs]
C-->G[./hamburger-dropdown-wrapper.gjs]
C-->H[./user-menu-wrapper.gjs]
C-->I[./sidebar-toggle.gjs]
C-->J[./topic/info.gjs]
```
There are additional components rendered within the `glimmer-header/*` components, but I will leave those out for now. From this view you can see that we split apart the logic of `widgets/header.js` into 10+ components. Breaking apart these mega files has many benefits (readability, etc).
# Services
I have introduced a [header](cdb42caa04/app/assets/javascripts/discourse/app/services/header.js
) service. This simplifies how we pass around data in the header, as well as fixes a bug we have with "swiping" menu panels.
# Modifiers
Added a [close-on-click-outside](cdb42caa04/app/assets/javascripts/discourse/app/modifiers/close-on-click-outside.js
) modifier that is built upon the [close-on-click-outside modifier](https://github.com/discourse/discourse/blob/main/app/assets/javascripts/float-kit/addon/modifiers/close-on-click-outside.js ) that @jjaffeux built for float-kit. I think we could replace float-kit's implementation with mine and have it in a centralized location as they are extremely similar.
# Tests
Rewrote the existing header tests ([1](https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/tests/integration/components/widgets/header-test.js ), [2](https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/tests/integration/components/site-header-test.js )) as system tests.
# Other
- Converted `widgets/user-status-bubble.js` to a gjs component
- Converted `widgets/sidebar-toggle.js` to a gjs component
- Converted `topicFeaturedLinkNode()` to a gjs component
- Deprecated the [docking mixin](https://github.com/discourse/discourse/blob/main/app/assets/javascripts/discourse/app/mixins/docking.js )
2024-02-23 11:08:15 -07:00
Kris
1ac8922013
DEV: update classes, remove unused CSS ( #25825 )
2024-02-23 09:14:37 -05:00
Kris
9005a14508
UX: fix topic map link expansion hover ( #25822 )
2024-02-22 15:47:38 -05:00
chapoi
a9f8009801
UX: Modal mobile fixes ( #25788 )
...
* UX: remove discourse-touch class wrapper
* UX: keep modal close btn in right position
2024-02-21 13:49:42 +01:00
Krzysztof Kotlarek
ee393a7953
UX: hide the draggable icon in the sidebar form on mobile ( #25738 )
...
Drag and drop link works only on desktop. Therefore, the drag icon should be hidden on mobile.
2024-02-21 09:16:49 +11:00
Kris
52fb523bbb
UX: show the full mobile read-state indicator ( #25678 )
2024-02-14 15:52:02 -05:00
David Taylor
9883e6a0c8
UX: Add loading indicator when loading 'new or updated topics' ( #25649 )
...
Also improves error handling so that the action can be retried if the network request fails
2024-02-13 10:41:22 +00:00
Kris
59ccb69db0
FEATURE: show unread post indicator on mobile ( #25421 )
2024-02-06 11:50:49 -05:00
chapoi
fbfab92fce
UX: overflow fix for add participants to PM on mobile ( #25437 )
2024-01-26 09:26:25 +01:00
chapoi
d5f527ee37
UX: show the SSO options when creating an account on mobile ( #25260 )
2024-01-15 16:36:00 +01:00
Kris
7639591552
UX: cleaning up some invite page styles ( #25247 )
2024-01-12 17:15:01 -05:00
Jordan Vidrine
8dad9788a3
FIX: Drop down fix ( #25093 )
2024-01-03 08:02:32 -06:00
Sam
baa7c4cec7
FIX: allow styling of feedback on mobile ( #25072 )
...
(to test try using discourse-ai which displays feedback on mobile)
---------
Co-authored-by: chapoi <101828855+chapoi@users.noreply.github.com>
2023-12-30 08:57:16 +11:00
Kris
096e26d972
UX: adjust pm styles to enbubble controls ( #24996 )
2023-12-22 14:28:02 -05:00
chapoi
1f9e6425c6
UX: align topic notification button + text vertically ( #24948 )
2023-12-18 16:59:03 +01:00
Mark VanLandingham
223e413a6c
DEV: Render glimmer notification items for user notification list ( #24802 )
...
This removes the widget notifications list and renders the glimmer user menu notification items instead.
2023-12-11 11:04:43 -06:00
chapoi
e227008c65
UX: login modal sizing fixes ( #24794 )
2023-12-08 17:21:37 +01:00
Kris
c197f8c6ee
UX: make github onebox styles more responsive ( #24761 )
2023-12-06 17:45:56 -05:00
chapoi
ad77a6876c
UX: fix alignment ( #24718 )
2023-12-05 14:19:21 +01:00
Krzysztof Kotlarek
dc2a0854b0
UX: add gift emoji styling for new features ( #24523 )
...
When admin has unseen new feature, gift emoji is added to a link.
In addition, `/new-features` path was changed to `/whats-new`
2023-11-27 09:32:28 +11:00
chapoi
0b352ce7fb
UX: fix date time modal on mobile ( #24531 )
...
* UX: fix date time modal
2023-11-24 10:28:46 +01:00
Jordan Vidrine
e073f4e5a6
UX: Adjust topic progress wrapper border radius ( #24470 )
2023-11-21 09:15:20 -06:00
Penar Musaraj
36606a2157
FIX: Modals on Android when keyboard is visible ( #24442 )
2023-11-20 11:56:06 -05:00
chapoi
f2d3e3ed3f
UX: Fixes login/create modal ( #24457 )
...
* UX: fix > hide alt login method on mobile create acc
* UX: login modal > fix long names on login buttons
* UX: fix login overflow
2023-11-20 11:52:50 +01:00
Krzysztof Kotlarek
190a7f8c7a
UX: smaller new feature emoji ( #24454 )
...
Moved the new feature emoji to the left of the title and made it smaller.
2023-11-20 16:08:10 +11:00
Krzysztof Kotlarek
96c5a6c9ca
FEATURE: dedicated admin section for new features ( #24292 )
...
New tab in admin panel with list of new features. Presentation was enhanced by screenshot and markdown description.
Related PR https://github.com/discourse-org/discourse-new-features-feeds/pull/23
2023-11-20 09:59:04 +11:00
chapoi
cd183edad1
UX: modal > remove obsolete wrapper class ( #24381 )
2023-11-15 11:33:23 +00:00