This fixes an issue where topics could scroll horizontally on mobile:
https://meta.discourse.org/t/topic-page-layout-issue/348262?u=pmusaraj
It seems some recent core change impacted the read state size/position
This sets the size and position to more static values (not based on
global font changes) to avoid the issue, and removes the horizontal
scroll.
c171e3dc works well in Safari, because the browser ignores the
`user-scalable=no` directive. However, PWA/Hub do respect the directive,
which means that it stopped pinch-zooming from working.
This commit updates the strategy for those environments so that the
viewport is only locked briefly during a focusin event. The simpler
strategy is maintained for the real safari browser.
Lazy loading images naturally causes a slight delay, because the browser
only starts to load them after laying out the DOM and checking whether
they're in the viewport. Plus, in Safari, re-rendering the DOM of a
lazy-loaded image always causes a brief flicker, even if the image is
already cached in the browser.
Lazy-loading is most beneficial on large one-off images which are often
rendered outside the viewport. That's frequently the case for images
which users share in topics. Avatars, on the other hand, are very small
images, they're very often above-the-fold, and the same avatar often
occurs many times on the same page.
Therefore, this commit removes `loading="lazy"` from avatars, which
should improve avatar load times in all browsers, and stop the flicker
in Safari.
---
Tapping logo to reload topic-list in Safari. Before: https://github.com/user-attachments/assets/242299f8-aa13-4991-b321-2f143603ed26
After: https://github.com/user-attachments/assets/5e5bfd28-3a78-40fd-af21-3d92e7b3ba8a
When clicking more in the emoji autocomplete menu, the picker would
sometimes be hidden at the bottom of the page. It was easily
reproducible in long topic pages when scrolled to the bottom.
This commit just marks the textarea as the trigger which is not a
perfect position but is still a good fallback.
Each case simplified:
`next(() => later(() => ...))` -> "wait 0 ms then wait X ms"
`next(() => debounce(() => ...))` -> "wait 0 ms then wait X ms
(debounced)"
`next(() => scheduleAfter("render", ...))` -> "in the next (empty) run
loop, do the thing (after a no-op render step)"
This will properly extract the text used to generate mathjax expression
(both inline and block display modes) as well as remove all the cruft
that mathjax is adding in the DOM.
Internal ref - t/135307
By default, iOS safari will automatically zoom into focused inputs with
font-sizes less than 16px. To avoid this, we had a CSS rule to ensure
inputs always had a large font-size on iOS. This worked, but did lead to
design inconsistencies.
Instead, we can set `user-scalable=no` on the viewport meta tag. Since
iOS 10, this property doesn't actually stop users zooming. But it *does*
still prevent the automatic zooming of inputs. So it solves our zoom
problem, and allows us to remove the CSS font-size workaround.
Stylelint is a css linter: https://stylelint.io/
As part of this change we have added two javascript scripts:
```
pnpm lint:css
pnpm lint:css:fix
```
Look at `.vscode/settings.json.sample` and `.vscode/extensions.json` for
configuration in VSCode.
---------
Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
ff815384 introduced a modifier which changes tracked state. If the
conditions are correct, this can cause an infinite re-rendering loop.
One example is [here](https://meta.discourse.org/t/346215/4), although
there are other non-dev-tools things which could trigger this kind of
loop. As a general rule, modifiers should not change tracked state.
This commit changes the approach to match the rest of the new-post-menu
assumptions: instead of trying to modify `collapsed` at runtime, the
rendering of individual buttons has the `>1` logic. That matches the
existing logic
[here](https://github.com/discourse/discourse/blob/89ff7d51e6/app/assets/javascripts/discourse/app/components/post/menu.gjs#L392C18-L394C6).
One of the big advantages is a nicer menu on mobile.
This commit also fixes a bug where the close modal action was called for any destroyed d-menu trigger, even if this specific menu was not expanding, which means it was closing a different modal than its own modal, given we can only have one modal at a time.
When the user selects “Use Current Timezone” on Profile -> Preferences
-> Profile, a call is made to `moment.tz.guess()`.
https://momentjs.com/timezone/docs/#/using-timezones/guessing-user-timezone/
states that, by default, previously cached responses from this function
will be returned upon subsequent calls. If your physical location has
changed, this may result in a cached value being returned, and thus the
timezone seemingly not being updating.
By passing the `true` value to the function, the cache is bypassed,
forcing an explicit recheck of the current timezone.
In a PM, if a user has made a post, and is later removed from the PM, they can still edit their own post. This can be done either if they happen to have a composer open in an active tab, or by just manually sending an HTTP request.
The post guardian is missing a basic check, can_see_post_topic? when we determine whether a user can edit a post or not. This basic check is already in place when we determine whether a user can see the post in the first place.
This PR adds in the missing check, so that if the user tries to edit their post after being removed, they'll receive a 403.
It also adds a MessageBus message scoped to the affected user and topic when they are removed from the PM, which will redirect them to their inbox. This helps avoid a stale tab where they are still in the PM which they by right can now no longer see.
discourse-emojis is used in chat only for message actions to show a
difference with the the other emojis so people don't think it's just the
smiley emoji.
When trying to insert schemaless or relative links using the "insert
hyperlink modal" in the composer, the resulting link would be wrongly
prefixed with "https://"
This is a small clean-up PR that does the following:
- Convert api-keys.hbs to a RouteTemplate backed api-keys.gjs.
- Move the sub-page templates (index, show, new) into /api-keys sub-directory.
- Removes some styles that aren't used after the admin UI conversion.
Similar to the `home-logo-href` and `home-logo-image-url` transformers,
this PR adds a new `home-logo-minimized` transformer to allow
plugins/themes to amend the default behavior of the header logo.
Internal topic: t/144688.
The new site setting `allow_anonymous_and_tl0_to_flag_illegal` allows
tl0 users to flag illegal content. In addition, anonymous users are
instructed on how to flag illegal content by sending emails.
Also `email_address_to_report_illegal_content` setting is added. If not
provided, then the site contact email is used.
Reverts 02113fc.
This is an imperfect detection of tablets and more generally, we want to
move away from detecting specific devices. THere's a broader effort to
remove mobile/desktop detection and rely instead on viewport-width-based
patterns and feature detection (touch, hover, etc.). See
https://github.com/discourse/discourse/pull/30642
To reach the same results in CSS/jS, we can use the `touch` and `hover`
media queries.
In CSS, something like:
```
@media (hover: none) {
// hover non excludes touchscreen desktops
.discourse-touch {
// we detect touch capability on the JS side, a bit of a belts and suspenders approach
}
}
```
And in JS:
```
this.capabilities.touch` plus `window.matchMedia("(hover: none)").matches
```
When tapping something on a touch-enabled device, `mouseMove` events are
still fired, so floatkit would still be triggered even if configured for
'hover' only. For links, this would be particularly strange, because the
tooltip would appear for a split-second, before the page navigation
occured.
To avoid this problem, we can use the more-modern 'pointerMove' event,
and check the `pointerType` to exclude 'touch'
