EDIT

    protected Button buttonContinue;

package eu.etaxonomy.cdm.vaadin.design.phycobank;

import com.vaadin.annotations.AutoGenerated;

import com.vaadin.annotations.DesignRoot;

import com.vaadin.ui.Button;

import com.vaadin.ui.CssLayout;

import com.vaadin.ui.VerticalLayout;

import com.vaadin.ui.declarative.Design;

/** 

 * !! DO NOT EDIT THIS FILE !!

 * 

 * This class is generated by Vaadin Designer and will be overwritten.

 * 

 * Please make a subclass with logic and additional interfaces as needed,

 * e.g class LoginView extends LoginDesign implements View { }

 */

@DesignRoot

@AutoGenerated

@SuppressWarnings("serial")

public class StartRegistrationDesign extends VerticalLayout {

    protected CssLayout dashboard;

    protected Button buttonName;

    protected Button buttonTypification;

    public StartRegistrationDesign() {

        Design.read(this);

    }

}

import com.vaadin.server.ExternalResource;

import com.vaadin.server.Page;

import com.vaadin.server.Resource;

import com.vaadin.ui.Label;

import eu.etaxonomy.cdm.vaadin.view.phycobank.ListView;

import eu.etaxonomy.cdm.vaadin.view.phycobank.StartRegistrationView;

        Label phycoBankLogo = new Label("PhycoBank");

        phycoBankLogo.addStyleName("phycobank-green");

        phycoBankLogo.addStyleName(ValoTheme.LABEL_HUGE);

        mainMenu.addMenuComponent(phycoBankLogo);

        mainMenu.addMenuItem("New", FontAwesome.EDIT, StartRegistrationView.NAME);

        mainMenu.addMenuItem("Continue", FontAwesome.ARROW_RIGHT, ListView.NAME);

        mainMenu.addMenuItem("List", FontAwesome.TASKS, ListView.NAME);

        //TODO the branding should be read from a properties file in .cdmLibrary/{instance-name}/cdm-vaadin.properties

        //  See CdmUtils for appropriate methods to access this folder

        String brand = "phycobank";

        // the 'vaadin://' protocol refers to the VAADIN folder

        Resource registryCssFile = new ExternalResource("vaadin://branding/" + brand + "/css/branding.css");

        Page.getCurrent().getStyles().add(registryCssFile);

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.context.ApplicationEventPublisher;

import eu.etaxonomy.vaadin.ui.navigation.NavigationEvent;

    @Autowired

    ApplicationEventPublisher eventBus;

        buttonNew.addClickListener(e -> eventBus.publishEvent(new NavigationEvent(StartRegistrationView.NAME)));

        buttonContinue.addClickListener(e -> eventBus.publishEvent(new NavigationEvent(RegistrationWorkflowView.NAME)));

        buttonList.addClickListener(e -> eventBus.publishEvent(new NavigationEvent(RegistrationWorkflowView.NAME)));

/**

* Copyright (C) 2017 EDIT

* European Distributed Institute of Taxonomy

* http://www.e-taxonomy.eu

*

* The contents of this file are subject to the Mozilla Public License Version 1.1

* See LICENSE.TXT at the top of this package for the full license terms.

*/

package eu.etaxonomy.cdm.vaadin.view.phycobank;

import com.vaadin.navigator.View;

import com.vaadin.navigator.ViewChangeListener.ViewChangeEvent;

import com.vaadin.spring.annotation.SpringView;

import com.vaadin.ui.Label;

import com.vaadin.ui.VerticalLayout;

/**

 * @author a.kohlbecker

 * @since Mar 2, 2017

 *

 */

@SpringView(name=ListView.NAME)

public class ListView extends VerticalLayout implements View {

    private static final long serialVersionUID = 3543300933072824713L;

    public static final String NAME = "list";

    public ListView() {

        addComponent(new Label("List View"));

    }

    /**

     * {@inheritDoc}

     */

    @Override

    public void enter(ViewChangeEvent event) {

    }

}

/**

* Copyright (C) 2017 EDIT

* European Distributed Institute of Taxonomy

* http://www.e-taxonomy.eu

*

* The contents of this file are subject to the Mozilla Public License Version 1.1

* See LICENSE.TXT at the top of this package for the full license terms.

*/

package eu.etaxonomy.cdm.vaadin.view.phycobank;

import com.vaadin.navigator.View;

import com.vaadin.navigator.ViewChangeListener.ViewChangeEvent;

import com.vaadin.spring.annotation.SpringView;

/**

 * @author a.kohlbecker

 * @since Mar 2, 2017

 *

 */

@SpringView(name=RegistrationWorkflowView.NAME)

public class RegistrationWorkflowView implements View {

    private static final long serialVersionUID = -213040114015958970L;

    public static final String NAME = "workflow";

    /**

     * {@inheritDoc}

     */

    @Override

    public void enter(ViewChangeEvent event) {

    }

}

/**

* Copyright (C) 2017 EDIT

* European Distributed Institute of Taxonomy

* http://www.e-taxonomy.eu

*

* The contents of this file are subject to the Mozilla Public License Version 1.1

* See LICENSE.TXT at the top of this package for the full license terms.

*/

package eu.etaxonomy.cdm.vaadin.view.phycobank;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.context.ApplicationEventPublisher;

import com.vaadin.navigator.View;

import com.vaadin.navigator.ViewChangeListener.ViewChangeEvent;

import com.vaadin.spring.annotation.SpringView;

import eu.etaxonomy.cdm.vaadin.design.phycobank.StartRegistrationDesign;

