turn Try it live link into a button

This commit is contained in:
Artur Paikin 2018-07-15 23:02:08 -04:00
parent ec5e2fed3a
commit ba67f1f2a1
13 changed files with 37 additions and 13 deletions

View file

@ -23,7 +23,7 @@ uppy.use(Dashboard, {
})
```
[Try it live](/examples/dashboard/)
<a class="TryButton" href="/examples/dashboard/">Try it live</a>
## Installation

View file

@ -17,7 +17,7 @@ uppy.use(DragDrop, {
})
```
[Try it live](/examples/dragdrop/)
<a class="TryButton" href="/examples/dragdrop/">Try it live</a>
## Installation

View file

@ -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.
<a class="TryButton" href="/examples/xhrupload/">Try it live</a>
The `@uppy/xhr-upload` example uses `@uppy/file-input` with the [`pretty`](#pretty-true) option enabled.
## Installation

View file

@ -31,7 +31,7 @@ uppy.on('complete', (result) => {
})
```
[Try it live!](/examples/dashboard/)
<a class="TryButton" href="/examples/dashboard/">Try it live</a>
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.

View file

@ -16,7 +16,9 @@ uppy.use(Informer, {
})
```
[Try it live](/examples/dashboard/) - The Informer plugin is included in the Dashboard by default.
<a class="TryButton" href="/examples/dashboard/">Try it live</a>
The Informer plugin is included in the Dashboard by default.
## Installation

View file

@ -17,7 +17,9 @@ uppy.use(ProgressBar, {
})
```
[Try it live](/examples/dragdrop/) - The `@uppy/drag-drop` example uses a Progress Bar to show progress.
<a class="TryButton" href="/examples/dragdrop/">Try it live</a>
The `@uppy/drag-drop` example uses a Progress Bar to show progress.
## Installation

View file

@ -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) // Thats a lot of stores!
})
})
```

View file

@ -18,7 +18,7 @@ uppy.use(StatusBar, {
})
```
[Try it live](/examples/statusbar/)
<a class="TryButton" href="/examples/statusbar/">Try it live</a>
## Installation

View file

@ -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/)
<a class="TryButton" href="/examples/transloadit/">Try it live</a>
```js
const Transloadit = require('@uppy/transloadit')

View file

@ -17,7 +17,7 @@ uppy.use(XHRUpload, {
})
```
[Try it live](/examples/xhrupload/)
<a class="TryButton" href="/examples/xhrupload/">Try it live</a>
## Installation

View file

@ -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; }

View file

@ -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;

View file

@ -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;
}
}