Mirrors/uppy
1
0
Fork 0
mirror of https://github.com/transloadit/uppy.git synced 2026-07-24 10:47:44 +00:00
Code Issues Projects Releases Wiki Activity

colors, paddings, moving things around

Browse source
This commit is contained in:
Artur Paikin 2018-07-25 17:34:51 -04:00
parent 32ec76c7f0
commit 79edef5f2c
5 changed files with 53 additions and 42 deletions
Download patch file Download diff file Expand all files Collapse all files

67
packages/@uppy/dashboard/src/style.scss
View file

@ -114,12 +114,13 @@
background-color: $color-almost-white;
max-width: 100%; /* no !important */
max-height: 100%; /* no !important */
width: 100%; /* no !important */
height: 100%; /* no !important */
min-width: 300px;
// width: 100%; /* no !important */
// height: 100%; /* no !important */
min-width: 290px;
min-height: 400px;
outline: none;
border: 1px solid rgba($color-gray, 0.2);
border-radius: 5px;
.uppy-Dashboard--modal & {
z-index: $zIndex-3;
@ -128,7 +129,7 @@
@media #{$screen-medium} {
width: 750px; /* no !important */
height: 550px; /* no !important */
border-radius: 5px;
// border-radius: 5px;
}
}
@ -139,16 +140,19 @@
overflow: hidden;
min-height: 300px;
position: relative;
border-radius: 5px;
@media #{$screen-medium} {
border-radius: 5px;
}
// @media #{$screen-medium} {
// border-radius: 5px;
// }
}
.uppy-Dashboard--modal .uppy-Dashboard-inner {
position: fixed;
top: 0;
left: 0;
top: 35px;
left: 15px;
right: 15px;
bottom: 15px;
border: none;
@media #{$screen-medium} {
@ -163,28 +167,34 @@
@include reset-button;
display: none;
position: absolute;
top: 2px;
right: 8px;
top: -33px;
right: -2px;
cursor: pointer;
color: rgba($color-asphalt-gray, 0.5);
transition: all 0.3s;
font-size: 23px;
color: rgba($color-white, 0.85);
// transition: all 0.3s;
font-size: 27px;
.uppy-Dashboard--wide & {
font-size: 30px;
top: 2px;
right: 8px;
// .uppy-Dashboard--wide & {
// font-size: 35px;
// top: -10px;
// right: -35px;
// }
@media #{$screen-medium} {
font-size: 35px;
top: -10px;
right: -35px;
}
.uppy-Dashboard--modal & {
z-index: $zIndex-5;
// display: block;
display: block;
}
}
.uppy-Dashboard-close:hover {
color: $color-cornflower-blue;
}
// .uppy-Dashboard-close:hover {
// color: $color-cornflower-blue;
// }
.uppy-DashboarAddFiles {
display: flex;
@ -346,7 +356,7 @@
.uppy-Dashboard--wide & {
height: 50px;
padding: 0 20px;
padding: 0 15px;
}
}
@ -513,7 +523,7 @@
.uppy-Dashboard-files {
margin: 0;
padding: 10px 5px 10px 5px;
padding: 0 0 10px 0;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
// position: absolute;
@ -524,9 +534,9 @@
flex: 1;
}
// .uppy-Dashboard--wide .uppy-Dashboard-files {
// padding-top: 10px;
// }
.uppy-Dashboard--wide .uppy-Dashboard-files {
padding-top: 10px;
}
.uppy-Dashboard.drag .uppy-Dashboard-innerWrap {
background-color: darken($color-almost-white, 25%)
@ -543,12 +553,13 @@
.uppy-Dashboard-dropFilesTitle {
max-width: 300px;
text-align: center;
font-size: 18px;
font-size: 16px;
line-height: 1.45;
font-weight: 400;
color: $color-asphalt-gray;
margin: auto;
margin-bottom: 20px;
padding: 0 15px;
.uppy-Dashboard--wide & {
max-width: 400px;

4
packages/@uppy/informer/src/index.js
View file

@ -44,7 +44,7 @@ module.exports = class Informer extends Plugin {
}
render (state) {
const { isHidden, type, message, details } = state.info
const { isHidden, message, details } = state.info
// const style = {
// backgroundColor: this.opts.typeColors[type].bg,
// color: this.opts.typeColors[type].text
@ -56,7 +56,7 @@ module.exports = class Informer extends Plugin {
<p role="alert">
{message}
{' '}
{details && <span style={{ color: this.opts.typeColors[type].bg }}
{details && <span
aria-label={details}
data-microtip-position="top"
data-microtip-size="large"

17
packages/@uppy/informer/src/style.scss
View file

@ -31,7 +31,7 @@
.uppy-Informer[aria-hidden=true] {
opacity: 0;
transform: translateY(200%);
transform: translateY(350%);
transition: all 300ms ease-in;
}
@ -39,24 +39,22 @@
display: inline-block;
margin: 0;
padding: 0;
height: 25px;
line-height: 25px;
// height: 25px;
// line-height: 25px;
font-size: 12px;
line-height: 1.4;
font-weight: 400;
padding: 0 15px;
padding: 6px 15px;
background-color: rgba($color-asphalt-gray, 0.7); /* no !important */
color: $color-white;
border-radius: 18px;
max-width: 90%;
white-space: nowrap;
overflow-x: auto;
.uppy-Dashboard--wide & {
height: 35px;
line-height: 35px;
font-size: 14px;
line-height: 1.3;
max-width: 500px;
padding: 0 20px;
padding: 10px 20px;
}
}
@ -66,6 +64,7 @@
height: 13px;
display: inline-block;
vertical-align: middle;
color: $color-asphalt-gray;
background-color: $color-white;
border-radius: 50%;
position: relative;

1
packages/@uppy/instagram/src/index.js
View file

@ -85,6 +85,7 @@ module.exports = class Instagram extends Plugin {
}
getItemIcon (item) {
console.log(item.images)
if (!item.images) {
return <svg viewBox="0 0 58 58" opacity="0.6">
<path d="M36.537 28.156l-11-7a1.005 1.005 0 0 0-1.02-.033C24.2 21.3 24 21.635 24 22v14a1 1 0 0 0 1.537.844l11-7a1.002 1.002 0 0 0 0-1.688zM26 34.18V23.82L34.137 29 26 34.18z" /><path d="M57 6H1a1 1 0 0 0-1 1v44a1 1 0 0 0 1 1h56a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1zM10 28H2v-9h8v9zm-8 2h8v9H2v-9zm10 10V8h34v42H12V40zm44-12h-8v-9h8v9zm-8 2h8v9h-8v-9zm8-22v9h-8V8h8zM2 8h8v9H2V8zm0 42v-9h8v9H2zm54 0h-8v-9h8v9z" />

6
packages/@uppy/status-bar/src/style.scss
View file

@ -142,14 +142,14 @@
position: absolute;
top: 0;
bottom: 0;
right: 15px;
right: 10px;
z-index: $zIndex-4;
}
.uppy-StatusBar.is-waiting .uppy-StatusBar-actions {
width: 100%;
position: static;
padding: 0 20px;
padding: 0 15px;
background-color: $color-almost-white;
}
@ -177,7 +177,7 @@
}
.uppy-Dashboard--wide .uppy-StatusBar.is-waiting .uppy-StatusBar-actionBtn--upload {
padding: 13px 28px;
padding: 16px 22px;
width: auto;
}