Commit Graph

179 Commits

Author SHA1 Message Date
Peter Zimon
c5c0fd4d20 Fixed tags code mirror UI bugs 2021-02-22 21:30:02 +01:00
Sanne de Vries
1873271c8b Fixed minor dark mode issues
No ref

- Nav list item hover state
- Dropdown option hover state
- Top border on member details page
- Integrations directory items background color
- Published label background color
2021-02-17 10:23:21 +01:00
Peter Zimon
377a2ffd54 Added dashboard UI skeleton 2021-02-16 18:12:24 +01:00
Sanne de Vries
86ff51e510 Fixed section header border in dark mode 2021-02-15 18:22:54 +01:00
Sanne de Vries
0d1f288beb Fixed dark mode issues 2021-02-15 18:03:07 +01:00
Peter Zimon
adc4e1e077 Updated dark styles 2021-02-11 16:24:49 +01:00
Peter Zimon
1ebff66109 Dark mode UI fixes 2021-02-10 16:36:08 +01:00
Sanne de Vries
48c9318089 Updated dark mode colors (#1827)
No issue

- Proposed color refresh for dark mode
- Improved overall styling for code injection in post settings and tag settings and added dark mode
2021-02-10 11:15:19 +01:00
Peter Zimon
04d9caefed Updated navigation (#1832)
no issue

Updated settings navigation to a completely redesigned flow for Ghost 4.0 🎉

Co-authored-by: Kevin Ansfield <kevin@lookingsideways.co.uk>
Co-authored-by: Fabien O'Carroll <fabien@allou.is>
Co-authored-by: Rish <zrishabhgarg@gmail.com>
2021-02-02 16:08:06 +00:00
Kevin Ansfield
6954d2f185 Added <GhBrowserPreview> component for re-usable browser chrome 2021-02-02 16:08:05 +00:00
Sanne de Vries
c45294717c Improved preview post modal design and added mobile view
refs https://github.com/TryGhost/Team/issues/451

- Added mobile view to the post preview modal
- Replaced tabs text with icons
- Moved back button and added publish button
- Changed copy-link design to be aligned with link preview in portal
- Changed layout for social previews
- Added images to the Twittr and Facebook previews
- Added labels to the social previews
- Changed styling for the "Preview post" button in editor
2021-02-02 16:08:05 +00:00
Kevin Ansfield
d48abaa1f8 Added outline launch wizard framework
refs https://github.com/TryGhost/Team/issues/450

- adds `launch/*` routes corresponding to launch wizard steps
- sets up navigation between each wizard step
- adds components for each `launch/*` step to contain step-related functionality and facilitate later refactoring to a generalised wizard component
- adds link to the launch wizard from the dashboard screen
2021-01-18 13:48:23 +00:00
John O'Nolan
eea1ddab71 Updated integrations showcase: Plausible, Ulysses, GitHub 2021-01-14 19:29:21 +07:00
Peter Zimon
c46198f728 Update post email preview design (#1767)
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
2020-11-16 12:16:51 +01:00
Peter Zimon
44bcf3b46f Updated dark style for email settings
no refs.
2020-11-13 16:05:00 +01:00
Sanne de Vries
5cbd9f0f78 Adjusted code injection fields in settings to dark mode 2020-09-04 21:41:19 +02:00
Sanne de Vries
11699d5172 Fixed transparent background pattern for blog logo and icon in dark mode 2020-09-04 15:25:32 +02:00
Scott Cabot
73c87de243 🐛 Changed caret color to white in code editor on Night Shift
closes #12154
Adds a new css class selector to app-dark.css to mimic the same effect as created in the gh-markdown-editor. The class keonig-card-html--editor is applied conditionally when the card is in edit mode, as per its template file. This now makes the cursor the same color as the text and easier to read.
2020-08-24 16:24:03 +01:00
Peter Zimon
a819837bd4 Refined members import modal dropdown
no refs.
- updated style of members import modal field dropdown
2020-07-07 13:07:21 +02:00
Peter Zimon
09f4a48bc5 Refined styles and copy for member import dialog
no refs.
- refined copy for Stripe warnings for members import pre-validation
- updated styles for data preview for dark mode
2020-07-01 07:24:10 +02:00
Rishabh Garg
23537355b6 Added live preview to members settings modal (#1622)
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
2020-06-26 02:15:47 +05:30
Peter Zimon
e6998afb40 Icon fixes on integrations night shift
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
2020-04-20 17:51:56 +02:00
Nazar Gargol
11e59e1f7e Moved billing page to a popup
no issue

- To simplify styling and give a better separation feeling from UI perspective
2020-04-09 17:26:11 +12:00
Rishabh Garg
d115204d9f Added labels for Members (#1477)
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>
2020-02-14 15:04:01 +05:30
Peter Zimon
397e18c7c0 🐛 Fixed dark mode link input bug
no refs.
- fixed style bug for link input in Koenig having no blue border in dark mode
2020-01-21 12:27:30 +01:00
Rishabh Garg
6a1edceded Added members growth chart (#1424)
no issue

Adds new members growth chart in members list screen to highlight growth of members over different date ranges
2019-12-17 15:59:26 +05:30
Peter Zimon
735f6eb66f 🐛 Fixed darkmode color regressions
refs. https://github.com/TryGhost/Ghost/issues/11445

- fixed input field background colors in Post Settings menu in darkmode
- applied color variables to day picker calendar component
- fixed colors of day picker calendar in darkmode
2019-12-16 15:04:32 +01:00
Rish
b23288a41b Added email preview modal flow 2019-11-05 13:10:49 +07:00
Peter Zimon
549fb7193a Dark mode related fixes
no issue

- fixed double border for tags tabs
- refined view action button border
- fixed border for staff avatar
- fixed member avatar label color
2019-10-20 10:41:03 +02:00
Peter Zimon
f60fce91ca Fixed dark mode form group style 2019-10-20 10:41:03 +02:00
Kevin Ansfield
159e810d5c Merge branch 'master' into v3 2019-10-08 14:04:38 +01:00
Peter Zimon
ce50606529 Updated member details screen design
no issue
2019-10-03 13:46:36 +02:00
Rish
4a3fd90017 Updated members list/detail screens base structure
no issue
2019-10-02 17:05:57 +05:30
Naz Gargol
7e3412ce8e 🔥 Removed all subscriber feature related code (#1337)
refs https://github.com/TryGhost/Ghost/pull/11153

- Removed all subscriber feature related code
- The feature is being substituted by members
2019-09-26 15:58:01 +02:00
Kevin Ansfield
5225a3d30a Added "What's new" indicator and modal to highlight recent updates (#1292)
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
2019-08-23 10:01:27 +01:00
Zimo
ca1644afc0 Night shift visual refinements
no refs.

- fixed visual bugs with buttons
- fixed background color of the SEO preview in night shift
2019-06-21 14:20:37 +02:00
Peter Zimon
c51bce7358 🎨 Updated admin area design and usability (#1232)
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
2019-06-18 11:47:20 +01:00
Zimo
428984bca2 Fixed integration icon background for Night shift
refs. 35d8e43c88

The blending mode used on light theme didn't work for Night shift (made all the icons blend into the dark background).
2019-03-25 14:38:16 +01:00
John O'Nolan
181de6f5ea View site inside Ghost Admin
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
2019-03-21 10:33:14 +01:00
Rish
57f9663b6e Added members feature to labs
no issue

- Added new members settings/toggle to labs
2019-02-26 15:33:38 +07:00
Kevin Ansfield
0d9bb4a07b Moved Spirit CSS library from external to internal 2019-02-24 11:19:22 +07:00
Peter Zimon
605b89a0d2 Left navigation menu update (#1102)
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)
2019-02-22 16:43:35 +07:00
Vikas Potluri
6c93b1bea8 🎨 clean up hover state borders in night shift (#1077)
no issue
2019-01-22 09:26:38 +00:00
Kevin Ansfield
5e3de1c333 🎨 Removed auto hide/show navigation toggle (#1094)
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
2019-01-10 15:00:07 +00:00
John O'Nolan
e36f8ca0c1 Added new theme directory links to Ghost Admin (#1078)
* Add new theme directory links to Ghost Admin

* Dark mode fixes
2018-12-04 18:04:52 +07:00
Zimo
474ccaf51a Koenig - Night Shift support
refs https://github.com/TryGhost/Ghost/issues/9623
- bump `ghost-spirit` dependency to include dark mode support
- import Spirit's dark mode file in `app-dark.css`
2018-06-07 09:48:27 +01:00
Kevin Ansfield
61513ac366 🐛 Fixed broken scrolling/scroll bars in Code Injection inputs
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
2018-06-04 13:29:28 +01:00
Kevin Ansfield
7f9c399812 Improved delete subscriber icon visibility in Night Shift
refs https://github.com/TryGhost/Ghost-Admin/pull/989
- changed the delete subscriber icon to match the colour of the rest of the table contents (thanks @CriticalRespawn)
- replaced manual colour hex code values with respective colour var in `app-dark.css`
2018-06-04 11:29:23 +01:00
Zimo
4c05d618bd Koenig - Replace custom CSS classes with Spirit
no issue
- Koenig container styles for Spirit
- Applying Spirit styles to card menu
- Applying Spirit styles to generic cards
- Replacing icon styles with Spirit
- Fix slash menu selected state
- Cleanup of unused files + fix empty HTML
2018-05-02 15:54:22 +01:00
Kevin Ansfield
6bff262849 Switch to packaged version of Spirit (#985)
no issue
- remove the manually copied Spirit CSS files
- remove the manually copied Spirit helpers
- install `ember-cli-ghost-spirit` addon
- remove manual postcss configuration
- update all `color()` functions in CSS to `color-mod()`
- fixed invalid `color-mod()` usage in `power-calendar.css`
- bump sub-dependencies
2018-04-03 11:52:18 +01:00
Austin Burdine
2a55c5767f Bower => NPM (#972)
no issue

- Convert validator to an npm dependency
  - clean up validator imports
  - fix validator function imports
  - remove unused validator extensions
- Convert devicejs to an npm dependency
- Convert remaining used bower deps to npm deps
- 🔥 Remove bower & unused bower dependencies
- remove globals imports in favor of direct module imports where possible
2018-03-19 17:56:09 +00:00
Kevin Ansfield
6d4d6cbc51 Koenig - HTML card template
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
2018-02-03 19:20:50 +01:00
Kevin Ansfield
61cf4d46db Koenig reboot - rich text (#952)
refs https://github.com/TryGhost/Ghost/issues/9311

Koenig is being fully rebooted, first port of call is to focus on getting the rich-text only aspect of mobiledoc-kit working with our popup toolbar.

- renames old koenig implementation (used for reference, will eventually be deleted)
- new `{{koenig-editor}}` mobiledoc-kit component implementation based on ember-mobiledoc-editor
  - markdown text expansions
- new `{{gh-koenig-edtor}}` that wraps our title+editor and handles keyboard navigation between the two
  - clicks below content will focus the editor
- new `{{koenig-toolbar}}` component for the popup formatting toolbar with improved behaviour and simplified code
2018-01-30 10:01:07 +00:00
Kevin Ansfield
506b2a9388 Resurrect the old alpha Koenig editor (#916)
requires https://github.com/TryGhost/Ghost/pull/9277

- added a `koenigEditor` feature flag
  - modified the feature service to accept a `developer` boolean on the options object passed into the internal `feature` method, if `true` the feature flag won't be enabled unless the `enableDeveloperExperiments` config option is also enabled
  - added "developer feature testing" section in labs that's only visible if `enableDeveloperExperiments` config flag is enabled
  - added koenig editor toggle to the developer section in labs

- enabled a switch between the markdown and koenig editors
  - modified the default value of the `mobiledoc` attr in the Post model to be a blank mobiledoc or blank markdown mobiledoc depending on the feature flag
  - modified the `autofocus` switch in editor controller's `setPost` method so that it is always switched, even for new->edit where the post model isn't swapped
  - added a compatibility check to the editor controller's `setPost` method that shows an alert and force enables the koenig editor if the koenig flag is not enabled and the opened post is not compatible with the markdown editor

- fixed various issues that have appeared due to the old koenig alpha becoming out of sync with master
2018-01-18 15:36:01 +00:00
Kevin Ansfield
8072d75401 Fixed some Night Shift colours in the post settings menu
closes https://github.com/TryGhost/Ghost/issues/9244
- adjust weekday and current day text colours in the calendar popup to improve legibility
- match the new tags input colours to the other form inputs
2018-01-02 11:29:23 +00:00
Kevin Ansfield
0106a21e3c New tags input, drop selectize & jquery-ui deps (#892)
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
2017-10-31 09:10:49 +00:00
Kevin Ansfield
66805967f9 🐛 Fixed unreadable HTML property colours in Night Shift mode (#885)
closes https://github.com/TryGhost/Ghost/issues/9080

- increase lightness of the default CodeMirror html property colour
2017-10-02 19:49:33 +02:00
Kevin Ansfield
e59555c2d2 🐛 Fixed visibility of spellcheck errors in Night Shift mode (#874)
closes https://github.com/TryGhost/Ghost/issues/9056

- decrease transparency of background color applied to spellcheck errors in night shift
2017-09-28 09:46:48 +07:00
Victor Truong
726e396cc5 🎨 Mellowed the bright white info boxes in night shift mode (#869)
no issue
- add background and text colours to `.gh-box` that better match the night shift aesthetic
2017-09-25 10:04:32 +01:00
Kevin Ansfield
a22f80d388 🐛 Fixed unreadable Unsplash search text in Night Shift mode (#866)
closes https://github.com/TryGhost/Ghost/issues/9030

- don't change the search input's background color when the input has focus in Night Shift
2017-09-21 11:14:08 +02:00
John O'Nolan
c20214af08 🎨 Improve visibility of unchecked checkboxes (#851)
no issue

* Checkboxes now have greater contrast when unchecked to make them more visible
* Checkbox colour tweaks for nightshift
2017-09-10 09:28:28 +01:00
Kevin Ansfield
ffbcd32a42 🎨 Fix legibility of contributor names in Night Shift
closes TryGhost/Ghost#8851
- use `var(--lightgrey)` as text colour for contributor names
2017-08-17 11:37:13 +01:00
Vikas
0c2e07451a 🎨 Improve legibility of theme uploader text in Night Shift (#823)
closes TryGhost/Ghost#8875
- use `var(--midgrey)` for `.gh-image-uploader .description` (only used in file `{{gh-file-uploader}}`)
2017-08-17 11:27:03 +01:00
Kevin Ansfield
46458487fd 🐛 Fix Unsplash when using Night Shift (#828)
closes https://github.com/TryGhost/Ghost/issues/8905
- import unsplash css file in `app-dark.css`
- add background and logo styles to match night shift styles
2017-08-16 10:04:07 +01:00
John O'Nolan
63df5ffb9b Resolve nightshift visual bugs
Closes https://github.com/TryGhost/Ghost/issues/8731, closes https://github.com/TryGhost/Ghost/issues/8742

- Visual bugs resolved
- Slack test message converted from alert to notiftication
- Slack test message notification copy update
- Increased size for notifications
2017-07-31 11:49:49 +04:00
John O'Nolan
2ef4472523 Minor colour update for nightshift
See https://github.com/TryGhost/Ghost/issues/8715
2017-07-20 18:07:00 +04:00
Kevin Ansfield
7a5d132e1a 🎨 fix about logo colours in nightshift (#793)
closes https://github.com/TryGhost/Ghost/issues/8715
- use SVG logo, invert in nightshift
- fix colour of `>` in screen titles in nightshift
2017-07-20 17:59:45 +04:00
Kevin Ansfield
d2a1835f5a 🎨 fix editor header not covering scrolled content (#769)
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
2017-07-06 17:23:14 +07:00
John O'Nolan
32f419e87c Visually stimulating cursor 💅🏼 2017-06-21 13:05:14 +01:00
John O'Nolan
cbd18c6253 Update dark mode
Fixes https://github.com/TryGhost/Ghost/issues/8560

Depends on https://github.com/TryGhost/Ghost-Admin/pull/733
2017-06-12 21:50:17 +01:00
Kevin Ansfield
05a3a11855 welcome tour (#527)
refs https://github.com/TryGhost/Ghost/issues/5168
- adds a `tour` service that handles syncing and management of tour throbbers & content
- adds a `gh-tour-item` component that handles the display of a throbber and it's associated popover when clicked
- uses settings API endpoint to populate viewed tour items on app boot/signin
- adds `liquid-tether@2.0.3` dependency for attaching throbbers and popups
- adds initial tour contents
2017-06-08 22:00:10 +07:00
Kevin Ansfield
762c3c4df0 SimpleMDE editor (#682)
no issue

* move "save on first change" behaviour into editor controller
* allow TAB events to be specified in keyEvents hash of gh-input
* replace mobiledoc-kit/gh-koenig with a SimpleMDE based editor
    - remove `gh-koenig` in-repo-addon from `package.json` so that test files etc aren't loaded
    - remove `mobiledoc-kit` dependencies
    - extends `gh-editor` to handle file drag/drop
    - adds `gh-uploader` and `gh-progress-bar` components to handle file uploads in a more composable manner
    - adds `gh-simplemde` component that wraps SimpleMDE
2017-05-08 11:35:42 +01:00
Kevin Ansfield
e22eb668c4 💄 refactor setup screens to use ember-concurrency (#644)
refs TryGhost/Ghost#7865

💄 refactor signup to use ember-concurrency

refs https://github.com/TryGhost/Ghost/issues/7865
- moves authentication actions from `signup` route to controller
- refactors authentication and signup logic into EC tasks
- replaces use of `gh-spin-button` with `gh-task-button` in signup template

💄 refactor setup screens to use ember-concurrency

refs https://github.com/TryGhost/Ghost/issues/7865
- moves authentication actions from `setup/two` route to controller
- refactors authentication and setup logic into EC tasks
- replaces use of `gh-spin-button` with `gh-task-button`
- fixes some styling issues with the new SVG icons
- adds `app/styles/patterns/icons.css` back to contain per-icon overrides and animations (some SVGs use fills and others use strokes so we sometimes have conflicting styles)
2017-04-19 12:27:32 +02:00
Aileen Nowak
b8a1036a43 No more icon font: {{inline-svg}} - Part 2 (#642)
closes TryGhost/Ghost#8107
- replaces all icons in Ghost-Admin with SVGs by using our new helper {{inline-svg}}.
- removes all ghosticon fonts.

This is the second and final batch of the refactor.
2017-04-14 17:22:14 +01:00
Kevin Ansfield
35cf6c9829 new publish menu and date/time picker (#588)
closes https://github.com/TryGhost/Ghost/issues/8249

- replaces the old split-button publish/schedule/update button with a less confusing menu system
- adds a `{{gh-date-time-picker}}` component that contains a datepicker with separate time input
- replaces the date text input in the post settings menu with `{{gh-date-time-picker}}`
  - disabled when post is scheduled, only way to update a scheduled time is via the publish menu
  - validates date is in the past when draft/published so there's no confusion with scheduling
- displays saving status in top-left of editor screen
- refactor editor (auto)saving processes to use ember-concurrency

Other minor changes:
- adds `post.publishedAtBlog{TZ,Date,Time}` properties to Post model to allow working with `publishedAt` datetime in the selected blog timezone rather than UTC
- adds a `beforeSave` hook to `validation-engine` that is called after successful validation and before the Ember Data save call is made
- adds validation of `publishedAtBlog{Date,Time}` to post validator
- prevent gh-task-button showing last task state on first render
- fixes bug where clicking into and out of the published date input in the PSM without making any changes saves a published date for draft posts
2017-04-11 14:39:45 +01:00
Aileen Nowak
f931f27dd4 🎨 No more icon font: {{inline-svg}} (#605)
refs TryGhost/Ghost#8107
- Replaces icon font with `{{inline-svg}}` helper incl. necessary style adjustments.
2017-04-07 16:23:45 +01:00
Kevin Ansfield
400150e67b 🔥 remove unused popover components (#620)
no issue

- `gh-popover` and `gh-popover-button` are no longer used in the codebase
- removing them seems prudent as we are moving towards a different approach for dropdowns/popovers/tethers etc
2017-04-05 14:08:29 +01:00
Austin Burdine
0366bde545 💄 import gh-koenig styles into dark mode stylesheet 2017-03-03 16:54:50 +00:00
John O'Nolan
2a300e0410 Prototype nightshift 🌆 2017-02-17 12:31:12 -06:00