summaryrefslogtreecommitdiffstats
path: root/WebContent/VAADIN/themes/runo/table/table.scss
diff options
context:
space:
mode:
Diffstat (limited to 'WebContent/VAADIN/themes/runo/table/table.scss')
-rw-r--r--WebContent/VAADIN/themes/runo/table/table.scss108
1 files changed, 54 insertions, 54 deletions
diff --git a/WebContent/VAADIN/themes/runo/table/table.scss b/WebContent/VAADIN/themes/runo/table/table.scss
index 47bcb2caca..3902ed7cb0 100644
--- a/WebContent/VAADIN/themes/runo/table/table.scss
+++ b/WebContent/VAADIN/themes/runo/table/table.scss
@@ -1,86 +1,86 @@
-@mixin runo-table {
+@mixin runo-table($primaryStyleName : v-table) {
-.v-table-header-wrap {
+.#{$primaryStyleName}-header-wrap {
height: 36px;
border: 1px solid #b6bbbc;
border-bottom: none;
background: #e7e9ea url(img/header-bg.png) repeat-x;
}
-.v-table-header {
+.#{$primaryStyleName}-header {
height: 36px;
}
-.v-table-footer-wrap {
+.#{$primaryStyleName}-footer-wrap {
border-color: #b6bbbc;
background: #e7e9ea url(img/header-bg.png) repeat-x;
}
-.v-table-footer td {
+.#{$primaryStyleName}-footer td {
border-right-color: #e8eaec;
padding-top: 3px;
padding-bottom: 3px;
}
-.v-table-resizer {
+.#{$primaryStyleName}-resizer {
height: 36px;
width: 4px;
background: transparent url(img/resizer-bg.png) repeat-y 100% 50%;
}
-.v-table-caption-container {
+.#{$primaryStyleName}-caption-container {
color: #393a3c;
font-size: 15px;
padding: 9px 2px 9px 0;
text-shadow: #ffffff 0 1px 0;
margin-left: 4px;
}
-.v-table-sort-indicator {
+.#{$primaryStyleName}-sort-indicator {
width: 0;
height: 36px;
}
-.v-table-header-cell-asc .v-table-sort-indicator {
+.#{$primaryStyleName}-header-cell-asc .#{$primaryStyleName}-sort-indicator {
background: transparent url(img/sort-asc.png) no-repeat right 50%;
width: 20px;
height: 36px;
}
-.v-table-header-cell-desc .v-table-sort-indicator {
+.#{$primaryStyleName}-header-cell-desc .#{$primaryStyleName}-sort-indicator {
background: transparent url(img/sort-desc.png) no-repeat right 50%;
width: 20px;
height: 36px;
}
-.v-table-header-cell:hover,
-.v-table-header-cell-asc:hover,
-.v-table-header-cell-desc:hover {
+.#{$primaryStyleName}-header-cell:hover,
+.#{$primaryStyleName}-header-cell-asc:hover,
+.#{$primaryStyleName}-header-cell-desc:hover {
background: transparent url(img/header-bg-over.png) repeat-x;
}
-.v-table-body {
+.#{$primaryStyleName}-body {
background: #fff;
border: 1px solid #b6bbbc;
}
-tr.v-table-row:hover,
-tr.v-table-row-odd:hover {
+tr.#{$primaryStyleName}-row:hover,
+tr.#{$primaryStyleName}-row-odd:hover {
background-color: #edeeee;
}
-.v-table-row,
-.v-table-body-noselection .v-table-row:hover {
+.#{$primaryStyleName}-row,
+.#{$primaryStyleName}-body-noselection .#{$primaryStyleName}-row:hover {
background-color: #fff;
}
-.v-table-row-odd,
-.v-table-body-noselection .v-table-row-odd:hover {
+.#{$primaryStyleName}-row-odd,
+.#{$primaryStyleName}-body-noselection .#{$primaryStyleName}-row-odd:hover {
background-color: #f6f7f7;
}
-.v-table-generated-row {
+.#{$primaryStyleName}-generated-row {
color: #393a3c;
font-size: 15px;
padding: 9px 2px 9px 0;
text-shadow: #ffffff 0 1px 0;
background: #e7e9ea;
}
-.v-table tr.v-selected {
+.#{$primaryStyleName} tr.v-selected {
background: #57a7ed;
color: #fff;
}
-.v-table-cell-content {
+.#{$primaryStyleName}-cell-content {
padding: 0 6px 0 4px;
border-right: none;
}
-.v-table-cell-wrapper {
+.#{$primaryStyleName}-cell-wrapper {
white-space: nowrap;
overflow: hidden;
line-height: 23px;
@@ -88,40 +88,40 @@ tr.v-table-row-odd:hover {
padding: 3px 0 0 0;
}
/* Fix textfield size to correspond label size inside table */
-.v-table-cell-content .v-textfield,
-.v-table-cell-content .v-button {
+.#{$primaryStyleName}-cell-content .v-textfield,
+.#{$primaryStyleName}-cell-content .v-button {
margin: -3px 0 0 0;
}
-.v-table-cell-content .v-textfield,
-.v-table-cell-content .v-datefield {
+.#{$primaryStyleName}-cell-content .v-textfield,
+.#{$primaryStyleName}-cell-content .v-datefield {
width: 97%; /* approximate */
}
/* ...but not for datefield textarea */
-.v-table-cell-content .v-datefield .v-textfield {
+.#{$primaryStyleName}-cell-content .v-datefield .v-textfield {
width: auto;
}
/* datefield button is too high for table cell */
-.v-table-cell-content .v-datefield-button {
+.#{$primaryStyleName}-cell-content .v-datefield-button {
height: 25px;
margin: -3px 0 0 0;
}
-.v-table-column-selector {
+.#{$primaryStyleName}-column-selector {
background: transparent url(img/colsel.png) no-repeat;
margin: -36px 0 0 0;
height: 36px;
width: 15px;
}
-.v-table-focus-slot-left {
+.#{$primaryStyleName}-focus-slot-left {
border-color: #b6bbbc;
margin-bottom: -36px;
width: auto;
border-right: none;
}
-.v-table-focus-slot-right {
+.#{$primaryStyleName}-focus-slot-right {
border-color: #b6bbbc;
}
-.v-table-header-drag {
+.#{$primaryStyleName}-header-drag {
background: #e7edf3 url(img/header-bg.png) repeat-x;
border: 1px solid #b6bbbc;
padding: 4px;
@@ -130,13 +130,13 @@ tr.v-table-row-odd:hover {
font-size: 15px;
margin-top: 20px;
}
-.v-table-scrollposition {
+.#{$primaryStyleName}-scrollposition {
width: 160px;
height: 39px;
background: transparent url(img/scroll-position-bg.png);
border: none;
}
-.v-table-scrollposition span {
+.#{$primaryStyleName}-scrollposition span {
display: block;
margin-top: 8px;
text-align: center;
@@ -153,52 +153,52 @@ tr.v-table-row-odd:hover {
.v-off div {
text-indent: 6px;
}
-.v-table .v-link {
+.#{$primaryStyleName} .v-link {
display: inline;
}
/* Borderless style */
-.v-table-borderless .v-table-header-wrap,
-.v-table-borderless .v-table-body {
+.#{$primaryStyleName}-borderless .#{$primaryStyleName}-header-wrap,
+.#{$primaryStyleName}-borderless .#{$primaryStyleName}-body {
border: none;
}
-.v-table-borderless .v-table-header-wrap {
+.#{$primaryStyleName}-borderless .#{$primaryStyleName}-header-wrap {
border-bottom: 1px solid #b6bbbc;
}
-.v-table-borderless .v-table-body {
+.#{$primaryStyleName}-borderless .#{$primaryStyleName}-body {
background: transparent;
}
-.v-table-borderless .v-table-row,
-.v-table-borderless .v-table-row-odd,
-.v-table-borderless .v-table-body-noselection .v-table-row:hover,
-.v-table-borderless .v-table-body-noselection .v-table-row-odd:hover {
+.#{$primaryStyleName}-borderless .#{$primaryStyleName}-row,
+.#{$primaryStyleName}-borderless .#{$primaryStyleName}-row-odd,
+.#{$primaryStyleName}-borderless .#{$primaryStyleName}-body-noselection .#{$primaryStyleName}-row:hover,
+.#{$primaryStyleName}-borderless .#{$primaryStyleName}-body-noselection .#{$primaryStyleName}-row-odd:hover {
background-color: transparent;
}
/* Small style */
-.v-table-small .v-table-header-wrap,
-.v-table-small .v-table-header {
+.#{$primaryStyleName}-small .#{$primaryStyleName}-header-wrap,
+.#{$primaryStyleName}-small .#{$primaryStyleName}-header {
height: 22px;
}
-.v-table-small .v-table-sort-indicator,
-.v-table-small .v-table-header-cell-asc .v-table-sort-indicator,
-.v-table-small .v-table-header-cell-desc .v-table-sort-indicator {
+.#{$primaryStyleName}-small .#{$primaryStyleName}-sort-indicator,
+.#{$primaryStyleName}-small .#{$primaryStyleName}-header-cell-asc .#{$primaryStyleName}-sort-indicator,
+.#{$primaryStyleName}-small .#{$primaryStyleName}-header-cell-desc .#{$primaryStyleName}-sort-indicator {
height: 22px;
}
-.v-table-small .v-table-caption-container {
+.#{$primaryStyleName}-small .#{$primaryStyleName}-caption-container {
font-size: 13px;
padding-top: 3px;
padding-bottom: 3px;
}
-.v-table-small .v-table-column-selector {
+.#{$primaryStyleName}-small .#{$primaryStyleName}-column-selector {
margin-top: -21px;
height: 21px;
}
-.v-table-small .v-table-body {
+.#{$primaryStyleName}-small .#{$primaryStyleName}-body {
font-size: 12px;
}
-.v-table-small .v-table-cell-wrapper {
+.#{$primaryStyleName}-small .#{$primaryStyleName}-cell-wrapper {
line-height: 18px;
padding: 2px 0;
}