Greg Sheremeta has uploaded a new change for review.
Change subject: userportal, webadmin: fix popup dialog header text spacing
......................................................................
userportal, webadmin: fix popup dialog header text spacing
Changed popup dialog header text to be spaced with CSS only.
Popup dialog header text was shifting left over the icon. This
was a regression. Hopefully permanently fixed by restructuring
the layout of the dialog header bar. Now when an icon is present,
CSS takes care of moving the header text over.
Change-Id: I28ffde8e344b1bedc10310f6eb814a37a7aecefe
Signed-off-by: Greg Sheremeta <gsher...@redhat.com>
---
M
frontend/webadmin/modules/gwt-common/src/main/java/org/ovirt/engine/ui/common/widget/dialog/SimpleDialogPanel.java
M
frontend/webadmin/modules/gwt-common/src/main/java/org/ovirt/engine/ui/common/widget/dialog/SimpleDialogPanel.ui.xml
M
frontend/webadmin/modules/webadmin/src/main/java/org/ovirt/engine/ui/webadmin/section/main/view/popup/guide/GuidePopupView.ui.xml
M packaging/branding/ovirt.brand/common.css
M packaging/branding/ovirt.brand/images/dialog/error.png
M packaging/branding/ovirt.brand/images/dialog/guide.png
M packaging/branding/ovirt.brand/ovirt-patternfly-compat.css
M packaging/branding/ovirt.brand/web_admin.css
8 files changed, 79 insertions(+), 71 deletions(-)
git pull ssh://gerrit.ovirt.org:29418/ovirt-engine refs/changes/83/29683/1
diff --git
a/frontend/webadmin/modules/gwt-common/src/main/java/org/ovirt/engine/ui/common/widget/dialog/SimpleDialogPanel.java
b/frontend/webadmin/modules/gwt-common/src/main/java/org/ovirt/engine/ui/common/widget/dialog/SimpleDialogPanel.java
index 28233be..9640a9f 100644
---
a/frontend/webadmin/modules/gwt-common/src/main/java/org/ovirt/engine/ui/common/widget/dialog/SimpleDialogPanel.java
+++
b/frontend/webadmin/modules/gwt-common/src/main/java/org/ovirt/engine/ui/common/widget/dialog/SimpleDialogPanel.java
@@ -3,9 +3,6 @@
import org.ovirt.engine.ui.uicommonweb.UICommand;
import com.google.gwt.core.client.GWT;
-import com.google.gwt.core.client.Scheduler;
-import com.google.gwt.core.client.Scheduler.ScheduledCommand;
-import com.google.gwt.dom.client.Style.Unit;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.event.dom.client.HasClickHandlers;
@@ -19,8 +16,6 @@
import com.google.gwt.user.client.ui.Widget;
public class SimpleDialogPanel extends AbstractDialogPanel {
-
- private static final int IMAGE_MARGIN = 10;
interface WidgetUiBinder extends UiBinder<Widget, SimpleDialogPanel> {
WidgetUiBinder uiBinder = GWT.create(WidgetUiBinder.class);
@@ -77,7 +72,6 @@
@UiChild(tagname = "logo", limit = 1)
public void setLogo(Widget widget) {
logoPanel.setWidget(widget);
- updateTitlePadding();
}
@Override
@@ -85,19 +79,6 @@
public void setContent(Widget widget) {
contentPanel.setWidget(widget);
widget.addStyleName(style.contentWidget());
- }
-
- void updateTitlePadding() {
- Scheduler.get().scheduleDeferred(new ScheduledCommand() {
- @Override
- public void execute() {
- int logoWidth = logoPanel.getOffsetWidth();
- if (logoWidth > 0) {
- logoWidth += IMAGE_MARGIN; //Add some pixels to account
for margins/left style of the image div.
-
headerTitlePanel.getParent().getElement().getStyle().setMarginLeft(logoWidth,
Unit.PX);
- }
- }
- });
}
@Override
diff --git
a/frontend/webadmin/modules/gwt-common/src/main/java/org/ovirt/engine/ui/common/widget/dialog/SimpleDialogPanel.ui.xml
b/frontend/webadmin/modules/gwt-common/src/main/java/org/ovirt/engine/ui/common/widget/dialog/SimpleDialogPanel.ui.xml
index d2e80c6..8ee5b54 100644
---
a/frontend/webadmin/modules/gwt-common/src/main/java/org/ovirt/engine/ui/common/widget/dialog/SimpleDialogPanel.ui.xml
+++
b/frontend/webadmin/modules/gwt-common/src/main/java/org/ovirt/engine/ui/common/widget/dialog/SimpleDialogPanel.ui.xml
@@ -17,9 +17,8 @@
right: 5px;
}
- .headerLeftPanel {
- position: absolute;
- left: 5px;
+ @external obrand_headerLeftPanel;
+ .obrand_headerLeftPanel {
}
@external obrand_headerCenterPanel;
@@ -91,8 +90,18 @@
z-index: 1;
}
+ .logoPanel {
+ float: left;
+ position: relative;
+ left: -5px;
+ }
+
@external obrand_dialogHeaderImage;
.obrand_dialogHeaderImage {
+ }
+
+ @external obrand_dialogLogoImageWrapper;
+ .obrand_dialogLogoImageWrapper {
}
@external obrand_dialogLogoImage;
@@ -102,10 +111,21 @@
<g:FlowPanel>
<g:FlowPanel addStyleNames="{style.header}">
- <g:SimplePanel ui:field="logoPanel"
addStyleNames="{style.headerLeftPanel}">
- <g:Image styleName='obrand_dialogLogoImage'
url="clear.cache.gif" />
- </g:SimplePanel>
- <g:SimplePanel addStyleNames="{style.obrand_headerCenterPanel}" />
+ <g:Image styleName="obrand_headerLeftPanel" url="clear.cache.gif"
/>
+ <g:FlowPanel addStyleNames="{style.obrand_headerCenterPanel}" >
+ <g:SimplePanel ui:field="logoPanel"
addStyleNames="{style.logoPanel}">
+ <g:Image styleName="obrand_dialogLogoImage"
url="clear.cache.gif" />
+ </g:SimplePanel>
+ <g:FlowPanel addStyleNames="{style.obrand_headerTitle}">
+ <g:FlowPanel ui:field="headerTitlePanel">
+ <g:PushButton ui:field="helpIconButton"
addStyleNames="{style.helpIconButton} sdp_helpIconButton_pfly_fix"
visible="false">
+ <g:upFace image='{resources.dialogIconHelp}' />
+ <g:downFace image='{resources.dialogIconHelpDown}'
/>
+ <g:upHoveringFace
image='{resources.dialogIconHelpRollover}' />
+ </g:PushButton>
+ </g:FlowPanel>
+ </g:FlowPanel>
+ </g:FlowPanel>
<g:SimplePanel addStyleNames="{style.headerRightPanel}">
<g:FlowPanel>
<g:Image styleName='obrand_dialogHeaderImage'
url="clear.cache.gif" />
@@ -116,15 +136,6 @@
</g:PushButton>
</g:FlowPanel>
</g:SimplePanel>
- <g:FlowPanel addStyleNames="{style.obrand_headerTitle}">
- <g:FlowPanel ui:field="headerTitlePanel">
- <g:PushButton ui:field="helpIconButton"
addStyleNames="{style.helpIconButton} sdp_helpIconButton_pfly_fix"
visible="false">
- <g:upFace image='{resources.dialogIconHelp}' />
- <g:downFace image='{resources.dialogIconHelpDown}' />
- <g:upHoveringFace
image='{resources.dialogIconHelpRollover}' />
- </g:PushButton>
- </g:FlowPanel>
- </g:FlowPanel>
</g:FlowPanel>
<g:SimplePanel ui:field="contentPanel" addStyleNames="{style.content}
contentPanel_pfly_fix" />
diff --git
a/frontend/webadmin/modules/webadmin/src/main/java/org/ovirt/engine/ui/webadmin/section/main/view/popup/guide/GuidePopupView.ui.xml
b/frontend/webadmin/modules/webadmin/src/main/java/org/ovirt/engine/ui/webadmin/section/main/view/popup/guide/GuidePopupView.ui.xml
index 8d24449..88913df 100644
---
a/frontend/webadmin/modules/webadmin/src/main/java/org/ovirt/engine/ui/webadmin/section/main/view/popup/guide/GuidePopupView.ui.xml
+++
b/frontend/webadmin/modules/webadmin/src/main/java/org/ovirt/engine/ui/webadmin/section/main/view/popup/guide/GuidePopupView.ui.xml
@@ -36,6 +36,10 @@
padding-bottom: 15px;
}
+ @external obrand_dialogLogoGuideImageWrapper;
+ .obrand_dialogLogoGuideImageWrapper {
+ }
+
@external obrand_dialogLogoGuideImage;
.obrand_dialogLogoGuideImage {
}
diff --git a/packaging/branding/ovirt.brand/common.css
b/packaging/branding/ovirt.brand/common.css
index a2bc6c8..d795fc6 100644
--- a/packaging/branding/ovirt.brand/common.css
+++ b/packaging/branding/ovirt.brand/common.css
@@ -13,10 +13,42 @@
display: block;
}
-
/* SimpleDialogPanel:
These classes allow you to modify the header of all the popup windows
in the user portal and web admin. The border is defined in gwt-common.css */
+
+/* left */
+.obrand_headerLeftPanel {
+ position: absolute;
+ left: 5px;
+ width: 27px;
+ line-height: 27px;
+ background: url(images/dialog/blank.png);
+}
+
+/* center */
+.obrand_headerCenterPanel {
+ position: absolute;
+ background: url(images/dialog_header_background_repetitive.png) repeat-x;
+ height: 27px;
+ line-height: 27px;
+ width: auto;
+ left: 20px;
+ right: 111px;
+}
+
+.obrand_headerTitle {
+ text-align: left;
+ font-size: 14px;
+ font-weight: bold;
+ color: white;
+ float: left;
+ position: relative;
+ margin-top: 1px;
+ left: -5px;
+}
+
+/* right */
.obrand_dialogHeaderImage {
background-image: url(images/dialog/dialog_header_image.png);
width: 118px;
@@ -25,42 +57,21 @@
display: block;
}
+/* SimpleDialogPanel.ui.xml:
+This class allows you to change the default icon on popup windows.
+Currently no icon for most windows. */
.obrand_dialogLogoImage {
- background-image: url(images/dialog/blank.png);
- width: 27px;
- height: 27px;
border: 0px;
- display: block;
}
-
-.obrand_headerCenterPanel {
- position: absolute;
- background: url(images/dialog_header_background_repetitive.png) repeat-x;
- height: 27px;
- line-height: 27px;
- width: auto;
- left: 32px;
- right: 123px;
-}
-
-.obrand_headerTitle {
- text-align: left;
- font-size: 14px;
- font-weight: bold;
- color: white;
- margin-left: 14px;
- float: left;
- position: relative;
- margin-top: 1px;
-}
-
/* ErrorPopupView.ui.xml:
This class allows you to change the error icon on the error popup window. */
.obrand_dialogLogoErrorImage {
background: url(images/dialog/error.png);
- width: 27px;
- height: 27px;
+ background-repeat: no-repeat;
+ background-position: 0 5px;
+ width: 16px;
+ height: 14px;
border: 0px;
}
diff --git a/packaging/branding/ovirt.brand/images/dialog/error.png
b/packaging/branding/ovirt.brand/images/dialog/error.png
index 2e90622..3a10a6e 100644
--- a/packaging/branding/ovirt.brand/images/dialog/error.png
+++ b/packaging/branding/ovirt.brand/images/dialog/error.png
Binary files differ
diff --git a/packaging/branding/ovirt.brand/images/dialog/guide.png
b/packaging/branding/ovirt.brand/images/dialog/guide.png
index aac84d2..09bdeb8 100644
--- a/packaging/branding/ovirt.brand/images/dialog/guide.png
+++ b/packaging/branding/ovirt.brand/images/dialog/guide.png
Binary files differ
diff --git a/packaging/branding/ovirt.brand/ovirt-patternfly-compat.css
b/packaging/branding/ovirt.brand/ovirt-patternfly-compat.css
index 8f66c9c..b139690 100644
--- a/packaging/branding/ovirt.brand/ovirt-patternfly-compat.css
+++ b/packaging/branding/ovirt.brand/ovirt-patternfly-compat.css
@@ -407,10 +407,6 @@
.epv_closeButton_pfly_fix {
line-height: 12px !important;
}
-.epv_titleLabel_pfly_fix {
- position: relative !important;
- left: 12px !important;
-}
.gpv_flowPanel_pfly_fix {
padding: 4px;
}
diff --git a/packaging/branding/ovirt.brand/web_admin.css
b/packaging/branding/ovirt.brand/web_admin.css
index 28de1ae..0ef6d39 100644
--- a/packaging/branding/ovirt.brand/web_admin.css
+++ b/packaging/branding/ovirt.brand/web_admin.css
@@ -58,9 +58,14 @@
padding-right: 10px;
}
-/* guide me dialogs */
+/* GuidePopupView.ui.xml:
+This class allows you to change the error icon on the guide popup window. */
.obrand_dialogLogoGuideImage {
- background-image: url(images/dialog/guide.png);
- width: 27px;
+ background: url(images/dialog/guide.png);
+ background-repeat: no-repeat;
+ width: 24px;
height: 27px;
+ position: relative;
+ left: -7px;
+ border: 0px;
}
--
To view, visit http://gerrit.ovirt.org/29683
To unsubscribe, visit http://gerrit.ovirt.org/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I28ffde8e344b1bedc10310f6eb814a37a7aecefe
Gerrit-PatchSet: 1
Gerrit-Project: ovirt-engine
Gerrit-Branch: master
Gerrit-Owner: Greg Sheremeta <gsher...@redhat.com>
_______________________________________________
Engine-patches mailing list
Engine-patches@ovirt.org
http://lists.ovirt.org/mailman/listinfo/engine-patches
