From 55eee77e254af72daa6b4e6681f3578cfbf926bf Mon Sep 17 00:00:00 2001 From: Artur Paikin Date: Wed, 6 Feb 2019 14:08:39 +0300 Subject: [PATCH 1/6] inherit font, allow overriding outline --- .gitignore | 1 + packages/@uppy/core/src/_common.scss | 6 +++--- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/.gitignore b/.gitignore index f53c5f37a..4fa093fdc 100644 --- a/.gitignore +++ b/.gitignore @@ -3,6 +3,7 @@ Thumbs.db npm-debug.log env.sh node_modules +.cache dist/ lib/ diff --git a/packages/@uppy/core/src/_common.scss b/packages/@uppy/core/src/_common.scss index 31e43b72f..418af71a9 100644 --- a/packages/@uppy/core/src/_common.scss +++ b/packages/@uppy/core/src/_common.scss @@ -19,8 +19,8 @@ // } .uppy-Root *:focus { - outline: $size-focus-outline solid $color-cornflower-blue; - outline-offset: $size-focus-offset; + outline: $size-focus-outline solid $color-cornflower-blue; /* no !important */ + outline-offset: $size-focus-offset; /* no !important */ } // https://blog.prototypr.io/align-svg-icons-to-text-and-say-goodbye-to-font-icons-d44b3d7b26b4 @@ -72,7 +72,7 @@ display: inline; empty-cells: show; float: none; - font-family: serif; + font-family: inherit; font-size: medium; font-style: normal; font-variant: normal; From ed961523a9ed1fded2eb1f83fecdf679b6318b16 Mon Sep 17 00:00:00 2001 From: Artur Paikin Date: Wed, 6 Feb 2019 14:08:54 +0300 Subject: [PATCH 2/6] improve icon animation jiggling --- packages/@uppy/dashboard/src/style.scss | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/packages/@uppy/dashboard/src/style.scss b/packages/@uppy/dashboard/src/style.scss index 1f545ef5c..9a4386939 100644 --- a/packages/@uppy/dashboard/src/style.scss +++ b/packages/@uppy/dashboard/src/style.scss @@ -316,15 +316,13 @@ } } - .uppy-DashboardTab-btn svg, - .uppy-DashboardTab-btn svg * { + .uppy-DashboardTab-btn svg { max-width: 100%; max-height: 100%; display: inline-block; vertical-align: text-top; overflow: hidden; - transition: transform 0.2s; - will-change: transform; + transition: transform ease-in-out 0.2s; } .uppy-DashboardTab-btn:hover svg { From 09d0f3b16a34f80488672779d9e50fbcba08883c Mon Sep 17 00:00:00 2001 From: Artur Paikin Date: Wed, 6 Feb 2019 14:09:54 +0300 Subject: [PATCH 3/6] fix breadcrumbs, bug with x button being stuck --- .../@uppy/provider-views/src/Breadcrumbs.js | 12 +++- packages/@uppy/provider-views/src/Browser.js | 14 ++-- packages/@uppy/provider-views/src/Filter.js | 21 ++---- packages/@uppy/provider-views/src/style.scss | 65 ++++++++----------- 4 files changed, 47 insertions(+), 65 deletions(-) diff --git a/packages/@uppy/provider-views/src/Breadcrumbs.js b/packages/@uppy/provider-views/src/Breadcrumbs.js index 3fbada575..43ec5ef9f 100644 --- a/packages/@uppy/provider-views/src/Breadcrumbs.js +++ b/packages/@uppy/provider-views/src/Breadcrumbs.js @@ -2,18 +2,26 @@ const { h } = require('preact') const Breadcrumb = (props) => { return ( - + + + {!props.isLast ? ' / ' : ''} + ) } module.exports = (props) => { return (
+
{props.breadcrumbsIcon}
{ props.directories.map((directory, i) => { return Breadcrumb({ getFolder: () => props.getFolder(directory.id), - title: i === 0 ? props.title : directory.title + title: i === 0 ? props.title : directory.title, + isLast: i + 1 === props.directories.length }) }) } diff --git a/packages/@uppy/provider-views/src/Browser.js b/packages/@uppy/provider-views/src/Browser.js index ef7e1704d..46cc8fe74 100644 --- a/packages/@uppy/provider-views/src/Browser.js +++ b/packages/@uppy/provider-views/src/Browser.js @@ -20,14 +20,12 @@ const Browser = (props) => {
-
-
{props.pluginIcon && props.pluginIcon()}
- {props.showBreadcrumbs && Breadcrumbs({ - getFolder: props.getFolder, - directories: props.directories, - title: props.title - })} -
+ {props.showBreadcrumbs && Breadcrumbs({ + getFolder: props.getFolder, + directories: props.directories, + breadcrumbsIcon: props.pluginIcon && props.pluginIcon(), + title: props.title + })} {props.username} From 553119809f611ba480200d3ca451ff9f3a1fc4ad Mon Sep 17 00:00:00 2001 From: Artur Paikin Date: Mon, 11 Feb 2019 17:02:06 +0300 Subject: [PATCH 6/6] search and close icons alignment --- packages/@uppy/provider-views/src/style.scss | 14 +++++++++----- 1 file changed, 9 insertions(+), 5 deletions(-) diff --git a/packages/@uppy/provider-views/src/style.scss b/packages/@uppy/provider-views/src/style.scss index 1bbdbd556..def45773e 100644 --- a/packages/@uppy/provider-views/src/style.scss +++ b/packages/@uppy/provider-views/src/style.scss @@ -155,11 +155,11 @@ height: 30px; background-color: transparent; outline: 0; - font-family: sans-serif; + font-family: $font-family-base; font-size: 13px; line-height: 30px; border: 0; - padding: 2px 16px 0 0; + padding: 0 16px 0 0; z-index: $zIndex-2; } @@ -168,17 +168,21 @@ height: 12px; position: absolute; right: 16px; - top: 7px; + top: 8px; z-index: $zIndex-3; - color: rgba($color-gray, 0.6); + color: $color-gray; cursor: pointer; } + .uppy-ProviderBrowser-searchClose svg { + vertical-align: text-top; + } + .uppy-ProviderBrowser-searchInput::placeholder, .uppy-ProviderBrowser-searchInput::-webkit-input-placeholder, .uppy-ProviderBrowser-searchInput::-moz-placeholder, .uppy-ProviderBrowser-searchInput::-ms-input-placeholder { - color: rgba($color-gray, 0.75); + color: rgba($color-gray, 0.85); letter-spacing: 1px; }