From d11b90c8ed3aa63f920e17675275c014f670f759 Mon Sep 17 00:00:00 2001 From: Artur Signell Date: Mon, 13 Jul 2015 22:37:21 +0300 Subject: [PATCH] Reconnect dialog basic css for all themes (#11733) Change-Id: I070cca17377dc49095481012717bab8931fb375b --- WebContent/VAADIN/themes/base/base.scss | 2 ++ .../base/common/img/reconnect-spinner.gif | Bin 0 -> 3223 bytes .../themes/base/common/reconnect-dialog.scss | 32 ++++++++++++++++++ .../themes/valo/shared/_reconnect-dialog.scss | 20 +++++++++-- .../communication/DefaultReconnectDialog.java | 5 +++ .../DefaultReconnectDialog.ui.xml | 2 +- 6 files changed, 57 insertions(+), 4 deletions(-) create mode 100644 WebContent/VAADIN/themes/base/common/img/reconnect-spinner.gif create mode 100644 WebContent/VAADIN/themes/base/common/reconnect-dialog.scss diff --git a/WebContent/VAADIN/themes/base/base.scss b/WebContent/VAADIN/themes/base/base.scss index d40ac1a7bf..56b2e311c6 100644 --- a/WebContent/VAADIN/themes/base/base.scss +++ b/WebContent/VAADIN/themes/base/base.scss @@ -17,6 +17,7 @@ $v-line-height: $line-height !default; @import "caption/caption.scss"; @import "colorpicker/colorpicker.scss"; @import "common/common.scss"; +@import "common/reconnect-dialog.scss"; @import "csslayout/csslayout.scss"; @import "customcomponent/customcomponent.scss"; @import "customlayout/customlayout.scss"; @@ -89,6 +90,7 @@ $v-line-height: $line-height !default; // here for now to preserve old semantics @include base-common; + @include base-reconnect-dialog; @include base-layout; @include base-csslayout; diff --git a/WebContent/VAADIN/themes/base/common/img/reconnect-spinner.gif b/WebContent/VAADIN/themes/base/common/img/reconnect-spinner.gif new file mode 100644 index 0000000000000000000000000000000000000000..bc1a496d11e8483313a02ed48317e16bfbb448f4 GIT binary patch literal 3223 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 Ohn>704#)l!GyV_%=J5>x literal 0 HcmV?d00001 diff --git a/WebContent/VAADIN/themes/base/common/reconnect-dialog.scss b/WebContent/VAADIN/themes/base/common/reconnect-dialog.scss new file mode 100644 index 0000000000..cde587cfe9 --- /dev/null +++ b/WebContent/VAADIN/themes/base/common/reconnect-dialog.scss @@ -0,0 +1,32 @@ +@mixin base-reconnect-dialog { + .v-reconnect-dialog { + color: white; + top: 12px; + right: 12px; + max-width: 100%; + border-radius: 0; + @include box-shadow(0 0 20px 0 rgba(0,0,0,0.25)); + padding: 10px; + + background-color: #444; + text-align: center; + + .text { + display: inline-block; + padding-left: 10px; + } + + .spinner { + background-image: url(img/reconnect-spinner.gif); + width: 31px; + height: 31px; + display: inline-block; + visibility: hidden; + vertical-align: middle; + } + + &.active .spinner { + visibility: visible; + } + } +} \ No newline at end of file diff --git a/WebContent/VAADIN/themes/valo/shared/_reconnect-dialog.scss b/WebContent/VAADIN/themes/valo/shared/_reconnect-dialog.scss index 81077efcc4..583cc4d11c 100644 --- a/WebContent/VAADIN/themes/valo/shared/_reconnect-dialog.scss +++ b/WebContent/VAADIN/themes/valo/shared/_reconnect-dialog.scss @@ -1,14 +1,28 @@ @mixin valo-reconnect-dialog { .v-reconnect-dialog { color: white; - @include valo-notification-bar-style("v-reconnect-dialog"); - @include valo-notification-system-style("v-reconnect-dialog"); + top: $v-layout-spacing-vertical; + right: $v-layout-spacing-horizontal; + max-width: 100%; + border-radius: 0; + @include box-shadow(0 0 20px 0 rgba(0,0,0,0.25)); + padding: round($v-unit-size/3) round($v-unit-size/2.5); + + background-color: #444; + background-color: rgba(#444, .9); + line-height: round($v-font-size * 1.4); + text-align: center; + .text { + display: inline-block; + padding-left: 10px; + } + .spinner { @include valo-spinner; display: inline-block; - margin-top: 10px; visibility: hidden; + vertical-align: middle; } &.active .spinner { diff --git a/client/src/com/vaadin/client/communication/DefaultReconnectDialog.java b/client/src/com/vaadin/client/communication/DefaultReconnectDialog.java index 60ecce8ae0..301967495b 100644 --- a/client/src/com/vaadin/client/communication/DefaultReconnectDialog.java +++ b/client/src/com/vaadin/client/communication/DefaultReconnectDialog.java @@ -82,4 +82,9 @@ public class DefaultReconnectDialog extends VOverlay implements ReconnectDialog setOwner(connection.getUIConnector().getWidget()); show(); } + + @Override + public void setPopupPosition(int left, int top) { + // Don't set inline styles for position, handle it in the theme + } } diff --git a/client/src/com/vaadin/client/communication/DefaultReconnectDialog.ui.xml b/client/src/com/vaadin/client/communication/DefaultReconnectDialog.ui.xml index 885588f8a5..90e92eaeb6 100644 --- a/client/src/com/vaadin/client/communication/DefaultReconnectDialog.ui.xml +++ b/client/src/com/vaadin/client/communication/DefaultReconnectDialog.ui.xml @@ -3,9 +3,9 @@ +