Commit Graph

8039 Commits

Author SHA1 Message Date
Thibaut Patel
5696ee53fc Moved the localstorage utils to be where it's used
refs https://github.com/TryGhost/Team/issues/1206

- Fixes the previous commit (78540cabfd)
2021-11-16 18:18:19 +01:00
Thibaut Patel
78540cabfd Save the latest callout card emoji
refs https://github.com/TryGhost/Team/issues/1206

- Re-use the saved emoji as the default for future callout cards
- Introduced a localstorage util that ignores errors. Ignoring errors avoids issues with browsers that don't support localstorage
2021-11-16 18:10:27 +01:00
Kevin Ansfield
96a810e6c7 Removed text contrast adjustment for accent buttons
no issue

- the front-end only supports white text on accent color backgrounds so we shouldn't have any auto contrast selection for text in Admin for consistency and to give a hint that a chosen accent color is too light
2021-11-16 17:01:52 +00:00
Thibaut Patel
a09d5ca14d Allow line-returns in callout card
refs https://github.com/TryGhost/Team/issues/1206

- Uses the `softReturn` parser to maintain line returns when editing the callout card
2021-11-16 17:11:00 +01:00
Peter Zimon
1aea3c7c42 Refined link dropdown line-height 2021-11-16 17:05:44 +01:00
Thibaut Patel
568c523ff2 Allow line-returns in callout card
refs https://github.com/TryGhost/Team/issues/1206

- This only solves partially the line-returns being eaten by the editor. When editing a card with a line return, it will be removed.
2021-11-16 15:04:56 +01:00
Sanne de Vries
3ec39ae255 Styled emoji picker in callout card 2021-11-16 13:34:44 +01:00
Kevin Ansfield
cdf0565d3b Hid gifs card when tenor API config is not available
refs https://github.com/TryGhost/Team/issues/1220

- added array support to `{{card-is-available}}` helper where every key needs to be present for the card to be available
- changed gifs card `isAvailable` property to require both the feature flag and the tenor api key to be set in config
2021-11-16 12:14:21 +00:00
Peter Zimon
527043a89d Set Button alignment to center 2021-11-16 09:04:35 +01:00
Peter Zimon
77c2a9eba7 Button refinements 2021-11-16 08:59:28 +01:00
Sanne de Vries
430989d722 Updated callout card dark-mode 2021-11-15 20:48:02 +01:00
Thibaut Patel
8e3bce3c49 Updated the html textarea editor code shortcut
refs https://github.com/TryGhost/Team/issues/1206

- the editor will behave like the main Ghost editor and will wrap text between backticks with a <code> tag
2021-11-15 18:48:24 +01:00
Kevin Ansfield
04fe62012d Dropped deprecated {{action}} usage in callout card and removed
no issue

- `{{action}}` is deprecated and is only available for backwards compatibility with action hashes in non-Glimmer components
- for event handlers we should be using the `{{on}}` modifier to use `addEventListener` on an element rather than directly attaching JS functions using `onclick=` attributes to avoid subtle DOM event ordering bugs
2021-11-15 17:37:29 +00:00
Thibaut Patel
be60693189 Partially revert changes from previous commit
refs 35db77e342

- This wasn't affecting HTML replacement so it had no reason to go
2021-11-15 18:31:09 +01:00
Thibaut Patel
35db77e342 Removed email-specific code from the html textarea
refs https://github.com/TryGhost/Team/issues/1206

- prevents text in curly brakets from being wrapped into a <code> tag
- updated the callout card to this generic textarea editor instead of the email-specific editor
2021-11-15 17:58:01 +01:00
Kevin Ansfield
5268ad1f77 Swapped feature card setting for isAvailable
no issue

- the number of properties that cards have in their definition was growing so it made sense to drop the single-use `feature` property in favor of the `isAvailable` property that can perform the same functionality
2021-11-15 16:43:44 +00:00
Kevin Ansfield
4ca14b8eee 🐛 Fixed Unsplash image selector being available in editor when disabled
closes https://github.com/TryGhost/Team/issues/1223

It's possible to disable the Unsplash integration from the integration settings but when disabled the image selector was still available for post feature images and as an editor embed option.

- adds `isAvailable` property to card definitions, if it's set it should be a string that matches a config/setting that determines the card's availability
  - unsplash card updated to use `'settings.unsplash'` as it's `isAvailable` property
