diff --git a/.settings/org.eclipse.wst.common.component b/.settings/org.eclipse.wst.common.component index 43242c5..f25c36f 100644 --- a/.settings/org.eclipse.wst.common.component +++ b/.settings/org.eclipse.wst.common.component @@ -4,9 +4,6 @@ - - uses - diff --git a/pom.xml b/pom.xml index 78cf530..c366f89 100644 --- a/pom.xml +++ b/pom.xml @@ -195,20 +195,24 @@ [0.2.0-SNAPSHOT,1.0.0-SNAPSHOT) - + + - org.gcube.portlets.admin - accounting-manager-theme - [0.0.1-SNAPSHOT, 2.0.0-SNAPSHOT) + com.sencha.gxt + gxt-theme-neptune + 3.1.1 + org.gcube.accounting accounting-analytics [1.0.0-SNAPSHOT,2.0.0-SNAPSHOT) - + org.gcube.accounting diff --git a/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.css b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.css new file mode 100644 index 0000000..9dac9f4 --- /dev/null +++ b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.css @@ -0,0 +1,321 @@ +/** + * Sencha GXT 3.1.1 - Sencha for GWT + * Copyright(c) 2007-2014, Sencha, Inc. + * licensing@sencha.com + * + * http://www.sencha.com/products/gxt/license/ + */ +@def borderColor value('theme.tabs.borderColor'); +@def bodyBackgroundColor value('theme.tabs.bodyBackgroundColor'); +/*@def cornerRadius value('theme.tabs.borderRadius', 'px');*/ + +@def cornerRadius 8px; +@def tabItemMarginTop 2px; +@def lastStopColor value('theme.tabs.lastStopColor'); +@def headerGradient value('theme.tabs.gradient'); +@def hoverGradient value('theme.tabs.hoverGradient'); +@def inactiveHeaderGradient value('theme.tabs.inactiveGradient'); +@def tabStripGradient value('theme.tabs.tabStripGradient'); + +@def headingTextColor value('theme.tabs.headingText.color'); +@def headingTextSize value('theme.tabs.headingText.size'); +@def headingTextWeight value('theme.tabs.headingText.weight'); +@def headingTextFont value('theme.tabs.headingText.family'); + +@def hoverHeadingTextColor value('theme.tabs.hoverHeadingText.color'); +@def hoverTextSize value('theme.tabs.hoverHeadingText.size'); +@def hoverHeadingTextWeight value('theme.tabs.hoverHeadingText.weight'); +@def hoverHeadingTextFont value('theme.tabs.hoverHeadingText.family'); + +@def activeHeadingTextColor value('theme.tabs.activeHeadingText.color'); +@def activeHeadingTextSize value('theme.tabs.activeHeadingText.size'); +@def activeHeadingTextWeight value('theme.tabs.activeHeadingText.weight'); +@def activeHeadingTextFont value('theme.tabs.activeHeadingText.family'); + +@def tabLeftPadding value('theme.tabs.padding.left', 'px'); + +/*@def tabLeftPaddingIcon value('theme.tabs.paddingWithIcon.left', 'px');*//*extra space for icon, default to 16px for icon*/ + + +@def tabLeftPaddingIcon 50px; + +@def tabRightPadding value('theme.tabs.padding.right', 'px'); +@def tabRightPaddingClosable value('theme.tabs.paddingWithClosable.right', 'px');/*extra space for close icon*/ + +@def tabIconLeftOffset value('theme.tabs.iconLeftOffset', 'px'); +@def tabIconTopOffset value('theme.tabs.iconTopOffset', 'px'); + +@def scrollerBackgroundColor value('theme.tabs.scrollerBackgroundColor'); +@def scrollerWidth value('theme.tabs.scrollerWidth', 'px'); + +/* +@def tabHeight value('theme.tabs.tabHeight', 'px'); +*/ +@def tabHeight 56px; +@def tabSpacing value('theme.tabs.tabSpacing', 'px'); + +@def tabItemBorderLeft value('theme.tabs.tabItemBorderLeft'); +@def tabItemBorderTop value('theme.tabs.tabItemBorderTop'); +@def tabItemBorderRight value('theme.tabs.tabItemBorderRight'); + +@def tabStripPaddingTop value('theme.tabs.tabStripPadding.top','px'); +@def tabBarBorder value('theme.tabs.tabBarBorder'); +@def tabBarBottomHeight value('theme.tabs.tabBarBottomHeight', 'px'); +@def tabStripBottomBorder value('theme.tabs.tabStripBottomBorder'); +@def tabBodyBorder value('theme.tabs.tabBodyBorder'); +@def tabTextPadding value('theme.tabs.tabTextPadding.toString'); +@def tabTexPaddingTop 16px; + +.tab { + overflow: hidden; + outline: none; +} + +.tabBar { + background-color: lastStopColor; + border: tabBarBorder; + overflow: hidden; + padding-bottom: tabBarBottomHeight; +} + +.tabStripWrap { + background: -webkit-linear-gradient(top, tabStripGradient); /* Chrome10+,Safari5.1+ */ + background: linear-gradient(to bottom, tabStripGradient); /* W3C */ + width: 100%; + overflow: hidden; + position: relative; + padding-top: tabStripPaddingTop; +} + +.tabStrip { + display: block; + /* widths great than this in ie8 causes north / south resize handles to have white background when tab panel put into window */ + /* width: 65520px; */ + whidth: auto; + float: left; + + background: repeat-x bottom; + border-bottom: tabStripBottomBorder; +} + +li.tabItem { + float: left; + position: relative; + margin-right: tabSpacing; + height: tabHeight; + cursor: pointer; +} + +.tabStripActive.tabItem { + cursor: default; +} + +.tabStrip li.tabEdge { + float: left; + margin: 0 !important; + padding: 0 !important; + border: 0 none !important; + font-size: 1px !important; + line-height: 1px !important; + overflow: hidden; + background: transparent !important; + width: 1px; +} + +.tabStrip a, .tabStrip span, .tabStrip em { + display: block; +} + +.tabStrip a { + text-decoration: none !important; + cursor: pointer; + outline: none; +} + +.tabStripInner { + overflow: hidden; + text-overflow: ellipsis; +} + +.tabStripText { + font: normal headingTextWeight headingTextSize headingTextFont; + color: headingTextColor; + white-space: nowrap; + cursor: pointer; + padding: tabTextPadding; + padding-top: tabTexPaddingTop; + + +} + +.tabWithIcon .tabStripText { + padding-left: tabLeftPaddingIcon; + background-position: 0 3px; + background-repeat: no-repeat; +} + +.tabStripActive, .tabStripActive a.tabRight { + cursor: default; +} +.tabStripOver .tabStripText { + font: normal hoverHeadingTextWeight hoverHeadingTextSize hoverHeadingTextFont; + color: hoverHeadingTextColor; +} + +.tabStripActive .tabStripText { + cursor: default; + margin-bottom: -1px; + font: normal activeHeadingTextWeight activeHeadingTextSize activeHeadingTextFont; + color: activeHeadingTextColor; +} + +@sprite .tabStrip .tabStripClosable a.tabStripClose { + gwt-image: "tabClose"; +} + +@sprite .tabStrip .tabStripClosable a.tabStripClose:hover { + gwt-image: "tabCloseOver"; +} + +.tabBody { + overflow: hidden; + background-color: bodyBackgroundColor; +} + +.tabStripActive .tabRight { + margin-bottom: -1px; +} + +.tabStripActive .tabStripText { + padding-bottom: 5px; +} + +.tabStrip .tabStripClose { + display: none; +} + +.tabStripClosable .tabStripClose { + background-repeat: no-repeat; + display: block; + width: 11px; + height: 11px; + position: absolute; + top: 3px; + right: 3px; + cursor: pointer; + z-index: 2; +} + +.tabStripClosable .tabStripClose { + opacity: 0.6; +} + +.tabStripActive .tabStripClose { + opacity: .8; +} + +.tabStripClosable .tabStripClose:hover { + opacity: 1; +} + +.tabBody { + border: tabBodyBorder; + border-top: 0 none; +} + +.tabScrolling .tabStripWrap { + margin-left: scrollerWidth; + margin-right: scrollerWidth; +} + +.tabScrolling { + position: relative; +} + +.tabImage { + position: absolute; + + top: tabIconTopOffset; + left: tabIconLeftOffset; +} + +.tabStripOver.tabItem { + background: -webkit-linear-gradient(top, hoverGradient); /* Chrome10+,Safari5.1+ */ + background: linear-gradient(to bottom, hoverGradient); /* W3C */ + + margin-bottom: -1px; + border-bottom: 1px solid lastStopColor; +} + +.tabStripActive.tabItem { + background: -webkit-linear-gradient(top, headerGradient); /* Chrome10+,Safari5.1+ */ + background: linear-gradient(to bottom, headerGradient); /* W3C */ + + margin-bottom: -1px; + border-bottom: 1px solid lastStopColor; +} + +.tabItem { + border-top-left-radius: cornerRadius; + border-top-right-radius: cornerRadius; + border-top: tabItemBorderTop; + border-left: tabItemBorderLeft; + border-right: tabItemBorderRight; + + margin-top: tabItemMarginTop; + + padding-left: tabLeftPadding; + padding-right: tabRightPadding; + + background: -webkit-linear-gradient(top, inactiveHeaderGradient); /* Chrome10+,Safari5.1+ */ + background: linear-gradient(to bottom, inactiveHeaderGradient); /* W3C */ +} +.tabItem.tabStripClosable { + padding-right: tabRightPaddingClosable; +} + +@sprite .tabScrollerLeft { + gwt-image: "scrollerLeft"; + width: scrollerWidth; + background-position: center; + background-color: scrollerBackgroundColor; + + + + border: none; + + position: absolute; + left: 0; + top: 0; + z-index: 10; + cursor: pointer; +} + +.tabScrollerLeftOver { + opacity: .7; +} + +@sprite .tabScrollerRight { + gwt-image: "scrollerRight"; + width: scrollerWidth; + + background-position: center; + background-color: scrollerBackgroundColor; + + border: none; + + position: absolute; + right: 0; + top: 0; + z-index: 10; + cursor: pointer; +} + +.tabScrollerLeftDisabled, .tabScrollerRightDisabled { + cursor: default; + opacity: .7; +} + +.tabScrollerRightOver { + opacity: .7; +} diff --git a/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.html b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.html new file mode 100644 index 0000000..96f9032 --- /dev/null +++ b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.html @@ -0,0 +1,11 @@ +
+
+
+
    +
  • +
    +
