Onboarding mobile improvements (#19997)

fixes IPC-142
TryGhost · Apr 8, 2024 · c1321f8 · c1321f8
1 parent 3d4c4d4
commit c1321f8
Showing 1 changed file with 48 additions and 0 deletions.
diff --git a/ghost/admin/app/styles/layouts/dashboard.css b/ghost/admin/app/styles/layouts/dashboard.css
@@ -2801,6 +2801,17 @@ Onboarding checklist */
     font-size: 1.5rem;
 }
 
+@media screen and (max-width: 480px) {
+    .gh-onboarding-header h2 {
+        font-size: 2.4rem;
+    }
+
+    .gh-onboarding-header p {
+        font-size: 1.4rem;
+        margin: 0;
+    }
+}
+
 .gh-onboarding-items {
     max-width: 540px;
     width: 100%;
@@ -2901,6 +2912,25 @@ Onboarding checklist */
     padding-right: 32px;
 }
 
+@media screen and (max-width: 480px) {
+    .gh-onboarding-item-title {
+        font-size: 1.5rem;
+    }
+
+    .gh-onboarding-item-description {
+        font-size: 1.4rem;
+        padding-right: 0;
+    }
+
+    .gh-onboarding-item-content {
+        padding-right: 16px;
+    }
+
+    .gh-onboarding-item--next {
+        padding: 24px 20px;
+    }
+}
+
 .gh-onboarding-item-action {
     display: flex;
     flex-direction: row;
@@ -2965,6 +2995,12 @@ Onboarding checklist */
     font-size: 1.5rem;
 }
 
+@media screen and (max-width: 480px) {
+    .gh-onboarding-help {
+        font-size: 1.4rem;
+    }
+}
+
 .gh-onboarding-help a {
     color: #30cf43
 }
@@ -3015,6 +3051,12 @@ Onboarding checklist */
     transition: opacity .3s ease-in-out;
 }
 
+@media screen and (max-width: 480px) {
+    .gh-onboarding-explore-dashboard {
+        font-size: 1.5rem;
+    }
+}
+
 .gh-onboarding-explore-dashboard:hover {
     opacity: 0.9;
 }
@@ -3085,6 +3127,12 @@ Share publication modal */
     transition: all .3s ease-in-out;
 }
 
+.gh-copy-publication-link span {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
 .gh-copy-publication-link:hover {
     border: 1px solid var(--lightgrey);
 }