mirrors
/
vaadin-framework
mirror of https://github.com/vaadin/framework.git


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
							<!DOCTYPE html>
<html>
 <head>
  <meta name="package-mapping" content="my:com.addon.mypackage"/>
 </head>
 <body>
  <v-vertical-layout>
      <!-- abstract component -->
  	  <v-button primary-style-name="button" id="foo" style-name="red" caption="Some caption" icon="vaadin://themes/runo/icons/16/ok.png" description="My tooltip" error="Something went wrong" locale="en_US"></v-button>

      <!-- absolute layout -->
      <v-absolute-layout>
		<v-button :top="100px" :left="0px" :z-index=21>OK</v-button>
		<v-button :bottom="0px" :right="0px">Cancel</v-button>
	  </v-absolute-layout>
	  
	  <!--  vertical layout -->
      <v-vertical-layout spacing margin>
		<v-button :top>OK</v-button>
		<v-table size-full :expand=1 />      
      </v-vertical-layout>
      
	  <!--  horizontal layout -->
      <v-horizontal-layout spacing margin>
		<v-button :top>OK</v-button>
		<v-table size-full :expand=1 />      
      </v-horizontal-layout>
      
	  <!--  form layout -->
      <v-form-layout spacing margin>
		<v-button :top>OK</v-button>
		<v-table size-full :expand=1 />      
      </v-form-layout>

	  <!--  css layout -->
      <v-css-layout>
		<v-button>OK</v-button>
		<v-table size-full />
      </v-css-layout>
      
      <!--  abstract field -->
	  <v-text-field buffered validation-visible=false invalid-committed invalid-allowed=false required required-error="This is a required field" conversion-error="Input {0} cannot be parsed" tabindex=3 readonly />
      <!--  abstract text field, text field -->
      <v-text-field null-representation="" null-setting-allowed maxlength=10 columns=5 input-prompt="Please enter a value" text-change-event-mode="eager" text-change-timeout=2 value="foo" />
	  <!--  password field -->      
      <v-password-field null-representation="" null-setting-allowed maxlength=10 columns=5 input-prompt="Please enter a value" text-change-event-mode="eager" text-change-timeout=2 value="foo" />
      <!--  text area -->
      <v-text-area rows=5 wordwrap=false >test value</v-text-area>
      <!--  button -->
      <v-button click-shortcut="ctrl-shift-o" disable-on-click tabindex=1 icon="http://vaadin.com/image.png" icon-alt="ok" plain-text>OK</v-button>
      <!--  native button -->
      <v-button click-shortcut="ctrl-shift-o" disable-on-click tabindex=1 icon="http://vaadin.com/image.png" icon-alt="ok" plain-text>OK</v-button>
      
      <!-- tabsheet -->
	  <v-tab-sheet tabindex=5>
		  <tab visible=false closable caption="My first tab">
			<v-vertical-layout>
				<v-text-field/>
		    </v-vertical-layout>
		  </tab>
		  <tab enabled=false caption="Disabled second tab">
			<v-button>In disabled tab - can’t be shown by default</v-button>
	      </tab>
		  <tab icon="theme://../runo/icons/16/ok.png" icon-alt="Ok png from Runo - very helpful" description="Click to show a text field" style-name="red" id="uniqueDomId">
			<v-text-field input-prompt="Icon only in tab" />
	      </tab>
	   </v-tab-sheet>

      <!-- accordion -->
	  <v-accordion tabindex=5>
		  <tab visible=false closable caption="My first tab">
			<v-vertical-layout>
				<v-text-field/>
		    </v-vertical-layout>
		  </tab>
		  <tab enabled=false caption="Disabled second tab">
			<v-button>In disabled tab - can’t be shown by default</v-button>
	      </tab>
		  <tab icon="theme://../runo/icons/16/ok.png" icon-alt="Ok png from Runo - very helpful" description="Click to show a text field" style-name="red" id="uniqueDomId">
			<v-text-field input-prompt="Icon only in tab" />
	      </tab>
	   </v-accordion>

           
  </v-vertical-layout>
 </body>
</html>