Commit Graph

694 Commits

Author SHA1 Message Date
Thibaut Patel
52530c2949 Updated the product card button in the editor
refs https://github.com/TryGhost/Team/issues/1245

- Disabled the button link to avoid leaving the editor
- Added disabled states when the button is incomplete
2021-12-08 12:07:46 +01:00
Thibaut Patel
3f16cec396 Fixed the image deletion action in the product card
refs https://github.com/TryGhost/Team/issues/1245

- The property `previewSrc` wasn't tracked so it wasn't updated when set to null
2021-12-08 11:29:53 +01:00
Thibaut Patel
6c81e9a182 Added the image placeholder for the product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-08 11:10:24 +01:00
Thibaut Patel
9a94dbe000 Enable the product card button when editing it
refs https://github.com/TryGhost/Team/issues/1245

- When editing the button text or url, the button is enabled
2021-12-08 10:36:24 +01:00
djordje vlaisavljevic
3b019b3b05 Updated editor template and styles for product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 22:34:15 +01:00
Rishabh
2b2edf48ef Refined audio card player UI in edit mode
refs https://github.com/TryGhost/Team/issues/1230

- updates player ui in audio card to use same html as theme
- removes setting panel for audio card
2021-12-08 00:44:58 +05:30
Kevin Ansfield
c29adfb441 🐛 Fixed pasted image files appearing twice in editor
closes https://github.com/TryGhost/Team/issues/1254

- when switching over to a more generic file paste handling the prevention of the default paste behaviour was missed meaning an additional image element was added to the contenteditable area which was not rendered on the front-end and disappeared when reloading the post
2021-12-07 18:08:00 +00:00
Kevin Ansfield
59ee50735a 🐛 Fixed initial paste of Twitter URL not triggering full script load
no issue

- pasted URLs that are converted into an embed card were triggering the `convertUrl` task twice, once on insertion and then again on the immediate deselection that happens whilst the caret is adjusted
- a change in browsers or in Twitter's script meant that the double-fetch and iframe population started to become unreliable with the script not triggering, or the iframe contents being replaced interfering with script timing, resulting in un-styled Twitter embeds immediately after pasting a URL
- added `.drop()` to the `convertUrl` task so the second deselection call is ignored whilst the first call is still in progress
2021-12-07 17:26:58 +00:00
djordje vlaisavljevic
40fad51d05 Updated editor template for product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 17:38:15 +01:00
Thibaut Patel
8e14a23fea Fixed the star rating in the product card
refs https://github.com/TryGhost/Team/issues/1245

- It wasn't hidden in the editor preview when disabled
2021-12-07 16:17:13 +01:00
djordje vlaisavljevic
9abe330714 Updated editor styles for product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 15:39:42 +01:00
djordje vlaisavljevic
1d1b1fe79a Added the menu icon for product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 15:39:42 +01:00
Thibaut Patel
636907f8f1 Removed duplicated star rating in product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 14:24:21 +01:00
Rishabh
3889163c8e Fixed caching of audio thumbnail when replaced
refs https://github.com/TryGhost/Team/issues/1230

- when updating a thumbnail for audio card, the thumbnail url doesn't change as its tied to the audio src. this can cause the old thumbnail to show in frontend due to browser caching
- this change adds a cache busting param at the end of url for each thumbnail upload, thus bypassing cache and showing the right thumbnail
2021-12-07 18:15:35 +05:30
djordje vlaisavljevic
9fd8ba431c Updated editor product card styles
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 13:14:37 +01:00
Thibaut Patel
cbf7e1a740 Fixed unsued variable
refs 53ed578140
2021-12-07 11:39:12 +01:00
djordje vlaisavljevic
d46a94f6ba Added a star icon
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 11:17:43 +01:00
Thibaut Patel
53ed578140 Updated the product card to allow rating and button toggles
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 10:40:28 +01:00
djordje vlaisavljevic
fc00dc1abc Updated editor product card styles
refs https://github.com/TryGhost/Team/issues/1245
2021-12-07 01:16:41 +01:00
Rishabh
a18b3ac369 Fixed thumbnail override bug for audio cards
refs https://github.com/TryGhost/Team/issues/1230

