ref https://linear.app/ghost/issue/AP-613/make-drawer-wider-when-displaying-articles-on-larger-screens
- Added a prop to Modal which allows you to interact with the page
behind the Modal, so the main navigation could still be used while the
Article modal is opened
- Removed the breakpoint we only use in one place, and switched to using
an arbitrary Tailwind breakpoint that matches the one in admin instead
ref https://linear.app/ghost/issue/AP-613/make-drawer-wider-when-displaying-articles-on-larger-screens
- The drawer view for viewing Articles was only slightly wider than the
one for viewing Posts. Since we've decided to make a bigger separation
between these 2 types of post, we wanted to make the drawer almost full
width (excluding the main navigation sidebar).
- This also removes the backdrop from drawer view so the interaction
would be lighter.
- To achieve this we're adding another CSS breakpoint so it would match
the one used in Admin. We didn’t have one since our DS was mostly used
in isolation in Settings.
- Adding custom fonts for themes behind a feature flag
- Introduces new `@tryghost/custom-fonts` module to manage custom fonts
- UI updates for Branding and Theme settings
---------
Co-authored-by: Fabien O'Carroll <fabien@allou.is>
Co-authored-by: Sodbileg Gansukh <sodbileg.gansukh@gmail.com>
Co-authored-by: Peter Zimon <peter.zimon@gmail.com>
Co-authored-by: Sanne de Vries <sannedv@protonmail.com>
Co-authored-by: Daniël van der Winden <danielvanderwinden@ghost.org>
AP-348
ATM the top navigation and the article drawer components are missing for
ActivityPub UI. They are both part of the next phase so we need to add
them.
fixes
https://linear.app/tryghost/issue/DES-81/misleading-hardcoded-tier-preview-title-colors
Tiers and Offers in Admin were shown with hardcoded pink titles. This
changes that. They are now shown with black titles, and only in the preview will they render with the site's accent colour.
---------
Co-authored-by: Princi Vershwal <vershwal.princi@gmail.com>
REF MOM-146
- These styling changes are a general newsletter template improvement,
and are also laying the groundwork for including a subhead in the
newsletter header. Both the newsletter template as well as the
newsletter preview in settings have been updated.
ref DES-228
This PR updates messaging and error handling in order to make Ghost calmer and friendlier. High level summary of the changes:
- Removed all onBlur validation in Settings -> now it’s possible to just click around without being warned to fill mandatory fields
- Removed lot of technical errors like `ValidationError: Validation (isEmpty) failed for locale`
- Completely removed the red background toast notifications, it was aggressive and raw esp. on the top
- Removed some unnecessary notifications (e.g. when removing a webhook, the removal already communicates the result)
- Now we show field errors on submitting forms, and in case of an error we show a “Retry” button in Settings too. This allowed to remove a lot of unnecessary error messages, like the big error message on the top, plus it’s consistent with the patterns outside Settings.
- Notification style is white now with filled color icons which makes everything much calmer and more refined.
- Removes redundant copy (e.g. "successful(ly)") from notifications
---------
Co-authored-by: Sodbileg Gansukh <sodbileg.gansukh@gmail.com>
refs.
https://linear.app/tryghost/issue/DES-21/empty-screen-is-missing-for-search-in-settings
- Search is one of the most useful functions in Settings and currently
the screen when there's no result for a searchterm is just a plain white
screen. Very non user-friendly.
- This update gives us an opportunity to improve the overall visual
hierarchy and focus of Settings in general.
---------
Co-authored-by: Ronald Langeveld <hi@ronaldlangeveld.com>
refs. https://github.com/TryGhost/Product/issues/4169
- the detail page for the Admin X proto app was empty
- the asc/desc selector of the SortMenu component in the design system needed a bit of refinement
- page toolbar was not set
