Browse Source

Mobile issues fixes + compact Companion migration table (#2593)

* Increase h4's font size

* More compact Redirect URI's table + make it responsive

* Simplify title

* Tweak table cell's & h3/h4's spacing

* Remove the last row's border-bottom

* $YOUR_COMPANION_HOST_NAME -> $COMPANION_HOST_NAME
Alexander Zaytsev 4 years ago
parent
commit
8196b1108b
2 changed files with 33 additions and 16 deletions
  1. 14 10
      website/src/docs/companion.md
  2. 19 6
      website/themes/uppy/source/css/_page.scss

+ 14 - 10
website/src/docs/companion.md

@@ -487,21 +487,25 @@ In v2 the `google` and `microsoft` [providerOptions](https://uppy.io/docs/compan
 
 On your Providers' respective developer platforms, the OAuth redirect URIs that you should supply has now changed from:
 
-`http(s)://$YOUR_COMPANION_HOST_NAME/connect/$AUTH_PROVIDER/callback` in v1
+`http(s)://$COMPANION_HOST_NAME/connect/$AUTH_PROVIDER/callback` in v1
 
 to:
 
-`http(s)://$YOUR_COMPANION_HOST_NAME/$PROVIDER_NAME/redirect` in v2
+`http(s)://$COMPANION_HOST_NAME/$PROVIDER_NAME/redirect` in v2
 
-Old Redirect URIs vs New Redirect URIs
+#### New Redirect URIs
 
-| Provider | v1 Redirect URI | v2 Redirect URI |
-|-|-|-|
-| Dropbox | https://$YOUR_COMPANION_HOST_NAME/connect/dropbox/callback | https://$YOUR_COMPANION_HOST_NAME/dropbox/redirect |
-| Google drive | https://$YOUR_COMPANION_HOST_NAME/connect/google/callback | https://$YOUR_COMPANION_HOST_NAME/drive/redirect |
-| OneDrive | https://$YOUR_COMPANION_HOST_NAME/connect/microsoft/callback | https://$YOUR_COMPANION_HOST_NAME/onedrive/redirect |
-| Facebook | https://$YOUR_COMPANION_HOST_NAME/connect/facebook/callback | https://$YOUR_COMPANION_HOST_NAME/facebook/redirect |
-| Instagram | https://$YOUR_COMPANION_HOST_NAME/connect/instagram/callback | https://$YOUR_COMPANION_HOST_NAME/instagram/redirect |
+<div class="table-responsive">
+
+| Provider | New Redirect URI
+|-|-|
+| Dropbox | `https://$COMPANION_HOST_NAME/dropbox/redirect` |
+| Google Drive | `https://$COMPANION_HOST_NAME/drive/redirect` |
+| OneDrive | `https://$COMPANION_HOST_NAME/onedrive/redirect` |
+| Facebook | `https://$COMPANION_HOST_NAME/facebook/redirect` |
+| Instagram | `https://$COMPANION_HOST_NAME/instagram/redirect` |
+
+</div>
 
 ## Development
 

+ 19 - 6
website/themes/uppy/source/css/_page.scss

@@ -141,6 +141,7 @@
   max-width: 600px;
   margin: 0 auto;
   font-size: 18px;
+  word-wrap: break-word; // it prevents long code blocks from breaking the layout
 
   @media #{$screen-medium} {
     padding: 2.2em 0;
@@ -195,16 +196,27 @@
     border-collapse: collapse;
   }
 
-  table th,
-  table td {
-    padding: 14px 8px;
+  table th {
+    padding: 8px 8px 4px;
   }
 
-  table td { 
+  table td {
+    padding: 14px 8px;
     vertical-align: top;
     border-bottom: 1px solid #eee;
   }
 
+  // Remove the last row's border-bottom
+table tr:last-child td {
+  border-bottom: 0;
+}
+
+  // Don't set padding for the first column cells
+  table th:first-child,
+  table td:first-child {
+    padding-left: 0;
+  }
+
   .light {
     color: $color-light;
   }
@@ -251,7 +263,7 @@
 
   .post h3,
   > h3 {
-    margin: 3em 0 1.2em;
+    margin: 3em 0 1em;
     position: relative;
     &:before {
       content: "#";
@@ -266,7 +278,8 @@
 
   .post h4,
   > h4 {
-    font-size: 0.8em;
+    font-size: 1em;
+    margin-bottom: 0.5em;
   }
 
   .post figure, .post ul, .post ol,