From ba67f1f2a1d08306383bc835ceee2fc3207b92d6 Mon Sep 17 00:00:00 2001 From: Artur Paikin Date: Sun, 15 Jul 2018 23:02:08 -0400 Subject: [PATCH] turn Try it live link into a button --- website/src/docs/dashboard.md | 2 +- website/src/docs/dragdrop.md | 2 +- website/src/docs/fileinput.md | 4 +++- website/src/docs/index.md | 2 +- website/src/docs/informer.md | 4 +++- website/src/docs/progressbar.md | 4 +++- website/src/docs/redux.md | 4 ++-- website/src/docs/statusbar.md | 2 +- website/src/docs/transloadit.md | 2 +- website/src/docs/xhrupload.md | 2 +- website/themes/uppy/source/css/_common.scss | 2 +- website/themes/uppy/source/css/_examples.scss | 2 +- website/themes/uppy/source/css/_page.scss | 18 ++++++++++++++++++ 13 files changed, 37 insertions(+), 13 deletions(-) diff --git a/website/src/docs/dashboard.md b/website/src/docs/dashboard.md index 639962c28..99918e0f0 100644 --- a/website/src/docs/dashboard.md +++ b/website/src/docs/dashboard.md @@ -23,7 +23,7 @@ uppy.use(Dashboard, { }) ``` -[Try it live](/examples/dashboard/) +Try it live ## Installation diff --git a/website/src/docs/dragdrop.md b/website/src/docs/dragdrop.md index f693acb86..3a6b9b6a0 100644 --- a/website/src/docs/dragdrop.md +++ b/website/src/docs/dragdrop.md @@ -17,7 +17,7 @@ uppy.use(DragDrop, { }) ``` -[Try it live](/examples/dragdrop/) +Try it live ## Installation diff --git a/website/src/docs/fileinput.md b/website/src/docs/fileinput.md index f195200e1..1f18baa8f 100644 --- a/website/src/docs/fileinput.md +++ b/website/src/docs/fileinput.md @@ -18,7 +18,9 @@ uppy.use(FileInput, { }) ``` -[Try it live](/examples/xhrupload) - The `@uppy/xhr-upload` example uses `@uppy/file-input` with the [`pretty`](#pretty-true) option enabled. +Try it live + +The `@uppy/xhr-upload` example uses `@uppy/file-input` with the [`pretty`](#pretty-true) option enabled. ## Installation diff --git a/website/src/docs/index.md b/website/src/docs/index.md index 07d84c5d6..fa2236383 100644 --- a/website/src/docs/index.md +++ b/website/src/docs/index.md @@ -31,7 +31,7 @@ uppy.on('complete', (result) => { }) ``` -[Try it live!](/examples/dashboard/) +Try it live Drag and drop, webcam, basic file manipulation (adding metadata), uploading via tus-resumable uploads or XHR/Multipart is all possible using just the Uppy client module. diff --git a/website/src/docs/informer.md b/website/src/docs/informer.md index 97dbff1c2..5bd795605 100644 --- a/website/src/docs/informer.md +++ b/website/src/docs/informer.md @@ -16,7 +16,9 @@ uppy.use(Informer, { }) ``` -[Try it live](/examples/dashboard/) - The Informer plugin is included in the Dashboard by default. +Try it live + +The Informer plugin is included in the Dashboard by default. ## Installation diff --git a/website/src/docs/progressbar.md b/website/src/docs/progressbar.md index a414a3a4f..a7cc198fb 100644 --- a/website/src/docs/progressbar.md +++ b/website/src/docs/progressbar.md @@ -17,7 +17,9 @@ uppy.use(ProgressBar, { }) ``` -[Try it live](/examples/dragdrop/) - The `@uppy/drag-drop` example uses a Progress Bar to show progress. +Try it live + +The `@uppy/drag-drop` example uses a Progress Bar to show progress. ## Installation diff --git a/website/src/docs/redux.md b/website/src/docs/redux.md index f6e731d52..55f918e97 100644 --- a/website/src/docs/redux.md +++ b/website/src/docs/redux.md @@ -1,7 +1,7 @@ --- title: "Redux" type: docs -permalink: docs/redux +permalink: docs/redux/ order: 87 --- @@ -22,7 +22,7 @@ const reducer = combineReducers({ const uppy = Uppy({ store: ReduxStore({ - store: createStore(reducer) // That's a lot of stores! + store: createStore(reducer) // That’s a lot of stores! }) }) ``` diff --git a/website/src/docs/statusbar.md b/website/src/docs/statusbar.md index 166d5887a..c2bc796c7 100644 --- a/website/src/docs/statusbar.md +++ b/website/src/docs/statusbar.md @@ -18,7 +18,7 @@ uppy.use(StatusBar, { }) ``` -[Try it live](/examples/statusbar/) +Try it live ## Installation diff --git a/website/src/docs/transloadit.md b/website/src/docs/transloadit.md index 4182d8e0c..8969d0473 100644 --- a/website/src/docs/transloadit.md +++ b/website/src/docs/transloadit.md @@ -8,7 +8,7 @@ permalink: docs/transloadit/ The `@uppy/transloadit` plugin can be used to upload files to [Transloadit](https://transloadit.com/) for all kinds of processing, such as transcoding video, resizing images, zipping/unzipping, [and more](https://transloadit.com/services/). -[Try it live](/examples/transloadit/) +Try it live ```js const Transloadit = require('@uppy/transloadit') diff --git a/website/src/docs/xhrupload.md b/website/src/docs/xhrupload.md index 1fdcdcfde..fa7eb8e71 100644 --- a/website/src/docs/xhrupload.md +++ b/website/src/docs/xhrupload.md @@ -17,7 +17,7 @@ uppy.use(XHRUpload, { }) ``` -[Try it live](/examples/xhrupload/) +Try it live ## Installation diff --git a/website/themes/uppy/source/css/_common.scss b/website/themes/uppy/source/css/_common.scss index 768995c45..e9a45e342 100644 --- a/website/themes/uppy/source/css/_common.scss +++ b/website/themes/uppy/source/css/_common.scss @@ -333,7 +333,7 @@ a.button { color: $color-light; padding-bottom: 3px; font-size: .85em; - margin: 0 .5em; + margin: 0; cursor: pointer; &:first-child { margin-left: 0; } diff --git a/website/themes/uppy/source/css/_examples.scss b/website/themes/uppy/source/css/_examples.scss index 2af590840..caf80db5d 100644 --- a/website/themes/uppy/source/css/_examples.scss +++ b/website/themes/uppy/source/css/_examples.scss @@ -17,7 +17,7 @@ @include reset-button; padding: 10px 15px; border: 1px solid $color-primary; - background-transition: all .3s; + transition: all .2s; font-size: 13px; color: $color-primary; cursor: pointer; diff --git a/website/themes/uppy/source/css/_page.scss b/website/themes/uppy/source/css/_page.scss index 212b896b6..8c993dc88 100644 --- a/website/themes/uppy/source/css/_page.scss +++ b/website/themes/uppy/source/css/_page.scss @@ -359,3 +359,21 @@ border-top: 1px solid #e5e5e5; font-size: .9em; } + +.TryButton, +a.TryButton { + @include reset-button; + font-size: 0.8em; + padding: 7px 16px; + border: 1px solid $color-primary; + transition: all .2s; + color: $color-primary; + cursor: pointer; + border-radius: 15px; + margin-bottom: 1.5em; + + &:hover { + background-color: $color-primary; + color: $color-white; + } +}