From: Jouni Koivuviita Date: Mon, 5 Oct 2009 05:09:55 +0000 (+0000) Subject: Initial commit for new Sampler home screen layout. X-Git-Tag: 6.7.0.beta1~2447 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=3e28b8746c8eafb7b3a5b9df86e2098dacbac1d0;p=vaadin-framework.git Initial commit for new Sampler home screen layout. svn changeset:9061/svn branch:6.2 --- diff --git a/WebContent/VAADIN/themes/sampler/sampler/grid-bg.png b/WebContent/VAADIN/themes/sampler/sampler/grid-bg.png new file mode 100644 index 0000000000..85a35dfd45 Binary files /dev/null and b/WebContent/VAADIN/themes/sampler/sampler/grid-bg.png differ diff --git a/WebContent/VAADIN/themes/sampler/sampler/screenshot-frame-hover.png b/WebContent/VAADIN/themes/sampler/sampler/screenshot-frame-hover.png new file mode 100644 index 0000000000..485461815d Binary files /dev/null and b/WebContent/VAADIN/themes/sampler/sampler/screenshot-frame-hover.png differ diff --git a/WebContent/VAADIN/themes/sampler/sampler/screenshot-frame.png b/WebContent/VAADIN/themes/sampler/sampler/screenshot-frame.png new file mode 100644 index 0000000000..99213b32ce Binary files /dev/null and b/WebContent/VAADIN/themes/sampler/sampler/screenshot-frame.png differ diff --git a/WebContent/VAADIN/themes/sampler/sampler/styles.css b/WebContent/VAADIN/themes/sampler/sampler/styles.css index 6898284749..82f9a237e2 100644 --- a/WebContent/VAADIN/themes/sampler/sampler/styles.css +++ b/WebContent/VAADIN/themes/sampler/sampler/styles.css @@ -274,17 +274,83 @@ } + +/* Sample grid styles */ +.v-app-SamplerApplication .v-csslayout-grid { + background: transparent url(grid-bg.png) 0 80px; + margin: 0 20px 50px; +} + .v-app-SamplerApplication .v-label-section { font-family: "Helvetica Neue", helvetica, arial, verdana, sans-serif; font-size: 24px; - font-weight: bold; - border-bottom: 1px solid #eee; - line-height: 35px; - text-indent: 15px; + font-weight: normal; + line-height: normal; text-shadow: 0 2px 1px #c0c1c2; color: #1e2229; - + padding: 30px 0 20px 0; + height: 30px; +} + +.v-csslayout-grid .v-label-subsection { + font-size: 11px; + line-height: 16px; + color: #787b7e; + float: left; + width: 155px; + height: 131px; + padding: 15px 175px 0 15px; + margin-right: -175px; + background: transparent url(subsection-bg.png) no-repeat; + white-space: normal; +} + +.v-csslayout-grid .v-label-subsection h3 { + font-size: 18px; + font-weight: bold; + text-shadow: 0 2px 1px #c0c1c2; + color: #292d30; + margin: 0 0 .5em; +} + +.v-csslayout-grid .screenshot, +.v-csslayout-grid .screenshot:focus, +.v-csslayout-grid .screenshot:active { + float: left; + height: 132px; + width: 87px; + margin: 14px 15px 0; + position: relative; +} + +.v-csslayout-grid .screenshot .v-icon { + display: block; + width: 75px; + margin: 3px 6px; + position: absolute; +} + +.v-csslayout-grid .screenshot .v-button-caption { + display: block; + width: 87px; + text-align: center; + white-space: normal; + text-decoration: none; + font-size: 12px; + color: #212325; + font-family: arial, helvetica, sans-serif; + font-weight: bold; + line-height: normal; + position: absolute; + background: transparent url(screenshot-frame.png) no-repeat 4px 2px; + padding-top: 84px; + height: 30px; } +.v-csslayout-grid .screenshot:hover .v-button-caption { + background: transparent url(screenshot-frame-hover.png) no-repeat 1px 0px; +} + +/* .v-app-SamplerApplication .v-label-subsection { font-family: helvetica, arial, verdana, sans-serif; font-size: 16px; @@ -292,27 +358,8 @@ color: #666666; text-indent: 15px; padding-right: 20px; -} -.v-app-SamplerApplication .v-nativebutton-screenshot { - border: 3px solid #ccc; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - overflow: hidden; -} -.v-app-SamplerApplication .v-nativebutton-screenshot:hover { - border-color: #abc; -} -.v-app-SamplerApplication .v-nativebutton-screenshot img.v-icon { - margin: 0; - margin-top: -2px; - margin-left: -3px; - width: auto; - height: auto; - -moz-border-radius: 5px; - -webkit-border-radius: 5px; - overflow: hidden; - position: static; -} +}*/ + .v-app-SamplerApplication .v-table-featuretable tr.v-table-row, .v-app-SamplerApplication .v-table-featuretable tr.v-table-row-odd { diff --git a/WebContent/VAADIN/themes/sampler/sampler/subsection-bg.png b/WebContent/VAADIN/themes/sampler/sampler/subsection-bg.png new file mode 100644 index 0000000000..a98b0ef571 Binary files /dev/null and b/WebContent/VAADIN/themes/sampler/sampler/subsection-bg.png differ diff --git a/src/com/vaadin/demo/sampler/FeatureSet.java b/src/com/vaadin/demo/sampler/FeatureSet.java index 8936d450dc..2766b63d8d 100644 --- a/src/com/vaadin/demo/sampler/FeatureSet.java +++ b/src/com/vaadin/demo/sampler/FeatureSet.java @@ -124,7 +124,7 @@ public class FeatureSet extends Feature { public static class Components extends FeatureSet { public Components() { - super("Components", new Feature[] { + super("Vaadin Core Components", new Feature[] { // new Common(), // new Accordions(), // @@ -435,19 +435,19 @@ public class FeatureSet extends Feature { * FeatureSet implementation follows. */ - private String pathname; + private final String pathname; - private String name; + private final String name; - private String desc; + private final String desc; - private String icon = "folder.gif"; + private final String icon = "folder.gif"; - private Feature[] content; + private final Feature[] content; private HierarchicalContainer container = null; - private boolean containerRecursive = false; + private final boolean containerRecursive = false; FeatureSet(String pathname, Feature[] content) { this(pathname, pathname, "", content); diff --git a/src/com/vaadin/demo/sampler/SamplerApplication.java b/src/com/vaadin/demo/sampler/SamplerApplication.java index 91ae0b4c84..7c0f5b34e2 100644 --- a/src/com/vaadin/demo/sampler/SamplerApplication.java +++ b/src/com/vaadin/demo/sampler/SamplerApplication.java @@ -25,9 +25,9 @@ import com.vaadin.ui.Alignment; import com.vaadin.ui.Button; import com.vaadin.ui.ComboBox; import com.vaadin.ui.Component; +import com.vaadin.ui.CssLayout; import com.vaadin.ui.CustomComponent; import com.vaadin.ui.Embedded; -import com.vaadin.ui.GridLayout; import com.vaadin.ui.HorizontalLayout; import com.vaadin.ui.Label; import com.vaadin.ui.NativeButton; @@ -737,15 +737,14 @@ public class SamplerApplication extends Application { private class FeatureGrid extends Panel implements FeatureList { - GridLayout grid = new GridLayout(11, 1); + CssLayout grid = new CssLayout(); private final HashMap iconCache = new HashMap(); FeatureGrid() { setSizeFull(); setContent(grid); - grid.setSizeUndefined(); - grid.setSpacing(true); setStyleName(Panel.STYLE_LIGHT); + grid.setStyleName("grid"); } @SuppressWarnings("unchecked") @@ -755,30 +754,25 @@ public class SamplerApplication extends Application { for (Iterator it = features.iterator(); it.hasNext();) { final Feature f = it.next(); if (f instanceof FeatureSet) { - grid.newLine(); Label title = new Label(f.getName()); if (c.isRoot(f)) { - title.setWidth("100%"); title.setStyleName("section"); - grid.setRows(grid.getCursorY() + 1); - grid.addComponent(title, 0, grid.getCursorY(), grid - .getColumns() - 1, grid.getCursorY()); - grid - .setComponentAlignment(title, - Alignment.MIDDLE_LEFT); + grid.addComponent(title); } else { + String text = "

" + f.getName() + "

"; + if (f.getDescription() != null + && f.getDescription() != "") { + text += f.getDescription().substring(0, + f.getDescription().indexOf(".") + 1); + } + title = new Label(text, Label.CONTENT_XHTML); title.setStyleName("subsection"); + title.setSizeUndefined(); grid.addComponent(title); - grid - .setComponentAlignment(title, - Alignment.MIDDLE_LEFT); } } else { - if (grid.getCursorX() == 0) { - grid.space(); - } - Button b = new NativeButton(); + Button b = new Button(f.getName()); b.setStyleName(Button.STYLE_LINK); b.addStyleName("screenshot"); String resId = "75-" + f.getIconName(); @@ -787,12 +781,8 @@ public class SamplerApplication extends Application { res = new ClassResource(f.getClass(), resId, SamplerApplication.this); iconCache.put(resId, res); - } b.setIcon(res); - b.setWidth("75px"); - b.setHeight("75px"); - b.setDescription("

" + f.getName() + "

"); b.addListener(new Button.ClickListener() { public void buttonClick(ClickEvent event) { ((SamplerWindow) getWindow()).setFeature(f);