From e48614d6cec19f781a63bc5166d7cc286c281d7b Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Tue, 20 Oct 2015 18:31:34 +0500 Subject: PLT-318 - Updating files overlay design --- web/react/components/file_upload_overlay.jsx | 16 +++++++-- web/sass-files/sass/partials/_post.scss | 48 +++++++++++++++++++++----- web/sass-files/sass/partials/_responsive.scss | 16 ++++++--- web/static/images/filesOverlay.png | Bin 0 -> 8392 bytes web/static/images/logo-email copy.png | Bin 0 -> 10380 bytes web/static/images/logoWhite.png | Bin 0 -> 5876 bytes 6 files changed, 64 insertions(+), 16 deletions(-) create mode 100644 web/static/images/filesOverlay.png create mode 100644 web/static/images/logo-email copy.png create mode 100644 web/static/images/logoWhite.png diff --git a/web/react/components/file_upload_overlay.jsx b/web/react/components/file_upload_overlay.jsx index 4fcee6cb0..d991dd625 100644 --- a/web/react/components/file_upload_overlay.jsx +++ b/web/react/components/file_upload_overlay.jsx @@ -12,9 +12,19 @@ export default class FileUploadOverlay extends React.Component { return (
-
- - Drop a file to upload it. +
+ Files + {'Drop a file to upload it.'} + Logo
); diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss index 0f3cc0ef6..6ecc0d965 100644 --- a/web/sass-files/sass/partials/_post.scss +++ b/web/sass-files/sass/partials/_post.scss @@ -119,20 +119,52 @@ body.ios { background-color: rgba(0, 0, 0, 0.6); text-align: center; color: #FFF; - display: table; - font-size: 1.7em; + font-size: em(20px); font-weight: 600; z-index: 6; - > div { - display: table-cell; - vertical-align: middle; + &.right-file-overlay { + font-size: em(18px); + .overlay__circle { + width: 300px; + height: 300px; + margin: -150px 0 0 -150px; + } + .overlay__files { + margin: 60px auto 15px; + width: 150px; + } } - .fa { + .overlay__circle { + background: #111; + background: rgba(black, 0.7); + width: 370px; + height: 370px; + margin: -185px 0 0 -185px; + @include border-radius(500px); + position: absolute; + top: 50%; + left: 50%; + } + + .overlay__files { display: block; - font-size: 2em; - margin: 0 0 0.3em; + margin: 75px auto 20px; + } + + .overlay__logo { + position: absolute; + left: 50%; + bottom: 30px; + margin-left: -50px; + @include opacity(0.3); + } + + .fa { + display: inline-block; + font-size: 1.1em; + margin-right: 8px; } } diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss index 09ac2047c..71ae52635 100644 --- a/web/sass-files/sass/partials/_responsive.scss +++ b/web/sass-files/sass/partials/_responsive.scss @@ -199,9 +199,6 @@ } @media screen and (max-width: 960px) { - .center-file-overlay { - font-size: 1.5em; - } .post { .post-header .post-header-col.post-header__reply { .comment-icon__container__hide { @@ -278,8 +275,17 @@ display: block; } } - .center-file-overlay { - font-size: 1.3em; + .file-overlay { + font-size: em(18px); + .overlay__circle { + width: 300px; + height: 300px; + margin: -150px 0 0 -150px; + } + .overlay__files { + margin: 60px auto 15px; + width: 150px; + } } .date-separator, .new-separator { &.hovered--after { diff --git a/web/static/images/filesOverlay.png b/web/static/images/filesOverlay.png new file mode 100644 index 000000000..d24da7626 Binary files /dev/null and b/web/static/images/filesOverlay.png differ diff --git a/web/static/images/logo-email copy.png b/web/static/images/logo-email copy.png new file mode 100644 index 000000000..c16978ba8 Binary files /dev/null and b/web/static/images/logo-email copy.png differ diff --git a/web/static/images/logoWhite.png b/web/static/images/logoWhite.png new file mode 100644 index 000000000..11bbd4632 Binary files /dev/null and b/web/static/images/logoWhite.png differ -- cgit v1.2.3-1-g7c22 From 4ba3a19855170fae8d29511aa82561f3975da2c0 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Tue, 20 Oct 2015 18:34:49 +0500 Subject: Adding background transparent for theme inputs --- web/sass-files/sass/partials/_settings.scss | 3 +++ 1 file changed, 3 insertions(+) diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss index c4591d7b6..5fc9b295b 100644 --- a/web/sass-files/sass/partials/_settings.scss +++ b/web/sass-files/sass/partials/_settings.scss @@ -103,6 +103,9 @@ text-overflow: ellipsis; margin-bottom: 0; } + .input-group-addon:not(:first-child) { + background: transparent; + } .radio { label { font-weight: 600; -- cgit v1.2.3-1-g7c22 From de3cd15b23641109af290be7623abc176dcc4a60 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Tue, 20 Oct 2015 18:36:33 +0500 Subject: Updating custom themes input addon --- web/sass-files/sass/partials/_settings.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss index 5fc9b295b..bc53dc0e4 100644 --- a/web/sass-files/sass/partials/_settings.scss +++ b/web/sass-files/sass/partials/_settings.scss @@ -103,7 +103,7 @@ text-overflow: ellipsis; margin-bottom: 0; } - .input-group-addon:not(:first-child) { + .input-group-addon { background: transparent; } .radio { -- cgit v1.2.3-1-g7c22 From b28b519d32030650f3c42946e40b59da8d5dbb83 Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Tue, 20 Oct 2015 20:56:30 +0500 Subject: Removing logo email copy file --- web/static/images/logo-email copy.png | Bin 10380 -> 0 bytes 1 file changed, 0 insertions(+), 0 deletions(-) delete mode 100644 web/static/images/logo-email copy.png diff --git a/web/static/images/logo-email copy.png b/web/static/images/logo-email copy.png deleted file mode 100644 index c16978ba8..000000000 Binary files a/web/static/images/logo-email copy.png and /dev/null differ -- cgit v1.2.3-1-g7c22 From e9fc2434fc98bf3ac9ae7b0f05609169f19d07ea Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Tue, 20 Oct 2015 21:08:18 +0500 Subject: Updating btn-close size for direct messages on mobile devices. --- web/sass-files/sass/partials/_responsive.scss | 3 +++ 1 file changed, 3 insertions(+) diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss index 71ae52635..3bffe82a2 100644 --- a/web/sass-files/sass/partials/_responsive.scss +++ b/web/sass-files/sass/partials/_responsive.scss @@ -645,6 +645,9 @@ } &.has-close { .btn-close { + width: 40px; + text-align: center; + right: 0; display: block; @include opacity(0.5); } -- cgit v1.2.3-1-g7c22