diff --git a/java/com.sap.sailing.server/SailingServer (No Proxy).launch b/java/com.sap.sailing.server/SailingServer (No Proxy).launch
index 8d2cd64f937..8f35a451c9c 100755
--- a/java/com.sap.sailing.server/SailingServer (No Proxy).launch
+++ b/java/com.sap.sailing.server/SailingServer (No Proxy).launch
@@ -33,5 +33,5 @@
-
+
diff --git a/java/com.sap.sse.gwt.theme/.classpath b/java/com.sap.sse.gwt.theme/.classpath
new file mode 100644
index 00000000000..b983a4da697
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/.classpath
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/java/com.sap.sse.gwt.theme/.gitignore b/java/com.sap.sse.gwt.theme/.gitignore
new file mode 100644
index 00000000000..62f0b377a8a
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/.gitignore
@@ -0,0 +1,6 @@
+/bin
+/.gwt
+/.generated
+/gwt-unitCache
+/extras
+/com.sap.sse.gwt.theme.*
diff --git a/java/com.sap.sse.gwt.theme/.project b/java/com.sap.sse.gwt.theme/.project
new file mode 100644
index 00000000000..8e679e93a05
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/.project
@@ -0,0 +1,39 @@
+
+
+ com.sap.sse.gwt.theme
+
+
+
+
+
+ org.eclipse.jdt.core.javabuilder
+
+
+
+
+ org.eclipse.pde.ManifestBuilder
+
+
+
+
+ org.eclipse.pde.SchemaBuilder
+
+
+
+
+ com.google.gdt.eclipse.core.webAppProjectValidator
+
+
+
+
+ com.google.gwt.eclipse.core.gwtProjectValidator
+
+
+
+
+
+ org.eclipse.pde.PluginNature
+ org.eclipse.jdt.core.javanature
+ com.google.gwt.eclipse.core.gwtNature
+
+
diff --git a/java/com.sap.sse.gwt.theme/.settings/com.google.gwt.eclipse.core.prefs b/java/com.sap.sse.gwt.theme/.settings/com.google.gwt.eclipse.core.prefs
new file mode 100644
index 00000000000..e992774d99b
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/.settings/com.google.gwt.eclipse.core.prefs
@@ -0,0 +1,2 @@
+eclipse.preferences.version=1
+gwtCompileSettings=PGd3dC1jb21waWxlLXNldHRpbmdzPjxsb2ctbGV2ZWw+SU5GTzwvbG9nLWxldmVsPjxvdXRwdXQtc3R5bGU+T0JGVVNDQVRFRDwvb3V0cHV0LXN0eWxlPjxleHRyYS1hcmdzPjwhW0NEQVRBWy13YXIgLiAtbG9jYWxXb3JrZXJzIDMgLXN0cmljdCAtbG9nTGV2ZWwgSU5GT11dPjwvZXh0cmEtYXJncz48dm0tYXJncz48IVtDREFUQVstWG14NTEybV1dPjwvdm0tYXJncz48ZW50cnktcG9pbnQtbW9kdWxlPmNvbS5zYXAuc3NlLmd3dC50aGVtZS5TU0VUaGVtZTwvZW50cnktcG9pbnQtbW9kdWxlPjwvZ3d0LWNvbXBpbGUtc2V0dGluZ3M+
diff --git a/java/com.sap.sse.gwt.theme/META-INF/MANIFEST.MF b/java/com.sap.sse.gwt.theme/META-INF/MANIFEST.MF
new file mode 100644
index 00000000000..ff236c0cf0d
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/META-INF/MANIFEST.MF
@@ -0,0 +1,19 @@
+Manifest-Version: 1.0
+Bundle-ManifestVersion: 2
+Bundle-Name: SSE Base Theme
+Bundle-SymbolicName: com.sap.sse.gwt.theme
+Bundle-Version: 1.0.0.qualifier
+Bundle-Vendor: SAP
+Bundle-RequiredExecutionEnvironment: JavaSE-1.7
+Bundle-ActivationPolicy: lazy
+Bundle-ClassPath: WEB-INF/classes/
+Import-Package: org.osgi.framework;version="1.7.0",
+ javax.servlet;version="3.1.0",
+ javax.servlet.descriptor;version="3.1.0",
+ javax.servlet.http;version="3.1.0"
+Require-Bundle: com.google.gwt.osgi;bundle-version="2.7.0",
+ com.sap.sailing.domain.common,
+ com.sap.sse.common,
+ com.sap.sse.gwt
+Web-ContextPath: /theme
+Export-Package: com.sap.sse.gwt.theme.client
diff --git a/java/com.sap.sse.gwt.theme/SSETheme.css b/java/com.sap.sse.gwt.theme/SSETheme.css
new file mode 100644
index 00000000000..9a49fb97ef1
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/SSETheme.css
@@ -0,0 +1,3 @@
+.mainPanel {
+
+}
\ No newline at end of file
diff --git a/java/com.sap.sse.gwt.theme/SSETheme.html b/java/com.sap.sse.gwt.theme/SSETheme.html
new file mode 100644
index 00000000000..cb45c7aad46
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/SSETheme.html
@@ -0,0 +1,54 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ SAP Sports Engine Theme
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/java/com.sap.sse.gwt.theme/SSETheme_GWT sdm.launch b/java/com.sap.sse.gwt.theme/SSETheme_GWT sdm.launch
new file mode 100644
index 00000000000..e61889df28b
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/SSETheme_GWT sdm.launch
@@ -0,0 +1,27 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/java/com.sap.sse.gwt.theme/SSETheme_GWT.launch b/java/com.sap.sse.gwt.theme/SSETheme_GWT.launch
new file mode 100644
index 00000000000..497ba323966
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/SSETheme_GWT.launch
@@ -0,0 +1,26 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/java/com.sap.sse.gwt.theme/WEB-INF/.gitignore b/java/com.sap.sse.gwt.theme/WEB-INF/.gitignore
new file mode 100644
index 00000000000..b30e141e749
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/WEB-INF/.gitignore
@@ -0,0 +1,2 @@
+deploy
+classes
\ No newline at end of file
diff --git a/java/com.sap.sse.gwt.theme/WEB-INF/web.xml b/java/com.sap.sse.gwt.theme/WEB-INF/web.xml
new file mode 100644
index 00000000000..7afb56e6574
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/WEB-INF/web.xml
@@ -0,0 +1,22 @@
+
+
+
+
+
+ default
+ org.eclipse.jetty.servlet.DefaultServlet
+
+
+ dirAllowed
+ false
+
+
+ useFileMappedBuffer
+ false
+
+
+
+
diff --git a/java/com.sap.sse.gwt.theme/build.properties b/java/com.sap.sse.gwt.theme/build.properties
new file mode 100644
index 00000000000..95d385246a8
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/build.properties
@@ -0,0 +1,10 @@
+source.WEB-INF/classes/ = src/main/java,\
+ src/main/resources
+output.WEB-INF/classes/ = bin
+bin.includes = META-INF/,\
+ WEB-INF/classes/,\
+ WEB-INF/web.xml,\
+ com.sap.sse.gwt.theme.SSETheme/,\
+ SSETheme.css,\
+ SSETheme.html
+output.. = WEB-INF/classes/
diff --git a/java/com.sap.sse.gwt.theme/pom.xml b/java/com.sap.sse.gwt.theme/pom.xml
new file mode 100644
index 00000000000..b426d91ca1a
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/pom.xml
@@ -0,0 +1,107 @@
+
+
+ 4.0.0
+
+ root
+ com.sap.sailing
+ 1.0.0-SNAPSHOT
+
+ com.sap.sse.gwt.theme
+ eclipse-plugin
+
+
+ javax.validation
+ validation-api
+ 1.0.0.GA
+
+
+ javax.validation
+ validation-api
+ 1.0.0.GA
+ sources
+
+
+ com.sap.sailing
+ com.sap.sse.common
+ 1.0.0-SNAPSHOT
+ sources
+
+
+ com.sap.sailing
+ com.sap.sse.gwt
+ 1.0.0-SNAPSHOT
+ sources
+
+
+
+
+
+ org.eclipse.tycho
+ tycho-source-plugin
+ ${tycho-version}
+
+
+ plugin-source
+ generate-sources
+
+ plugin-source
+
+
+
+
+
+ org.codehaus.mojo
+ gwt-maven-plugin
+ ${gwt.version}
+
+
+
+
+ -Dgwt.persistentunitcache=false
+
+
+ com.sap.sse.gwt.theme.Theme
+
+ ${basedir}/.generated
+ 7
+ ${basedir}
+ ${basedir}/src/main/resources
+
+
+
+ compile
+
+
+
+
+
+
+
+
+
+ debug.no-gwt-compile
+
+
+
+ org.codehaus.mojo
+ gwt-maven-plugin
+ ${gwt.version}
+
+
+
+
+
+
+
+ help
+
+
+
+
+
+
+
+
+
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/SSETheme.gwt.xml b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/SSETheme.gwt.xml
new file mode 100644
index 00000000000..8af42f07f54
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/SSETheme.gwt.xml
@@ -0,0 +1,25 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/ThemeEntryPoint.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/ThemeEntryPoint.java
new file mode 100644
index 00000000000..99665fc24e3
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/ThemeEntryPoint.java
@@ -0,0 +1,20 @@
+package com.sap.sse.gwt.theme.client;
+
+import com.google.gwt.core.client.EntryPoint;
+import com.google.gwt.user.client.ui.RootLayoutPanel;
+import com.sap.sse.gwt.theme.client.resources.ThemeResources;
+import com.sap.sse.gwt.theme.client.showcase.MainPage;
+
+/**
+ * Entry point classes define onModuleLoad().
+ */
+public class ThemeEntryPoint implements EntryPoint {
+
+ @Override
+ public void onModuleLoad() {
+ ThemeResources.INSTANCE.mediaCss().ensureInjected();
+ ThemeResources.INSTANCE.mainCss().ensureInjected();
+
+ RootLayoutPanel.get().add(new MainPage());
+ }
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEvent.css b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEvent.css
new file mode 100644
index 00000000000..519353979c9
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEvent.css
@@ -0,0 +1,47 @@
+.eventteasercontainer {
+ font-size: 1rem;
+ text-align: center;
+ width: 100%;
+ height: 24em;
+}
+.eventteaser {
+ font-size: 1rem;
+ display: inline-block;
+ margin-bottom: 3em;
+ text-align: left;
+ max-width: 100%;
+ width: 100%;
+}
+.eventteaser:hover {
+ text-decoration: none;
+}
+.eventteaser:hover .eventteaser_name {
+ text-decoration: underline;
+}
+.eventteaser:hover .eventteaser_image {
+ opacity: 0.9;
+}
+.eventteaser_image {
+ position: relative;
+ display: inline-block;
+ max-width: 100%;
+ width: 100%;
+ height: 240px;
+ background-position: center;
+ background-size: cover;
+ background-repeat: no-repeat;
+}
+.eventteaser_series {
+ position: absolute;
+ bottom: 0;
+ right: 0;
+}
+.eventteaser_name {
+ font-size: 1.466666666666667em;
+ font-weight: bold;
+ color: #008fcc;
+ margin-top: 0.333333333333333em;
+}
+.eventteaser_location {
+ color: #222;
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEvent.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEvent.java
new file mode 100644
index 00000000000..b5fde43544c
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEvent.java
@@ -0,0 +1,69 @@
+package com.sap.sse.gwt.theme.client.component.recentevent;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.dom.client.DivElement;
+import com.google.gwt.dom.client.SpanElement;
+import com.google.gwt.dom.client.Style.Display;
+import com.google.gwt.event.dom.client.ClickEvent;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.uibinder.client.UiField;
+import com.google.gwt.uibinder.client.UiHandler;
+import com.google.gwt.user.client.Command;
+import com.google.gwt.user.client.ui.Anchor;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.Widget;
+
+public class RecentEvent extends Composite {
+
+ @UiField
+ SpanElement eventNameUi;
+
+ @UiField
+ SpanElement venueNameUi;
+
+ @UiField
+ SpanElement eventDateUi;
+
+ @UiField
+ Anchor eventOverviewUi;
+
+ @UiField
+ DivElement eventImageContainerUi;
+
+ @UiField
+ DivElement isLiveUi;
+
+ interface RecentEventUiBinder extends UiBinder {
+ }
+
+ private static RecentEventUiBinder uiBinder = GWT.create(RecentEventUiBinder.class);
+ private Command eventClickAction;
+
+ public RecentEvent(RecentEventData data) {
+
+ this.eventClickAction = data.getCommand();
+ RecentEventResources.INSTANCE.css().ensureInjected();
+ initWidget(uiBinder.createAndBindUi(this));
+
+ eventNameUi.setInnerText(data.getEventName());
+ venueNameUi.setInnerText(data.getVenue());
+ eventDateUi.setInnerText(data.getEventStart().toString().substring(10) + " "
+ + data.getEventEnd().toString().substring(10));
+
+ final StringBuilder thumbnailUrlBuilder = new StringBuilder("url('").append(data.getEventImageUrl()).append(
+ "')");
+ GWT.log(thumbnailUrlBuilder.toString());
+ eventImageContainerUi.getStyle().setBackgroundImage(thumbnailUrlBuilder.toString());
+ if (data.isLive())
+ isLiveUi.getStyle().setDisplay(Display.BLOCK);
+ else
+ isLiveUi.getStyle().setDisplay(Display.NONE);
+ }
+
+ @UiHandler("eventOverviewUi")
+ public void goToEventOverview(ClickEvent e) {
+ eventClickAction.execute();
+ e.preventDefault();
+ }
+
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEvent.ui.xml b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEvent.ui.xml
new file mode 100644
index 00000000000..92b0202e911
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEvent.ui.xml
@@ -0,0 +1,22 @@
+
+
+
+
+
+
+
+
+
+
+
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEventData.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEventData.java
new file mode 100644
index 00000000000..b3788eaab89
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEventData.java
@@ -0,0 +1,16 @@
+package com.sap.sse.gwt.theme.client.component.recentevent;
+
+import java.util.Date;
+
+import com.google.gwt.user.client.Command;
+
+public interface RecentEventData {
+ String getEventImageUrl();
+ String getVenue();
+ String getLocation();
+ Date getEventStart();
+ Date getEventEnd();
+ Command getCommand();
+ String getEventName();
+ boolean isLive();
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEventResources.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEventResources.java
new file mode 100644
index 00000000000..6d2229572a1
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/RecentEventResources.java
@@ -0,0 +1,25 @@
+package com.sap.sse.gwt.theme.client.component.recentevent;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.resources.client.ClientBundle;
+import com.google.gwt.resources.client.CssResource;
+import com.google.gwt.resources.client.ImageResource;
+
+public interface RecentEventResources extends ClientBundle {
+ public static final RecentEventResources INSTANCE = GWT.create(RecentEventResources.class);
+
+ @Source("RecentEvent.css")
+ LocalCss css();
+
+ public interface LocalCss extends CssResource {
+ String eventteaser();
+ String eventteaser_name();
+ String eventteaser_image();
+ String eventteaser_series();
+ String eventteaser_location();
+ String eventteasercontainer();
+ }
+
+ @Source("default_event_photo.jpg")
+ ImageResource defaultEventPhotoImage();
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/default_event_photo.jpg b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/default_event_photo.jpg
new file mode 100644
index 00000000000..03f41052084
Binary files /dev/null and b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/recentevent/default_event_photo.jpg differ
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeader.css b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeader.css
new file mode 100644
index 00000000000..9de247011bb
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeader.css
@@ -0,0 +1,44 @@
+.siteheader {
+ font-size: 15px;
+ font-size: 1rem;
+ background: #333;
+ border-bottom: 5px solid #f0ab00;
+ height: 70px;
+ line-height: 4em;
+ width: 100%;
+ overflow: hidden;
+ text-align:center;
+}
+
+.siteheaderLeft {
+ float:left;
+ width: 25%;
+ text-align: left;
+}
+
+.siteheaderCentered {
+ width: 50%;
+ display: inline-block;
+ margin:0 auto;
+}
+
+.siteheaderRight {
+ float:right;
+ width: 25%;
+ text-align: right;
+}
+
+.logo {
+ margin: 0.8em 10px;
+ float: left;
+}
+.logotitle {
+ display: inline;
+ color: #f6f9fc;
+ font-weight: bold;
+}
+.pagetitle {
+ color: #ffffff;
+ font-size: 1.5rem;
+ font-weight: bold;
+}
\ No newline at end of file
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeader.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeader.java
new file mode 100644
index 00000000000..83e30aaa36f
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeader.java
@@ -0,0 +1,51 @@
+package com.sap.sse.gwt.theme.client.component.sapheader;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.core.client.Scheduler;
+import com.google.gwt.core.client.Scheduler.RepeatingCommand;
+import com.google.gwt.dom.client.DivElement;
+import com.google.gwt.dom.client.ParagraphElement;
+import com.google.gwt.event.dom.client.ClickEvent;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.uibinder.client.UiField;
+import com.google.gwt.uibinder.client.UiHandler;
+import com.google.gwt.user.client.ui.Button;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.Widget;
+import com.sap.sse.gwt.theme.client.util.FullscreenUtil;
+
+public class SAPHeader extends Composite {
+ private static SAPHeaderUiBinder uiBinder = GWT.create(SAPHeaderUiBinder.class);
+
+ interface SAPHeaderUiBinder extends UiBinder {
+ }
+
+ @UiField ParagraphElement applicationNameUi;
+ @UiField DivElement pageTitleUi;
+ @UiField Button startFullScreenButton;
+
+ public SAPHeader(String applicationName, String pageTitle, boolean startInAutoScreenMode) {
+ SAPHeaderResources.INSTANCE.css().ensureInjected();
+
+ initWidget(uiBinder.createAndBindUi(this));
+
+ applicationNameUi.setInnerText(applicationName != null ? applicationName : " ");
+ pageTitleUi.setInnerText(pageTitle);
+ startFullScreenButton.setVisible(startInAutoScreenMode);
+
+ // the 'fullscreen' button should disappear after some seconds (10)
+ if(startInAutoScreenMode) {
+ Scheduler.get().scheduleFixedPeriod(new RepeatingCommand() {
+ public boolean execute () {
+ startFullScreenButton.setVisible(false);
+ return false;
+ }
+ }, 10000);
+ }
+ }
+
+ @UiHandler("startFullScreenButton")
+ void startFullScreenClicked(ClickEvent e) {
+ FullscreenUtil.requestFullscreen();
+ }
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeader.ui.xml b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeader.ui.xml
new file mode 100644
index 00000000000..1138ddaf708
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeader.ui.xml
@@ -0,0 +1,21 @@
+
+
+
+
+
+
+
+
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeaderData.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeaderData.java
new file mode 100644
index 00000000000..16804993bd9
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeaderData.java
@@ -0,0 +1,5 @@
+package com.sap.sse.gwt.theme.client.component.sapheader;
+
+public interface SAPHeaderData {
+
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeaderResources.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeaderResources.java
new file mode 100644
index 00000000000..cea0a1754d1
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/SAPHeaderResources.java
@@ -0,0 +1,26 @@
+package com.sap.sse.gwt.theme.client.component.sapheader;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.resources.client.ClientBundle;
+import com.google.gwt.resources.client.CssResource;
+import com.google.gwt.resources.client.ImageResource;
+
+public interface SAPHeaderResources extends ClientBundle {
+ public static final SAPHeaderResources INSTANCE = GWT.create(SAPHeaderResources.class);
+
+ @Source("SAPHeader.css")
+ LocalCss css();
+
+ public interface LocalCss extends CssResource {
+ String siteheader();
+ String siteheaderLeft();
+ String siteheaderCentered();
+ String siteheaderRight();
+ String logo();
+ String logotitle();
+ String pagetitle();
+ }
+
+ @Source("logo-small@2x.png")
+ ImageResource logo();
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/logo-small@2x.png b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/logo-small@2x.png
new file mode 100644
index 00000000000..e5d2daf91f3
Binary files /dev/null and b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/component/sapheader/logo-small@2x.png differ
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/ThemeResources.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/ThemeResources.java
new file mode 100644
index 00000000000..d6026a3ab87
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/ThemeResources.java
@@ -0,0 +1,140 @@
+package com.sap.sse.gwt.theme.client.resources;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.resources.client.ClientBundle;
+import com.google.gwt.resources.client.CssResource;
+
+public interface ThemeResources extends ClientBundle {
+ public static final ThemeResources INSTANCE = GWT.create(ThemeResources.class);
+
+ @Source("main.gss")
+ MainCss mainCss();
+
+ @Source("media.gss")
+ MediaCss mediaCss();
+
+ public interface MainCss extends CssResource{
+ String wrapper();
+ String navbar();
+ String navbar_button();
+ String navbar_buttonhidden();
+ String navbar_buttonactive();
+ String button();
+ String buttonsmall();
+ String buttonstrong();
+ String buttoninactive();
+ String buttonprimary();
+ String buttonred();
+ String buttonrefresh();
+ String buttonarrowdown();
+ String buttonsearch();
+ String buttonarrowrightwhite();
+ String label();
+ String labellarge();
+ String morelink();
+ String dummy();
+ String mainsection();
+ String mainsection_header();
+ String mainsection_header_title();
+ String mainsection_navigation();
+ String lightbox();
+ String lightbox_overlay();
+ String lightbox_content();
+ String lightbox_close();
+ String stickyheader();
+ String slideto();
+ String slidetonav();
+ String slidetoactive();
+ }
+
+ public interface MediaCss extends CssResource{
+ String grid();
+ String stackenblochen();
+ String column();
+ String columns();
+ String small1();
+ String small2();
+ String small3();
+ String small4();
+ String small5();
+ String small6();
+ String small7();
+ String small8();
+ String small9();
+ String small10();
+ String small11();
+ String small12();
+ String smalloffset0();
+ String smalloffset1();
+ String smalloffset2();
+ String smalloffset3();
+ String smalloffset4();
+ String smalloffset5();
+ String smalloffset6();
+ String smalloffset7();
+ String smalloffset8();
+ String smalloffset9();
+ String smalloffset10();
+ String smalloffset11();
+ String showonsmall();
+ String hideonsmall();
+ String showonmedium();
+ String hideonmedium();
+ String showonlarge();
+ String hideonlarge();
+ String smallcentered();
+ String smalluncentered();
+ String medium1();
+ String medium2();
+ String medium3();
+ String medium4();
+ String medium5();
+ String medium6();
+ String medium7();
+ String medium8();
+ String medium9();
+ String medium10();
+ String medium11();
+ String medium12();
+ String mediumoffset0();
+ String mediumoffset1();
+ String mediumoffset2();
+ String mediumoffset3();
+ String mediumoffset4();
+ String mediumoffset5();
+ String mediumoffset6();
+ String mediumoffset7();
+ String mediumoffset8();
+ String mediumoffset9();
+ String mediumoffset10();
+ String mediumoffset11();
+ String mediumcentered();
+ String mediumuncentered();
+ String large1();
+ String large2();
+ String large3();
+ String large4();
+ String large5();
+ String large6();
+ String large7();
+ String large8();
+ String large9();
+ String large10();
+ String large11();
+ String large12();
+ String largeoffset0();
+ String largeoffset1();
+ String largeoffset2();
+ String largeoffset3();
+ String largeoffset4();
+ String largeoffset5();
+ String largeoffset6();
+ String largeoffset7();
+ String largeoffset8();
+ String largeoffset9();
+ String largeoffset10();
+ String largeoffset11();
+ String largecentered();
+ String largeuncentered();
+ }
+}
\ No newline at end of file
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/i18n/TextMessages.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/i18n/TextMessages.java
new file mode 100644
index 00000000000..3b9b9964efc
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/i18n/TextMessages.java
@@ -0,0 +1,10 @@
+package com.sap.sse.gwt.theme.client.resources.i18n;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.i18n.client.Messages;
+
+public interface TextMessages extends Messages {
+ public static final TextMessages INSTANCE = GWT.create(TextMessages.class);
+
+ String chooseALanguage();
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/i18n/TextMessages.properties b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/i18n/TextMessages.properties
new file mode 100644
index 00000000000..3bb701bcae5
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/i18n/TextMessages.properties
@@ -0,0 +1 @@
+chooseALanguage=Choose a language
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/i18n/TextMessages_de.properties b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/i18n/TextMessages_de.properties
new file mode 100644
index 00000000000..c638bf7471d
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/i18n/TextMessages_de.properties
@@ -0,0 +1 @@
+chooseALanguage=Wähle eine Sprache
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/main.gss b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/main.gss
new file mode 100644
index 00000000000..ea60fb681f6
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/main.gss
@@ -0,0 +1,417 @@
+/**
+ * The main styling styles
+ */
+*,
+*:before,
+*:after {
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+html,
+body {
+ height: 100%;
+ font-family: 'Open Sans', sans-serif;
+ font-size: 93.75%;
+ line-height: 1.333;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ -ms-content-zooming: none;
+}
+figure {
+ margin: 0;
+}
+a {
+ text-decoration: none;
+ color: #008fcc;
+}
+a:hover,
+a:focus {
+ text-decoration: underline;
+}
+a img {
+ vertical-align: bottom;
+}
+hr {
+ font-size: 1rem;
+ margin: 0;
+ height: 1px;
+ border: none;
+ border-top: 1px solid #eee;
+}
+h1 {
+ font-size: 2.133333333333333em;
+}
+h2 {
+ font-size: 1.466666666666667em;
+ font-weight: bold;
+ color: #008fcc;
+ margin-top: 0.7em;
+ margin-bottom: 0.7em;
+}
+h3 {
+ font-size: 1.2em;
+ font-weight: bold;
+ margin: 0 0 0.5em;
+}
+h4 {
+ font-size: 1em;
+ font-weight: bold;
+ color: #008fcc;
+}
+h5 {
+ font-size: 0.866666666666667em;
+ font-weight: 600;
+ color: #008fcc;
+}
+figure img {
+ display: block;
+}
+figcaption {
+ margin-top: 1.333333333333333em;
+}
+.wrapper {
+ position: relative;
+ min-height: 100%;
+ margin-bottom: -5em;
+ padding-bottom: 8em;
+}
+.wrapper > * {
+ padding-left: 1.333333333333333em;
+ padding-right: 1.333333333333333em;
+}
+.navbar {
+ font-size: 1rem;
+}
+.navbar_button {
+ font-size: 1.2em;
+ display: inline-block;
+ font-weight: 600;
+ color: #666;
+ border: 1px solid #dedede;
+ padding: 0.833333333333333em 0.944444444444444em;
+ background-color: #eee;
+ -webkit-transition: background-color 0.2s, border-color 0.2s;
+ -moz-transition: background-color 0.2s, border-color 0.2s;
+ transition: background-color 0.2s, border-color 0.2s;
+ text-decoration: none;
+ margin-right: 0.833333333333333em;
+}
+.navbar_buttonhidden {
+ display: block;
+}
+.navbar_button:hover,
+.navbar_button:focus {
+ background-color: #dedede;
+ outline: none;
+ text-decoration: none;
+}
+.navbar_buttonactive {
+ color: #333;
+ background-color: #fff;
+ border-bottom: 1px solid #fff;
+}
+.navbar_buttonactive:hover,
+.navbar_buttonactive:focus {
+ background-color: #dedede;
+ border-bottom: 1px solid #dedede;
+}
+.button {
+ font-size: 1rem;
+ display: inline-block;
+ font-weight: 600;
+ color: #fff;
+ border: none;
+ padding: 0.666666666666667em 2em;
+ border-radius: 0.2em;
+ background-color: #f0ab00;
+ -webkit-transition: background-color 0.2s;
+ -moz-transition: background-color 0.2s;
+ transition: background-color 0.2s;
+ text-decoration: none;
+}
+.button:hover,
+.button:focus {
+ background-color: #d89a00;
+ outline: none;
+ text-decoration: none;
+}
+.buttonsmall {
+ visibility: inherit;
+}
+.buttonstrong {
+ font-size: 0.933333333333333rem;
+ font-weight: 700;
+ text-transform: uppercase;
+ padding: 0.714285714285714em 1.071428571428571em;
+}
+.buttoninactive {
+ background-color: #eee;
+}
+.buttoninactive:hover,
+.buttoninactive:focus {
+ background-color: #eee;
+}
+.buttonprimary {
+ background-color: #008fcc;
+}
+.buttonprimary:hover,
+.buttonprimary:focus {
+ background-color: #0081b8;
+}
+.buttonred {
+ background-color: #e94a1b;
+}
+.buttonred:hover,
+.buttonred:focus {
+ background-color: #d54115;
+}
+.buttonrefresh {
+ background-image: url("data:image/png;base64,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");
+}
+.buttonrefresh,
+.buttonarrowdown {
+ background-repeat: no-repeat;
+ background-position: left top;
+ background-size: cover;
+ width: 2.333333333333333em;
+ height: 0;
+ padding: 2.333333333333333em 0 0 0;
+ border: 0;
+ overflow: hidden;
+}
+.buttonsearch {
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2NTg0MEE1MTVFN0UxMUU0QkNGMTk0Q0UzOUEwNUNFMyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2NTg0MEE1MjVFN0UxMUU0QkNGMTk0Q0UzOUEwNUNFMyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjY1ODQwQTRGNUU3RTExRTRCQ0YxOTRDRTM5QTA1Q0UzIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjY1ODQwQTUwNUU3RTExRTRCQ0YxOTRDRTM5QTA1Q0UzIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+tERf2gAAArFJREFUeNrMmE1kXFEUx28SwjAMjxCGIQwhzCoMQysVugqlhJBVyCqLbELpqtmEUFJddZFNFhVSpd20uqgw1VIhixgSIqREYiKRSExkhNTruZzhOO5999737m3m8DdzZt6773fP/Trn9cRxLBysD/QUNAaKQEP4eQI6xc/voN/Cl0lAC1VBG6Cr2M6aoHegkmX7WpkuKIPW4/R2B1oBRSEAJ0G3BoAz0DaoZbjuGEfBG+CS5kG7oFegiua+MYxYU3Gv7OyUD0AV3CFo2qHhHGhBM2efZQGcUjT4ER+YZg7JRbLF2msljEAiYFkx515nXYXYuS+s3QNQvyvghiJywpPyoAZr/4ULYFXRw5xHQKkh3HY6dmGz/fTifv2S7d+LoLbwa39Ab4gvT6BZm5MkYj3b9Rw5qojN84ZNBB+B+gnzexHOLvGs7lgFVEy6oQNI7asIax+YP2oCLBP/BrQXGHCH+RUT4ADxZcr0NzDgEfMLJsA88dsivN0wP2cCvCZ+/j8ARsw/NwGeEr+IWXNIK7kC7hNfbje1wIA1xQaeCPiL/TYRGHCSzfkfppMkx/K2Q9tMI2X6dU+e9dPmJGmzzVNWanOBorfE5viqbVWnyjSKnqNXY9E7thkp6qywlGvLY8pVVNQpc64Ja4S9ovbJA2QJMyRqm2lrkqoi7W9kKMBrmgpvPEtVN60pGZdBBYeorRnePAxnqYufa4rxFg677MQoSdlL6MtS8xtbDJkgk/6s4J7ow+qgCcVwGyFtC/CLlGBNtlpHXCFtJ3sBQesWUPe4Smc0+5wTZI/j+0GBCa488Acx+xkk7waP8Gw15ZUjoE28lybLT1jyIkTACs4kq0g+JKAV5EMDGiHTzMEQNgyqK+bk424B1EF+7hXdY/u4immNJLopgh2TLxLe4vf5fwIMADtbDGrkqxb2AAAAAElFTkSuQmCC");
+ background-color: transparent;
+ background-size: contain;
+ background-position: center center;
+ background-repeat: no-repeat;
+ width: 1.333333333333333em;
+ height: 1.333333333333333em;
+ padding: 0;
+}
+.buttonsearch:hover,
+.buttonsearch:focus {
+ background-color: transparent;
+ outline: none;
+ text-decoration: none;
+}
+.buttonarrowdown {
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAALFJREFUeNrs1TEOgjAUxnFx5iDscgPvwXkYuYdXwBPgAYwrsxPGIAPPvKQkxLQO5UE0+X9J06Ff0186tImI7H45CUCAAAECBAgQIMA1s1+y+dkUpUXna/QGY0Z/q0QztCcJddyauG7UOdHA8XWXKT7khNO47rbArj5kIeQnTrubA0NIS9xioA9piTMB+pBWODPgHGmJ02H6UD/OeaZzerxc+eoAAgQIECBAgAD/AvgWYACm/8hEADYaXwAAAABJRU5ErkJggg==");
+ width: 2.666666666666667em;
+ padding: 2.733333333333333em 0 0 0;
+}
+.buttonarrowrightwhite:after {
+ content: '';
+ display: inline-block;
+ margin-left: 0.666666666666667em;
+ width: 0.466666666666667em;
+ height: 0.8em;
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAMCAYAAACulacQAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAFtJREFUeNpi+P///wEgPgzEokDMgIxBxMn/EHAVXQGIkIBKYCiAqUJXIIEsiVUBA5ojRJEUnGFiwAR/ofQvXLpQjMXpILxeOY8rEEAOegfER4DYAYhfI7sMIMAAiXvwy2upI1UAAAAASUVORK5CYII=");
+ background-size: contain;
+ background-repeat: no-repeat;
+}
+.label {
+ display: inline-block;
+ font-size: 0.8rem;
+ font-weight: 600;
+ color: #fff;
+ padding: 0.066666666666667em 0.666666666666667em;
+ position: relative;
+ margin-left: 0.833333333333333em;
+ height: 1.666666666666667em;
+ line-height: 1.666666666666667em;
+}
+.label:before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: -0.833333333333333em;
+ width: 0;
+ height: 0;
+ border-top: 0.833333333333333em solid transparent;
+ border-bottom: 0.833333333333333em solid transparent;
+ border-right: 0.833333333333333em solid transparent;
+}
+.labellarge {
+ height: 2em;
+ line-height: 1.75em;
+ margin-left: 1em;
+}
+.labellarge:before {
+ left: -1em;
+ border-top-width: 1em;
+ border-bottom-width: 1em;
+ border-right-width: 1em;
+}
+.label[datalabeltype='live'] {
+ background-color: #e94a1b;
+ vertical-align: middle;
+ margin-top: -0.416666666666667em;
+}
+.label[datalabeltype='live']:before {
+ border-right-color: #e94a1b;
+}
+.label[datalabeltype='finished'] {
+ background-color: #8ab54e;
+ vertical-align: middle;
+ margin-top: -0.416666666666667em;
+}
+.label[datalabeltype='finished']:before {
+ border-right-color: #8ab54e;
+}
+.label[datalabeltype='progress'] {
+ background-color: #f0ab00;
+ vertical-align: middle;
+ margin-top: -0.416666666666667em;
+}
+.label[datalabeltype='progress']:before {
+ border-right-color: #f0ab00;
+}
+.label[datalabeltype='upcoming'] {
+ color: #333;
+ background-color: #eee;
+ vertical-align: middle;
+ margin-top: -0.416666666666667em;
+}
+.label[datalabeltype='upcoming']:before {
+ border-right-color: #eee;
+}
+.label[datalabeltype='new'],
+.label[datalabeltype='updated'] {
+ background-color: #f0ab00;
+ text-transform: uppercase;
+ vertical-align: middle;
+}
+.label[datalabeltype='new']:before,
+.label[datalabeltype='updated']:before {
+ border-right-color: #f0ab00;
+}
+.label[datalabeltype='ess'] {
+ background-color: #a71724;
+}
+.label[datalabeltype='ess']:before {
+ border-right-color: #a71724;
+}
+.label[datalabeltype='worldcup'] {
+ background-color: #c79242;
+}
+.label[datalabeltype='worldcup']:before {
+ border-right-color: #c79242;
+}
+.label[datalabeltype='bundesliga'] {
+ background-color: #005fa7;
+}
+.label[datalabeltype='bundesliga']:before {
+ border-right-color: #005fa7;
+}
+.morelink {
+ color: #008fcc;
+ text-transform: uppercase;
+ text-align: center;
+ font-size: 0.933333333333333em;
+ font-weight: 700;
+ padding: 1.866666666666667em;
+ display: block;
+ text-decoration: none;
+}
+.morelink:hover,
+.morelink:focus {
+ text-decoration: underline;
+}
+.dummy {
+ font-size: 1rem;
+ min-height: 25em;
+ position: relative;
+}
+.dummy:after {
+ content: 'Dummy content';
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ font-weight: 700;
+ font-size: 6em;
+ color: #f7f7f7;
+ text-shadow: 1px 1px 0 #eee, 2px 2px 0 #eee, 3px 3px 0 #eee, 4px 4px 0 #eee, 5px 5px 0 #eee, 6px 6px 0 #eee, 7px 7px 0 #eee;
+ margin: -100px 0 0 -350px;
+}
+.mainsection {
+ padding-top: 5.333333333333333em;
+ padding-bottom: 5.333333333333333em;
+}
+.mainsection_header {
+ text-align: center;
+ margin-bottom: 3.666666666666667em;
+}
+.mainsection_header p {
+ margin-top: 0;
+ font-size: 1.2em;
+}
+.mainsection_header_title {
+ margin: 0;
+ font-size: 2.4em;
+ text-align: center;
+}
+.mainsection_navigation {
+ text-align: center;
+}
+.lightbox {
+ font-size: 1rem;
+}
+.lightbox_overlay {
+ display: none;
+ font-size: 1rem;
+ background: rgba(0,0,0,0.75);
+ width: 100%;
+ height: 100%;
+ position: fixed;
+ left: 0;
+ top: 0;
+ z-index: 10;
+ -webkit-transition: opacity 0.3s ease;
+ -moz-transition: opacity 0.3s ease;
+ transition: opacity 0.3s ease;
+}
+.lightbox_content {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ -webkit-transform: translate(-50%, -50%);
+ -moz-transform: translate(-50%, -50%);
+ -ms-transform: translate(-50%, -50%);
+ transform: translate(-50%, -50%);
+ max-width: 90%;
+ max-height: 90%;
+ overflow: hidden;
+}
+.lightbox_close {
+ background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHVJREFUeNqsk4EJACEIReWawY2bMLh5LME7JNQEE4So/x9pCUTUVvaVuBKSieJpIAuOkYSgaDn6t/EmIdrMHtQHJ4g2/5pd4EFM8w7whK7ZAliQEZWWaVbY3AeqcbuEUhMj4fEZ8XTV6CNlzC7kyjCVxnkKMABEXRUAnXsRRQAAAABJRU5ErkJggg==");
+ background-repeat: no-repeat;
+ background-position: center center;
+ width: 1.333333333333333em;
+ height: 0;
+ padding-top: 1.333333333333333em;
+ position: absolute;
+ top: 1.333333333333333em;
+ right: 1.333333333333333em;
+ cursor: pointer;
+ z-index: 2;
+}
+.stickyheader {
+ background: inherit;
+}
+.slideto {
+ background: inherit;
+ border-bottom: 0.266666666666667em solid transparent;
+}
+.slidetonav {
+ background: inherit;
+}
+.slidetoactive {
+ border-bottom-color: #f0ab00;
+ text-decoration: none;
+ color: #dedede;
+}
+.slidetoactive:hover,
+.slidetoactive:focus {
+ border-bottom-color: #d89a00;
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/media.gss b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/media.gss
new file mode 100644
index 00000000000..611ff15f214
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/resources/media.gss
@@ -0,0 +1,450 @@
+/**
+ * The grid styles
+ */
+.grid,
+.stackenblochen {
+ display: block;
+ width: 100%;
+ max-width: 80rem;
+ list-style: none;
+ margin: 0 auto;
+ zoom: 1;
+}
+.grid:before,
+.stackenblochen:before,
+.grid:after,
+.stackenblochen:after {
+ content: "";
+ display: table;
+}
+.grid:after,
+.stackenblochen:after {
+ clear: both;
+}
+.grid *,
+.stackenblochen * {
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+.grid .grid,
+.stackenblochen .grid,
+.grid .stackenblochen,
+.stackenblochen .stackenblochen {
+ width: auto;
+ max-width: none;
+ margin-left: -1rem;
+ margin-right: -1rem;
+}
+.column,
+.columns {
+ float: left;
+ padding: 0 1rem;
+ position: relative;
+ width: 100%;
+}
+.column img,
+.columns img {
+ max-width: 100%;
+ height: auto;
+ ms-interpolation-mode: bicubic;
+}
+.small1 {
+ width: 8.3333333333333%;
+}
+.small2 {
+ width: 16.6666666666667%;
+}
+.small3 {
+ width: 25%;
+}
+.small4 {
+ width: 33.3333333333333%;
+}
+.small5 {
+ width: 41.6666666666667%;
+}
+.small6 {
+ width: 50%;
+}
+.small7 {
+ width: 58.3333333333333%;
+}
+.small8 {
+ width: 66.6666666666667%;
+}
+.small9 {
+ width: 75%;
+}
+.small10 {
+ width: 83.3333333333333%;
+}
+.small11 {
+ width: 91.6666666666667%;
+}
+.small12 {
+ width: 100%;
+}
+.smalloffset0 {
+ margin-left: 0% !important;
+}
+.smalloffset1 {
+ margin-left: 8.3333333333333% !important;
+}
+.smalloffset2 {
+ margin-left: 16.6666666666667% !important;
+}
+.smalloffset3 {
+ margin-left: 25% !important;
+}
+.smalloffset4 {
+ margin-left: 33.3333333333333% !important;
+}
+.smalloffset5 {
+ margin-left: 41.6666666666667% !important;
+}
+.smalloffset6 {
+ margin-left: 50% !important;
+}
+.smalloffset7 {
+ margin-left: 58.3333333333333% !important;
+}
+.smalloffset8 {
+ margin-left: 66.6666666666667% !important;
+}
+.smalloffset9 {
+ margin-left: 75% !important;
+}
+.smalloffset10 {
+ margin-left: 83.3333333333333% !important;
+}
+.smalloffset11 {
+ margin-left: 91.6666666666667% !important;
+}
+.showonsmall {
+ display: inherit !important;
+}
+.hideonsmall {
+ display: none !important;
+}
+table.showonsmall {
+ display: table !important;
+}
+tr.showonsmall {
+ display: table-row !important;
+}
+td.showonsmall,
+th.showonsmall {
+ display: table-cell !important;
+}
+.showonmedium {
+ display: none !important;
+}
+.hideonmedium {
+ display: inherit !important;
+}
+table.hideonmedium {
+ display: table !important;
+}
+tr.hideonmedium {
+ display: table-row !important;
+}
+td.hideonmedium,
+th.hideonmedium {
+ display: table-cell !important;
+}
+.showonlarge {
+ display: none !important;
+}
+.hideonlarge {
+ display: inherit !important;
+}
+table.hideonlarge {
+ display: table !important;
+}
+tr.hideonlarge {
+ display: table-row !important;
+}
+td.hideonlarge,
+th.hideonlarge {
+ display: table-cell !important;
+}
+.column.smallcentered,
+.columns.smallcentered {
+ margin-left: auto;
+ margin-right: auto;
+ float: none;
+}
+.column.smalluncentered,
+.columns.smalluncentered {
+ margin-left: 0;
+ margin-right: 0;
+ float: left !important;
+}
+@media (min-width: 45em) {
+ .medium1 {
+ width: 8.3333333333333%;
+ }
+ .medium2 {
+ width: 16.6666666666667%;
+ }
+ .medium3 {
+ width: 25%;
+ }
+ .medium4 {
+ width: 33.3333333333333%;
+ }
+ .medium5 {
+ width: 41.6666666666667%;
+ }
+ .medium6 {
+ width: 50%;
+ }
+ .medium7 {
+ width: 58.3333333333333%;
+ }
+ .medium8 {
+ width: 66.6666666666667%;
+ }
+ .medium9 {
+ width: 75%;
+ }
+ .medium10 {
+ width: 83.3333333333333%;
+ }
+ .medium11 {
+ width: 91.6666666666667%;
+ }
+ .medium12 {
+ width: 100%;
+ }
+ .mediumoffset0 {
+ margin-left: 0% !important;
+ }
+ .mediumoffset1 {
+ margin-left: 8.3333333333333% !important;
+ }
+ .mediumoffset2 {
+ margin-left: 16.6666666666667% !important;
+ }
+ .mediumoffset3 {
+ margin-left: 25% !important;
+ }
+ .mediumoffset4 {
+ margin-left: 33.3333333333333% !important;
+ }
+ .mediumoffset5 {
+ margin-left: 41.6666666666667% !important;
+ }
+ .mediumoffset6 {
+ margin-left: 50% !important;
+ }
+ .mediumoffset7 {
+ margin-left: 58.3333333333333% !important;
+ }
+ .mediumoffset8 {
+ margin-left: 66.6666666666667% !important;
+ }
+ .mediumoffset9 {
+ margin-left: 75% !important;
+ }
+ .mediumoffset10 {
+ margin-left: 83.3333333333333% !important;
+ }
+ .mediumoffset11 {
+ margin-left: 91.6666666666667% !important;
+ }
+ .showonsmall {
+ display: none !important;
+ }
+ .hideonsmall {
+ display: inherit !important;
+ }
+ table.hideonsmall {
+ display: table !important;
+ }
+ tr.hideonsmall {
+ display: table-row !important;
+ }
+ td.hideonsmall,
+ th.hideonsmall {
+ display: table-cell !important;
+ }
+ .showonmedium {
+ display: inherit !important;
+ }
+ .hideonmedium {
+ display: none !important;
+ }
+ table.showonmedium {
+ display: table !important;
+ }
+ tr.showonmedium {
+ display: table-row !important;
+ }
+ td.showonmedium,
+ th.showonmedium {
+ display: table-cell !important;
+ }
+ .showonlarge {
+ display: none !important;
+ }
+ .hideonlarge {
+ display: inherit !important;
+ }
+ table.hideonlarge {
+ display: table !important;
+ }
+ tr.hideonlarge {
+ display: table-row !important;
+ }
+ td.hideonlarge,
+ th.hideonlarge {
+ display: table-cell !important;
+ }
+ .column.mediumcentered,
+ .columns.mediumcentered {
+ margin-left: auto;
+ margin-right: auto;
+ float: none;
+ }
+ .column.mediumuncentered,
+ .columns.mediumuncentered {
+ margin-left: 0;
+ margin-right: 0;
+ float: left !important;
+ }
+}
+@media (min-width: 61em) {
+ .large1 {
+ width: 8.3333333333333%;
+ }
+ .large2 {
+ width: 16.6666666666667%;
+ }
+ .large3 {
+ width: 25%;
+ }
+ .large4 {
+ width: 33.3333333333333%;
+ }
+ .large5 {
+ width: 41.6666666666667%;
+ }
+ .large6 {
+ width: 50%;
+ }
+ .large7 {
+ width: 58.3333333333333%;
+ }
+ .large8 {
+ width: 66.6666666666667%;
+ }
+ .large9 {
+ width: 75%;
+ }
+ .large10 {
+ width: 83.3333333333333%;
+ }
+ .large11 {
+ width: 91.6666666666667%;
+ }
+ .large12 {
+ width: 100%;
+ }
+ .largeoffset0 {
+ margin-left: 0% !important;
+ }
+ .largeoffset1 {
+ margin-left: 8.3333333333333% !important;
+ }
+ .largeoffset2 {
+ margin-left: 16.6666666666667% !important;
+ }
+ .largeoffset3 {
+ margin-left: 25% !important;
+ }
+ .largeoffset4 {
+ margin-left: 33.3333333333333% !important;
+ }
+ .largeoffset5 {
+ margin-left: 41.6666666666667% !important;
+ }
+ .largeoffset6 {
+ margin-left: 50% !important;
+ }
+ .largeoffset7 {
+ margin-left: 58.3333333333333% !important;
+ }
+ .largeoffset8 {
+ margin-left: 66.6666666666667% !important;
+ }
+ .largeoffset9 {
+ margin-left: 75% !important;
+ }
+ .largeoffset10 {
+ margin-left: 83.3333333333333% !important;
+ }
+ .largeoffset11 {
+ margin-left: 91.6666666666667% !important;
+ }
+ .showonsmall {
+ display: none !important;
+ }
+ .hideonsmall {
+ display: inherit !important;
+ }
+ table.hideonsmall {
+ display: table !important;
+ }
+ tr.hideonsmall {
+ display: table-row !important;
+ }
+ td.hideonsmall,
+ th.hideonsmall {
+ display: table-cell !important;
+ }
+ .showonmedium {
+ display: none !important;
+ }
+ .hideonmedium {
+ display: inherit !important;
+ }
+ table.hideonmedium {
+ display: table !important;
+ }
+ tr.hideonmedium {
+ display: table-row !important;
+ }
+ td.hideonmedium,
+ th.hideonmedium {
+ display: table-cell !important;
+ }
+ .showonlarge {
+ display: inherit !important;
+ }
+ .hideonlarge {
+ display: none !important;
+ }
+ table.showonlarge {
+ display: table !important;
+ }
+ tr.showonlarge {
+ display: table-row !important;
+ }
+ td.showonlarge,
+ th.showonlarge {
+ display: table-cell !important;
+ }
+ .column.largecentered,
+ .columns.largecentered {
+ margin-left: auto;
+ margin-right: auto;
+ float: none;
+ }
+ .column.largeuncentered,
+ .columns.largeuncentered {
+ margin-left: 0;
+ margin-right: 0;
+ float: left !important;
+ }
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/ComponentShowCase.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/ComponentShowCase.java
new file mode 100644
index 00000000000..bd6f890cc59
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/ComponentShowCase.java
@@ -0,0 +1,53 @@
+package com.sap.sse.gwt.theme.client.showcase;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.dom.client.DivElement;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.uibinder.client.UiChild;
+import com.google.gwt.uibinder.client.UiField;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.SimplePanel;
+import com.google.gwt.user.client.ui.Widget;
+
+public class ComponentShowCase extends Composite {
+
+ private static ComponentShowCaseUiBinder uiBinder = GWT.create(ComponentShowCaseUiBinder.class);
+
+ interface ComponentShowCaseUiBinder extends UiBinder {
+ }
+
+ @UiField
+ DivElement componentNameUi;
+
+ @UiField
+ SimplePanel componentDescriptionUi;
+
+ @UiField
+ SimplePanel componentPanelUi;
+
+ private String name;
+
+ public ComponentShowCase() {
+ initWidget(uiBinder.createAndBindUi(this));
+ }
+
+ public void setName(String name) {
+ this.name = name;
+ componentNameUi.setInnerText(name);
+ }
+
+ @UiChild
+ public void addDescription(Widget description) {
+ componentDescriptionUi.setWidget(description);
+ }
+
+ @UiChild
+ public void addComponent(Widget w) {
+ componentPanelUi.setWidget(w);
+ }
+
+ public String getName() {
+ return this.name;
+ }
+
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/ComponentShowCase.ui.xml b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/ComponentShowCase.ui.xml
new file mode 100644
index 00000000000..cfad5712d50
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/ComponentShowCase.ui.xml
@@ -0,0 +1,30 @@
+
+
+
+ .outerpanel {
+ margin: 20px;
+ }
+ .componentName {
+ font-size: 20px;
+ font-weight: bold;
+ magin-bottom: 10px;
+
+ }
+ .componentDescription {
+ margin-bottom: 30px;
+ border-bottom: 3px solid black;
+ padding: 20px;
+ width: 100%;
+
+ }
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/MainPage.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/MainPage.java
new file mode 100644
index 00000000000..7ab3fd01d6c
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/MainPage.java
@@ -0,0 +1,30 @@
+package com.sap.sse.gwt.theme.client.showcase;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.dom.client.Style.Unit;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.uibinder.client.UiField;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.SimplePanel;
+import com.google.gwt.user.client.ui.Widget;
+
+public class MainPage extends Composite {
+
+ private static MainPageUiBinder uiBinder = GWT.create(MainPageUiBinder.class);
+
+ interface MainPageUiBinder extends UiBinder {
+ }
+
+ @UiField(provided = true)
+ SimplePanel contentUi;
+
+ @UiField(provided = true)
+ ShowcaseStackLayoutPanel stackLayoutPanelUi;
+
+ public MainPage() {
+ contentUi = new SimplePanel();
+ stackLayoutPanelUi = new ShowcaseStackLayoutPanel(Unit.EM);
+ stackLayoutPanelUi.setTarget(contentUi);
+ initWidget(uiBinder.createAndBindUi(this));
+ }
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/MainPage.ui.xml b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/MainPage.ui.xml
new file mode 100644
index 00000000000..6a61941b82d
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/MainPage.ui.xml
@@ -0,0 +1,33 @@
+
+
+
+
+
+
+ Styleguide
+
+
+ tbd.
+
+
+
+
+ Components
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/Section.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/Section.java
new file mode 100644
index 00000000000..d6407623138
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/Section.java
@@ -0,0 +1,50 @@
+package com.sap.sse.gwt.theme.client.showcase;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.event.dom.client.ClickEvent;
+import com.google.gwt.event.dom.client.ClickHandler;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.uibinder.client.UiChild;
+import com.google.gwt.uibinder.client.UiField;
+import com.google.gwt.user.client.ui.AcceptsOneWidget;
+import com.google.gwt.user.client.ui.Anchor;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.FlowPanel;
+import com.google.gwt.user.client.ui.SimplePanel;
+import com.google.gwt.user.client.ui.Widget;
+
+public class Section extends Composite {
+ private static ShowCaseSectionUiBinder uiBinder = GWT.create(ShowCaseSectionUiBinder.class);
+
+ interface ShowCaseSectionUiBinder extends UiBinder {
+ }
+
+ private AcceptsOneWidget target;
+
+ @UiField
+ FlowPanel panelUi;
+
+ public Section() {
+ initWidget(uiBinder.createAndBindUi(this));
+ }
+
+ public void setTargetContentArea(AcceptsOneWidget target) {
+ this.target = target;
+ }
+
+ @UiChild
+ public void addItem(final Widget widget, String name) {
+ SimplePanel p = new SimplePanel();
+ Anchor showCaseItem = new Anchor(name);
+ p.setWidget(showCaseItem);
+ showCaseItem.addClickHandler(new ClickHandler() {
+
+ @Override
+ public void onClick(ClickEvent event) {
+ target.setWidget(widget);
+ }
+ });
+
+ panelUi.add(p);
+ }
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/Section.ui.xml b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/Section.ui.xml
new file mode 100644
index 00000000000..7f8562acc98
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/Section.ui.xml
@@ -0,0 +1,6 @@
+
+
+
+
+
\ No newline at end of file
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/ShowcaseStackLayoutPanel.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/ShowcaseStackLayoutPanel.java
new file mode 100644
index 00000000000..4889e6aa5ec
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/ShowcaseStackLayoutPanel.java
@@ -0,0 +1,27 @@
+package com.sap.sse.gwt.theme.client.showcase;
+
+import com.google.gwt.dom.client.Style.Unit;
+import com.google.gwt.user.client.ui.SimplePanel;
+import com.google.gwt.user.client.ui.StackLayoutPanel;
+import com.google.gwt.user.client.ui.Widget;
+
+public class ShowcaseStackLayoutPanel extends StackLayoutPanel {
+ private SimplePanel target;
+
+ public ShowcaseStackLayoutPanel(Unit unit) {
+ super(unit);
+ }
+
+ public void setTarget(SimplePanel target) {
+ this.target = target;
+ }
+
+ @Override
+ public void add(Widget widget, String header, boolean asHtml, double headerSize) {
+ if (widget instanceof Section) {
+ Section section = (Section) widget;
+ section.setTargetContentArea(target);
+ }
+ super.add(widget, header, asHtml, headerSize);
+ }
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/recentevent/RecentEventShowcase.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/recentevent/RecentEventShowcase.java
new file mode 100644
index 00000000000..a4b84a55a22
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/recentevent/RecentEventShowcase.java
@@ -0,0 +1,131 @@
+package com.sap.sse.gwt.theme.client.showcase.recentevent;
+
+import java.util.Date;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.uibinder.client.UiField;
+import com.google.gwt.user.client.Command;
+import com.google.gwt.user.client.Window;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.Widget;
+import com.sap.sse.gwt.theme.client.component.recentevent.RecentEvent;
+import com.sap.sse.gwt.theme.client.component.recentevent.RecentEventData;
+
+public class RecentEventShowcase extends Composite {
+
+ private static RecentEventShowcaseUiBinder uiBinder = GWT.create(RecentEventShowcaseUiBinder.class);
+
+ interface RecentEventShowcaseUiBinder extends UiBinder {
+ }
+
+ @UiField(provided = true)
+ RecentEvent finishedItem;
+
+ @UiField(provided = true)
+ RecentEvent liveItem;
+
+ public RecentEventShowcase() {
+ finishedItem = new RecentEvent(new RecentEventData() {
+
+ @Override
+ public boolean isLive() {
+ return false;
+ }
+
+ @Override
+ public String getVenue() {
+ return "Venue1";
+ }
+
+ @Override
+ public String getLocation() {
+ return "Loc1";
+ }
+
+ @Override
+ public Date getEventStart() {
+ return new Date();
+ }
+
+ @Override
+ public String getEventName() {
+ return "SomeName";
+ }
+
+ @Override
+ public String getEventImageUrl() {
+
+ return "http://demotivators.despair.com/demotivational/mistakesdemotivator.jpg";
+ }
+
+ @Override
+ public Date getEventEnd() {
+ return new Date();
+ }
+
+ @Override
+ public Command getCommand() {
+ return new Command() {
+
+ @Override
+ public void execute() {
+ Window.alert("done");
+ }
+ };
+ }
+ });
+
+ liveItem = new RecentEvent(new RecentEventData() {
+
+ @Override
+ public boolean isLive() {
+ return true;
+ }
+
+ @Override
+ public String getVenue() {
+ return "Venue2";
+ }
+
+ @Override
+ public String getLocation() {
+ return "Loc2";
+ }
+
+ @Override
+ public Date getEventStart() {
+ return new Date();
+ }
+
+ @Override
+ public String getEventName() {
+ return "SomeName";
+ }
+
+ @Override
+ public String getEventImageUrl() {
+
+ return "http://demotivators.despair.com/demotivational/mistakesdemotivator.jpg";
+ }
+
+ @Override
+ public Date getEventEnd() {
+ return new Date();
+ }
+
+ @Override
+ public Command getCommand() {
+ return new Command() {
+
+ @Override
+ public void execute() {
+ Window.alert("done");
+ }
+ };
+ }
+ });
+
+ initWidget(uiBinder.createAndBindUi(this));
+ }
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/recentevent/RecentEventShowcase.ui.xml b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/recentevent/RecentEventShowcase.ui.xml
new file mode 100644
index 00000000000..0e292882202
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/recentevent/RecentEventShowcase.ui.xml
@@ -0,0 +1,35 @@
+
+
+
+ .holder {
+ width: 400px;
+ display: block;
+ magin: 10px;
+
+ }
+
+
+
+
+ This is a very cool recent event widget.
+ Import: xmlns:ubi="urn:import:com.sap.sse.gwt.theme.client.sailing"
+
+
+
+
+ FINISHED:
+
+
+
+
+ LIVE:
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/sapheader/SAPHeaderShowcase.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/sapheader/SAPHeaderShowcase.java
new file mode 100644
index 00000000000..8e16cf7a833
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/sapheader/SAPHeaderShowcase.java
@@ -0,0 +1,25 @@
+package com.sap.sse.gwt.theme.client.showcase.sapheader;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.uibinder.client.UiField;
+import com.google.gwt.user.client.ui.Composite;
+import com.google.gwt.user.client.ui.Widget;
+import com.sap.sse.gwt.theme.client.component.sapheader.SAPHeader;
+
+public class SAPHeaderShowcase extends Composite {
+
+ private static SAPHeaderShowcaseUiBinder uiBinder = GWT.create(SAPHeaderShowcaseUiBinder.class);
+
+ interface SAPHeaderShowcaseUiBinder extends UiBinder {
+ }
+
+ @UiField(provided = true)
+ SAPHeader sapHeader;
+
+ public SAPHeaderShowcase() {
+ sapHeader = new SAPHeader("Sailing Analytics", "Demo page", false);
+
+ initWidget(uiBinder.createAndBindUi(this));
+ }
+}
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/sapheader/SAPHeaderShowcase.ui.xml b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/sapheader/SAPHeaderShowcase.ui.xml
new file mode 100644
index 00000000000..108308c4951
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/showcase/sapheader/SAPHeaderShowcase.ui.xml
@@ -0,0 +1,29 @@
+
+
+
+ .holder {
+ width: 400px;
+ display: block;
+ magin: 10px;
+
+ }
+
+
+
+
+ A simple header with SAP logo and title.
+ Import: xmlns:sap="urn:import:com.sap.sse.gwt.theme.client.component.sapheader"
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/styleguide/typeface/typeface.html b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/styleguide/typeface/typeface.html
new file mode 100644
index 00000000000..5e580d7c2be
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/styleguide/typeface/typeface.html
@@ -0,0 +1,24 @@
+
+ Typeface Open Sans
+
+
+
Grumpy wizards make toxic brew for the evil queen and jack.
+
Code und sooo
+
+
+
+
Grumpy wizards make toxic brew for the evil queen and jack.
+
Code und sooo
+
+
+
+
Grumpy wizards make toxic brew for the evil queen and jack.
+
Code und sooo
+
+
diff --git a/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/util/FullscreenUtil.java b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/util/FullscreenUtil.java
new file mode 100644
index 00000000000..27ff25bebd3
--- /dev/null
+++ b/java/com.sap.sse.gwt.theme/src/main/java/com/sap/sse/gwt/theme/client/util/FullscreenUtil.java
@@ -0,0 +1,27 @@
+package com.sap.sse.gwt.theme.client.util;
+
+/**
+ * A utility class to set the browser to fullscreen mode
+ * @author c5163874 (Frank)
+ *
+ */
+public class FullscreenUtil {
+
+ public static void requestFullscreen() {
+ nativeRequestFullScreen();
+ };
+
+ private static native void nativeRequestFullScreen() /*-{
+ var element = $doc.documentElement;
+ if(element.requestFullscreen) {
+ element.requestFullscreen();
+ } else if(element.mozRequestFullScreen) {
+ element.mozRequestFullScreen();
+ } else if(element.webkitRequestFullscreen) {
+ element.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
+ } else if(element.msRequestFullscreen) {
+ element.msRequestFullscreen();
+ }
+ }-*/;
+
+}