From a91a037c1d7d94a47e356918952a106b5071cf5c Mon Sep 17 00:00:00 2001 From: Mathieu Baudier Date: Fri, 9 Oct 2020 19:28:09 +0200 Subject: [PATCH] Improve UX. --- .../icons/types/16/close.png | Bin 440 -> 456 bytes .../icons/types/32/close.png | Bin 603 -> 601 bytes org.argeo.suite.theme.default/rap/work.css | 80 +++++++++++------- .../src/org/argeo/suite/ui/ArgeoSuiteUi.java | 2 + .../org/argeo/suite/ui/DefaultLeadPane.java | 9 +- .../src/org/argeo/suite/ui/RecentItems.java | 34 ++++---- .../src/org/argeo/suite/ui/SuiteStyle.java | 2 +- 7 files changed, 79 insertions(+), 48 deletions(-) diff --git a/org.argeo.suite.theme.default/icons/types/16/close.png b/org.argeo.suite.theme.default/icons/types/16/close.png index 29d82f5ec2c458d27fbd3140b753947472c5ae7a..af85e1ad1560e32c0bbdba6aae638722b5220a99 100644 GIT binary patch delta 409 zcmV;K0cQTV1IPoAIe&UdL_t(Ijir*oN&-<7hW~R7WW>e+QEW2WM5~ZC5%~x~4`7+K zD|&!7f??nj1V#HOY8mtbErNC;K`kQ*97smoOxk!)8*j|q#!a2wz4v?{-2WV6X8fn7 zf``5RgLT`UeK@LBdr{4$&9aqFrT$cWd)x2#?|)p^ZPkw(Run9RcywL& z-t)Xi)gu64t6VwreSZT09H%p{j;Ci~v)et1&K1$AedsiAG#t4FnJGbETK z36>6rLIi-T%YTa|GZ%^IGXnn7;a`Gry#jFbOT#d_2byx)!2sR{9izEPmnGa&ISX+k`pi6SO z8BZ;e7&r7rqfsG|NL)vaDkw2c^Te{OV&o$IrM>~UFB0r9Ycrr6a&vS7yv|CaCdt%W9Bm=`pAL5RQQ)c zT+aaB(g#EY%YU+7H(9>t7}gwkc7u&Dv^fArIN4`KfFl8O(j(Dq{Mo??g2L$0bmTwRGXJcl)(X9 z*Tr$18E}yi_<#KA;}STnBB2ZS{e#Rw%-n(?j67fh^i-QAZ^zx;_i0slu7HWe{=Uy* zalesLHmbmt0=g1qRR)KGDAqX>b>W2qbtH7*r2WwrHIYg1x=x0Pl6+ zP;dy7rE|~YGHqa`Prw8Y=Dnj(z!Y9ZLMfmFw{5$&M1QV;ZnhsEzq}Pf+}4rE8%VSp zi*4H{Qpyu*bkX!cV%*j0bkRowf8k$E;PK~mB+{=y846_yS2ebi1IZM44g5BR>qw{q z>d_O(lQ7NpJc*)oR1GA3;7haF{BwBt;-@Y=wTA~xgb>|!`{=1Enu`XKqfV#01TclC tB)m?i>m-eagK6Fxt!DHuYv+GX9{_~Aix^vZfgAt;002ovPDHLkV1lcK5QG2# delta 557 zcmV+|0@D521lt6VIe!gFL_t(og~gUlYZE~nho9LI8VGdL^^`(as1?$a`2xj!1g{AJ z*Sj~5fy5Si_uNZc5WR^Xp?(7+1$*sY?IH1$5|Z^`Hcr-knHQx0z_WF?!;_bn~vwx|S^37;C_@;gr>MvNq zuK?fkJi_n^wOZ}9twguikAQQ4t*shi82*w{zECARrSlpNuv{*Q<6CC4+4=FwY2*S2 zxWAtf$MN=JvG{s?a@yVy$imaImB_-&B+?almxbF(6v0)A>2$gcyjKMxU|cjvSE33I z;QKy75R8GBYkz@HA3schj*EmYyxH6x1D(-uFj)(@O4!07a|~CLHTbh3pBGK09?_ed zAK1ck1xzG@;4yc1Kg-yq@InDyiK?oCLrE6s> zu(J~Yoaw-!WD}~TbI#K;P0`8~FoA=4c9aU3!fhl91%GtlQc7ouTmjv?eSiPywGiUk zMdBX;lVFij9wkX~ghPsM2-u{WYm}>RLSuN^?jn)C39aF-66p%Giw5byO(o{@Ijequ zZ^CY`e*wI*g{xH-<;~_UzVBa-hJy$;pJWkm=?Y)XmAevI_=Z4M!WLd6kq3w3Ct1{L v9ZrBN8zy*Wt_IL)wGJD3;iQ#@|FeDr+K0Fkwj7Ee00000NkvXXu0mjfoJ9~4 diff --git a/org.argeo.suite.theme.default/rap/work.css b/org.argeo.suite.theme.default/rap/work.css index fbd1180..937d299 100644 --- a/org.argeo.suite.theme.default/rap/work.css +++ b/org.argeo.suite.theme.default/rap/work.css @@ -10,14 +10,17 @@ } .argeo-suite-leadPane { - font: bold 14px sans-serif; - background-color:#ddd; + background-color: #eee; } -Button.argeo-suite-leadPane { - font: bold 14px sans-serif; - color: white; - background-color: white; +Label.argeo-suite-leadPane { + font: 14px sans-serif; + color: #888; + background-color: #eee; +} + +Button.argeo-suite-leadPane:hover { + cursor:pointer; } .argeo-suite-recentItems { @@ -45,59 +48,74 @@ Button.argeo-suite-leadPane { } .argeo-suite-simpleLabel { - font:bold 14px sans-serif; - padding:0 0 0 8px; + font: bold 14px sans-serif; + padding: 0 0 0 8px; } .argeo-suite-simpleText { + } -.argeo-suite-titleCell{ - font:bold 14px sans-serif; - background-color:#ddd; +.argeo-suite-titleCell { + font: bold 14px sans-serif; + background-color: #ddd; } .argeo-suite-inlineButton { - padding:0px 4px; + padding: 0px 4px; font: 12px sans-serif; - border:1px solid white; - color:white; - background-image:none; - background-color:#00294b; + border: 1px solid white; + color: white; + background-image: none; + background-color: #00294b; } .argeo-suite-inlineButton:hover { - color:#00294b; - background-color:white; + color: #00294b; + background-color: white; } - +Composite.argeo-suite-mainTabBody { + background-color: #eee; + border: 1px solid #bbb; +} .argeo-suite-mainTab { - background-color:#ddd; - border:1px solid #bbb; + background-color: #eee; + border: 1px solid #bbb; +} + +ToolItem.argeo-suite-mainTab { + border: none; + background-color: #eee; } Button.argeo-suite-mainTab { - border:none; - background-color:#ddd; + border: none; + background-color: #eee; } .argeo-suite-mainTab:hover { - background-color:#eee; + background-color: #eee; } Button.argeo-suite-mainTab:hover { - cursor:pointer; - background-color:#eee; + cursor: pointer; + background-color: #eee; } .argeo-suite-mainTabSelected { - font:bold 14px sans-serif; - color:white; - background-color:#00294b; + font: bold 14px sans-serif; + color: white; + /*background-color: #00294b;*/ + background-color: #5882b5; + border: 1px solid #00294b; } -Button.argeo-suite-mainTabSelected { - border:none; +ToolItem.argeo-suite-mainTabSelected { + border: none; } + +Button.argeo-suite-mainTabSelected { + border: none; +} \ No newline at end of file diff --git a/org.argeo.suite.ui/src/org/argeo/suite/ui/ArgeoSuiteUi.java b/org.argeo.suite.ui/src/org/argeo/suite/ui/ArgeoSuiteUi.java index e6f38a3..d74dc21 100644 --- a/org.argeo.suite.ui/src/org/argeo/suite/ui/ArgeoSuiteUi.java +++ b/org.argeo.suite.ui/src/org/argeo/suite/ui/ArgeoSuiteUi.java @@ -151,9 +151,11 @@ public class ArgeoSuiteUi extends Composite { } int[] weights = new int[] { 2000, 8000 }; area.setWeights(weights); +// editorArea.setLayout(CmsUiUtils.noSpaceGridLayout()); editorArea.setLayout(new GridLayout()); tabbedArea = new TabbedArea(editorArea, SWT.NONE); + tabbedArea.setBodyStyle(SuiteStyle.mainTabBody.toStyleClass()); tabbedArea.setTabStyle(SuiteStyle.mainTab.toStyleClass()); tabbedArea.setTabSelectedStyle(SuiteStyle.mainTabSelected.toStyleClass()); tabbedArea.setCloseIcon(SuiteIcon.close.getSmallIcon(theme)); diff --git a/org.argeo.suite.ui/src/org/argeo/suite/ui/DefaultLeadPane.java b/org.argeo.suite.ui/src/org/argeo/suite/ui/DefaultLeadPane.java index 931f5a1..6c60474 100644 --- a/org.argeo.suite.ui/src/org/argeo/suite/ui/DefaultLeadPane.java +++ b/org.argeo.suite.ui/src/org/argeo/suite/ui/DefaultLeadPane.java @@ -14,10 +14,12 @@ import org.argeo.cms.ui.CmsView; import org.argeo.cms.ui.util.CmsIcon; import org.argeo.cms.ui.util.CmsUiUtils; import org.eclipse.swt.SWT; +import org.eclipse.swt.layout.GridData; import org.eclipse.swt.layout.GridLayout; import org.eclipse.swt.widgets.Button; import org.eclipse.swt.widgets.Composite; import org.eclipse.swt.widgets.Control; +import org.eclipse.swt.widgets.Label; /** Side pane listing various perspectives. */ public class DefaultLeadPane implements CmsUiProvider { @@ -46,8 +48,13 @@ public class DefaultLeadPane implements CmsUiProvider { CmsTheme theme = CmsTheme.getCmsTheme(parent); Button button = new Button(parent, SWT.PUSH); CmsUiUtils.style(button, SuiteStyle.leadPane); - button.setToolTipText(msg.lead()); button.setImage(icon.getBigIcon(theme)); + button.setLayoutData(new GridData(SWT.CENTER, SWT.BOTTOM, true, false)); + //button.setToolTipText(msg.lead()); + Label lbl = new Label(parent,SWT.NONE); + CmsUiUtils.style(lbl, SuiteStyle.leadPane); + lbl.setText(msg.lead()); + lbl.setLayoutData(new GridData(SWT.CENTER, SWT.TOP, true, false)); CmsUiUtils.sendEventOnSelect(button, SuiteEvent.switchLayer.topic(), SuiteEvent.LAYER, layer); return button; } diff --git a/org.argeo.suite.ui/src/org/argeo/suite/ui/RecentItems.java b/org.argeo.suite.ui/src/org/argeo/suite/ui/RecentItems.java index 09480ba..0c08d2d 100644 --- a/org.argeo.suite.ui/src/org/argeo/suite/ui/RecentItems.java +++ b/org.argeo.suite.ui/src/org/argeo/suite/ui/RecentItems.java @@ -63,20 +63,22 @@ public class RecentItems implements CmsUiProvider { public Control createUi(Composite parent, Node context) throws RepositoryException { theme = CmsTheme.getCmsTheme(parent); parent.setLayout(new GridLayout()); +// parent.setLayout(CmsUiUtils.noSpaceGridLayout()); + parent.setLayout(new GridLayout()); - Composite top = new Composite(parent, SWT.NONE); - CmsUiUtils.style(top, SuiteStyle.recentItems); - top.setLayoutData(CmsUiUtils.fillWidth()); - top.setLayout(CmsUiUtils.noSpaceGridLayout(2)); - Label lbl = new Label(top, SWT.NONE); - lbl.setLayoutData(CmsUiUtils.fillAll()); - lbl.setText(SuiteMsg.recentItems.lead()); - CmsUiUtils.style(lbl, SuiteStyle.recentItems); - - ToolBar topToolBar = new ToolBar(top, SWT.NONE); - ToolItem addItem = new ToolItem(topToolBar, SWT.FLAT); -// CmsUiUtils.style(addItem, SuiteStyle.recentItems); - addItem.setImage(SuiteIcon.add.getSmallIcon(theme)); +// Composite top = new Composite(parent, SWT.BORDER); +// CmsUiUtils.style(top, SuiteStyle.recentItems); +// top.setLayoutData(CmsUiUtils.fillWidth()); +// top.setLayout(CmsUiUtils.noSpaceGridLayout(2)); +// Label lbl = new Label(top, SWT.FLAT); +// lbl.setLayoutData(CmsUiUtils.fillWidth()); +// lbl.setText(SuiteMsg.recentItems.lead()); +// CmsUiUtils.style(lbl, SuiteStyle.recentItems); +// +// ToolBar topToolBar = new ToolBar(top, SWT.NONE); +// ToolItem addItem = new ToolItem(topToolBar, SWT.FLAT); +//// CmsUiUtils.style(addItem, SuiteStyle.recentItems); +// addItem.setImage(SuiteIcon.add.getSmallIcon(theme)); if (context == null) return null; @@ -93,7 +95,8 @@ public class RecentItems implements CmsUiProvider { deleteItem.setEnabled(false); // CmsUiUtils.style(deleteItem, SuiteStyle.recentItems); deleteItem.setImage(SuiteIcon.delete.getSmallIcon(theme)); - + ToolItem addItem = new ToolItem(bottomToolBar, SWT.FLAT); + addItem.setImage(SuiteIcon.add.getSmallIcon(theme)); entityViewer.getViewer().addDoubleClickListener(new IDoubleClickListener() { @Override @@ -212,7 +215,8 @@ public class RecentItems implements CmsUiProvider { } protected TableViewer createListPart(Composite parent, ILabelProvider labelProvider) { - parent.setLayout(new GridLayout()); +// parent.setLayout(new GridLayout()); +// parent.setLayout(CmsUiUtils.noSpaceGridLayout()); Composite tableComposite = new Composite(parent, SWT.NONE); GridData gd = new GridData(GridData.HORIZONTAL_ALIGN_FILL | GridData.GRAB_VERTICAL diff --git a/org.argeo.suite.ui/src/org/argeo/suite/ui/SuiteStyle.java b/org.argeo.suite.ui/src/org/argeo/suite/ui/SuiteStyle.java index b49c0e0..4e825ec 100644 --- a/org.argeo.suite.ui/src/org/argeo/suite/ui/SuiteStyle.java +++ b/org.argeo.suite.ui/src/org/argeo/suite/ui/SuiteStyle.java @@ -17,7 +17,7 @@ public enum SuiteStyle implements CmsStyle { // table titleCell, // tabbed area - mainTabSelected, mainTab, + mainTabBody,mainTabSelected, mainTab, // Buttons inlineButton; -- 2.30.2