From: Artur Signell Date: Fri, 23 Nov 2012 17:43:19 +0000 (+0200) Subject: Fixed browser specific theme selectors (#10362) X-Git-Tag: 7.0.0.beta10~9^2 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=refs%2Fchanges%2F73%2F373%2F2;p=vaadin-framework.git Fixed browser specific theme selectors (#10362) Browser specific class names are set on the body element and the theme class name is inside body. Theme selectors must therefore be of type ".v-ie & " Change-Id: I1893946ed9b5441a6977945a757a85ae87c07ce8 --- diff --git a/WebContent/VAADIN/themes/base/button/button.scss b/WebContent/VAADIN/themes/base/button/button.scss index 212e386e29..3ab0eb7aaa 100644 --- a/WebContent/VAADIN/themes/base/button/button.scss +++ b/WebContent/VAADIN/themes/base/button/button.scss @@ -66,7 +66,7 @@ } /* Inset Safari focus outline a bit */ -.v-sa .#{$primaryStyleName}-link:focus{ +.v-sa & .#{$primaryStyleName}-link:focus{ outline-offset: -3px; } diff --git a/WebContent/VAADIN/themes/base/button/nativebutton.scss b/WebContent/VAADIN/themes/base/button/nativebutton.scss index 724316a34d..f85bd507ab 100644 --- a/WebContent/VAADIN/themes/base/button/nativebutton.scss +++ b/WebContent/VAADIN/themes/base/button/nativebutton.scss @@ -60,13 +60,13 @@ float: none; } /* Fixes stretched buttons in IE7*/ -.v-ie .#{$primaryStyleName} { +.v-ie & .#{$primaryStyleName} { overflow: visible; padding-left: 1em; padding-right: 1em; } -.v-ie .#{$primaryStyleName}-link { +.v-ie & .#{$primaryStyleName}-link { padding: 0; } diff --git a/WebContent/VAADIN/themes/base/common/common.scss b/WebContent/VAADIN/themes/base/common/common.scss index 56da6e3051..ac9154d2dc 100644 --- a/WebContent/VAADIN/themes/base/common/common.scss +++ b/WebContent/VAADIN/themes/base/common/common.scss @@ -222,7 +222,7 @@ body &.v-app-loading { } /* Enable kinetic scrolling on Mobile Safari 6 */ -.v-ios.v-sa6 .v-scrollable { +.v-ios.v-sa6 & .v-scrollable { -webkit-overflow-scrolling: touch; } diff --git a/WebContent/VAADIN/themes/base/dragwrapper/dragwrapper.scss b/WebContent/VAADIN/themes/base/dragwrapper/dragwrapper.scss index 2baf8a4e09..e66f02e207 100644 --- a/WebContent/VAADIN/themes/base/dragwrapper/dragwrapper.scss +++ b/WebContent/VAADIN/themes/base/dragwrapper/dragwrapper.scss @@ -13,7 +13,7 @@ -khtml-user-select: none; -webkit-user-select: none; } -.v-ie .#{$primaryStyleName} a.drag-start { +.v-ie & .#{$primaryStyleName} a.drag-start { display: block; position: absolute; top: 0; diff --git a/WebContent/VAADIN/themes/base/select/select.scss b/WebContent/VAADIN/themes/base/select/select.scss index e45249ce66..31de83d859 100644 --- a/WebContent/VAADIN/themes/base/select/select.scss +++ b/WebContent/VAADIN/themes/base/select/select.scss @@ -12,7 +12,7 @@ white-space: nowrap; margin: 0 2px; } -.v-ie .#{$primaryStyleName}-optiongroup .#{$primaryStyleName}-option { +.v-ie & .#{$primaryStyleName}-optiongroup .#{$primaryStyleName}-option { zoom: 1; } .#{$primaryStyleName}-select { diff --git a/WebContent/VAADIN/themes/base/table/table.scss b/WebContent/VAADIN/themes/base/table/table.scss index 660c30a4cf..e48b582804 100644 --- a/WebContent/VAADIN/themes/base/table/table.scss +++ b/WebContent/VAADIN/themes/base/table/table.scss @@ -275,8 +275,8 @@ margin-left: -6px; background: transparent url(../common/img/drag-slot-dot.png); } -.v-ff .#{$primaryStyleName}-row-drag-bottom .#{$primaryStyleName}-cell-content:first-child:after, -.v-ie .#{$primaryStyleName}-row-drag-bottom .#{$primaryStyleName}-cell-content:first-child:after { +.v-ff & .#{$primaryStyleName}-row-drag-bottom .#{$primaryStyleName}-cell-content:first-child:after, +.v-ie & .#{$primaryStyleName}-row-drag-bottom .#{$primaryStyleName}-cell-content:first-child:after { margin-top: -2px; } diff --git a/WebContent/VAADIN/themes/base/textfield/textfield.scss b/WebContent/VAADIN/themes/base/textfield/textfield.scss index 1eb1203e97..de57e50e4d 100644 --- a/WebContent/VAADIN/themes/base/textfield/textfield.scss +++ b/WebContent/VAADIN/themes/base/textfield/textfield.scss @@ -46,8 +46,8 @@ textarea.v-textarea-readonly:focus { } */ /* Safari focus glow fix */ -.v-sa input:focus, -.v-sa textarea:focus { +.v-sa & input:focus, +.v-sa & textarea:focus { outline-width: medium; } diff --git a/WebContent/VAADIN/themes/base/tree/tree.scss b/WebContent/VAADIN/themes/base/tree/tree.scss index c1d1283f52..22bd3b7703 100644 --- a/WebContent/VAADIN/themes/base/tree/tree.scss +++ b/WebContent/VAADIN/themes/base/tree/tree.scss @@ -71,8 +71,8 @@ div.#{$primaryStyleName}-node-leaf { .#{$primaryStyleName} .#{$primaryStyleName}-node-caption-drag-center:after { margin-left: 14px; } -.v-ff .#{$primaryStyleName} .#{$primaryStyleName}-node-caption-drag-center:after, -.v-ie .#{$primaryStyleName} .#{$primaryStyleName}-node-caption-drag-center:after { +.v-ff & .#{$primaryStyleName} .#{$primaryStyleName}-node-caption-drag-center:after, +.v-ie & .#{$primaryStyleName} .#{$primaryStyleName}-node-caption-drag-center:after { margin-top: -2px; } .#{$primaryStyleName} .#{$primaryStyleName}-node-drag-top { diff --git a/WebContent/VAADIN/themes/base/upload/upload.scss b/WebContent/VAADIN/themes/base/upload/upload.scss index 71827480ae..933482764c 100644 --- a/WebContent/VAADIN/themes/base/upload/upload.scss +++ b/WebContent/VAADIN/themes/base/upload/upload.scss @@ -11,8 +11,8 @@ overflow: hidden; } -.v-ff .#{$primaryStyleName}-immediate, -.v-op .#{$primaryStyleName}-immediate { +.v-ff & .#{$primaryStyleName}-immediate, +.v-op & .#{$primaryStyleName}-immediate { display: inline-block; } diff --git a/WebContent/VAADIN/themes/chameleon/common/common.scss b/WebContent/VAADIN/themes/chameleon/common/common.scss index a38ed62eb9..050d100673 100644 --- a/WebContent/VAADIN/themes/chameleon/common/common.scss +++ b/WebContent/VAADIN/themes/chameleon/common/common.scss @@ -31,7 +31,7 @@ $chameleon-line-height: 1.4; -moz-border-radius: 4px; } - .v-sa .v-tooltip { + .v-sa & .v-tooltip { outline: 1px solid rgba(0,0,0,.2); -webkit-border-radius: 0; -moz-border-radius: 0; diff --git a/WebContent/VAADIN/themes/chameleon/components/button/button.scss b/WebContent/VAADIN/themes/chameleon/components/button/button.scss index beeba2478f..28d96991a7 100644 --- a/WebContent/VAADIN/themes/chameleon/components/button/button.scss +++ b/WebContent/VAADIN/themes/chameleon/components/button/button.scss @@ -1,14 +1,14 @@ @mixin chameleon-button { .v-button:active, -.v-ie8 .v-pressed.v-button, +.v-ie8 & .v-pressed.v-button, div.v-button-down { background-image: url(../../img/grad-dark-bottom2.png); background-color: #afafaf; } .v-button:active .v-button-wrap, -.v-ie8 .v-pressed.v-button .v-button-wrap, +.v-ie8 & .v-pressed.v-button .v-button-wrap, .v-button-down .v-button-wrap { background-image: url(../../img/grad-dark-top2.png); border: 1px solid #888; @@ -55,10 +55,10 @@ div.v-button-down .v-button-wrap { -ms-text-overflow: ellipsis; } -.v-sa .v-button, -.v-sa .v-button-wrap, -.v-ff .v-button, -.v-ff .v-button-wrap { +.v-sa & .v-button, +.v-sa & .v-button-wrap, +.v-ff & .v-button, +.v-ff & .v-button-wrap { overflow: hidden; } @@ -96,7 +96,7 @@ div.v-button-down .v-button-wrap { } .v-button-small:active .v-button-wrap, -.v-ie8 .v-button-small.v-pressed .v-button-wrap, +.v-ie8 & .v-button-small.v-pressed .v-button-wrap, .v-button-down.small .v-button-wrap { padding: 2px 10px; } @@ -116,7 +116,7 @@ div.v-button-down .v-button-wrap { } .v-button-wide:active .v-button-wrap, -.v-ie8 .v-button-wide.v-pressed .v-button-wrap { +.v-ie8 & .v-button-wide.v-pressed .v-button-wrap { padding-left: 25px; padding-right: 25px; } @@ -131,7 +131,7 @@ div.v-button-down .v-button-wrap { } .v-button-tall:active .v-button-wrap, -.v-ie8 .v-button-tall.v-pressed .v-button-wrap { +.v-ie8 & .v-button-tall.v-pressed .v-button-wrap { padding-top: 12px; padding-bottom: 12px; } @@ -154,13 +154,13 @@ div.v-button-link:focus, .v-button-link:active, div.v-disabled.v-button-link, div.v-disabled.v-button-link:focus, -body.v-ie .v-pressed.v-button-link, +body.v-ie & .v-pressed.v-button-link, div.v-button-borderless, div.v-button-borderless:focus, .v-button-borderless:active, div.v-disabled.v-button-borderless, div.v-disabled.v-button-borderless:focus, -body.v-ie .v-pressed.v-button-borderless { +body.v-ie & .v-pressed.v-button-borderless { background: transparent; font-weight: normal; text-shadow: none; @@ -180,13 +180,13 @@ div.v-button-link:focus .v-button-wrap, .v-button-link:active .v-button-wrap, div.v-disabled.v-button-link .v-button-wrap, div.v-disabled.v-button-link:focus .v-button-wrap, -body.v-ie .v-pressed.v-button-link .v-button-wrap, +body.v-ie & .v-pressed.v-button-link .v-button-wrap, div.v-button-borderless .v-button-wrap, div.v-button-borderless:focus .v-button-wrap, .v-button-borderless:active .v-button-wrap, div.v-disabled.v-button-borderless .v-button-wrap, div.v-disabled.v-button-borderless:focus .v-button-wrap, -body.v-ie .v-pressed.v-button-borderless .v-button-wrap { +body.v-ie & .v-pressed.v-button-borderless .v-button-wrap { background: transparent; font-weight: normal; text-shadow: none; diff --git a/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.scss b/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.scss index 791b564449..bd9c89bb33 100644 --- a/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.scss +++ b/WebContent/VAADIN/themes/chameleon/components/datefield/datefield.scss @@ -25,12 +25,12 @@ height: 1.2em; } -.v-ie8 .#{$primaryStyleName}-button { +.v-ie8 & .#{$primaryStyleName}-button { height: 1.6em; padding: 0; } -.v-ie8 .#{$primaryStyleName}-big .#{$primaryStyleName}-button { +.v-ie8 & .#{$primaryStyleName}-big .#{$primaryStyleName}-button { height: 1.8em; } diff --git a/WebContent/VAADIN/themes/chameleon/components/textfield/textfield.scss b/WebContent/VAADIN/themes/chameleon/components/textfield/textfield.scss index 335b9d9451..edbdf5eff5 100644 --- a/WebContent/VAADIN/themes/chameleon/components/textfield/textfield.scss +++ b/WebContent/VAADIN/themes/chameleon/components/textfield/textfield.scss @@ -38,9 +38,9 @@ body input.v-filterselect-input { color: #222; } -.v-ie input.v-textfield, -.v-ie textarea.v-textarea, -.v-ie .v-filterselect { +.v-ie & input.v-textfield, +.v-ie & textarea.v-textarea, +.v-ie & .v-filterselect { border-top-color: #808080; } diff --git a/WebContent/VAADIN/themes/liferay/button/button.scss b/WebContent/VAADIN/themes/liferay/button/button.scss index 3a2e4a7acb..9835628d31 100644 --- a/WebContent/VAADIN/themes/liferay/button/button.scss +++ b/WebContent/VAADIN/themes/liferay/button/button.scss @@ -91,12 +91,12 @@ button.v-nativebutton-link-pressed, } .v-button-link:focus, -.v-sa .v-button-link:focus { +.v-sa & .v-button-link:focus { outline: 1px dotted #1b699f; outline-offset: -1px; } -.v-sa .v-button-link:focus { +.v-sa & .v-button-link:focus { outline-offset: -1px; } diff --git a/WebContent/VAADIN/themes/liferay/datefield/datefield.scss b/WebContent/VAADIN/themes/liferay/datefield/datefield.scss index 97fb25cfe5..608b4504b0 100644 --- a/WebContent/VAADIN/themes/liferay/datefield/datefield.scss +++ b/WebContent/VAADIN/themes/liferay/datefield/datefield.scss @@ -83,10 +83,10 @@ span.#{$primaryStyleName}-calendarpanel-month { border-radius: 0; } -.v-ie .#{$primaryStyleName}-calendarpanel-prevyear button, -.v-ie .#{$primaryStyleName}-calendarpanel-nextyear button, -.v-ie .#{$primaryStyleName}-calendarpanel-prevmonth button, -.v-ie .#{$primaryStyleName}-calendarpanel-nextmonth button { +.v-ie & .#{$primaryStyleName}-calendarpanel-prevyear button, +.v-ie & .#{$primaryStyleName}-calendarpanel-nextyear button, +.v-ie & .#{$primaryStyleName}-calendarpanel-prevmonth button, +.v-ie & .#{$primaryStyleName}-calendarpanel-nextmonth button { text-indent: 0; font-size: 1px; } diff --git a/WebContent/VAADIN/themes/liferay/panel/panel.scss b/WebContent/VAADIN/themes/liferay/panel/panel.scss index 79172b2474..cb65560a74 100644 --- a/WebContent/VAADIN/themes/liferay/panel/panel.scss +++ b/WebContent/VAADIN/themes/liferay/panel/panel.scss @@ -61,11 +61,11 @@ } /* IE specific rules */ -.v-ie .v-panel { +.v-ie & .v-panel { background: transparent; } -.v-ie .v-panel-caption, -.v-ie .v-panel-nocaption { +.v-ie & .v-panel-caption, +.v-ie & .v-panel-nocaption { border: 1px solid #999; border-bottom: none; background: #c0c2c5 url(/html/themes/classic/images/application/panel_header_bg.png) repeat-x 0 0; @@ -73,13 +73,13 @@ padding-left: 5px; } -.v-ie .v-panel-caption-light, -.v-ie .v-panel-nocaption-light { +.v-ie & .v-panel-caption-light, +.v-ie & .v-panel-nocaption-light { border: none; background: transparent; } -.v-ie .v-panel-caption-light { +.v-ie & .v-panel-caption-light { border-bottom: 1px solid #999; } diff --git a/WebContent/VAADIN/themes/liferay/table/table.scss b/WebContent/VAADIN/themes/liferay/table/table.scss index 0e1b96f5b0..ecb260709b 100644 --- a/WebContent/VAADIN/themes/liferay/table/table.scss +++ b/WebContent/VAADIN/themes/liferay/table/table.scss @@ -64,7 +64,7 @@ margin: -4px 3px 0 0; } -.v-ie .v-table-caption-container .v-icon { +.v-ie & .v-table-caption-container .v-icon { margin-top: -2px; } diff --git a/WebContent/VAADIN/themes/reindeer/accordion/accordion.scss b/WebContent/VAADIN/themes/reindeer/accordion/accordion.scss index 64190b8820..2646bfaa8b 100644 --- a/WebContent/VAADIN/themes/reindeer/accordion/accordion.scss +++ b/WebContent/VAADIN/themes/reindeer/accordion/accordion.scss @@ -30,7 +30,7 @@ .#{$primaryStyleName}-item-caption .v-caption { padding: 3px 0 5px 10px; } -.v-ie .#{$primaryStyleName}-item-caption .v-caption { +.v-ie & .#{$primaryStyleName}-item-caption .v-caption { padding: 2px 0 6px 10px; } .#{$primaryStyleName}-item-open .#{$primaryStyleName}-item-caption { @@ -40,7 +40,7 @@ .#{$primaryStyleName}-item-caption .v-icon { margin-top: -1px; } -.v-ie .#{$primaryStyleName}-item-caption .v-icon { +.v-ie & .#{$primaryStyleName}-item-caption .v-icon { vertical-align: top; } /* Borderless style */ diff --git a/WebContent/VAADIN/themes/reindeer/button/button-ie.scss b/WebContent/VAADIN/themes/reindeer/button/button-ie.scss index e0d6c35091..6732aeb2aa 100644 --- a/WebContent/VAADIN/themes/reindeer/button/button-ie.scss +++ b/WebContent/VAADIN/themes/reindeer/button/button-ie.scss @@ -1,6 +1,6 @@ @mixin reindeer-button-ie($primaryStyleName : v-nativebutton) { -.v-ie8 .#{$primaryStyleName}-link { +.v-ie8 & .#{$primaryStyleName}-link { padding: 0; text-align: left; } diff --git a/WebContent/VAADIN/themes/reindeer/common/common.scss b/WebContent/VAADIN/themes/reindeer/common/common.scss index f06a7a7638..5e85cb09bc 100644 --- a/WebContent/VAADIN/themes/reindeer/common/common.scss +++ b/WebContent/VAADIN/themes/reindeer/common/common.scss @@ -99,7 +99,7 @@ color: #fff; text-shadow: #3b5a7a 0 1px 0; } -.v-ie .v-contextmenu .gwt-MenuItem-selected { +.v-ie & .v-contextmenu .gwt-MenuItem-selected { background-image: url(img/sel-bg.png); background-position: left top; } diff --git a/WebContent/VAADIN/themes/reindeer/datefield/datefield.scss b/WebContent/VAADIN/themes/reindeer/datefield/datefield.scss index 0969be3532..83761ba1ff 100644 --- a/WebContent/VAADIN/themes/reindeer/datefield/datefield.scss +++ b/WebContent/VAADIN/themes/reindeer/datefield/datefield.scss @@ -79,10 +79,10 @@ td.#{$primaryStyleName}-calendarpanel-nextyear { -moz-border-radius: 0; border-radius: 0; } -.v-ie .#{$primaryStyleName}-calendarpanel-prevyear button, -.v-ie .#{$primaryStyleName}-calendarpanel-nextyear button, -.v-ie .#{$primaryStyleName}-calendarpanel-prevmonth button, -.v-ie .#{$primaryStyleName}-calendarpanel-nextmonth button { +.v-ie & .#{$primaryStyleName}-calendarpanel-prevyear button, +.v-ie & .#{$primaryStyleName}-calendarpanel-nextyear button, +.v-ie & .#{$primaryStyleName}-calendarpanel-prevmonth button, +.v-ie & .#{$primaryStyleName}-calendarpanel-nextmonth button { text-indent: 0; font-size: 1px; } @@ -91,11 +91,11 @@ td.#{$primaryStyleName}-calendarpanel-nextyear { background-image: url(img/year-next.png); /** sprite-ref: verticals */ } .#{$primaryStyleName}-calendarpanel-prevyear button:active, -.v-ie .#{$primaryStyleName}-calendarpanel-prevyear button.v-pressed { +.v-ie & .#{$primaryStyleName}-calendarpanel-prevyear button.v-pressed { background-image: url(img/year-prev-pressed.png); /** sprite-ref: verticals */ } .#{$primaryStyleName}-calendarpanel-nextyear button:active, -.v-ie .#{$primaryStyleName}-calendarpanel-nextyear button.v-pressed { +.v-ie & .#{$primaryStyleName}-calendarpanel-nextyear button.v-pressed { background-image: url(img/year-next-pressed.png); /** sprite-ref: verticals */ } .#{$primaryStyleName}-calendarpanel-prevmonth, @@ -116,20 +116,20 @@ td.#{$primaryStyleName}-calendarpanel-nextyear { min-width: 24px; margin-top: 1px; } -.v-ie .#{$primaryStyleName}-calendarpanel-prevmonth button, -.v-ie .#{$primaryStyleName}-calendarpanel-nextmonth button { +.v-ie & .#{$primaryStyleName}-calendarpanel-prevmonth button, +.v-ie & .#{$primaryStyleName}-calendarpanel-nextmonth button { border: none; } .#{$primaryStyleName}-calendarpanel-nextmonth button { background-image: url(img/month-next.png); /** sprite-ref: verticals; sprite-alignment: center */ } .#{$primaryStyleName}-calendarpanel-prevmonth button:active, -.v-ie .#{$primaryStyleName}-calendarpanel-prevmonth button.v-pressed { +.v-ie & .#{$primaryStyleName}-calendarpanel-prevmonth button.v-pressed { background-position: center top; background-image: url(img/month-prev-pressed.png); /** sprite-ref: verticals; sprite-alignment: center */ } .#{$primaryStyleName}-calendarpanel-nextmonth button:active, -.v-ie .#{$primaryStyleName}-calendarpanel-nextmonth button.v-pressed { +.v-ie & .#{$primaryStyleName}-calendarpanel-nextmonth button.v-pressed { background-position: center top; background-image: url(img/month-next-pressed.png); /** sprite-ref: verticals; sprite-alignment: center */ } @@ -178,14 +178,14 @@ td.#{$primaryStyleName}-calendarpanel-nextyear { background-image: url(img/weekday-last.png); /** sprite-ref: verticals; sprite-alignment: right; sprite-margin-bottom: 3px */ } /* IE fails to position backgrounds inside table element */ -.v-ie .#{$primaryStyleName}-calendarpanel-weekdays td { +.v-ie & .#{$primaryStyleName}-calendarpanel-weekdays td { background: url(img/weekday-bg.png) repeat-x; background-position: left top; } -.v-ie .#{$primaryStyleName}-calendarpanel .v-first { +.v-ie & .#{$primaryStyleName}-calendarpanel .v-first { background: url(img/weekday-first.png) no-repeat; } -.v-ie .#{$primaryStyleName}-calendarpanel .v-last { +.v-ie & .#{$primaryStyleName}-calendarpanel .v-last { background: url(img/weekday-last.png) no-repeat right top; } .#{$primaryStyleName}-calendarpanel-body td { @@ -228,8 +228,8 @@ td.#{$primaryStyleName}-calendarpanel-nextyear { -webkit-border-radius: 3px; -moz-border-radius: 3px; } -.v-sa .#{$primaryStyleName}-popup, -.v-op .#{$primaryStyleName}-popup { +.v-sa & .#{$primaryStyleName}-popup, +.v-op & .#{$primaryStyleName}-popup { background: rgba(255,255,255,.95); } .v-has-width > input.#{$primaryStyleName}-textfield { @@ -321,11 +321,11 @@ td.#{$primaryStyleName}-calendarpanel-nextyear { background-image: url(img/year-next-black.png); /** sprite-ref: black-verticals */ } .black .#{$primaryStyleName}-calendarpanel-prevyear button:active, -.v-ie .black .#{$primaryStyleName}-calendarpanel-prevyear button.v-pressed { +.v-ie & .black .#{$primaryStyleName}-calendarpanel-prevyear button.v-pressed { background-image: url(img/year-prev-black-pressed.png); /** sprite-ref: black-verticals */ } .black .#{$primaryStyleName}-calendarpanel-nextyear button:active, -.v-ie .black .#{$primaryStyleName}-calendarpanel-nextyear button.v-pressed { +.v-ie & .black .#{$primaryStyleName}-calendarpanel-nextyear button.v-pressed { background-image: url(img/year-next-black-pressed.png); /** sprite-ref: black-verticals */ } .black .#{$primaryStyleName}-calendarpanel-prevmonth, @@ -343,15 +343,15 @@ td.#{$primaryStyleName}-calendarpanel-nextyear { background-image: url(img/month-next-black.png); /** sprite-ref: black-verticals; sprite-alignment: center */ } .black .#{$primaryStyleName}-calendarpanel-prevmonth button:active, -.v-ie .black .#{$primaryStyleName}-calendarpanel-prevmonth button.v-pressed { +.v-ie & .black .#{$primaryStyleName}-calendarpanel-prevmonth button.v-pressed { background-image: url(img/month-prev-black-pressed.png); /** sprite-ref: black-verticals; sprite-alignment: center */ } .black .#{$primaryStyleName}-calendarpanel-nextmonth button:active, -.v-ie .black .#{$primaryStyleName}-calendarpanel-nextmonth button.v-pressed { +.v-ie & .black .#{$primaryStyleName}-calendarpanel-nextmonth button.v-pressed { background-image: url(img/month-next-black-pressed.png); /** sprite-ref: black-verticals; sprite-alignment: center */ } -.v-ie .black .#{$primaryStyleName}-calendarpanel-prevmonth button, -.v-ie .black .#{$primaryStyleName}-calendarpanel-nextmonth button { +.v-ie & .black .#{$primaryStyleName}-calendarpanel-prevmonth button, +.v-ie & .black .#{$primaryStyleName}-calendarpanel-nextmonth button { border: none; } .black .#{$primaryStyleName}-calendarpanel-weekdays td { diff --git a/WebContent/VAADIN/themes/reindeer/label/label.scss b/WebContent/VAADIN/themes/reindeer/label/label.scss index 68b0d58eb0..9a6f9b33ad 100644 --- a/WebContent/VAADIN/themes/reindeer/label/label.scss +++ b/WebContent/VAADIN/themes/reindeer/label/label.scss @@ -113,8 +113,8 @@ border-bottom: 1px solid #fff; } -.v-sa .#{$primaryStyleName} hr, -.v-ie8 .#{$primaryStyleName} hr { +.v-sa & .#{$primaryStyleName} hr, +.v-ie8 & .#{$primaryStyleName} hr { height: 1px; } diff --git a/WebContent/VAADIN/themes/reindeer/notification/notification.scss b/WebContent/VAADIN/themes/reindeer/notification/notification.scss index 6eb53dc70a..4884f19f8b 100644 --- a/WebContent/VAADIN/themes/reindeer/notification/notification.scss +++ b/WebContent/VAADIN/themes/reindeer/notification/notification.scss @@ -10,7 +10,7 @@ font-weight: bold; } -.v-ie9 .#{$primaryStyleName} H1 { +.v-ie9 & .#{$primaryStyleName} H1 { /* Fix for #6793 */ font-weight: bold; } diff --git a/WebContent/VAADIN/themes/reindeer/panel/panel.scss b/WebContent/VAADIN/themes/reindeer/panel/panel.scss index 8de6ea7f62..b095fb4ffb 100644 --- a/WebContent/VAADIN/themes/reindeer/panel/panel.scss +++ b/WebContent/VAADIN/themes/reindeer/panel/panel.scss @@ -12,12 +12,12 @@ border-bottom: 1px solid #e5e5e5; line-height: 16px; /* accommodate minimum icon size */ } -.v-webkit .#{$primaryStyleName}-caption, -.v-webkit .#{$primaryStyleName}-nocaption, -.v-gecko .#{$primaryStyleName}-caption, -.v-gecko .#{$primaryStyleName}-nocaption, -.v-ie9 .#{$primaryStyleName}-caption, -.v-ie9 .#{$primaryStyleName}-nocaption { +.v-webkit & .#{$primaryStyleName}-caption, +.v-webkit & .#{$primaryStyleName}-nocaption, +.v-gecko & .#{$primaryStyleName}-caption, +.v-gecko & .#{$primaryStyleName}-nocaption, +.v-ie9 & .#{$primaryStyleName}-caption, +.v-ie9 & .#{$primaryStyleName}-nocaption { border-bottom-color: rgba(0,0,0,.08); } .#{$primaryStyleName}-caption { @@ -30,9 +30,9 @@ border-bottom: none; border-top: none; } -.v-webkit .#{$primaryStyleName}-content, -.v-gecko .#{$primaryStyleName}-content, -.v-ie9 .#{$primaryStyleName}-content { +.v-webkit & .#{$primaryStyleName}-content, +.v-gecko & .#{$primaryStyleName}-content, +.v-ie9 & .#{$primaryStyleName}-content { border-top-color: rgba(0,0,0,.07); } .blue .#{$primaryStyleName}-deco { @@ -46,9 +46,9 @@ background: #e2e2e2; overflow: hidden; } -.v-webkit .#{$primaryStyleName}-deco, -.v-gecko .#{$primaryStyleName}-deco, -.v-ie9 .#{$primaryStyleName}-deco { +.v-webkit & .#{$primaryStyleName}-deco, +.v-gecko & .#{$primaryStyleName}-deco, +.v-ie9 & .#{$primaryStyleName}-deco { border-top-color: rgba(0,0,0,.1); background: rgba(0,0,0,.08); } diff --git a/WebContent/VAADIN/themes/reindeer/select/select.scss b/WebContent/VAADIN/themes/reindeer/select/select.scss index 1785a367e6..e902458ad1 100644 --- a/WebContent/VAADIN/themes/reindeer/select/select.scss +++ b/WebContent/VAADIN/themes/reindeer/select/select.scss @@ -84,7 +84,7 @@ -webkit-user-select: none; cursor: default; } -.v-ff .#{$primaryStyleName}-suggestmenu .gwt-MenuItem { +.v-ff & .#{$primaryStyleName}-suggestmenu .gwt-MenuItem { height: 18px; } .#{$primaryStyleName}-suggestmenu .gwt-MenuItem .v-icon { @@ -170,28 +170,28 @@ -webkit-user-select: none; } /* IE fails to position background images properly inside table elements */ -.v-ie .#{$primaryStyleName}-suggestmenu .gwt-MenuItem-selected { +.v-ie & .#{$primaryStyleName}-suggestmenu .gwt-MenuItem-selected { background: transparent url(../common/img/sel-bg.png) repeat-x; } -.v-ie .#{$primaryStyleName}-nextpage:hover { +.v-ie & .#{$primaryStyleName}-nextpage:hover { background: transparent url(img/page-down-hover.png) repeat-x; } -.v-ie .#{$primaryStyleName}-prevpage:hover { +.v-ie & .#{$primaryStyleName}-prevpage:hover { background: transparent url(img/page-up-hover.png) repeat-x; } -.v-ie .#{$primaryStyleName}-prevpage span { +.v-ie & .#{$primaryStyleName}-prevpage span { background: transparent url(img/arrow-up.png) no-repeat center 3px; } -.v-ie .#{$primaryStyleName}-nextpage span { +.v-ie & .#{$primaryStyleName}-nextpage span { background: transparent url(img/arrow-down.png) no-repeat center 3px; } -.v-ie .#{$primaryStyleName}-prevpage:hover span { +.v-ie & .#{$primaryStyleName}-prevpage:hover span { background: transparent url(img/arrow-up-hover.png) no-repeat center 3px; } -.v-ie .#{$primaryStyleName}-nextpage:hover span { +.v-ie & .#{$primaryStyleName}-nextpage:hover span { background: transparent url(img/arrow-down-hover.png) no-repeat center 3px; } -.v-ie .#{$primaryStyleName}-status { +.v-ie & .#{$primaryStyleName}-status { background: transparent url(img/status-bg.png) repeat-x; } /* Filterselect with icon needs a similar fix than in buttons */ diff --git a/WebContent/VAADIN/themes/reindeer/table/table.scss b/WebContent/VAADIN/themes/reindeer/table/table.scss index c2ada54e34..5896bef014 100644 --- a/WebContent/VAADIN/themes/reindeer/table/table.scss +++ b/WebContent/VAADIN/themes/reindeer/table/table.scss @@ -61,8 +61,8 @@ margin: -4px 3px 0 0; vertical-align: middle; } -.v-ie .#{$primaryStyleName}-caption-container .v-icon, -.v-ie .#{$primaryStyleName}-header-drag .v-icon { +.v-ie & .#{$primaryStyleName}-caption-container .v-icon, +.v-ie & .#{$primaryStyleName}-header-drag .v-icon { margin-top: -3px; } .#{$primaryStyleName}-resizer { diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.scss b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.scss index 7b6ed54c02..75ce9e1094 100644 --- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.scss +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-minimal-style.scss @@ -107,7 +107,7 @@ .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close { margin-top: 1px; } -.v-ff .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close { +.v-ff & .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close { margin-top: -15px; } .#{$primaryStyleName}-tabs-minimal .#{$primaryStyleName}-caption-close:hover, diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.scss b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.scss index c13bb6f025..172c735933 100644 --- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.scss +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-normal-style.scss @@ -104,7 +104,7 @@ .#{$primaryStyleName}-tabsheetpanel { background: #fff; } -.v-sa .#{$primaryStyleName}-content { +.v-sa & .#{$primaryStyleName}-content { border-color: rgba(0,0,0,.1); } .blue .#{$primaryStyleName}-deco { @@ -118,7 +118,7 @@ background: #e2e2e2; overflow: hidden; } -.v-sa .#{$primaryStyleName}-deco { +.v-sa & .#{$primaryStyleName}-deco { border-top-color: rgba(0,0,0,.1); background: rgba(0,0,0,.08); } @@ -132,7 +132,7 @@ display: inline; float: none; } -.v-sa .#{$primaryStyleName}-tabs .v-captiontext { +.v-sa & .#{$primaryStyleName}-tabs .v-captiontext { display: inline-block; } .#{$primaryStyleName}-tabs .v-icon { @@ -145,12 +145,12 @@ height: 16px; background: transparent url(../common/icons/error.png) no-repeat 50%; } -.v-ie .#{$primaryStyleName}-tabs .v-errorindicator { +.v-ie & .#{$primaryStyleName}-tabs .v-errorindicator { zoom: 1; display: inline; } -.v-ie8 .#{$primaryStyleName}-tabs .v-errorindicator, -.v-ie9 .#{$primaryStyleName}-tabs .v-errorindicator { +.v-ie8 & .#{$primaryStyleName}-tabs .v-errorindicator, +.v-ie9 & .#{$primaryStyleName}-tabs .v-errorindicator { display: inline-block; } diff --git a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-small-style.scss b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-small-style.scss index de0c29d516..2f1d0c7081 100644 --- a/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-small-style.scss +++ b/WebContent/VAADIN/themes/reindeer/tabsheet/tabsheet-small-style.scss @@ -52,7 +52,7 @@ .#{$primaryStyleName}-tabs-bar .#{$primaryStyleName}-caption-close { margin-top: 1px; } -.v-ff .#{$primaryStyleName}-tabs-bar .#{$primaryStyleName}-caption-close { +.v-ff & .#{$primaryStyleName}-tabs-bar .#{$primaryStyleName}-caption-close { margin-top: -14px; } .#{$primaryStyleName}-tabs-bar .#{$primaryStyleName}-caption-close:hover { diff --git a/WebContent/VAADIN/themes/reindeer/window/window.scss b/WebContent/VAADIN/themes/reindeer/window/window.scss index 7ba6b01675..073980e6d9 100644 --- a/WebContent/VAADIN/themes/reindeer/window/window.scss +++ b/WebContent/VAADIN/themes/reindeer/window/window.scss @@ -9,8 +9,8 @@ -moz-box-sizing: border-box; box-sizing: border-box; } -.v-sa .#{$primaryStyleName}-wrap, -.v-op .#{$primaryStyleName}-wrap { +.v-sa & .#{$primaryStyleName}-wrap, +.v-op & .#{$primaryStyleName}-wrap { border-color: rgba(0,0,0,.2); } .#{$primaryStyleName}-outerheader { @@ -130,8 +130,8 @@ -moz-border-radius: 8px; overflow: hidden; } -.v-sa .#{$primaryStyleName}-black .#{$primaryStyleName}-wrap, -.v-op .#{$primaryStyleName}-black .#{$primaryStyleName}-wrap { +.v-sa & .#{$primaryStyleName}-black .#{$primaryStyleName}-wrap, +.v-op & .#{$primaryStyleName}-black .#{$primaryStyleName}-wrap { border-color: rgba(0,0,0,.8); } .#{$primaryStyleName}-black .#{$primaryStyleName}-wrap2 { @@ -139,8 +139,8 @@ -moz-border-radius: 7px; -webkit-border-radius: 7px; } -.v-sa .#{$primaryStyleName}-black .#{$primaryStyleName}-wrap2, -.v-op .#{$primaryStyleName}-black .#{$primaryStyleName}-wrap2 { +.v-sa & .#{$primaryStyleName}-black .#{$primaryStyleName}-wrap2, +.v-op & .#{$primaryStyleName}-black .#{$primaryStyleName}-wrap2 { background-color: rgba(29,32,33,.9); } .#{$primaryStyleName}-black .#{$primaryStyleName}-outerheader { diff --git a/WebContent/VAADIN/themes/runo/label/label.scss b/WebContent/VAADIN/themes/runo/label/label.scss index 94bb5637e9..b5308e4696 100644 --- a/WebContent/VAADIN/themes/runo/label/label.scss +++ b/WebContent/VAADIN/themes/runo/label/label.scss @@ -66,8 +66,8 @@ height: 1px; } -.v-sa .v-label hr, -.v-ie8 .v-label hr { +.v-sa & .v-label hr, +.v-ie8 & .v-label hr { height: 1px; } diff --git a/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.scss b/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.scss index 8799c7d8a6..bb202433b5 100644 --- a/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.scss +++ b/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.scss @@ -90,29 +90,29 @@ div.v-csslayout-box-shadow { margin-left: -6px; } /* Fancier shadows for capable browsers */ -.v-webkit .v-csslayout-box-shadow, -.v-webkit .v-csslayout-box-shadow > .v-csslayout-margin, -.v-webkit .v-csslayout-box-shadow > .v-csslayout-margin > .v-csslayout-container, -.v-gecko .v-csslayout-box-shadow, -.v-gecko .v-csslayout-box-shadow > .v-csslayout-margin, -.v-gecko .v-csslayout-box-shadow > .v-csslayout-margin > .v-csslayout-container, -.v-gecko .v-csslayout-box-shadow > .v-csslayout-margin > .v-csslayout-container > * { +.v-webkit & .v-csslayout-box-shadow, +.v-webkit & .v-csslayout-box-shadow > .v-csslayout-margin, +.v-webkit & .v-csslayout-box-shadow > .v-csslayout-margin > .v-csslayout-container, +.v-gecko & .v-csslayout-box-shadow, +.v-gecko & .v-csslayout-box-shadow > .v-csslayout-margin, +.v-gecko & .v-csslayout-box-shadow > .v-csslayout-margin > .v-csslayout-container, +.v-gecko & .v-csslayout-box-shadow > .v-csslayout-margin > .v-csslayout-container > * { background: transparent; padding: 0; margin: 0; height: auto; position: static; } -.v-webkit .v-csslayout-box-shadow > .v-csslayout-margin > .v-csslayout-container > *, -.v-gecko .v-csslayout-box-shadow > .v-csslayout-margin > .v-csslayout-container > * { +.v-webkit & .v-csslayout-box-shadow > .v-csslayout-margin > .v-csslayout-container > *, +.v-gecko & .v-csslayout-box-shadow > .v-csslayout-margin > .v-csslayout-container > * { margin-left: 0; } -.v-webkit .v-csslayout-box-shadow, -.v-gecko .v-csslayout-box-shadow { +.v-webkit & .v-csslayout-box-shadow, +.v-gecko & .v-csslayout-box-shadow { padding: 4px 8px 10px; } -.v-webkit .v-csslayout-box-shadow > .v-csslayout-margin, -.v-gecko .v-csslayout-box-shadow > .v-csslayout-margin { +.v-webkit & .v-csslayout-box-shadow > .v-csslayout-margin, +.v-gecko & .v-csslayout-box-shadow > .v-csslayout-margin { -webkit-box-shadow: 0 2px 8px rgba(0,0,0,.4); -moz-box-shadow: 0 2px 8px rgba(0,0,0,.4); } diff --git a/WebContent/VAADIN/themes/runo/panel/panel.scss b/WebContent/VAADIN/themes/runo/panel/panel.scss index 3d6b00173b..d33bcc5c62 100644 --- a/WebContent/VAADIN/themes/runo/panel/panel.scss +++ b/WebContent/VAADIN/themes/runo/panel/panel.scss @@ -69,13 +69,13 @@ overflow: hidden; } /* IE specific rules */ -.v-ie8 .v-panel-content { +.v-ie8 & .v-panel-content { border-bottom: 1px solid #babfc0; } -.v-ie8 .v-panel-content-light { +.v-ie8 & .v-panel-content-light { border-bottom: none; } -.v-ie8 .v-panel-deco { +.v-ie8 & .v-panel-deco { height: 0; overflow: hidden; } diff --git a/WebContent/VAADIN/themes/runo/select/select.scss b/WebContent/VAADIN/themes/runo/select/select.scss index 64188eed09..6ba9acecd7 100644 --- a/WebContent/VAADIN/themes/runo/select/select.scss +++ b/WebContent/VAADIN/themes/runo/select/select.scss @@ -40,7 +40,7 @@ outline: 1px solid #5daee8; outline-offset: -1px; } -.v-sa .v-filterselect-focus { +.v-sa & .v-filterselect-focus { /* place safari focus outline around the whole thing */ outline: 5px auto -webkit-focus-ring-color; outline-offset: -4px; @@ -74,7 +74,7 @@ cursor: pointer; height: 18px; } -.v-ff .v-filterselect-suggestmenu .gwt-MenuItem { +.v-ff & .v-filterselect-suggestmenu .gwt-MenuItem { height: 20px; } .v-filterselect-suggestmenu .gwt-MenuItem .v-icon { diff --git a/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.scss b/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.scss index ec6bdd5b0f..6ed8585547 100644 --- a/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.scss +++ b/WebContent/VAADIN/themes/runo/tabsheet/tabsheet.scss @@ -134,17 +134,17 @@ padding-top: 12px; }*/ /* IE specific styles */ -.v-ie .v-tabsheet-content { +.v-ie & .v-tabsheet-content { border-bottom: none; } -.v-ie .v-tabsheet-deco { +.v-ie & .v-tabsheet-deco { height: 1px; background: #babfc0; overflow: hidden; margin: 0; } -.v-ie8 .v-tabsheet-deco, -.v-ie9 .v-tabsheet-deco { +.v-ie8 & .v-tabsheet-deco, +.v-ie9 & .v-tabsheet-deco { width: 100%; } /* Light-style */ @@ -250,7 +250,7 @@ margin-left: -3px; padding-left: 3px; }*/ -.v-ie .v-tabsheet-deco-light { +.v-ie & .v-tabsheet-deco-light { height: 0; }