Commit Graph

662 Commits

Author SHA1 Message Date
Thibaut Patel
3742502f2d Updated the header card based
refs https://github.com/TryGhost/Team/issues/1253

- follows the latest design
2021-12-14 16:00:59 +01:00
Fabien egg O'Carroll
7d7d856e77 Removed edit option from toolbar
https://github.com/TryGhost/Team/issues/1249

We have no floating settings now so we can remove the menu item and
display the toolbar always when the card is selected
2021-12-14 16:40:51 +02:00
Fabien egg O'Carroll
1338ddd12b Removed usage of MutationObserver
refs https://github.com/TryGhost/Team/issues/1249

We now want to update the element which we are observing, which means we
end up in a loop. Instead we can listen to resize events and manually
update the dimensions when images are changed.
2021-12-14 16:40:51 +02:00
Fabien egg O'Carroll
d3ee36e45d Moved image upload and slider settings into card
refs https://github.com/TryGhost/Team/issues/1249

Based on design wirefames
2021-12-14 16:40:51 +02:00
Fabien egg O'Carroll
993fdf9a10 Moved layout and orientation settings to toolbar
refs https://github.com/TryGhost/Team/issues/1249

Based on the design wireframes we're not going to be using a floating
panel for settings, this moves the functionality into the toolbar
2021-12-14 16:40:51 +02:00
Fabien egg O'Carroll
d18e6006f9 Removed unused wordCount
refs https://github.com/TryGhost/Team/issues/1249

This isn't used anywhere at the moment.
2021-12-14 16:40:46 +02:00
Rishabh
324e6e95d0 Added duration data in video card
refs https://github.com/TryGhost/Team/issues/1229
2021-12-14 16:42:56 +05:30
Thibaut Patel
06a83f81b7 Updated the header card width selector
refs https://github.com/TryGhost/Team/issues/1253

- Follows the same pattern as the video card
2021-12-14 12:02:05 +01:00
Sanne de Vries
69aa98f9ca Updated video card and media player classes
Refs https://github.com/TryGhost/Team/issues/1229
2021-12-14 11:49:33 +01:00
Sanne de Vries
a011ee2d97 Updated video card settings panel
Refs https://github.com/TryGhost/Team/issues/1229
2021-12-14 09:37:45 +01:00
Thibaut Patel
f8caa3adce Added a first pass of the header card
refs https://github.com/TryGhost/Team/issues/1253
2021-12-13 19:31:23 +01:00
Sanne de Vries
6df5708c7f Refined audio and bookmark cards in editor
Refs https://github.com/TryGhost/Team/issues/1230
2021-12-13 19:09:00 +01:00
Rishabh
c9c602f839 Fixed settings panel behavior for video card thumbnail replace
refs https://github.com/TryGhost/Team/issues/1229
2021-12-13 21:46:09 +05:30
Sanne de Vries
06cb582fc0 Refined audio cards in editor
Refs https://github.com/TryGhost/Team/issues/1230
2021-12-13 16:18:32 +01:00
Fabien egg O'Carroll
12582c6cf4 Added initial Before/After card UI
refs https://github.com/TryGhost/Team/issues/1249

This adds a WIP for the Before/After card UI - behind an alpha flag.
It's completely missing design input and is intented to serve as a base
to work from.
2021-12-13 15:57:29 +02:00
Sanne de Vries
f788cd6dfa Removed unnecessary hidden audio player buttons
Refs https://github.com/TryGhost/Team/issues/1230
2021-12-13 14:09:39 +01:00
Sanne de Vries
828786212c Fixed audio card error state
Refs https://github.com/TryGhost/Team/issues/1230
2021-12-13 12:36:38 +01:00
Thibaut Patel
a879beb09d Hid the product card button fields when button is disabled
refs https://github.com/TryGhost/Team/issues/1245
2021-12-13 11:48:21 +01:00
Sanne de Vries
26265b6a11 Updated video card in editor
Refs https://github.com/TryGhost/Team/issues/1229
2021-12-13 11:43:11 +01:00
Rishabh
48e64a47be Updated thumbnail replace for audio card with thumbnail delete option
refs https://github.com/TryGhost/Team/issues/1230