- replacing an existing thumbnail in audio card was broken and prevented updating thumbnails for audio file
2021-12-07 00:20:30 +05:30
Thibaut Patel
824d4f2f51 Updated the product card star rating
refs https://github.com/TryGhost/Team/issues/1245

- Moved away from using only checkboxes and css because we need to use SVGs to display the stars
- Made it simple to keep CSS to the minimum and enable flexibility
2021-12-06 16:53:04 +01:00
djordje vlaisavljevic
9c8cb742d3 Updated toggle editor styles
refs https://github.com/TryGhost/Team/issues/1209
2021-12-03 20:15:38 +01:00
djordje vlaisavljevic
3dd1a12e0c Changed placeholders for inputs
refs https://github.com/TryGhost/Team/issues/1209
2021-12-03 10:43:20 +01:00
Rishabh
c5d9e27a07 Cleaned tab/enter behavior for toggle heading
refs https://github.com/TryGhost/Team/issues/1209

- updates tab/enter behavior for toggle heading -> content to use editor keyboard commands instead of overriding html input component
2021-12-03 01:39:21 +05:30
Rishabh Garg
6c837599d1 Allowed tab switch for heading to content input in toggle card (#2165)
refs https://github.com/TryGhost/Team/issues/1209

- allows switching to content input from heading by pressing tab
2021-12-03 01:14:05 +05:30
Rishabh
628150fd32 Renamed accordion usages to toggle for toggle card
refs https://github.com/TryGhost/Team/issues/1209
2021-12-03 00:52:46 +05:30
Rishabh
a5b0f75486 Updated audio card edit mode to include audio element
refs https://github.com/TryGhost/Team/issues/1230
2021-12-03 00:26:58 +05:30
James Morris
6eff87bf9c Editor changes for multiple quotes 2021-12-02 12:53:07 +00:00
Sanne de Vries
9ad920e985 Updated media card descriptions in cardmenu 2021-12-01 15:00:59 +00:00
Sanne de Vries
9fcaae4475 Updated callout card class for consistency
No ref

- Swapped "kg-card-callout" for "kg-callout-card"
2021-12-01 14:23:47 +00:00
Sanne de Vries
48742a1b15 Updated audio card placeholder 2021-12-01 14:07:05 +00:00
Kevin Ansfield
a7cf374566 Added "Gifs" card to the editor
refs https://github.com/TryGhost/Team/issues/1225

When inserted opens a searchable gif selector, creating an image card when a gif is chosen.

Includes keyboard navigation once open:
- `Tab`/`Shift+Tab` cycles highlighted gif through search result order
- `Up` / `Down` / `Left` / `Right` moves highlight in the respective direction
- `Enter` inserts highlighted gif

For the gifs card to be activated it's necessary to add a Tenor API key (obtained freely from https://tenor.com/gifapi) via your config.production.json file:

```
  ...
  "tenor": {
    "publicReadOnlyApiKey": "YOUR_KEY"
  }
}
```
2021-12-01 12:19:10 +00:00
Kevin Ansfield
cbdf3bfa28 Added "Button" card to the editor
refs https://github.com/TryGhost/Team/issues/1210

The button card lets you add a center or left-aligned button-styled link to your posts.
2021-12-01 12:01:46 +00:00
Sanne de Vries
80148c64db Updated file card icon in cardmenu 2021-12-01 10:29:17 +00:00
Rishabh
e0eff4436c Updated audio card with basic upload behavior
refs https://github.com/TryGhost/Team/issues/1230

- adds thumbnail upload on audio card
- cleans up card design in edit mode
2021-12-01 14:34:40 +05:30
Peter Zimon
fecbbdd2e7 Updated button URL suggestion copy 2021-11-30 17:10:24 -04:00
Peter Zimon
0a700cd10a Gif browser UI refinements 2021-11-30 17:07:07 -04:00
Kevin Ansfield
927a977257 Fixed focus not fully returning to editor after pressing escape in caption input
no issue

- forced card deselection+reselection so that keys such as `Enter` and `Backspace` work as expected when the card is shown as selected
2021-11-30 18:06:17 +00:00
Kevin Ansfield
ba532aa815 Reverted insertion of blank paragraph when selecting unsplash/gif image
refs e419e4e99f

- the behaviour wasn't desirable in all cases, reverting to the previous behaviour of selecting the card after image selection
2021-11-30 18:02:58 +00:00
Kevin Ansfield
024b27c8dd Fixed error when pressing enter inside a caption
refs e419e4e99f

- added an optional options param to `addParagraphAfterCard` but was missing a default value meaning the destructuring errored when the param wasn't provided
2021-11-30 18:02:58 +00:00
Thibaut Patel
1dac565dbc Fixed the product card bold/italic rendering
refs https://github.com/TryGhost/Team/issues/1233

- The content is html so it shouldn't be escaped by handlebars
2021-11-30 18:04:44 +01:00
Thibaut Patel
fc208558dd Added a star-rating input for the product card
refs https://github.com/TryGhost/Team/issues/1245

- This is a proof-of-concept as there are so many ways to implement a star-rating component
- The component is only available when editing the product card
- Uses the unicode star character: ★
- The inspiration is an old article from Lea Verou: https://lea.verou.me/2011/08/accessible-star-rating-widget-with-pure-css/ (minus the clever use of :not(:checked) on something that's not an input to filter-out IE)
- There is currently no way to remove the star rating as it'll get designed this week
2021-11-30 18:02:44 +01:00
djordje vlaisavljevic
f07e5b8c9c Updated product card editor look for 🛹 refs https://github.com/TryGhost/Team/issues/1233 2021-11-30 17:32:02 +01:00
Sanne de Vries
b3e84bfbd8 Updated media card icons in cardmenu 2021-11-30 16:01:40 +00:00
Kevin Ansfield
691308c34e Fixed video card settings panel position when card width changes
closes https://github.com/TryGhost/Team/issues/1244

- moved the `<KoenigSettingsPanel>` usage outside of the `<KoenigCard>` contents so it gets positioned relative to the outer card container rather than the inner card container so it's not affected by the inner card changing width/breaking out of the outer container
2021-11-30 15:32:21 +00:00
Kevin Ansfield
e419e4e99f Added blank paragraph insertion when selecting unsplash/gif image
refs https://github.com/TryGhost/Team/issues/1225

- provides a more obvious continuation point after selecting an image
- added `scrollIntoView` option to `addParagraphAfterCard()` because for large images the cursor in the new paragraph could be pushed out of the visible area
2021-11-30 15:05:41 +00:00
Kevin Ansfield
8e66f6ead5 Fixed editor not having focus after selecting an unsplash/gif image
refs https://github.com/TryGhost/Team/issues/1225

After selecting an image you were left in a state where it looked like the image card is inserted and selected but pressing Cmd+Z, Delete, Enter, etc had no effect.

- added a manual deselect/reselect of the card to make sure it's properly selected and editor has focus
- added a scrollToCard call so the newly inserted card position feels more natural
2021-11-30 13:06:57 +00:00
Kevin Ansfield
9223d0237c Added scroll-into-view behavior when opening gif selector
refs https://github.com/TryGhost/Team/issues/1225

When the gif selector is activated we want to scroll as much of the picker into view as possible.

- updated `scroll-into-view` modifier so it can work on bounding rects as well as offsets for those situations where a scroll parent is not the offset parent
  - only implemented "off bottom" behavior for now as that's all we need for this use-case
  - if the scroll adjustment would mean the top is cut off we readjust so that the top of the element is always visible
2021-11-30 12:51:56 +00:00
Kevin Ansfield
79d9ea82d9 Changed tenor config API key name
refs https://github.com/TryGhost/Team/issues/1237#issuecomment-981770688

- API key names for external services now follow a standard pattern
  - top-level key of the service name
  - public/private and read/write perms inside the name, eg. `publicReadOnlyApiKey`
- updated test to match expected API key name
2021-11-30 11:29:16 +00:00
Kevin Ansfield
506d925462 Fixed syntax error
refs 5b90fe87ad

- closing bracket was accidentally deleted in final post-push cleanup
2021-11-30 10:59:37 +00:00