Made post email preview design consistent with the new email settings design preview.
* changed background
* added fake container windows and faux sender/recipient content
* updated mobile and dark mode
no-issue
This adds three initial customisation options for newsletters:
1. Show/Hide site title and logo
2. Set font to serif/sans serif
3. Display a publish with Ghost badge
This is the first step in allowing customisation of the look and feel of newsletters.
Co-authored-by: Rish <zrishabhgarg@gmail.com>
Co-authored-by: Peter Zimon <zimo@ghost.org>
* Added auto focusing preview on the signup page while being on links and clicking on any setting in the sidebar
* Refine upload custom portal icon button
* Updated copy for sidebar and links screen
* Added grouping to links list
no refs.
- in Portal settings domain and the path are separated visually so that it conveys the concept of using the relative URL instead of absolute
- for similar reasons, copy link copies only the path part
no issue
On newer iOS devices with no home button, we have this bar at the bottom of the screen instead. When installed as a PWA, the mobile nav sits under that bar. I'm unsure how much Ghost is used this way, but this is a small QOL improvement for those who do.
This PR uses the native `env` CSS custom properties Safari has to add a propriety amount of `padding-bottom` to the mobile nav bar, and also the global container to prevent anything in the iframe from being hidden by the taller nav bar. If the device does not support these `env` vars, is has no adverse affect. In order for this to work, the `<meta name="viewport" />` tag needs `viewport-fit=cover` added to it.
MDN docs for reference: https://developer.mozilla.org/en-US/docs/Web/CSS/env
* Fixed spacing issue with account menu by changing verticalPosition of the Ember dropdown component to 'above' and adjusted the top attribute as needed.
no issue
- Adds 2 new email address fields for members in email settings section - support address and reply-to address
- Support address - Is used for member auth emails as well as in themes and Portal for allowing members to contact support.
- Reply-to address - Is used to set `reply-to` address for newsletter emails that allows configuring where member's reply to emails will go
- Disabled from address update for empty value
- Updated success toast message and copy for from/support address update
- Changed section title + description for email addresses
- Added "public" to support email description
refs https://github.com/TryGhost/members.js/issues/77
- There was a quick flicker before the portal popup appears due to the site theme being visible in background till portal loads
- Adds the constant background with slight delay to show the frame which ensures the portal script is successfully loaded to minimise the visible flicker
closes https://github.com/TryGhost/members.js/issues/80
- This adds the link/attribute switcher and chooser directly to Admin in Portal preview area
- Thinks links/attributes section was previously shown as a Portal page
no issue
- updated single member delete modal copy + design layout
- swapped switch to regular checkbox + applied red color to it
- set button label based on checkbox state
no issue
- All interactions on the portal preview should be disabled to keep a focused view.
- Disabled pointer events on portal preview iframe to not allow any interactions on page that can cause popup to close or navigate away
no refs.
- refined typography, colors and layout
- using built in admin icons for portal button icon temporarily
- styled icons for future usage with inline svgs
no issue
- Adds new Look & Feel section to portal settings to control accent color, button style, text and icon
- Adds Links section to portal settings to show static links to control popup behavior
- Adds the 3 new portal settings to setting model
no issue
- Adds live preview of members.js modal UI to the new settings modal behind dev flag
- Uses `gh-site-iframe` to render site in preview mode with custom portal url
no issue
- initial UI for bulk-selection, focusing for now on first stage which is limited to select-all and delete actions
- adds "Edit" button to the members table that shows the "selection" toolbar in place of the table header and shows a checkbox next to each member
no issues.
- removes email and Stripe duplicate customer ID check to focus validation that might affect the whole dataset
- applies visual style and refines copy
no issue
- it's useful to be able to see the column headers anywhere in the list
- prep for having the table header toggle between normal and edit modes where having to scroll back up to the top of the page each time you want to toggle would be a poor experience
no issues.
- changed warning style when import can still happen
- combines all warnings to a single section
- hides details for warnings behind an expandable list so that
- updated copy
no issues
Updated and refined Stripe Connect design in Labs/Members settings:
- refined visuals and UI logic
- updated copy
- added switch for test mode
- added error handling
no issue
- the members list uses occluded rendering to keep scrolling performance high but this will cause constant reflows of the table contents whilst scrolling because contents are swapped in and out causing the browser to adjust the column widths to match longest/shortest content in the currently rendered set of rows
- applying `table-layout: fixed` to the table means that columns will always match the sizes defined by the first row of the table (in this case the header) ensuring that there is no dynamic resizing whilst scrolling
no issue
- Opted in to use explicit `hisotry.replaceState` and setting iframe's `src` using assignment instead of tracking it through computed property. This allows for tighter control over when iframe's history is updated which was causing problems when `src` was bound to computed property
- Added billing page metadata. This way browser history records appear with nicer signature
- Removed "update button" iframe and rewrote "global iframe" to not use modals. This allows to have single iframe on a page, which simplifies `postMessage` communication and preserve history inside iframe to be able to navigate it after closure
- Added route change handler responding to BMA app route changes. Allows to sync browser URL visible to the user with active route in BMA iframe. The sync is based on `hisory.replaceState` method that makes sure singular history records are kept in the browser history
- Added nested wildcard billing route. This is meant to catch all the nested routes inside of BMA iframe
refs https://github.com/TryGhost/Ghost/pull/11790
- After user fails to signin due to "locked" being locked a new view with automatic email message and more instructions will be shown to make the password reset process easier.
- Refined instructions screen
- Added icon + animation
- Refined copy
Co-authored-by: Nazar Gargol <nazargargol@gmail.com>
no issue.
- improved the Y axis of members list chart to only take the visible range into consideration. This way the change in a period is more understandable
- added labels to Y axis so that the range is clearer
no issue
- Added billing update button to navigation menu. Ghost-Admin communicates with billing iframe and displays this button based on the plan data that iframe returns
- Ghost-Admin communicates with an iframe using same mechanism as with token exchange - throu `window.postMessage` API
refs. https://github.com/TryGhost/Ghost/issues/11342
- replaced Zapier and Amp logos for SVGs with transparent background so that there's no white background in night shift
- inverted Unsplash icon in night shift (similarly to Mailchimp, Typeform etc.)
- replaced ellipsis icon for SVG and handled night shift color change
- removed unnecessary icon container drop shadow in integration detail pages for night shift
Displaying the role of suspended staff users is misleading, giving the false impression that those users still have access to the publication.
no refs.
- updated label to "Suspended" for all suspended staff user
no issue
refs TryGhost/Ghost#11538
* Added members label handling v1
* Added members label dropdown in list screen
* Updated selected labels and member list UI refactor
* Added v1 label add/delete modal
* Added add label modal v1
* Fixed disabled check for new label save
* First stab at member filters layout
* Updated member detail screen design
* Member detail refinements
* Added basic editing for member labels
* Fixed label deletion from members list
* Updated filtered list header
* Refinements for dropdown and empty filter state
* Refined label modal
* Updated member labels fetch logic
* Added custom dropdown component for labels
* Refined style for dropdown
* Refined dropdown button
* Restructure and refine members dropdown styles
* Added selected indication to dropdown
* Fixed dropdown footer style
* Removed member label placeholder
* Removed add label from member list actions
* New label refinements
* Added confirmation modal for label delete
* Added duplicate validation check for labels
* Updated validation check with slug
* Updated copy
* Updated actions dropdown copy
* Fixed visual glitch of dropdown on FF
* Hide scrollbar for labels dropdown
Co-authored-by: Peter Zimon <peter.zimon@gmail.com>
no issue
- list custom post views in collapsable sidebar navigation
- default views: Draft, Scheduled, Published (except for contributors)
- record expanded/collapsed state of the navigation menus in user settings via new `navigation` service
- adds `customViews` service that manages custom views
- provides list of default views
- gives access to "active" custom view based on current route and query params
- manages loading/saving of custom views to user settings
- show "Add view" button in the content filter when the posts list has been filtered
- show "Edit view" button in the content filter when the posts list filter matches a saved view
Co-authored-by: Peter Zimon <peter.zimon@gmail.com>
refs TryGhost/Ghost#11537
- Adds support for "Complimentary" plan toggle only when editing an existing member. The same functionality for adding a new member was left out intentionally for simplicity sake.
Co-authored-by: Peter Zimon <peter.zimon@gmail.com>
refs https://github.com/TryGhost/Members/pull/107
- Added 'cancel at period end' logic to members subscription details
- Added stripe subscription link in subscriptions details
no issue
- When an email has a valid gravatar handle it displays an image instead of initials for the member
- Introduces new {{gravatar}} helper which accepts an email as parameter and size/d as named parameters. The output is a URL to gravatar image
- Refactored usage of "splattribute" to explicit property. There was a need to duplicate class property usage in the component and doing that through splatttibute feature is unsafe as pointed ou here - https://github.com/TryGhost/Ghost-Admin/pull/1417#discussion_r351837584
no refs.
Issue was that the ratio of email mobile preview UI was completely off on higher screen resolutions.
- set the email mobile preview UI to fixed size
no issue
- There was a need to make the experience of adding a first member(s) as frictionless as possible, which lead to adding some actionable controls to the "no-members" screen.
- Adds the ability to make yourself a member
- Adds the ability to import CSV member
- Link to add a member manually
no issue
- We have a need to create a member manually, this changeset solves this problem.
- Added new member button to the member's screen
- Needed to be able to perform add member action
- Fixed inconsistent `createAt` naming. All models use consistent `createdAtUTC`, fixed it up so that members model follows the same pattern. If we want to change this pattern should probably happen for all models at once
- Fixed member avatar when creating a new member. If the values are completely empty the screen ends up being filled with empty space. Added some dummy initials which are recalculated once the member enters the name or an email
- Refactored DS naming for consistency. Nowhere else in the codebase 'DS' name is ever used, made this consistent
- Added missing validations in members form
- Simplified if conditions in the member list template. When using the if/esle statements unnecessary new-line symbols were inserted which made it hard to test. Also by using computed property view is much cleaner
- Updated member's model default value for `subscribed` to "true". It is turned on by default in the model layer on the backend (ref: https://github.com/TryGhost/Ghost/blob/3.1.0/core/server/data/schema/schema.js#L330), this behavior is intended and should be the same on the frontend
no issue.
- updated basic typographic style of Koenig to match better with Casper 3.0
- fixed vertical spacings of paragraphs and lists
- changed color of code text to make it more theme agnostic
- refined Koenig mobile typography
* Fixed Firefox bug for input groups
* Moved from `rem` based responsive styles to `px` based
* Fixed invisible clickable menus for member/user list
* Added responsive CSS for meembers list header
* Updated member list responsive styles
* Fix list header responsive style
no refs.
- fixes a visual bug that the checkmark icon's stroke color during the registration flow was #000. The bug was a sideeffect to the latest ember-svg-jar module update.
requires https://github.com/TryGhost/Ghost/pull/11024
With the bookmark card you can present links in a much richer format, similar to Twitter cards. If the URL points to a page with right meta information it can show the page title, excerpt, author, publisher and even a preview image.
Bookmark cards can be created in two ways:
1. pasting a link as the first thing in blank paragraph - we'll check to see if we can create an embed, if we can't then we'll create a bookmark card instead
2. manually selecting the bookmark card from the (+) menu or by typing "/bookmark<kbd>Enter</kbd>" or "/bookmark {url}<kbd>Enter</kbd>" for short (you might want to do this if you want the bookmark version instead of a full embed)
Pressing <kbd>Ctrl/Cmd+Z</kbd> after pasting will convert the bookmark card back to a link if that's preferred, alternatively a URL can be pasted with <kbd>Ctrl/Cmd+Shift+V</kbd> to avoid any automatic transformation to an embed/bookmark.
---
- adds "bookmark" card that functions similarly to the embed card
- if the oembed API request returns `type: "bookmark"` then the metadata is used to create a bookmark card
no issue
- adds `whats-new` service that fetches the changelog from ghost.org and exposes the latest changelog entries
- trigger a background fetch of the changelog from ghost.org when first loading the admin when logged in, or after signing in
- adds a "What's new" menu item next to the user popup menu
- adds an indicator to the user menu button and what's new menu item if there are unseen changelog entries
- closing the changelog modal will update the "last seen date", clearing both indicators
refs. https://github.com/TryGhost/Team/issues/205
Major update to Ghost Admin UI including:
- improved general consistency (typography, colors and contrast, UI components, icons)
- new design for post and pages lists, improved discoverability of filters
- search moved to modal
- account menu is decoupled from ghost logo
- further usability fixes
no issue
- removed `styleBody` mixin in favour of using Ember's `buildRouteInfoMetadata` hook and router events in the `ui` service
- refactored separate CSS classes for each unauthenticated route into a single `.unauthenticated-route` class because hiding mobile nav whilst unauthenticated was the only use for body classes
no refs.
- added view site in new tab button to sidebar
- show secondary actions on sidebar only on mouseover
- replaced labs icon
- refined spacing for view site
- unified colors of secondary icons
closes https://github.com/TryGhost/Ghost/issues/9494, refs https://github.com/TryGhost/Ghost/issues/10365
- removed `overflow-y: auto` on posts list to fix the vertical scrolling
- added `overflow-wrap: break-word` so that post previews are forced to wrap for long words such as URLs
- added `-webkit-overflow-scrolling: touch` to the main scrollable pane so that iOS Safari uses momentum scrolling
no refs.
Set blending mode to multiply on the integration icons (on Integrations screen) to remove the white background that was visible on hover and didn't fit with the background color of the table rows.
no refs.
- added "View site" as the first and default menu item in navigation bar to be able to browse the site without leaving the Admin
- rearranged left sidebar items according to new structure (moved Labs down to bottom)
- removed "View site" from publication main menu because it's become redundant
- added Night shift toggle in line with Labs menu to be able quickly access it
refs. [d6c22df](d6c22df6d7)
- added icons for members and pages
- improved view site link visibility
- added view site to logo dropdown
- updated all navigation and logo menu icons
- rename 'team' to 'staff'
- lots of design refinement and update (colors, shadows)
no issue
Updated custom integrations section for a more balanced and consistent design:
- removed green "New custom integration" button and added a fixed bottom row in the custom integrations list
- added "Custom integrations" heading to the list
- synced webhooks design with this pattern
no issue
- use broccoli-funnel to avoid polluting the `dist/` dir with unused build artefacts
- load codemirror and simplemde CSS up-front to avoid duplicate styles and specificity problems
- pull simplemde dependency out into a separate JS file and lazy-load in `{{gh-simplemde}}` component to reduce main bundle size. Before/after:
- `vendor.min.js 3.58 MB (795.88 KB gzipped)`
- `vendor.min.js 3.32 MB (710.66 KB gzipped)`
no issue
- fixed bug introduced in https://github.com/TryGhost/Ghost-Admin/pull/1095 by the addition of an `<occluded-content>` element which meant the `:first-child` class was no longer being applied
no issue
- the autonav behaviour has outlasted it's usefulness - it was mostly useful for editing but the editor screen is now always fullscreen and the number of low-resolution screens has dropped significantly
- dropped the components and all supporting code associated with autonav behaviour
refs https://github.com/TryGhost/Ghost/issues/9724
- fixed Card menu plus icon's rounded edges
- decreased link toolbar appearance delay
- changing 'H'/'h' toolbar mapping to 'H2'/'H3' and harmonized title font size
refs https://github.com/TryGhost/Ghost/issues/9724
- when Koenig is active, toggle `ui.isFullscreen` when entering/leaving the editor route
- add `ui.isFullscreen` to the `showNavMenu` CP in the application controller
- when in fullscreen mode, display a "< Stories" link in the editor header
- refine editor header style
closes https://github.com/TryGhost/Ghost/issues/9635
- CodeMirror expects default CSS box-sizing rather than `border-box` so it's scroll calculations were thrown off
- reset the `box-sizing` properties on CM elements
- remove now unnecessary `.CodeMirror-scroll` patches that we'd put in place to cover broken scroll behaviour
- move all non-layout-specific CM styles into a `components/codemirror.css` file
no issue
* Fixing 'Suspended' label on user screen
* Replace default avatar on users screen
* Remove shadow of 'Publish' button to work better on top of full width images
no issue
- Ember will not output the application template wrapper div in the future but it's possible to optionally enable that feature now
- fixes test harness render so that all elements are constrained to the application wrapper rather than breaking out with `position: fixed` and covering the test results
no issue
- remove jQuery usage in `{{gh-markdown-editor}}` (general cleanup)
- switch `koenig-card-markdown` to use `{{gh-markdown-editor}}`
- update markdown editor styles to fit within the card interface
- add `{{gh-editor}}` for handling image uploads and drag/drop
refs https://github.com/TryGhost/Ghost/issues/9314
* added save button for contributor
* hide tag filter & redirect to posts.index if post is published
* update editor controller test to need session service
refs https://github.com/TryGhost/Ghost/issues/9311
- add a basic HTML card that renders a CodeMirror editor
- adjust styles so that CodeMirror styles for the markdown editor don't affect CodeMirror instances inside Koenig
refs https://github.com/TryGhost/Ghost/issues/5071
Upgrade messages are now shown on the About screen rather than as alerts. Notifications that are marked as `top` or `custom` are still shown as alerts to allow for certain upgrade messages to be given more visibility.
- remove old `upgrade-notification` service
- update the `upgrade-status` service:
- add a `message` property that contains an upgrade notification if any exists
- add a `handleUpgradeNotification` method that accepts a Notification model instance and extracts the `notification.message` property into a html safe string for use in templates
- when loading server notifications during app boot, pass notifications that aren't marked as `top` or `custom` to the new `handleUpgradeNotification` method
- update the `about.hbs` template to pull the upgrade message from the `upgradeStatus` service
closes https://github.com/TryGhost/Ghost/issues/9249
- in `{{gh-cm-editor}}` display a standard textarea in place of the CodeMirror editor whilst CodeMirror assets are loading in the background, textarea will be upgraded to a CodeMirror editor when loading finishes
- update styles so that the switch from plain textarea to CodeMirror is not too jarring
closes https://github.com/TryGhost/Ghost/issues/9356
- it was possible to start a selection from outside of CodeMirror's control, this was confusing because text appeared to be selected but wasn't
- disable user selection on the outermost CodeMirror wrapper so that the selection behaves as it does with a normal textarea where the selection needs to start from inside the content area
refs https://github.com/TryGhost/Ghost/issues/8744
- active styles for mobile nav bar
- extra padding in the editor
- fixed bugs in team listing screen
- improved layout in the "Invite a new user" modal
- fixed bugs in theme listing layout
- improved layout of "Import content" file selection/import button
closes https://github.com/TryGhost/Ghost/issues/6458
- swap `ember-sortable` for `ember-drag-drop` in navigation UI
- extract PSM tag input into new `{{gh-psm-tags-input}}`
- add new `{{gh-token-input}}` that wraps `ember-power-select` and `ember-drag-drop` to replicate the previous selectize based tags input
- enhance `{{gh-psm-tags-input}}` behaviour to highlight selected primary tag and show "primary/internal" in selected tag titles
- 🔥 remove `selectize`
- 🔥 remove `jquery-ui`
- 🔥 remove unused `{{gh-navigation}}` component
closesTryGhost/Ghost#8962
- fix inability to close menu after clicking "more" in mobile quick-nav (credit @nithindavid)
- fix stories list header padding at iPhone 6S sizes
- fix horizontal scroll when menu is open
closesTryGhost/Ghost#8896
- remove `margin-right: 30px` and forced `overflow: scroll` styles for CodeMirror's "Scroll" element in the code injection editors
refs https://github.com/TryGhost/Ghost/issues/8744
- adjust padding of `.apps-card-meta` at mobile sizes
- adjust title font-size of `.apps-card-title` at mobile sizes
- adjust wrapping behaviour of actions and status badge of invites on team screen
closes https://github.com/TryGhost/Ghost/issues/8729, closes https://github.com/TryGhost/Ghost/issues/8728
- remove the duplicated `max-height` rules for different parts of the power select dropdowns - they were interacting with each other and causing a large part of the lists to be unreachable
- bump the `bufferSize` so that enough dropdown items are rendered to fill the dropdown list
- filter the temporary tags that are created when using the PSM tags input so duplicates aren't visible in the tags dropdown filter
no issue
With GScan sending error details now, the modal was a bit overloaded.
This PR adds a toggle for each error rule which - when clicked - shows the details and the affected files.
closes https://github.com/TryGhost/Ghost/issues/8540
- use `{{vertical-collection}}` in the tags dropdown filter list, opening the dropdown is now virtually instant as it's not attempting to immediately render components for every tag in the list
- remove pagination/infinite scroll from tags screen
- load all tags when accessing the tags screen
- will pause to show spinner if no tags have previously been loaded
- if tags exist in the ember data store, show the list immediately and load/update list in the background
- use `{{vertical-collection}}` to render enough tags to fill the scrollable area with a small buffer and use occlusion and element re-use to swap tags in whilst scrolling (suuuuper fast no matter number of tags loaded)
- scroll tags into view when they are selected (keyboard nav now makes a lot more sense)
- tested with 875 tags and 2x/5x CPU throttling with no major slowdowns 🎉
no issue
- background color of the editor header at smaller screen sizes had been removed resulting in the editor content showing through when scrolling, this adds the explicit bg color back for both normal and dark mode
closesTryGhost/Ghost#8222
- there are fatal and normal errors
- fatal === can't activate a theme
- the normal errors are only returned in development mode (!)
- Separate between `fatal` and normal errors and group them
closes https://github.com/TryGhost/Ghost/issues/8384
- fixes image uploads on settings/general by reverting to jQuery for triggering the file dialog because IE11 doesn't support `MouseEvent` events or have the `.closest` method on native DOM elements
- gives all SVG elements an explicit `width` and `height` - if one property is set to `auto` or not specified IE11 will treat it as 100% of the container
- fixes horizontal scroll + scrollbar on the main app viewport
closes https://github.com/TryGhost/Ghost/issues/8504
- allow `.settings-code-editor` to inherit from `.gh-input` - fixes border colours
- change `gh-cm-editor`'s "focused" class from `.focused` to `.focus` so it can inherit `.gh-input` styles
- add lazy loading of CM styles back in `gh-cm-editor` but prevent `lib/codemirror.css` from being compiled into the codemirror styles so that we get the theme colours without causing conflicts with the main editor
no issue
- force editor toolbar to a fixed height, previously flexbox behaviour meant that it would squash the space above/below the buttons at smaller screen heights
refs https://github.com/TryGhost/Ghost/issues/8464
- fix padding on user actions button
- match user screen heading to other screens
- match app screen headers to other screens, update form styles
- change header link colour to match non-link colour
- fix team acceptance test
- fix canvas top padding so header elements always align
- reduce header font size
refs https://github.com/TryGhost/Ghost/issues/5422
- handles errors and warnings from returned from the server and improves visual display
- adds a reset so that errors are cleared when leaving the labs screen
- removes the unnecessary "Import failed" alert - we already show the errors on the screen, no point bugging the user even further
refs TryGhost/Ghost#8455
- ensure `uploadUrls` and `errors` are cleared in `gh-uploader` when new uploads are started
- yield `isUploading` in `gh-uploader` component
- replace image upload modals in settings/general with in-page uploads
closes https://github.com/TryGhost/Ghost/issues/8461
- adds toggle spellcheck button to the `gh-markdown-editor` toolbar
- adds custom styles to fake a spellcheck icon
- updates `simplemde` fork
- adds `spellcheck` to the list of toolbar buttons that don't have their `active` class removed based on cursor position
- removes bundled `marked` dependency that we no longer use
closesTryGhost/Ghost#7134
Overhaul of the user settings page to make it more consistent with other settings panels.
The hardly readable validation for user "Full Name" is redundant as well, as the input field for it now has the same styles as the other input fields.