- adds conditional to `<GhEditorFeatureImage>` so the Unsplash selector is only shown when enabled to bring it inline with the `<GhImageUploader>` component that was used previously for post feature images
2021-11-15 16:38:57 +00:00
Kevin Ansfield
7c70211afe Fixed linter error 2021-11-15 14:30:21 +00:00
Kevin Ansfield
601727e50c Removed "zoom" in gif selector in favor of instant-insert
refs https://github.com/TryGhost/Team/issues/1220

- there's no options for individual gifs like there are with Unsplash images and there's no real need to zoom for gifs that are already fairly small so the extra zoom step is unnecessary
2021-11-15 14:27:22 +00:00
Kevin Ansfield
a9ae15b1a5 Added responsive column count to gif selector
refs https://github.com/TryGhost/Team/issues/1220

- added resize observer and cut-off widths for number of columns to auto-adjust based on the size of the selector's container
- fixed error when tenor service is unavailable due to missing `retry` action
2021-11-15 14:27:22 +00:00
Fabien O'Carroll
747e6c9533 Handled missing html property for NFT Oembed response
refs https://github.com/TryGhost/Team/issues/1211

Since we have switched to rendering the NFT card outside of the OEmbed
response we no longer include a html property. This check would throw
for missing HTML so we've updated it to not include NFT cards
2021-11-15 15:49:42 +02:00
Fabien O'Carroll
b8dd7c6af2 Revert "Added support for no-iframed embeds"
This reverts commit 8e29e8de79.
2021-11-15 15:49:42 +02:00
Fabien O'Carroll
dad82ec463 Revert "Fixed embeds without iframe resizing iframe"
This reverts commit 85c8674299.
2021-11-15 15:49:42 +02:00
Daniel Lockyer
584cb7940a Merged v4.22.3 into main
v4.22.3
2021-11-15 13:44:35 +00:00
Daniel Lockyer
cd5eb77ac6 v4.22.3 2021-11-15 13:43:15 +00:00
Thibaut Patel
82ccb36338 Added an emoji picker for the callout card
refs https://github.com/TryGhost/Team/issues/1206

- Uses https://emoji-button.js.org/ for the emoji panel and search
- Displayed when the callout card emoji is clicked
2021-11-15 14:19:20 +01:00
Sanne de Vries
e2f149ca45 Updated callout icon in card menu
Refs https://github.com/TryGhost/Team/issues/1206
2021-11-15 13:47:36 +01:00
Rishabh
a5c0116e0b Updated design for toggle card in edit mode
refs https://github.com/TryGhost/Team/issues/1209
2021-11-15 16:50:53 +05:30
Sanne de Vries
c621fe0843 Updated padding for callout cards 2021-11-15 11:17:21 +01:00
Fabien O'Carroll
0f839a9d27 Added child component for NFT Embeds
refs https://github.com/TryGhost/Team/issues/1211

We've moved the rendering of HTML outside of the OEmbed endpoint - so
the Admin needs to handle constructing the HTML from the OEmbed response
metadata.
2021-11-15 11:02:27 +02:00
Fabien O'Carroll
85c8674299 Fixed embeds without iframe resizing iframe
refs https://github.com/TryGhost/Admin/commit/8e29e8de7

The listener for resize is added on the first render of the component,
so we cannot check for the existence of the iframe then.
2021-11-15 11:01:37 +02:00
Kevin Ansfield
cd6d167f77 Added repositioning of settings panel when it's size adjusts
refs https://github.com/TryGhost/Team/issues/1219

- added optional `adjustOnResize` argument to `{{movable}}` modifier
  - when the movable element's size changes (based on a `ResizeObserver` event) the passed in action is called with the element and the current x/y position
  - having this handled via the `{{movable}}` modifier is needed because that's what knows about any CSS translations that are present and allows the drag position to remain in sync with any resize-related adjustments
  - return value of the action is expected to be a new `{x, y}` tuple
- used `adjustOnResize` in the `<KoenigSettingsPanel>` component so that any time the settings panel grows and causes part of it to be off-screen we re-position so that the whole panel is kept on-screen
2021-11-12 18:45:03 +00:00
Kevin Ansfield
6853b964f8 First iteration of gifs image selector + card
refs https://github.com/TryGhost/Team/issues/1217