import eu.etaxonomy.vaadin.ui.navigation.NavigationEvent;

/**

 * @author a.kohlbecker

 * @since Mar 2, 2017

 *

 */

@SpringView(name=StartRegistrationView.NAME)

public class StartRegistrationView extends StartRegistrationDesign implements View {

    private static final long serialVersionUID = -213040114015958970L;

    public static final String NAME = "regStart";

    @Autowired

    ApplicationEventPublisher eventBus;

    public StartRegistrationView() {

        buttonName.addClickListener(e -> new NavigationEvent(RegistrationWorkflowView.NAME));

    }

    /**

     * {@inheritDoc}

     */

    @Override

    public void enter(ViewChangeEvent event) {

    }

}

import com.vaadin.ui.Component;

 *

	 *

	public void addMenuComponent(Component component);

import com.vaadin.ui.Component;

    /**

     * {@inheritDoc}

     */

    @Override

    public void addMenuComponent(Component component) {

        menuArea.addComponent(component);

    }

   <vaadin-label style-name="logo_giant phycobank-green" size-auto plain-text :center>

     <vaadin-button icon="fonticon://FontAwesome/f061" style-name="borderless icon-align-top giant" plain-text _id="buttonContinue" :middle :center>

<!doctype html>

<html>

 <head>

  <meta charset="UTF-8">

  <meta name="design-properties" content="{&quot;RULERS_VISIBLE&quot;:true,&quot;GUIDELINES_VISIBLE&quot;:false,&quot;SNAP_TO_OBJECTS&quot;:true,&quot;SNAP_TO_GRID&quot;:true,&quot;SNAPPING_DISTANCE&quot;:10,&quot;JAVA_SOURCES_ROOT&quot;:&quot;src/main/java&quot;,&quot;THEME&quot;:&quot;edit-valo&quot;}">

  <meta name="vaadin-version" content="7.7.0">

 </head>

 <body>

  <vaadin-vertical-layout>

   <vaadin-label style-name="huge" size-auto plain-text :center>

     New Registration 

   </vaadin-label>

   <vaadin-label size-auto plain-text :middle :center>

     What are you about to register, a scientific name or a typification for a name? 

   </vaadin-label>

   <vaadin-css-layout style-name="dashboard-actions" responsive _id="dashboard" :center>

    <vaadin-vertical-layout style-name="dashboard-action-2" spacing size-auto margin>

     <vaadin-button icon="fonticon://FontAwesome/f02b" style-name="borderless icon-align-top giant" plain-text _id="buttonNew" :middle :center>

       Name 

     </vaadin-button>

     <vaadin-label size-auto plain-text :center>

       Start a new registration of a name scientific name. 

     </vaadin-label>

    </vaadin-vertical-layout>

    <vaadin-vertical-layout style-name="dashboard-action-2" spacing size-auto margin>

     <vaadin-button icon="fonticon://FontAwesome/f02c" style-name="borderless icon-align-top giant" plain-text _id="buttonContinue" :middle :center>

       Typification 

     </vaadin-button>

     <vaadin-label size-auto plain-text :center>

       Start a new registration of a typification. 

     </vaadin-label>

    </vaadin-vertical-layout>

   </vaadin-css-layout>

  </vaadin-vertical-layout>

 </body>

</html>

<!doctype html>

<html>

 <head>

  <meta charset="UTF-8">

  <meta name="design-properties" content="{&quot;RULERS_VISIBLE&quot;:true,&quot;GUIDELINES_VISIBLE&quot;:false,&quot;SNAP_TO_OBJECTS&quot;:true,&quot;SNAP_TO_GRID&quot;:true,&quot;SNAPPING_DISTANCE&quot;:10,&quot;JAVA_SOURCES_ROOT&quot;:&quot;src/main/java&quot;,&quot;THEME&quot;:&quot;edit-valo&quot;}">

  <meta name="vaadin-version" content="7.7.0">

 </head>

 <body>

  <vaadin-vertical-layout spacing>

   <vaadin-label style-name="huge" size-auto plain-text :center>

     New Registration 

   </vaadin-label>

   <vaadin-label size-auto plain-text :middle :center>

     What are you about to register, a scientific name or a typification for a name? 

   </vaadin-label>

   <vaadin-css-layout style-name="dashboard-actions" responsive _id="dashboard" :center>

    <vaadin-vertical-layout style-name="dashboard-action-2" spacing size-auto margin>

     <vaadin-button icon="fonticon://FontAwesome/f02b" style-name="borderless icon-align-top giant" plain-text _id="buttonName" :middle :center>

       Name 

     </vaadin-button>

     <vaadin-label size-auto plain-text :center>

       Start the registration process for a scientific name. 

     </vaadin-label>

    </vaadin-vertical-layout>

    <vaadin-vertical-layout style-name="dashboard-action-2" spacing size-auto margin>

     <vaadin-button icon="fonticon://FontAwesome/f02c" enabled="false" style-name="borderless icon-align-top giant" plain-text _id="buttonTypification" :middle :center>

       Typification 

     </vaadin-button>

     <vaadin-label size-auto plain-text :center>

       Start the registration process for a typification. 

     </vaadin-label>

    </vaadin-vertical-layout>

   </vaadin-css-layout>

  </vaadin-vertical-layout>

 </body>

</html>

.phycobank-green {

  color: #2C9208;

}

      .dashboard-action-2 {

        width: 50%;

        .v-label {

            white-space: normal;

        }

      }

          .dashboard-action-2, .dashboard-action-3 {