From: Matti Tahvonen <matti.tahvonen@itmill.com>
Date: Mon, 22 Dec 2008 07:12:08 +0000 (+0000)
Subject: fixes #2373. refactored DOM structure of RTE toolbar
X-Git-Tag: 6.7.0.beta1~3469
X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=c5b08a5d5e14ec7846f29fa426660e1561a44f52;p=vaadin-framework.git

fixes #2373. refactored DOM structure of RTE toolbar

svn changeset:6319/svn branch:trunk
---

diff --git a/WebContent/ITMILL/themes/default/styles.css b/WebContent/ITMILL/themes/default/styles.css
index c848c6e82f..93bb1bf4fb 100644
--- a/WebContent/ITMILL/themes/default/styles.css
+++ b/WebContent/ITMILL/themes/default/styles.css
@@ -2383,6 +2383,13 @@ input.i-modified,
 	border: 1px solid #b6b6b6;
 	overflow: hidden;
 }
+.i-richtextarea .gwt-RichTextToolbar .gwt-ToggleButton,
+.i-richtextarea .gwt-RichTextToolbar .gwt-PushButton {
+	float:left;
+}
+.i-richtextarea .gwt-RichTextToolbar {
+	white-space: nowrap;
+}
 .i-richtextarea .gwt-RichTextArea {
 	background: #fff url(textfield/img/bg.png) repeat-x;
 }
diff --git a/WebContent/ITMILL/themes/default/textfield/textfield.css b/WebContent/ITMILL/themes/default/textfield/textfield.css
index cabf11630a..0a91a97b2e 100644
--- a/WebContent/ITMILL/themes/default/textfield/textfield.css
+++ b/WebContent/ITMILL/themes/default/textfield/textfield.css
@@ -39,6 +39,13 @@
 	border: 1px solid #b6b6b6;
 	overflow: hidden;
 }
+.i-richtextarea .gwt-RichTextToolbar .gwt-ToggleButton,
+.i-richtextarea .gwt-RichTextToolbar .gwt-PushButton {
+	float:left;
+}
+.i-richtextarea .gwt-RichTextToolbar {
+	white-space: nowrap;
+}
 .i-richtextarea .gwt-RichTextArea {
 	background: #fff url(img/bg.png) repeat-x;
 }
diff --git a/src/com/itmill/toolkit/terminal/gwt/client/ui/richtextarea/IRichTextToolbar.java b/src/com/itmill/toolkit/terminal/gwt/client/ui/richtextarea/IRichTextToolbar.java
index 22450b8968..af056fbf60 100644
--- a/src/com/itmill/toolkit/terminal/gwt/client/ui/richtextarea/IRichTextToolbar.java
+++ b/src/com/itmill/toolkit/terminal/gwt/client/ui/richtextarea/IRichTextToolbar.java
@@ -22,20 +22,19 @@ import com.google.gwt.user.client.ui.AbstractImagePrototype;
 import com.google.gwt.user.client.ui.ChangeListener;
 import com.google.gwt.user.client.ui.ClickListener;
 import com.google.gwt.user.client.ui.Composite;
-import com.google.gwt.user.client.ui.HorizontalPanel;
+import com.google.gwt.user.client.ui.FlowPanel;
 import com.google.gwt.user.client.ui.ImageBundle;
 import com.google.gwt.user.client.ui.KeyboardListener;
 import com.google.gwt.user.client.ui.ListBox;
 import com.google.gwt.user.client.ui.PushButton;
 import com.google.gwt.user.client.ui.RichTextArea;
 import com.google.gwt.user.client.ui.ToggleButton;
-import com.google.gwt.user.client.ui.VerticalPanel;
 import com.google.gwt.user.client.ui.Widget;
 
 /**
- * A sample toolbar for use with {@link RichTextArea}. It provides a simple UI
- * for all rich text formatting, dynamically displayed only for the available
- * functionality.
+ * A modified version of sample toolbar for use with {@link RichTextArea}. It
+ * provides a simple UI for all rich text formatting, dynamically displayed only
+ * for the available functionality.
  */
 public class IRichTextToolbar extends Composite {
 
@@ -293,9 +292,9 @@ public class IRichTextToolbar extends Composite {
     private final RichTextArea.BasicFormatter basic;
     private final RichTextArea.ExtendedFormatter extended;
 
-    private final VerticalPanel outer = new VerticalPanel();
-    private final HorizontalPanel topPanel = new HorizontalPanel();
-    private final HorizontalPanel bottomPanel = new HorizontalPanel();
+    private final FlowPanel outer = new FlowPanel();
+    private final FlowPanel topPanel = new FlowPanel();
+    private final FlowPanel bottomPanel = new FlowPanel();
     private ToggleButton bold;
     private ToggleButton italic;
     private ToggleButton underline;
@@ -334,6 +333,8 @@ public class IRichTextToolbar extends Composite {
         outer.add(topPanel);
         outer.add(bottomPanel);
         topPanel.setWidth("100%");
+        topPanel.setHeight("20px");
+        topPanel.getElement().getStyle().setProperty("overflow", "hidden");
         bottomPanel.setWidth("100%");
 
         initWidget(outer);