diff options
Diffstat (limited to 'WebContent/VAADIN/themes/reindeer/table/table.scss')
-rw-r--r-- | WebContent/VAADIN/themes/reindeer/table/table.scss | 293 |
1 files changed, 293 insertions, 0 deletions
diff --git a/WebContent/VAADIN/themes/reindeer/table/table.scss b/WebContent/VAADIN/themes/reindeer/table/table.scss new file mode 100644 index 0000000000..cb190e1f30 --- /dev/null +++ b/WebContent/VAADIN/themes/reindeer/table/table.scss @@ -0,0 +1,293 @@ +@mixin reindeer-table { + +/* Table on blue background */ +.blue .v-table-header-wrap { + border-color: #92a2aa; +} +.blue .v-table-body { + border-color: #92a2aa; + border-top-color: #c2c3c4; +} + +/* Default & white style */ +.v-table-header-wrap, +.white .v-table-header-wrap, +.v-table-footer-wrap, +.white .v-table-footer-wrap, +.v-table-header-drag { + border-color: #c2c3c4; + background: transparent repeat-x; + background-image: url(img/header-bg-light.png); /** sprite-ref: verticals; sprite-alignment: repeat */ + height: 20px; + text-transform: uppercase; + font-size: 10px; + font-weight: bold; + color: #222; + text-shadow: #f3f5f8 0 1px 0; + line-height: normal; +} + +.v-table-footer-wrap, +.white .v-table-footer-wrap { + text-transform: none; + font-size: 12px; + font-weight: normal; +} + +.v-table-footer td, +.white .v-table-footer td { + border-color: #c2c3c4; +} + +.v-table-footer-container { + padding-right: 7px; +} + + +.v-table-header, +.v-table-footer, +.v-table-footer table { + height: 20px; +} + +.v-table-caption-container, +.v-table-header-drag { + padding-top: 4px; + padding-right: 4px; +} +.v-table-caption-container .v-icon, +.v-table-header-drag .v-icon { + height: 16px; + margin: -4px 3px 0 0; + vertical-align: middle; +} +.v-ie .v-table-caption-container .v-icon, +.v-ie .v-table-header-drag .v-icon { + margin-top: -3px; +} +.v-table-resizer { + height: 20px; + width: 2px; + background: transparent; + border-right: 1px solid #c2c3c4; +} + +.v-table-sort-indicator { + background: transparent; + width: 0px; + height: 20px; +} + +.v-table-header-cell-asc .v-table-sort-indicator { + background: transparent no-repeat right 7px; + background-image: url(img/asc-light.png); /** sprite-ref: verticals; sprite-alignment: right; sprite-margin-top: 7px; sprite-margin-bottom: 6px; sprite-margin-right: 6px; */ + width: 16px; +} +.v-table-header-cell-desc .v-table-sort-indicator { + background: transparent no-repeat right 7px; + background-image: url(img/desc-light.png); /** sprite-ref: verticals; sprite-alignment: right; sprite-margin-top: 7px; sprite-margin-bottom: 6px; sprite-margin-right: 6px; */ + width: 16px; +} +.v-table-body, +.white .v-table-body { + border-color: #c2c3c4; + background: #fff; +} +.v-table-cell-content { + padding-top: 0; + border-right-color: #d3d4d5; + vertical-align: top; +} +.v-table-cell-wrapper { + padding-top: 3px; + padding-bottom: 3px; +} +.v-table-row-odd { + background: #eff0f1; +} +.v-table-generated-row { + background: #dcdee0; + text-transform: uppercase; + font-size: 10px; + font-weight: bold; + color: #222; + text-shadow: #f3f5f8 0 1px 0; + line-height: normal; +} +.v-table-generated-row .v-table-cell-wrapper { + padding-top: 4px; + padding-bottom: 5px; +} +.v-table-cell-content:last-child { + border-right-color: transparent; +} +.v-table .v-selected, +.black .v-table .v-selected { + background: #4d749f url(../common/img/sel-bg.png) repeat-x; /* We can't include this in the sprite, since we don't know the row height */ + color: #fff; + text-shadow: #3b5a7a 0 1px 0; +} +.v-table .v-selected .v-table-cell-content { + border-right-color: #466c90; +} +.v-table-column-selector { + width: 16px; + height: 20px; + margin-top: -20px; + background: transparent no-repeat; + background-image: url(img/col-sel-light.png); /** sprite-ref: verticals */ +} +.v-table-column-selector:active { + background-image: url(img/col-sel-light-pressed.png); /** sprite-ref: verticals */ +} +.v-table-focus-slot-left { + border-left: 1px solid #222; + margin-bottom: -20px; + width: auto; +} +.v-table-focus-slot-right { + border-right-color: #222; + margin-right: 0; +} +.v-table-header-drag { + padding-left: 6px; + height: 16px; +} +.v-table-header-drag img { + height: 16px; + margin: -3px 3px 0 0; +} +.v-table-scrollposition { + width: auto; + background: transparent; + border: none; +} +.v-table-scrollposition span { + background: transparent repeat-x; + background-image: url(img/scroll-indic-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */ + border: 1px solid #939494; + border: none; + border-radius-bottomleft: 4px; + border-radius-bottomright: 4px; + -moz-border-radius-bottomleft: 4px; + -moz-border-radius-bottomright: 4px; + -webkit-border-bottom-left-radius: 4px; + -webkit-border-bottom-right-radius: 4px; + height: 13px; + padding: 4px 30px; + white-space: nowrap; + color: #222; + text-shadow: #fff 0 1px 0; + position: relative; + top: 1px; + -webkit-box-shadow: rgba(0,0,0,.5) 0 1px 2px; + -moz-box-shadow: rgba(0,0,0,.5) 0 1px 2px; +} +.v-table-borderless .v-table-scrollposition span { + top: 0; +} +/* row in column selector */ +.v-contextmenu .v-on, +.v-contextmenu .v-off { + display: inline-block; + zoom: 1; + background: transparent no-repeat 0 4px; + background-image: url(../common/icons/bullet.png); /** sprite-ref: verticals; sprite-margin-top: 4px; sprite-margin-bottom: 4px */ + padding-left: 12px; + padding-right: 4px; +} +.v-contextmenu .v-off { + background-image: none; + color: #666; +} +.v-contextmenu .gwt-MenuItem-selected .v-on { + background-image: url(../common/icons/bullet-white.png); /** sprite-ref: verticals; sprite-margin-top: 4px; sprite-margin-bottom: 5px */ +} + + +/* Strong style */ +.v-table-strong .v-table-header-wrap, +.v-table-strong .v-table-header-drag { + border-color: #2b3033; + border-top-color: #2b3033; + background-image: url(img/header-bg.png); /** sprite-ref: verticals; sprite-alignment: repeat */ + color: #e7e9ea; + text-shadow: #000 0 -1px 0; +} +.v-table-strong .v-table-body { + border-top-color: #2b3033; +} +.v-table-strong .v-table-resizer { + border-right-color: #1c1f21; +} +.v-table-strong .v-table-header-cell-asc .v-table-sort-indicator { + background-image: url(img/asc.png); /** sprite-ref: verticals; sprite-alignment: right; sprite-margin-top: 7px; sprite-margin-bottom: 6px; sprite-margin-right: 6px; */ +} +.v-table-strong .v-table-header-cell-desc .v-table-sort-indicator { + background-image: url(img/desc.png); /** sprite-ref: verticals; sprite-alignment: right; sprite-margin-top: 7px; sprite-margin-bottom: 6px; sprite-margin-right: 6px; */ +} +.v-table-strong .v-table-column-selector { + background-image: url(img/col-sel.png); /** sprite-ref: verticals */ +} +.v-table-strong .v-table-column-selector:active { + background-image: url(img/col-sel-pressed.png); /** sprite-ref: verticals */ +} +.v-table-strong .v-table-focus-slot-left, +.v-table-strong .v-table-focus-slot-right { + border-color: #9ca1a5; +} + + +/* Table on black background (normal style) */ +.black .v-table-header-wrap, +.black .v-table-header-drag { + border-color: #252729; + background-image: url(img/header-bg-black.png); /** sprite-ref: black-verticals; sprite-alignment: repeat */ + color: #e7eaee; + text-shadow: #000 0 -1px 0; +} +.black .v-table-resizer { + border-right-color: #252729; +} +.black .v-table-header-cell-asc .v-table-sort-indicator { + background-image: url(img/asc.png); /** sprite-ref: black-verticals; sprite-alignment: right; sprite-margin-top: 7px; sprite-margin-bottom: 6px; sprite-margin-right: 6px; */ +} +.black .v-table-header-cell-desc .v-table-sort-indicator { + background-image: url(img/desc.png); /** sprite-ref: black-verticals; sprite-alignment: right; sprite-margin-top: 7px; sprite-margin-bottom: 6px; sprite-margin-right: 6px; */ +} +.black .v-table-column-selector { + background-image: url(img/col-sel-black.png); /** sprite-ref: black-verticals */ +} +.black .v-table-column-selector:active { + background-image: url(img/col-sel-black-pressed.png); /** sprite-ref: black-verticals */ +} +.black .v-table-focus-slot-left, +.black .v-table-focus-slot-right { + border-color: #9ca1a5; +} +.black .v-table-body { + border-color: #252729; + background: transparent; +} +.black .v-table-cell-content { + border-right-color: #252729; + border-bottom: 1px solid #252729; +} +.black .v-table-cell-wrapper { + padding-bottom: 2px; +} +.black .v-table-row-odd { + background: transparent; +} +/* Selection background-color combined with the default (white) style selector, so we don't have to duplicate the sprite image in the final sprite collection */ +.black .v-table .v-selected .v-table-cell-content { + border-bottom: 1px solid #4d749f; +} + +/* Borderless style */ +.v-table-borderless .v-table-header-wrap, +.v-table-borderless .v-table-body { + border: none; +} + +}
\ No newline at end of file |