From f476c268b593bf27a6922f60a1de84b2926dda29 Mon Sep 17 00:00:00 2001 From: Peter Zimon Date: Wed, 25 Nov 2020 11:31:15 +0100 Subject: [PATCH] Zapier templates update (#1783) - updated Zapier templates page to show the most relevant Zaps instead of the latest - fixed design regression in Slack, Amp and Unsplash integration pages --- ghost/admin/app/styles/layouts/apps.css | 53 ++++++ ghost/admin/app/styles/layouts/settings.css | 9 + .../app/templates/settings/integration.hbs | 8 +- .../templates/settings/integrations/amp.hbs | 6 +- .../templates/settings/integrations/slack.hbs | 2 +- .../settings/integrations/unsplash.hbs | 4 +- .../settings/integrations/zapier.hbs | 170 +++++++++++++++++- .../public/assets/icons/ghost-squircle.svg | 7 + ghost/admin/public/assets/img/google-docs.svg | 17 ++ ghost/admin/public/assets/img/patreon.svg | 1 + ghost/admin/public/assets/img/paypal.svg | 1 + ghost/admin/public/assets/img/twitter.svg | 1 + ghost/admin/public/assets/img/zapier-logo.svg | 1 + ghost/admin/public/assets/img/zero-bounce.png | Bin 0 -> 16424 bytes 14 files changed, 262 insertions(+), 18 deletions(-) create mode 100644 ghost/admin/public/assets/icons/ghost-squircle.svg create mode 100644 ghost/admin/public/assets/img/google-docs.svg create mode 100644 ghost/admin/public/assets/img/patreon.svg create mode 100644 ghost/admin/public/assets/img/paypal.svg create mode 100644 ghost/admin/public/assets/img/twitter.svg create mode 100644 ghost/admin/public/assets/img/zapier-logo.svg create mode 100644 ghost/admin/public/assets/img/zero-bounce.png diff --git a/ghost/admin/app/styles/layouts/apps.css b/ghost/admin/app/styles/layouts/apps.css index 637da64fe0..36634dc2de 100644 --- a/ghost/admin/app/styles/layouts/apps.css +++ b/ghost/admin/app/styles/layouts/apps.css @@ -389,4 +389,57 @@ .new-webhook-cell:hover { background: var(--whitegrey-l2); +} + +/* Zapier templates */ +/* ---------------------------------------------------------- */ +.gh-settings-zapier-templates .apps-grid-cell:hover { + background: var(--white); +} + +.zapier-template-link:hover { + border-color: #f04600; +} + +.zapier-template-link span { + transition: all 0.2s ease; + transition-property: color; +} + +.zapier-template-link:hover span { + color: #f04600; +} + +.gh-settings-zapier-templates .apps-card-app-title { + margin-left: 8px; + white-space: unset; +} + +.gh-settings-zapier-templates .apps-card-app { + height: 68px; +} + +.gh-settings-zapier-templates .gh-card-right { + display: flex; + flex-direction: column; + justify-content: center; +} + +.zapier-footer, +.zapier-footer a { + display: flex; + justify-content: flex-end; + align-items: center; + color: var(--midgrey); + font-size: 1.3rem; +} + +.zapier-footer figure { + margin: 0 0 2px; + width: 47px; + height: 47px; + background-position: 50%; + background-size: cover; + background-repeat: no-repeat; + border-radius: 15%; } \ No newline at end of file diff --git a/ghost/admin/app/styles/layouts/settings.css b/ghost/admin/app/styles/layouts/settings.css index 4239975349..c4e497e6ed 100644 --- a/ghost/admin/app/styles/layouts/settings.css +++ b/ghost/admin/app/styles/layouts/settings.css @@ -895,4 +895,13 @@ p.theme-validation-details { height: 34px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; +} + +.gh-setting-amp-liquid { + padding-left: 40px; + padding-right: 40px; +} + +.gh-setting-unsplash-checkbox { + margin-bottom: 0; } \ No newline at end of file diff --git a/ghost/admin/app/templates/settings/integration.hbs b/ghost/admin/app/templates/settings/integration.hbs index b3d851f330..0f95cf242b 100644 --- a/ghost/admin/app/templates/settings/integration.hbs +++ b/ghost/admin/app/templates/settings/integration.hbs @@ -94,7 +94,7 @@ - + - + @@ -234,7 +234,7 @@
Content API KeyContent API key
@@ -119,7 +119,7 @@
Admin API KeyAdmin API key
@@ -139,7 +139,7 @@
{{#if (eq this.regeneratedKeyType this.integration.adminKey.type)}} -
Admin API Key was successfully regenerated
+
Admin API key was successfully regenerated
{{/if}}
diff --git a/ghost/admin/app/templates/settings/integrations/amp.hbs b/ghost/admin/app/templates/settings/integrations/amp.hbs index 5ba919661c..f1df1bfafd 100644 --- a/ghost/admin/app/templates/settings/integrations/amp.hbs +++ b/ghost/admin/app/templates/settings/integrations/amp.hbs @@ -31,7 +31,7 @@
AMP configuration
-
+
Enable AMP
@@ -53,8 +53,8 @@
- {{#liquid-if this.settings.amp}} -
+ {{#liquid-if this.settings.amp class="nl5 nr5"}} +
Google Analytics Tracking ID
Tracks AMP traffic in Google Analytics, find your ID here
diff --git a/ghost/admin/app/templates/settings/integrations/slack.hbs b/ghost/admin/app/templates/settings/integrations/slack.hbs index 38038ae30d..99cef24bc1 100644 --- a/ghost/admin/app/templates/settings/integrations/slack.hbs +++ b/ghost/admin/app/templates/settings/integrations/slack.hbs @@ -33,7 +33,7 @@
Slack configuration
-
+
Webhook URL
diff --git a/ghost/admin/app/templates/settings/integrations/unsplash.hbs b/ghost/admin/app/templates/settings/integrations/unsplash.hbs index 9df2a990e7..0002f5b319 100644 --- a/ghost/admin/app/templates/settings/integrations/unsplash.hbs +++ b/ghost/admin/app/templates/settings/integrations/unsplash.hbs @@ -31,14 +31,14 @@
Unsplash configuration
-
+
Enable Unsplash
Enable Unsplash image integration for your posts
-
+