1 files changed, 279 insertions, 0 deletions

diff --git a/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.scss b/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.scss
new file mode 100644
index 0000000000..2f9705ca58
--- /dev/null
+++ b/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.scss
@@ -0,0 +1,279 @@
+@mixin chameleon-datefield {
+
+.v-datefield-button {
+	background: #dadada url(../../img/date-btn.png) repeat-x 50% 0;
+	border: 1px solid gray;
+	-webkit-border-top-right-radius: 3px;
+	-webkit-border-bottom-right-radius: 3px;
+	-moz-border-radius-topright: 3px;
+	-moz-border-radius-bottomright: 3px;
+	width: 25px;
+	height: 1.2em;
+	padding: .2em 0;
+	-webkit-box-sizing: content-box;
+	-moz-box-sizing: content-box;
+	-ms-box-sizing: content-box;
+	box-sizing: content-box;
+	}
+
+.v-datefield-small .v-datefield-button {
+	height: 1.2em;
+	}
+
+.v-datefield-big .v-datefield-button {
+	padding: .3em 0;
+	height: 1.2em;
+	}
+
+.v-ie8 .v-datefield-button {
+	height: 1.6em;
+	padding: 0;
+	}
+
+.v-ie8 .v-datefield-big .v-datefield-button {
+	height: 1.8em;
+	}
+
+input.v-datefield-textfield {
+	border-right: none;
+	-webkit-border-top-right-radius: 0;
+	-webkit-border-bottom-right-radius: 0;
+	-moz-border-radius-topright: 0;
+	-moz-border-radius-bottomright: 0;
+	}
+
+
+/*******************************************************************************
+ * Big
+ ******************************************************************************/
+.v-datefield-big .v-datefield-button {
+	width: 32px;
+	background-image: url(../../img/date-btn-big.png);
+	}
+
+
+/*******************************************************************************
+ * Small
+ ******************************************************************************/
+.v-datefield-small .v-datefield-button {
+	width: 19px;
+	background-position: 50% -2px;
+	}
+
+
+/*******************************************************************************
+ * Calendar panel
+ ******************************************************************************/
+.v-datefield-calendarpanel {
+	border-collapse: collapse;
+	margin: 0;
+	padding: 0;
+	height: auto !important;
+	font-size: 0.9em;
+	}
+
+.v-datefield-month .v-datefield-textfield {
+	width: 6em;
+	}
+
+.v-datefield-year .v-datefield-textfield {
+	width: 4em;
+	}
+
+.v-datefield-year .v-datefield-calendarpanel-prevmonth,
+.v-datefield-year .v-datefield-calendarpanel-nextmonth {
+	display: none;
+	}
+
+.v-datefield-calendarpanel-header td {
+	border-bottom: 1px solid #666;
+	}
+
+.v-datefield-year .v-datefield-calendarpanel-header td,
+.v-datefield-month .v-datefield-calendarpanel-header td {
+	border-bottom: none;
+	}
+
+td.v-datefield-calendarpanel-month {
+	background: #c9c9c9 url(../../img/grad-light-top.png) repeat-x 0 -1px;
+	text-shadow: 0 1px 0 rgba(255,255,255,.7);
+	}
+
+span.v-datefield-calendarpanel-month {
+	display: block;
+	text-align: center;
+	overflow: hidden;
+	line-height: 2em;
+	height: 1.8em;
+	}
+
+.v-datefield-year .v-datefield-calendarpanel-month {
+	width: 5em;
+	}
+
+.v-datefield-month .v-datefield-calendarpanel-month,
+.v-datefield-day .v-datefield-calendarpanel-month,
+.v-datefield-full .v-datefield-calendarpanel-month {
+	width: 9em;
+	}
+
+.v-datefield-popupcalendar {
+	min-width: 0;
+	}
+
+.v-datefield-year .v-datefield-calendarpanel {
+	width: 8em;
+	}
+
+td.v-datefield-calendarpanel-prevyear {
+	text-align: right;
+	}
+
+td.v-datefield-calendarpanel-nextyear {
+	text-align: left;
+	}
+
+.v-datefield-calendarpanel-header button {
+	font-size: 1em;
+	line-height: normal;
+	width: 100%;
+	padding: 0 .8em;
+	height: 1.8em;
+	border: none;
+	background: #c9c9c9 url(../../img/grad-light-top.png) repeat-x 0 -1px;
+	overflow: hidden;
+	outline: none;
+	cursor: pointer;
+	}
+
+.v-datefield-popup .v-datefield-calendarpanel-month,
+.v-datefield-popup .v-datefield-calendarpanel-header button {
+	background-position: 0 0;
+	}
+
+.v-datefield-calendarpanel-header button:active {
+	background-image: url(../../img/grad-dark-top2.png);
+	}
+
+.v-datefield-calendarpanel-prevyear button {
+	-webkit-border-top-left-radius: 4px;
+	-moz-border-radius-topleft: 4px;
+	}
+
+.v-datefield-calendarpanel-nextyear button {
+	-webkit-border-top-right-radius: 4px;
+	-moz-border-radius-topright: 4px;
+	}
+
+.v-datefield-year .v-datefield-calendarpanel-prevyear button,
+.v-datefield-month .v-datefield-calendarpanel-prevyear button {
+	-webkit-border-bottom-left-radius: 3px;
+	-moz-border-radius-bottomleft: 3px;
+	}
+
+.v-datefield-year .v-datefield-calendarpanel-nextyear button,
+.v-datefield-month .v-datefield-calendarpanel-nextyear button {
+	-webkit-border-bottom-right-radius: 3px;
+	-moz-border-radius-bottomright: 3px;
+	}
+
+.v-datefield-calendarpanel-body,
+.v-datefield-calendarpanel-time {
+	text-align: center;
+	vertical-align: top;
+	}
+
+.v-datefield-calendarpanel-body table {
+	border-collapse: collapse;
+	margin: 0;
+	padding: 0;
+	margin: 0 auto;
+	}
+
+.v-datefield-calendarpanel-weekdays td {
+	width: 14.2%;
+	overflow: hidden;
+	line-height: normal;
+	text-transform: uppercase;
+	vertical-align: top;
+	}
+	
+.v-datefield-calendarpanel-weeknumbers td {
+	width: 12.5%;
+	}
+
+.v-datefield-calendarpanel-weekdays strong {
+	display: block;
+	text-align: right;
+	font-size: 0.8em;
+	padding: .3em .5em .35em 0;
+	height: 1.1em;
+	color: #fff;
+	text-shadow: 0 1px 0 rgba(0,0,0,.5);
+	background: #c9c9c9 url(../../img/grad-dark-top2.png) repeat-x;
+	margin-bottom: 2px;
+	}
+
+.v-datefield-calendarpanel .v-first strong {
+	-webkit-border-bottom-left-radius: 3px;
+	-moz-border-radius-bottomleft: 3px;
+	}
+
+.v-datefield-calendarpanel .v-last strong {
+	-webkit-border-bottom-right-radius: 3px;
+	-moz-border-radius-bottomright: 3px;
+	}
+
+.v-datefield-popup .v-datefield-calendarpanel .v-first strong,
+.v-datefield-popup .v-datefield-calendarpanel .v-last strong {
+	-webkit-border-radius: 0;
+	-moz-border-radius: 0;
+	}
+
+.v-datefield-calendarpanel-body td {
+	text-align: right;
+	height: 1.6em;
+	}
+
+.v-datefield-calendarpanel-weeknumber {
+	padding: .5em .5em .35em 0;
+	}
+
+.v-datefield-calendarpanel-day,
+.v-datefield-calendarpanel-day-today {
+	padding: .15em .5em .15em 0;
+	display: block;
+	margin: 1px 1px 1px .3em;
+	border-radius: 2px;
+	-webkit-border-radius: 2px;
+	-moz-border-radius: 2px;
+	}
+
+.v-datefield-calendarpanel-day-focused,
+.v-datefield-calendarpanel-day:hover {
+	margin: 0 0 0 .2em;
+	border: 1px solid #b3b3b3;
+	outline: none;
+	}
+
+.v-datefield-calendarpanel-day-today {
+	border: none;
+	background: transparent url(../../img/grad-dark-top2.png) repeat-x;
+	margin: 0 0 0 .2em;
+	font-weight: bold;
+	border: 1px solid #c9c9c9;
+	}
+
+.v-datefield-calendarpanel-day-selected,
+.v-datefield-calendarpanel-day-selected:hover {
+	margin: 0 0 0 .3em;
+	border: none;
+	}
+
+.v-datefield-calendarpanel-time select {
+	padding: 0;
+	font-size: 0.9em;
+	margin: 0;
+	}
+
+}
\ No newline at end of file