- adds `tenor` service that acts as a coordinator for the Tenor API similar to the `unsplash` service
- adds `<GhTenor>` component that renders an image search and select modal using the `tenor` service
- swapped the gifs card over to use the `tenor` image selector so it opens the tenor modal instead of the unsplash modal
2021-11-12 16:10:26 +00:00
Daniel Lockyer
0bc5d322d4 v4.22.2 2021-11-12 16:00:24 +00:00
Kevin Ansfield
c128998d86 Fixed dropdown elements staying open/fixed when moving settings panel
refs https://github.com/TryGhost/Team/issues/1219

- added `dropdown.closeDropdowns()` to the `{{movable}}` modifier when dragging starts
- updated ember-power-select derived inputs to close their dropdowns when the dropdown service triggers it's `'close'` event
2021-11-12 15:27:08 +00:00
Peter Zimon
f112bd06c9 NFT card style refinements 2021-11-12 15:55:35 +01:00
Peter Zimon
690d34eebb Updated NFT card styles 2021-11-12 14:02:15 +01:00
Kevin Ansfield
e289b391f1 🐛 Fixed install of free themes from the marketplace that aren't in the built-in list
no issue

When we were given a source+ref we were using that to find a theme object from the built-in list of marketplace themes and if it wasn't found redirecting to the change-theme screen. That redirect didn't need to happen because we only need the `ref` and can determine the theme name from that.

- passed `ref` through to the install modal as a data argument
- updated install modal to get theme name from passed in theme or extracted from passed in `ref` when theme is not known
- adjusted "isDefaultTheme" so it always checks against Casper rather than using the `ref: 'default'` value from the list of marketplace themes
2021-11-12 12:57:25 +00:00
Rishabh
b4415830e6 Refined design for toggle card in edit mode
refs https://github.com/TryGhost/Team/issues/1209
2021-11-12 16:31:39 +05:30
Rishabh
5e01b94bb1 Fixed default tag override not working on edits for html input component
no refs

- we added a default tag override for basic html input component, but the edit mode was still using `p` as the tag irrespective of default set, which caused switching back to p tag when editing the component
2021-11-12 16:31:39 +05:30
Rishabh
57b318de52 Added new html textarea component
refs https://github.com/TryGhost/Team/issues/1209

- adds new `KoenigHtmlTextarea` component for entering multi line html in cards
- updates accordion card to use html text area component
2021-11-12 16:31:39 +05:30
Kevin Ansfield
6190feb0b9 Added gifs card to card menu
refs https://github.com/TryGhost/Team/issues/1217

- behind the `gifsCard` feature flag
- currently maps to the unsplash image selector whilst we're building out an alternative selector
2021-11-12 10:09:36 +00:00
Naz
b42271d87c Added "urlCache" labs alpha flag
closes https://github.com/TryGhost/Toolbox/issues/126

- A flag go control the experimental URL Cache alpha feature
2021-11-12 12:29:18 +04:00
Renovate Bot
2e668d0d41 Update dependency @tryghost/timezone-data to v0.2.51 2021-11-11 16:23:57 +00:00
Renovate Bot
2eb9a08c27 Update dependency @tryghost/helpers to v1.1.53 2021-11-11 16:23:51 +00:00
Kevin Ansfield
fe07578905 Added GIFs card labs flag
refs https://github.com/TryGhost/Team/issues/1217

- labs flag for adding a gif selector in a similar fashion to our Unsplash image selector
2021-11-11 15:12:57 +00:00
Sanne de Vries
549f89084f Updated callout-card color picker
Refs https://github.com/TryGhost/Team/issues/1206

- Replaced select component for color palette picker
- Added support for brand color
2021-11-11 15:48:14 +01:00
Kevin Ansfield
69dbabb5c1 Added support for copy/pasting Wordpress and Substack buttons into editor
refs https://github.com/TryGhost/Team/issues/1214

- bumped `@tryghost/kg-plugin-parsers` to add support for Wordpress/Substack style button html in paste events

Example Wordpress html:
```html
<div class="wp-block-buttons">
    <div class="wp-block-button">
        <a href="https://example.com" class="wp-block-button__link">
            Testing  button
        </a>
    </div>
</div>
```

Example Substack html:
```html
<a class="button primary" href="https://ghost.org">
    <span>Custom Button</span>
</a>
```
2021-11-11 14:31:32 +00:00
djordje vlaisavljevic
8f73a4e39b Updated Accordion card container and styles 2021-11-11 15:18:29 +01:00
Peter Zimon
e106188d39 Updated Button card menu icon 2021-11-11 14:26:21 +01:00