+
+
+
+
\ No newline at end of file diff --git a/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanelAppearance.java b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanelAppearance.java new file mode 100644 index 0000000..513d9b9 --- /dev/null +++ b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanelAppearance.java @@ -0,0 +1,312 @@ +package org.gcube.portlets.admin.accountingmanager.client.custom; + +import com.google.gwt.core.client.GWT; +import com.google.gwt.dom.client.Element; +import com.google.gwt.dom.client.NodeList; +import com.google.gwt.resources.client.ImageResource; +import com.google.gwt.safehtml.shared.SafeHtml; +import com.google.gwt.safehtml.shared.SafeHtmlBuilder; +import com.sencha.gxt.core.client.XTemplates; +import com.sencha.gxt.core.client.dom.XDOM; +import com.sencha.gxt.core.client.dom.XElement; +import com.sencha.gxt.core.client.resources.StyleInjectorHelper; +import com.sencha.gxt.core.client.resources.ThemeStyles; +import com.sencha.gxt.core.client.util.IconHelper; +import com.sencha.gxt.theme.neptune.client.base.tabs.Css3TabPanelAppearance.Css3TabPanelResources; +import com.sencha.gxt.widget.core.client.TabItemConfig; +import com.sencha.gxt.widget.core.client.TabPanel.TabPanelAppearance; + + +public class Css3BigTabPanelAppearance implements TabPanelAppearance { + + public interface ItemTemplate extends XTemplates { + @XTemplate(source = "Css3BigTabPanelTabItem.html") + SafeHtml render(Css3TabPanelStyle style, TabItemConfig config); + } + + public interface Css3BigTabPanelResources extends Css3TabPanelResources { + @Source("Css3BigTabPanel.css") + Css3TabPanelStyle style(); + + /* + ThemeDetails theme(); + + ImageResource tabClose(); + + ImageResource tabCloseOver(); + + ImageResource scrollerLeft(); + + ImageResource scrollerRight(); + */ + } + + public interface Css3TabPanelStyle extends com.sencha.gxt.theme.neptune.client.base.tabs.Css3TabPanelAppearance.Css3TabPanelStyle { + /** the entire tab panel */ + String tab(); + + /** contents of the tab panel */ + String tabBody(); + + String tabEdge(); + + /** tab bar, when above the body */ + String tabBar(); + + /** icon element inside a tab item */ + String tabImage(); + + /** the tab item itself */ + String tabItem(); + + String tabRight(); + + String tabScrollerLeft(); + + String tabScrollerLeftDisabled(); + + String tabScrollerLeftOver(); + + String tabScrollerRight(); + + String tabScrollerRightDisabled(); + + String tabScrollerRightOver(); + + String tabScrolling(); + + String tabStrip(); + + /** marker on the tab item that it is active */ + String tabStripActive(); + + /** marker on the tab item that it may be closed */ + String tabStripClosable(); + + /** close icon within a tab item, may not be visible */ + String tabStripClose(); + + String tabStripInner(); + + /** marker on the tab item that it is hovered */ + String tabStripOver(); + + /** text element inside the tab item */ + String tabStripText(); + + String tabStripWrap(); + + /** extra marker on the tab item to indicate that there is an icon */ + String tabWithIcon(); + } + + public interface Css3TabPanelTemplates extends XTemplates { + @XTemplate(source = "Css3BigTabPanel.html") + SafeHtml render(Css3TabPanelStyle style); + } + + protected ItemTemplate itemTemplate = GWT. create(ItemTemplate.class); + protected final Css3TabPanelStyle style; + protected Css3TabPanelTemplates template; + + private static final String ITEM_SELECTOR = "li"; + + public Css3BigTabPanelAppearance() { + this(GWT. create(Css3BigTabPanelResources.class)); + } + + public Css3BigTabPanelAppearance(Css3BigTabPanelResources resources) { + this(resources, GWT. create(Css3TabPanelTemplates.class)); + } + + public Css3BigTabPanelAppearance(Css3BigTabPanelResources resources, Css3TabPanelTemplates template) { + this.style = resources.style(); + this.template = template; + + StyleInjectorHelper.ensureInjected(this.style, true); + } + + @Override + public void createScrollers(XElement parent) { + int h = getStripWrap(parent).getOffsetHeight(); + XElement scrollLeft = getBar(parent).insertFirst("
"); + scrollLeft.setId(XDOM.getUniqueId()); + scrollLeft.setHeight(h); + + XElement scrollRight = getBar(parent).insertFirst("
"); + scrollRight.setId(XDOM.getUniqueId()); + scrollRight.setHeight(h); + } + + @Override + public XElement getBar(XElement parent) { + return parent.getFirstChildElement().cast(); + } + + @Override + public XElement getBody(XElement parent) { + return parent.selectNode("." + style.tabBody()); + } + + @Override + public String getItemSelector() { + return ITEM_SELECTOR; + } + + @Override + public XElement getScrollLeft(XElement parent) { + return getBar(parent).selectNode("." + style.tabScrollerLeft()); + } + + @Override + public XElement getScrollRight(XElement parent) { + return getBar(parent).selectNode("." + style.tabScrollerRight()); + } + + public XElement getStrip(XElement parent) { + return parent.selectNode("." + style.tabStrip()); + } + + @Override + public XElement getStripEdge(XElement parent) { + return parent.selectNode("." + style.tabEdge()); + } + + @Override + public XElement getStripWrap(XElement parent) { + return parent.selectNode("." + style.tabStripWrap()); + } + + @Override + public void insert(XElement parent, TabItemConfig config, int index) { + XElement item = XDOM.create(itemTemplate.render(style, config).asString()); + item.setClassName(ThemeStyles.get().style().disabled(), !config.isEnabled()); + + if (config.isHTML()) { + XElement textEl = item.selectNode("." + style.tabStripText()); + textEl.setInnerHTML(config.getHTML()); + } + + getStrip(parent).insertChild(item, index); + + if (config.getIcon() != null) { + setItemIcon(item, config.getIcon()); + } + + if (config.isClosable()) { + item.addClassName(style.tabStripClosable()); + } + } + + @Override + public boolean isClose(XElement target) { + return target.is("." + style.tabStripClose()); + } + + @Override + public void onDeselect(Element item) { + item.removeClassName(style.tabStripActive()); + } + + @Override + public void onMouseOut(XElement parent, XElement target) { + NodeList nodeList = parent.select("." + style.tabStripOver()); + for (int i = 0; i < nodeList.getLength(); i++) { + nodeList.getItem(i).removeClassName(style.tabStripOver()); + } + if (target.is("." + style.tabScrollerLeft())) { + target.removeClassName(style.tabScrollerLeftOver()); + } else if (target.is("." + style.tabScrollerRight())) { + target.removeClassName(style.tabScrollerRightOver()); + } + } + + @Override + public void onMouseOver(XElement parent, XElement target) { + Element item = findItem(target); + if (item != null) { + item.addClassName(style.tabStripOver()); + } else if (target.is("." + style.tabScrollerLeft())) { + target.addClassName(style.tabScrollerLeftOver()); + } else if (target.is("." + style.tabScrollerRight())) { + target.addClassName(style.tabScrollerRightOver()); + } + } + + @Override + public void onScrolling(XElement parent, boolean scrolling) { + parent.selectNode("." + style.tabBar()).setClassName(style.tabScrolling(), scrolling); + } + + @Override + public void onSelect(Element item) { + item.addClassName(style.tabStripActive()); + } + + @Override + public void render(SafeHtmlBuilder builder) { + builder.append(template.render(style)); + } + + @Override + public void setItemWidth(XElement element, int width) { + XElement inner = element.selectNode("." + style.tabStripInner()); + int tw = element.getOffsetWidth(); + int iw = inner.getOffsetWidth(); + inner.setWidth(width - (tw - iw)); + } + + @Override + public void updateItem(XElement item, TabItemConfig config) { + XElement textEl = item.selectNode("." + style.tabStripText()); + + if (config.isHTML()) { + textEl.setInnerHTML(config.getHTML()); + } else { + textEl.setInnerText(config.getText()); + } + + setItemIcon(item, config.getIcon()); + + item.setClassName(ThemeStyles.get().style().disabled(), !config.isEnabled()); + + item.setClassName(style.tabStripClosable(), config.isClosable()); + } + + @Override + public void updateScrollButtons(XElement parent) { + int pos = getScrollPos(parent); + getScrollLeft(parent).setClassName(style.tabScrollerLeftDisabled(), pos == 0); + getScrollRight(parent).setClassName(style.tabScrollerRightDisabled(), + pos >= (getScrollWidth(parent) - getScrollArea(parent) - 2)); + } + + protected Element findItem(Element target) { + return target. cast().findParentElement(ITEM_SELECTOR, -1); + } + + protected void setItemIcon(XElement item, ImageResource icon) { + XElement node = item.selectNode("." + style.tabImage()); + if (node != null) { + node.removeFromParent(); + } + if (icon != null) { + Element e = IconHelper.getElement(icon); + e.setClassName(style.tabImage()); + item.appendChild(e); + } + item.setClassName(style.tabWithIcon(), icon != null); + } + + private int getScrollPos(XElement parent) { + return getStripWrap(parent).getScrollLeft(); + } + + private int getScrollArea(XElement parent) { + return Math.max(0, getStripWrap(parent).getClientWidth()); + } + + private int getScrollWidth(XElement parent) { + return getStripEdge(parent).getOffsetsTo(getStripWrap(parent)).getX() + getScrollPos(parent); + } +} diff --git a/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanelTabItem.html b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanelTabItem.html new file mode 100644 index 0000000..200d08b --- /dev/null +++ b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanelTabItem.html @@ -0,0 +1,4 @@ +
  • + + {config.text} +
  • diff --git a/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerLeft.png b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerLeft.png new file mode 100644 index 0000000..8d00a24 Binary files /dev/null and b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerLeft.png differ diff --git a/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerRight.png b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerRight.png new file mode 100644 index 0000000..2add25a Binary files /dev/null and b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerRight.png differ diff --git a/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/tabClose.png b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/tabClose.png new file mode 100644 index 0000000..1ca1c86 Binary files /dev/null and b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/tabClose.png differ diff --git a/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/tabCloseOver.png b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/tabCloseOver.png new file mode 100644 index 0000000..c47ca89 Binary files /dev/null and b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/custom/tabCloseOver.png differ diff --git a/src/main/java/org/gcube/portlets/admin/accountingmanager/client/menu/AccountingManagerMenu.java b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/menu/AccountingManagerMenu.java index 668f075..459739b 100644 --- a/src/main/java/org/gcube/portlets/admin/accountingmanager/client/menu/AccountingManagerMenu.java +++ b/src/main/java/org/gcube/portlets/admin/accountingmanager/client/menu/AccountingManagerMenu.java @@ -1,5 +1,6 @@ package org.gcube.portlets.admin.accountingmanager.client.menu; +import org.gcube.portlets.admin.accountingmanager.client.custom.Css3BigTabPanelAppearance; import org.gcube.portlets.admin.accountingmanager.client.event.AccountingMenuEvent; import org.gcube.portlets.admin.accountingmanager.client.resource.AccountingManagerResources; import org.gcube.portlets.admin.accountingmanager.shared.data.AccountingType; @@ -10,7 +11,6 @@ import com.google.gwt.event.logical.shared.SelectionEvent; import com.google.gwt.event.logical.shared.SelectionHandler; import com.google.gwt.event.shared.EventBus; import com.google.gwt.user.client.ui.Widget; -import com.sencha.gxt.theme.neptune.client.base.tabs.Css3BigTabPanelAppearance; import com.sencha.gxt.widget.core.client.TabItemConfig; import com.sencha.gxt.widget.core.client.TabPanel; diff --git a/src/main/resources/org/gcube/portlets/admin/accountingmanager/AccountingManager.gwt.xml b/src/main/resources/org/gcube/portlets/admin/accountingmanager/AccountingManager.gwt.xml index 208a810..c074c24 100644 --- a/src/main/resources/org/gcube/portlets/admin/accountingmanager/AccountingManager.gwt.xml +++ b/src/main/resources/org/gcube/portlets/admin/accountingmanager/AccountingManager.gwt.xml @@ -24,8 +24,8 @@ - + @@ -48,17 +48,17 @@ name="locale" values="es" /> --> - + - - - - + diff --git a/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.css b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.css new file mode 100644 index 0000000..9dac9f4 --- /dev/null +++ b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.css @@ -0,0 +1,321 @@ +/** + * Sencha GXT 3.1.1 - Sencha for GWT + * Copyright(c) 2007-2014, Sencha, Inc. + * licensing@sencha.com + * + * http://www.sencha.com/products/gxt/license/ + */ +@def borderColor value('theme.tabs.borderColor'); +@def bodyBackgroundColor value('theme.tabs.bodyBackgroundColor'); +/*@def cornerRadius value('theme.tabs.borderRadius', 'px');*/ + +@def cornerRadius 8px; +@def tabItemMarginTop 2px; +@def lastStopColor value('theme.tabs.lastStopColor'); +@def headerGradient value('theme.tabs.gradient'); +@def hoverGradient value('theme.tabs.hoverGradient'); +@def inactiveHeaderGradient value('theme.tabs.inactiveGradient'); +@def tabStripGradient value('theme.tabs.tabStripGradient'); + +@def headingTextColor value('theme.tabs.headingText.color'); +@def headingTextSize value('theme.tabs.headingText.size'); +@def headingTextWeight value('theme.tabs.headingText.weight'); +@def headingTextFont value('theme.tabs.headingText.family'); + +@def hoverHeadingTextColor value('theme.tabs.hoverHeadingText.color'); +@def hoverTextSize value('theme.tabs.hoverHeadingText.size'); +@def hoverHeadingTextWeight value('theme.tabs.hoverHeadingText.weight'); +@def hoverHeadingTextFont value('theme.tabs.hoverHeadingText.family'); + +@def activeHeadingTextColor value('theme.tabs.activeHeadingText.color'); +@def activeHeadingTextSize value('theme.tabs.activeHeadingText.size'); +@def activeHeadingTextWeight value('theme.tabs.activeHeadingText.weight'); +@def activeHeadingTextFont value('theme.tabs.activeHeadingText.family'); + +@def tabLeftPadding value('theme.tabs.padding.left', 'px'); + +/*@def tabLeftPaddingIcon value('theme.tabs.paddingWithIcon.left', 'px');*//*extra space for icon, default to 16px for icon*/ + + +@def tabLeftPaddingIcon 50px; + +@def tabRightPadding value('theme.tabs.padding.right', 'px'); +@def tabRightPaddingClosable value('theme.tabs.paddingWithClosable.right', 'px');/*extra space for close icon*/ + +@def tabIconLeftOffset value('theme.tabs.iconLeftOffset', 'px'); +@def tabIconTopOffset value('theme.tabs.iconTopOffset', 'px'); + +@def scrollerBackgroundColor value('theme.tabs.scrollerBackgroundColor'); +@def scrollerWidth value('theme.tabs.scrollerWidth', 'px'); + +/* +@def tabHeight value('theme.tabs.tabHeight', 'px'); +*/ +@def tabHeight 56px; +@def tabSpacing value('theme.tabs.tabSpacing', 'px'); + +@def tabItemBorderLeft value('theme.tabs.tabItemBorderLeft'); +@def tabItemBorderTop value('theme.tabs.tabItemBorderTop'); +@def tabItemBorderRight value('theme.tabs.tabItemBorderRight'); + +@def tabStripPaddingTop value('theme.tabs.tabStripPadding.top','px'); +@def tabBarBorder value('theme.tabs.tabBarBorder'); +@def tabBarBottomHeight value('theme.tabs.tabBarBottomHeight', 'px'); +@def tabStripBottomBorder value('theme.tabs.tabStripBottomBorder'); +@def tabBodyBorder value('theme.tabs.tabBodyBorder'); +@def tabTextPadding value('theme.tabs.tabTextPadding.toString'); +@def tabTexPaddingTop 16px; + +.tab { + overflow: hidden; + outline: none; +} + +.tabBar { + background-color: lastStopColor; + border: tabBarBorder; + overflow: hidden; + padding-bottom: tabBarBottomHeight; +} + +.tabStripWrap { + background: -webkit-linear-gradient(top, tabStripGradient); /* Chrome10+,Safari5.1+ */ + background: linear-gradient(to bottom, tabStripGradient); /* W3C */ + width: 100%; + overflow: hidden; + position: relative; + padding-top: tabStripPaddingTop; +} + +.tabStrip { + display: block; + /* widths great than this in ie8 causes north / south resize handles to have white background when tab panel put into window */ + /* width: 65520px; */ + whidth: auto; + float: left; + + background: repeat-x bottom; + border-bottom: tabStripBottomBorder; +} + +li.tabItem { + float: left; + position: relative; + margin-right: tabSpacing; + height: tabHeight; + cursor: pointer; +} + +.tabStripActive.tabItem { + cursor: default; +} + +.tabStrip li.tabEdge { + float: left; + margin: 0 !important; + padding: 0 !important; + border: 0 none !important; + font-size: 1px !important; + line-height: 1px !important; + overflow: hidden; + background: transparent !important; + width: 1px; +} + +.tabStrip a, .tabStrip span, .tabStrip em { + display: block; +} + +.tabStrip a { + text-decoration: none !important; + cursor: pointer; + outline: none; +} + +.tabStripInner { + overflow: hidden; + text-overflow: ellipsis; +} + +.tabStripText { + font: normal headingTextWeight headingTextSize headingTextFont; + color: headingTextColor; + white-space: nowrap; + cursor: pointer; + padding: tabTextPadding; + padding-top: tabTexPaddingTop; + + +} + +.tabWithIcon .tabStripText { + padding-left: tabLeftPaddingIcon; + background-position: 0 3px; + background-repeat: no-repeat; +} + +.tabStripActive, .tabStripActive a.tabRight { + cursor: default; +} +.tabStripOver .tabStripText { + font: normal hoverHeadingTextWeight hoverHeadingTextSize hoverHeadingTextFont; + color: hoverHeadingTextColor; +} + +.tabStripActive .tabStripText { + cursor: default; + margin-bottom: -1px; + font: normal activeHeadingTextWeight activeHeadingTextSize activeHeadingTextFont; + color: activeHeadingTextColor; +} + +@sprite .tabStrip .tabStripClosable a.tabStripClose { + gwt-image: "tabClose"; +} + +@sprite .tabStrip .tabStripClosable a.tabStripClose:hover { + gwt-image: "tabCloseOver"; +} + +.tabBody { + overflow: hidden; + background-color: bodyBackgroundColor; +} + +.tabStripActive .tabRight { + margin-bottom: -1px; +} + +.tabStripActive .tabStripText { + padding-bottom: 5px; +} + +.tabStrip .tabStripClose { + display: none; +} + +.tabStripClosable .tabStripClose { + background-repeat: no-repeat; + display: block; + width: 11px; + height: 11px; + position: absolute; + top: 3px; + right: 3px; + cursor: pointer; + z-index: 2; +} + +.tabStripClosable .tabStripClose { + opacity: 0.6; +} + +.tabStripActive .tabStripClose { + opacity: .8; +} + +.tabStripClosable .tabStripClose:hover { + opacity: 1; +} + +.tabBody { + border: tabBodyBorder; + border-top: 0 none; +} + +.tabScrolling .tabStripWrap { + margin-left: scrollerWidth; + margin-right: scrollerWidth; +} + +.tabScrolling { + position: relative; +} + +.tabImage { + position: absolute; + + top: tabIconTopOffset; + left: tabIconLeftOffset; +} + +.tabStripOver.tabItem { + background: -webkit-linear-gradient(top, hoverGradient); /* Chrome10+,Safari5.1+ */ + background: linear-gradient(to bottom, hoverGradient); /* W3C */ + + margin-bottom: -1px; + border-bottom: 1px solid lastStopColor; +} + +.tabStripActive.tabItem { + background: -webkit-linear-gradient(top, headerGradient); /* Chrome10+,Safari5.1+ */ + background: linear-gradient(to bottom, headerGradient); /* W3C */ + + margin-bottom: -1px; + border-bottom: 1px solid lastStopColor; +} + +.tabItem { + border-top-left-radius: cornerRadius; + border-top-right-radius: cornerRadius; + border-top: tabItemBorderTop; + border-left: tabItemBorderLeft; + border-right: tabItemBorderRight; + + margin-top: tabItemMarginTop; + + padding-left: tabLeftPadding; + padding-right: tabRightPadding; + + background: -webkit-linear-gradient(top, inactiveHeaderGradient); /* Chrome10+,Safari5.1+ */ + background: linear-gradient(to bottom, inactiveHeaderGradient); /* W3C */ +} +.tabItem.tabStripClosable { + padding-right: tabRightPaddingClosable; +} + +@sprite .tabScrollerLeft { + gwt-image: "scrollerLeft"; + width: scrollerWidth; + background-position: center; + background-color: scrollerBackgroundColor; + + + + border: none; + + position: absolute; + left: 0; + top: 0; + z-index: 10; + cursor: pointer; +} + +.tabScrollerLeftOver { + opacity: .7; +} + +@sprite .tabScrollerRight { + gwt-image: "scrollerRight"; + width: scrollerWidth; + + background-position: center; + background-color: scrollerBackgroundColor; + + border: none; + + position: absolute; + right: 0; + top: 0; + z-index: 10; + cursor: pointer; +} + +.tabScrollerLeftDisabled, .tabScrollerRightDisabled { + cursor: default; + opacity: .7; +} + +.tabScrollerRightOver { + opacity: .7; +} diff --git a/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.html b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.html new file mode 100644 index 0000000..96f9032 --- /dev/null +++ b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanel.html @@ -0,0 +1,11 @@ +
    +
    +
    +
      +
    • +
      +
    +
    +
    +
    +
    \ No newline at end of file diff --git a/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanelTabItem.html b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanelTabItem.html new file mode 100644 index 0000000..200d08b --- /dev/null +++ b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/Css3BigTabPanelTabItem.html @@ -0,0 +1,4 @@ +
  • + + {config.text} +
  • diff --git a/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerLeft.png b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerLeft.png new file mode 100644 index 0000000..8d00a24 Binary files /dev/null and b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerLeft.png differ diff --git a/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerRight.png b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerRight.png new file mode 100644 index 0000000..2add25a Binary files /dev/null and b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/scrollerRight.png differ diff --git a/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/tabClose.png b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/tabClose.png new file mode 100644 index 0000000..1ca1c86 Binary files /dev/null and b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/tabClose.png differ diff --git a/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/tabCloseOver.png b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/tabCloseOver.png new file mode 100644 index 0000000..c47ca89 Binary files /dev/null and b/src/main/resources/org/gcube/portlets/admin/accountingmanager/client/custom/tabCloseOver.png differ diff --git a/src/main/webapp/WEB-INF/jsp/AccountingManagerPortlet_view.jsp b/src/main/webapp/WEB-INF/jsp/AccountingManagerPortlet_view.jsp index 0818b5f..c57ca81 100644 --- a/src/main/webapp/WEB-INF/jsp/AccountingManagerPortlet_view.jsp +++ b/src/main/webapp/WEB-INF/jsp/AccountingManagerPortlet_view.jsp @@ -7,13 +7,13 @@ - - + +