Refined mailgun warning

TryGhost · Nov 7, 2019 · e2dd5f5 · e2dd5f5
1 parent d75f826
commit e2dd5f5
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 9 deletions.
diff --git a/app/styles/components/settings-menu.css b/app/styles/components/settings-menu.css
@@ -318,14 +318,8 @@
     margin-bottom: 4px;
 }
 
-.settings-menu-mailgun-warning {
-    border-radius: 5px;
-    padding: 8px 12px;
-    background: rgba(254, 205, 53, 0.1);
-    color: color-mod(var(--yellow) l(-8%) s(+10%));
-    border: 1px solid var(--yellow);
-    font-size: 13px;
-    font-weight: 500;
+.settings-menu-mailgun-warning .gh-box-info {
+    border-left: var(--yellow);
 }
 
 .settings-menu-mailgun-warning a {

diff --git a/app/styles/layouts/preview-email.css b/app/styles/layouts/preview-email.css
@@ -111,6 +111,10 @@
     padding: 0;
 }
 
+.gh-pe-mobile-container .gh-pe-iframe .left-col {
+    display: none;
+}
+
 @media (max-width: 850px) {
     .gh-pe-header {
         flex-direction: column;

diff --git a/app/styles/patterns/boxes.css b/app/styles/patterns/boxes.css
@@ -30,3 +30,15 @@
 .gh-box-info svg {
     fill: var(--blue);
 }
+
+.gh-box-warning {
+    border-left-color: var(--yellow);
+}
+
+.gh-box-warning svg {
+    fill: var(--yellow);
+}
+
+.gh-box-warning a {
+    color: var(--yellow);
+}
diff --git a/app/templates/components/gh-post-settings-menu.hbs b/app/templates/components/gh-post-settings-menu.hbs
@@ -323,7 +323,11 @@
 
                         <div class="settings-menu-content settings-menu-email">
                             {{#if mailgunError}}
-                                <p class="settings-menu-mailgun-warning">You need to configure Mailgun in {{#link-to "settings.labs" data-test-nav="labs"}}Labs → Members settings{{/link-to}} to enable sending posts in email.</p>
+                                <p class="gh-box gh-box-warning settings-menu-mailgun-warning">
+                                    {{svg-jar "info" class="w5 h5 fill-yellow nl1"}}
+                                    You need to configure Mailgun in {{#link-to "settings.labs" data-test-nav="labs"}}Labs → Members settings{{/link-to}} to
+                                    enable sending posts in email.
+                                </p>
                             {{/if}}
                             <form {{action "discardEnter" on="submit"}}>
                                 {{#gh-form-group errors=post.errors hasValidated=post.hasValidated property="emailSubject"}}