vaadin-framework/themes/src/main/resources/VAADIN/themes/base/common/common.scss

@mixin base-common {

&.v-app {
	height: 100%;
}
/* Force arrow cursor for all elements inside the app */
&.v-app,
.v-window,
.v-popupview-popup,
.v-label,
.v-caption {
	cursor: default;
}
/* add box-shadows to overlay elements */
.v-window {
  box-shadow: 0 5px 18px 0 rgba(0, 0, 0, .5);
}
.v-datefield-popup,
.v-filterselect-suggestpopup,
.v-menubar-popup,
.v-slider-feedback,
.v-popupview-popup,
.v-contextmenu  {
	 box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .5);
}

body &.v-app .v-app-loading {
	/* You can use this to provide indication for the user that the application is loading. */
	/* It is applied to the same element as .v-app */
	background-image: url(img/loading-indicator.gif);
	background-repeat: no-repeat;
	background-position: 50%;
	width: 100%;
	height: 100%;
}
.v-ui {
	height: 100%;
	width: 100%;
	/* avoid scrollbars with margins in root layout */
	outline: none;
	position: relative;
}
/* Prevent margin collapse */
.v-ui.v-ui-embedded {
	margin-top: -1px;
	border-top: 1px solid transparent;
}
/**
 * Try to handle printing somehow. Reasonable printing support 
 * needs application specific planning and CSS tuning.
 */
 /* Disabled for now, see #10336
@media print {
	.v-generated-body {
		height: auto;
		min-height: 20cm;
		overflow: visible;
	}
	.v-app {
		height: auto;
		min-height: 20cm;
	}
	.v-ui {
		overflow: visible;
	}
	.v-gridlayout {
		overflow: visible !important;
	}
}
*/

.v-ui:active,
.v-ui:focus {
	outline: none;
}
&.v-app select,
.v-window select {
	margin: 0;
}
.v-disabled {
	opacity: .3;
	filter: alpha(opacity=30);
	cursor: default;
}
.v-disabled * {
	cursor: default;
}
* html & .v-disabled {
	zoom: 1;
}
*+html & .v-disabled {
	zoom: 1;
}
.v-disabled .v-disabled {
	opacity: 1;
}
.v-required-field-indicator {
	padding-left: 2px;
	color: red;
}
.v-form fieldset {
	border: none;
	padding: 0;
	margin: 0;
	height: 100%;
}
.v-form-content {
	height: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/* Field modified */ /* Disabled by default
.v-modified,
.v-richtextarea.v-modified iframe.gwt-RichTextArea,
.v-checkbox.v-modified,
.v-modified .v-select-option,
.v-modified .v-textfield,
.v-modified .v-datefield-calendarpanel,
.v-modified .v-select-select,
.v-modified .v-select-twincol-selections,
.v-modified .v-select-twincol-options,
.v-modified .v-slider-base {
	background: #ffffe0;
}
*/
.v-tooltip {
	cursor: default;
	background: #fff;
	box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .5);
}
.v-tooltip-text {
	overflow: auto;
}
.v-tooltip .v-errormessage {
	overflow: auto;
}
.v-contextmenu {
	background: #fff;
}
.v-contextmenu .gwt-MenuItem {
	cursor: pointer;
	vertical-align: middle;
	padding: 0;
	border: 0;
	margin: 0;
}

.v-contextmenu .gwt-MenuBar {
	overflow-y: auto;
	overflow-x: hidden;
}

.v-contextmenu .gwt-MenuItem div {
	cursor: pointer;
	vertical-align: middle;
	white-space: nowrap;
}
.v-contextmenu .gwt-MenuItem-selected div {
	background: #aaa;
	color: #fff;
}
.v-contextmenu table {
	border-collapse: collapse;
	margin: 0;
	padding: 0;
}
.v-contextmenu .gwt-MenuItem img {
	margin-right: 1em;
	vertical-align: middle;
}
/* Margins are not supported within Label */
.v-label pre {
	margin: 0;
}
/* A label with undefined width is always considered to be on one line */
.v-label-undef-w {
	white-space: nowrap;
}
/* Revert line-height for heading elements inside labels */
.v-label h1,
.v-label h2,
.v-label h3,
.v-label h4,
.v-label h5,
.v-label h6 {
	line-height: normal;
} 
/* Loading indicator states
 * Note: client side expects that loading indicator has a height. It depends on
 * this css property to ensure browsers have applied all required styles.
 */
.v-loading-indicator,
.v-loading-indicator-delay,
.v-loading-indicator-wait {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 30000;
	width: 31px;
	height: 31px;
	background: transparent url(img/loading-indicator.gif);
	margin-right: 5px;
	margin-top: 5px;
}
.v-loading-indicator-delay {
	background-image: url(img/loading-indicator-delay.gif);
}
.v-loading-indicator-wait {
	background-image: url(img/loading-indicator-wait.gif);
}
/* Fix for Liferay, issue #2384 */
&.v-app input[type="text"],
&.v-app input[type="password"],
&.v-app input[type="reset"],
&.v-app select,
&.v-app textarea ,
.v-window input[type="text"],
.v-window input[type="password"],
.v-window input[type="reset"],
.v-window select,
.v-window textarea {
	padding: 2px;
}

/* Removes clear button from input fields introduced by IE10 */
input::-ms-clear {
    display: none;
}

.v-drag-element {
	z-index: 60000;
	/* override any other position: properties */
	position: absolute !important;
	opacity: 0.5;
	filter: alpha(opacity=50);
	cursor: default;
}

.v-clip {
	overflow: hidden;
}

.v-scrollable {
	overflow: auto;
	font-size: 0;
	line-height: normal;
}
/* Set font-size in order to make Firefox scrolling better #11353 */
.v-ff & .v-scrollable {
	font-size: $font-size;
}
.v-ios.v-webkit & .v-scrollable {
	-webkit-overflow-scrolling: touch; 
}
/* Disable native scrolling on iOS 5 due to #8792 */
.v-ios5.v-webkit & .v-scrollable {
	-webkit-overflow-scrolling: none;
}

/* "Unnecessary scrollbar" related fixes (#14631, copied from Valo) */
.v-scrollable.v-panel-content > .v-widget {
        /* This is needed for IE */
        vertical-align: middle;

        /* Needed for all browsers. Can't really show anything outside the
         * scrolling area anyway, so we can safely hide any overflow */
        overflow: hidden;
}



&.v-overlay-container {
	width: 0;
	height: 0;
}

}

/* Outside the base mixin because elements might be added directly to the body */
.v-assistive-device-only {
	position: absolute;
	top: -2000px;
	left: -2000px;
	width: 10px;
	overflow: hidden;
}
/* fix for #14681 - mobile safari 8 sometimes displayed text cursor on that element */
.v-radiobutton {
	-webkit-user-select: none;
}