- allowing users to delete the thumbnail and upload another is a better flow as it allows removing a thumbnail as well if not needed
2021-12-13 16:10:29 +05:30
Rishabh
c3cb7dde47 Updated card edit flow for audio and file cards
refs https://github.com/TryGhost/Team/issues/1230

- Updated the audio and file card to follow - 1st click → select, 2nd click → edit pattern, which is consistent with other cards
2021-12-13 15:58:25 +05:30
Kevin Ansfield
59def266de Fixed video card aspect ration change when uploading custom thumbnail
refs https://github.com/TryGhost/Team/issues/1229

- changed the video card image so it uses an aspect-ratio box set to the aspect ratio of the video, with the image using `object-fit: cover` to match the background image behavior in the front-end
2021-12-10 19:48:28 +00:00
Peter Zimon
6800a3fdb4 Updated file card styles in Koenig (#2175)
Added styles for file card in editor
2021-12-10 19:17:11 +01:00
Rishabh
0fb7a04bae Refined file upload card
refs https://github.com/TryGhost/Team/issues/1231

- updated upload endpoint for files
- cleanup
2021-12-10 18:01:25 +05:30
Rishabh
ee639625ad Cleaned up audio card file
refs https://github.com/TryGhost/Team/issues/1230
2021-12-10 17:25:55 +05:30
djordje vlaisavljevic
7b9c0319a6 Updated settings panel placeholders for product card
https://github.com/TryGhost/Team/issues/1245
2021-12-10 11:26:53 +01:00
Rishabh
dd8e770692 Updated audio card allowed extensions and payload
refs https://github.com/TryGhost/Team/issues/1230

- cleans up allowed payload attributes for audio card
2021-12-10 01:22:05 +05:30
Kevin Ansfield
c7925e6915 Fixed video card with adjustment not changing editor size
refs 00d9d200f7

- `concat` helper had been accidentally removed so width classes weren't being output correctly
2021-12-09 16:49:38 +00:00
Kevin Ansfield
e04422221f Switched to images API for video thumbnails with custom thumbnail override behaviour
refs https://github.com/TryGhost/Team/issues/1229

- using the images API lets us separate the auto-generated thumbnail and custom thumbnail
- added `customThumbnailSrc` to video card payload and switched settings panel uploader to store upload result there
- switched image display to fallback from custom thumbnail to auto-generated thumbnail
2021-12-09 16:38:05 +00:00
Sanne de Vries
00d9d200f7 Added static player UI to video card
Refs https://github.com/TryGhost/Team/issues/1229
2021-12-09 16:22:58 +00:00
James Morris
25807c9490 Added temporary icons for header card alignment
refs https://github.com/TryGhost/Team/issues/1253
2021-12-09 15:06:25 +00:00
Rishabh
49aab60795 Added first version for new file card
refs https://github.com/TryGhost/Team/issues/1231
2021-12-09 20:30:28 +05:30
Rishabh
997862cf58 Allowed creating audio card directly on file drop in editor
refs https://github.com/TryGhost/Team/issues/1230
2021-12-09 20:30:28 +05:30
Kevin Ansfield
192c983975 First pass at custom thumbnail upload for video card
refs https://github.com/TryGhost/Team/issues/1229

- adds uploader to setting panel
- currently replaces the single/auto-generated thumbnail image
2021-12-09 14:58:28 +00:00
Thibaut Patel
7e48fcd06d Fixed a visual bug in the cards using KoenigBasicHtmlInput
refs https://github.com/TryGhost/Team/issues/1245

- When pressing backspace on an empty `KoenigBasicHtmlInput` that don't use `p` as the default tag, an empty paragraph was created by e21bde39e1/lib/koenig-editor/addon/options/key-commands.js (L171-L176), messing with the style while in edit mode.
- This was fixed by normalizing the tag to be the `defaultTag` in the `didUpdatePost` hook
- Because of this new normalization, we could remove the same normalization from `handlePaste`
2021-12-09 14:08:17 +01:00
djordje vlaisavljevic
24eeaf68ff Updated the product card menu icon
refs https://github.com/TryGhost/Team/issues/1209
2021-12-09 10:18:19 +01:00
Rishabh
f37c0f91d4 Added metadata extraction for audio file in card
refs https://github.com/TryGhost/Team/issues/1230

- extracts audio duration and mimeType metadata for uploaded file
2021-12-09 13:12:45 +05:30
Rishabh
4df58bb022 Fixed thumbnail replace not working on drop for audio cards
refs https://github.com/TryGhost/Team/issues/1230
2021-12-09 00:08:43 +05:30
djordje vlaisavljevic
e9c2942de5 Updated editor styles and template for product card
refs https://github.com/TryGhost/Team/issues/1209
2021-12-08 19:33:55 +01:00
Sanne de Vries
049fe97e7e Updated video card
Refs https://github.com/TryGhost/Team/issues/1229
2021-12-08 17:29:22 +00:00
Thibaut Patel
16d242f763 Added image drag and drop to the product card
refs https://github.com/TryGhost/Team/issues/1245

- followed the pattern from the video card as the image card uses an older ember syntax
2021-12-08 18:28:42 +01:00
Thibaut Patel
b1d0c33c09 Added hover-over on product card stars in edit mode
refs https://github.com/TryGhost/Team/issues/1245

- Used onmouseover because a CSS-only approach wouldn't work
- CSS can only highligh next siblings on hover, while we want to highlight previous sibling in our case
- This adds a hover class on mouseover to the right stars and removes it onmouseout
2021-12-08 17:18:45 +01:00
Sanne de Vries
ed3b5e462f Updated audio card
Refs https://github.com/TryGhost/Team/issues/1230
2021-12-08 15:34:25 +00:00
Kevin Ansfield
9218c72b86 Added an additional blockquote style
refs https://github.com/TryGhost/Team/issues/1239

Repeatedly clicking the quote icon in the editor toolbar or using the <kbd>Ctrl+Q</kbd> keyboard shortcut will cycle through standard-blockquote -> alternative-blockquot -> standard paragraph.
2021-12-08 15:19:39 +00:00
Kevin Ansfield
e21bde39e1 Updated CTRL+Q blockquote keyboard shortcut to cycle through alt style
refs https://github.com/TryGhost/Team/issues/1239

- updates keyboard shortcut behavior to match the quote icon behavior where it cycles through blockquote->aside->p
2021-12-08 15:19:39 +00:00
Thibaut Patel
811ca6d08e Allow multiple paragraphs in the product card description
refs https://github.com/TryGhost/Team/issues/1245
2021-12-08 16:00:49 +01:00
Thibaut Patel
b157bf7c34 Added enter/tab support to the product card title field
refs https://github.com/TryGhost/Team/issues/1245

- Enables keyboard-only title+description input
2021-12-08 15:08:40 +01:00
Thibaut Patel
120deae9b1 Allowed line-breaks in product card description
refs https://github.com/TryGhost/Team/issues/1245
2021-12-08 14:42:00 +01:00
Thibaut Patel
b03f72c59e 🐛 Fixed pasting html into a KoenigBasicHtmlInput
refs https://github.com/TryGhost/Team/issues/1245

- Several inputs where dismissing the content when pasting HTML without the expected input tag
- The inputs where: the caption of the feature image; the email footer; the caption in the bookmark, code, embed, gallery, image, video cards; the callout card title; the product card header and description; the toggle header
- This makes sure the wrapper html tag is the expected one.

Co-authored-by:
- Kevin Ansfield (@kevinansfield)
2021-12-08 14:22:33 +01:00
djordje vlaisavljevic
50516e47d5 Updated editor template and styles for product card
refs https://github.com/TryGhost/Team/issues/1245
2021-12-08 13:55:18 +01:00