diff options
Diffstat (limited to 'WebContent/VAADIN/themes/valo')
18 files changed, 123 insertions, 74 deletions
diff --git a/WebContent/VAADIN/themes/valo/components/_accordion.scss b/WebContent/VAADIN/themes/valo/components/_accordion.scss index 91ce4efe33..40ab29f862 100644 --- a/WebContent/VAADIN/themes/valo/components/_accordion.scss +++ b/WebContent/VAADIN/themes/valo/components/_accordion.scss @@ -2,7 +2,7 @@ * Outputs the selectors and properties for the Accordion component. * * @param {string} $primary-stylename (v-accordion) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * @group accordion */ @mixin valo-accordion ($primary-stylename: v-accordion, $include-additional-styles: contains($v-included-additional-styles, accordion)) { diff --git a/WebContent/VAADIN/themes/valo/components/_button.scss b/WebContent/VAADIN/themes/valo/components/_button.scss index eb57e20d2a..b1b16f5bde 100644 --- a/WebContent/VAADIN/themes/valo/components/_button.scss +++ b/WebContent/VAADIN/themes/valo/components/_button.scss @@ -2,7 +2,7 @@ * Outputs the selectors and properties for the Button component. * * @param {string} $primary-stylename (v-button) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * * @group button */ @@ -164,7 +164,7 @@ /** * Outputs the styles for a button variant. * - * @param {size} $unit-size ($v-unit-size) - The sizing of the button, which corresponds its height + * @param {size} $unit-size ($v-unit-size) - The sizing of the button, which corresponds its height * @param {size | list} $padding (null) - The padding of the button. Computed from other parameters by default. * @param {color} $font-color (null) - The font color of the button. Computed from the $background-color by default. * @param {number} $font-weight ($v-font-weight + 100) - The font weight of the button @@ -349,7 +349,7 @@ * Output styles for a borderless button. Expects that the targeted element * already has both valo-button-static-style and valo-button-style included. * - * @param {color} $font-color (inherit) - The font color of the borderless button + * @param {color} $font-color (inherit) - The font color of the borderless button * * @group button */ diff --git a/WebContent/VAADIN/themes/valo/components/_checkbox.scss b/WebContent/VAADIN/themes/valo/components/_checkbox.scss index 7ad08ad74d..3c418ec9b7 100644 --- a/WebContent/VAADIN/themes/valo/components/_checkbox.scss +++ b/WebContent/VAADIN/themes/valo/components/_checkbox.scss @@ -2,7 +2,7 @@ * Outputs the selectors and properties for the CheckBox component. * * @param {string} $primary-stylename (v-checkbox) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * * @group checkbox */ @@ -43,8 +43,8 @@ * Outputs the styles for a checkbox variant. * * @param {color} $background-color ($v-background-color) - The background color of the checkbox - * @param {size} $unit-size ($v-unit-size) - The sizing of the checkbox. The width and height of the checkbox will be the unit-size divided by 2. - * @param {color} $selection-color ($v-selection-color) - The color of the checked state icon + * @param {size} $unit-size ($v-unit-size) - The sizing of the checkbox. The width and height of the checkbox will be the unit-size divided by 2. + * @param {color} $selection-color ($v-selection-color) - The color of the checked state icon * * @group checkbox */ diff --git a/WebContent/VAADIN/themes/valo/components/_combobox.scss b/WebContent/VAADIN/themes/valo/components/_combobox.scss index 79107eb0d1..f84faef603 100644 --- a/WebContent/VAADIN/themes/valo/components/_combobox.scss +++ b/WebContent/VAADIN/themes/valo/components/_combobox.scss @@ -2,7 +2,7 @@ * Outputs the selectors and properties for the ComboBox component. * * @param {string} $primary-stylename (v-filterselect) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * * @group combobox */ @@ -93,7 +93,7 @@ /** * Outputs the styles for a combobox variant. * - * @param {size} $unit-size ($v-unit-size) - The sizing of the combobox, which corresponds its height + * @param {size} $unit-size ($v-unit-size) - The sizing of the combobox, which corresponds its height * @param {color} $font-color (null) - The font color of the combobox. Computed from the $background-color by default. * @param {number} $font-weight (max(400, $v-font-weight)) - The font weight of the combobox * @param {size} $font-size (null) - The font size of the combobox. Inherited from the parent by default. @@ -201,7 +201,7 @@ /** * Outputs the styles for a combobox variant input element. * - * @param {size} $unit-size ($v-unit-size) - The sizing of the input (affects the padding only, width and height are 100%) + * @param {size} $unit-size ($v-unit-size) - The sizing of the input (affects the padding only, width and height are 100%) * @param {size | list} $padding (null) - The padding of the input. Computed from other parameters by default. * @param {color} $font-color (null) - The font color of the input. Computed from the $background-color by default. * @param {number} $font-weight (null) - The font weight of the input. Inherited from the parent by default. @@ -257,7 +257,7 @@ /** * Outputs the styles for a combobox variant button element. * - * @param {size} $unit-size ($v-unit-size) - The sizing of the button, which corresponds its width. + * @param {size} $unit-size ($v-unit-size) - The sizing of the button, which corresponds its width. * @param {list} $bevel ($v-textfield-bevel) - Box-shadow value according to $v-bevel documentation * @param {color} $background-color ($v-textfield-background-color) - The background color of the input, which affects the font color of the button * @param {size} $border-radius ($v-textfield-border-radius) - The border-radius of the input, which affects the border-radius of the button diff --git a/WebContent/VAADIN/themes/valo/components/_csslayout.scss b/WebContent/VAADIN/themes/valo/components/_csslayout.scss index 3525bcad5a..c06d3c2441 100644 --- a/WebContent/VAADIN/themes/valo/components/_csslayout.scss +++ b/WebContent/VAADIN/themes/valo/components/_csslayout.scss @@ -11,7 +11,7 @@ $v-component-group-spacing: null !default; * Outputs the additional styles for the CssLayout component. Does not produce any other output. * * @param {string} $primary-stylename (v-csslayout) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * * @group csslayout */ diff --git a/WebContent/VAADIN/themes/valo/components/_datefield.scss b/WebContent/VAADIN/themes/valo/components/_datefield.scss index 71b50b5a77..3201288120 100644 --- a/WebContent/VAADIN/themes/valo/components/_datefield.scss +++ b/WebContent/VAADIN/themes/valo/components/_datefield.scss @@ -2,7 +2,7 @@ * Outputs the selectors and properties for the DateField component. * * @param {string} $primary-stylename (v-datefield) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * * @group datefield */ @@ -120,7 +120,7 @@ * * @param {list} $bevel ($v-textfield-bevel) - Box-shadow value according to $v-bevel documentation * @param {list} $shadow ($v-textfield-shadow) - Box-shadow value according to $v-shadow documentation - * @param {size} $unit-size ($v-unit-size) - The sizing of the datefield, which corresponds its height + * @param {size} $unit-size ($v-unit-size) - The sizing of the datefield, which corresponds its height * @param {list} $border ($v-textfield-border) - The border of the datefield * @param {size} $border-radius ($v-textfield-border-radius) - The border-radius of the datefield * @param {color} $background-color ($v-textfield-background-color) - The background color of the datefield @@ -189,7 +189,7 @@ /** * Outputs the styles for a date field variant button element. * - * @param {size} $unit-size ($v-unit-size) - The sizing of the button, which corresponds its width. + * @param {size} $unit-size ($v-unit-size) - The sizing of the button, which corresponds its width. * @param {list} $bevel ($v-textfield-bevel) - Box-shadow value according to $v-bevel documentation * @param {color} $background-color ($v-textfield-background-color) - The background color of the input, which affects the font color of the button * @param {size} $border-radius ($v-textfield-border-radius) - The border-radius of the input, which affects the border-radius of the button diff --git a/WebContent/VAADIN/themes/valo/components/_formlayout.scss b/WebContent/VAADIN/themes/valo/components/_formlayout.scss index da3d0b987f..35627ebd79 100644 --- a/WebContent/VAADIN/themes/valo/components/_formlayout.scss +++ b/WebContent/VAADIN/themes/valo/components/_formlayout.scss @@ -2,7 +2,7 @@ * Outputs the selectors and properties for the FormLayout component. * * @param {string} $primary-stylename (v-formlayout) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * * @group formlayout */ @@ -51,6 +51,8 @@ > .v-label-h4 { position: absolute; left: 0; + right: 0; + width: auto !important; margin-top: -0.5em; padding-bottom: 0.5em; border-bottom: valo-border($color: $v-app-background-color, $strength: 0.5); @@ -85,17 +87,17 @@ $right: $margin; $bottom: $margin; $left: $margin; - } @else if length($margin) == 2 { + } @else if length($margin) == 2 { $top: nth($margin, 1); $right: nth($margin, 2); $bottom: nth($margin, 1); $left: nth($margin, 2); - } @else if length($margin) == 3 { + } @else if length($margin) == 3 { $top: nth($margin, 1); $right: nth($margin, 2); $bottom: nth($margin, 3); $left: nth($margin, 2); - } @else if length($margin) == 4 { + } @else if length($margin) == 4 { $top: nth($margin, 1); $right: nth($margin, 2); $bottom: nth($margin, 3); @@ -114,8 +116,22 @@ padding-left: $left; } + [class*="margin-left"] > tbody > [class*="row"] > [class*="contentcell"] { + > .v-label-h2, + > .v-label-h3, + > .v-label-h4 { + left: $left; + } + } + [class*="margin-right"] > tbody > [class*="row"] > [class*="contentcell"] { padding-right: $right; + + > .v-label-h2, + > .v-label-h3, + > .v-label-h4 { + right: $right; + } } } @@ -141,7 +157,7 @@ /** * Outputs the styles for a light style form layout. This mixin expects the target to have the normal styles of a form layout applied. * - * @param {size} $row-height ($v-unit-size) - The height of an individual form layout row + * @param {size} $row-height ($v-unit-size) - The height of an individual form layout row * * @group formlayout */ @@ -150,7 +166,7 @@ padding: 0; } - > table > tbody > [class*="row"] > td { + > table > tbody > tr > td { padding-top: 0; height: $row-height; // Effectively min-height border-bottom: valo-border($color: $v-app-background-color, $strength: 0.3); @@ -160,7 +176,7 @@ border-bottom: none; } - > table > tbody > [class*="row"] > [class*="captioncell"] { + > table > tbody > tr > [class*="captioncell"] { color: valo-font-color($v-background-color, .5); text-align: right; padding-left: ceil($v-unit-size/3); @@ -168,6 +184,8 @@ } > table > tbody > [class*="row"] > [class*="contentcell"] { + padding-right: 0; + > .v-textfield, > .v-textarea, > .v-filterselect, @@ -208,6 +226,8 @@ > .v-label-h3, > .v-label-h4 { border-bottom: none; + left: 0; + right: 0; } > .v-label-h3, diff --git a/WebContent/VAADIN/themes/valo/components/_label.scss b/WebContent/VAADIN/themes/valo/components/_label.scss index b59d3e0e21..cfec847271 100644 --- a/WebContent/VAADIN/themes/valo/components/_label.scss +++ b/WebContent/VAADIN/themes/valo/components/_label.scss @@ -101,7 +101,7 @@ $v-letter-spacing--h4: 0 !default; * Outputs the selectors and styles for the Label component. * * @param {string} $primary-stylename (v-label) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * * @group label */ diff --git a/WebContent/VAADIN/themes/valo/components/_table.scss b/WebContent/VAADIN/themes/valo/components/_table.scss index d8a673294d..a70532ccfd 100644 --- a/WebContent/VAADIN/themes/valo/components/_table.scss +++ b/WebContent/VAADIN/themes/valo/components/_table.scss @@ -612,7 +612,7 @@ $v-table-background-color: null !default; * @group table */ @mixin valo-table-sort-asc-icon-style { - content: '\f0dd'; + content: '\f0de'; font-family: FontAwesome; } @@ -623,7 +623,7 @@ $v-table-background-color: null !default; * @group table */ @mixin valo-table-sort-desc-icon-style { - content: '\f0de'; + content: '\f0dd'; font-family: FontAwesome; } diff --git a/WebContent/VAADIN/themes/valo/components/_tabsheet.scss b/WebContent/VAADIN/themes/valo/components/_tabsheet.scss index 7dafbe4624..bb3e55042a 100644 --- a/WebContent/VAADIN/themes/valo/components/_tabsheet.scss +++ b/WebContent/VAADIN/themes/valo/components/_tabsheet.scss @@ -63,7 +63,7 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; * Outputs the selectors and properties for the TabSheet component. * * @param {string} $primary-stylename (v-tabsheet) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * * @group tabsheet */ @@ -208,6 +208,7 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; overflow: hidden; text-overflow: ellipsis; border-bottom: max(1px, first-number($v-border))*2 solid transparent; + position: relative; @if $v-animations-enabled { @include transition(border-bottom 200ms, color 200ms); @@ -229,7 +230,6 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; @include opacity($v-disabled-opacity); cursor: default; color: inherit !important; - border-bottom: none; } } @@ -251,14 +251,23 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; color: $v-selection-color; } + .v-caption-closable { + padding-right: round($v-unit-size/10) + round($v-font-size * 1.1); + } + + &.icons-on-top .v-caption-closable { + padding-right: round($v-unit-size/10); + } + .#{$primary-stylename}-caption-close { - display: inline-block; + position: absolute; + right: 0; + top: 50%; + margin: round($v-font-size / -2) 0 0; font-size: round($v-font-size * 1.1); line-height: round($v-font-size * 1.1); width: round($v-font-size * 1.1); - vertical-align: middle; text-align: center; - margin: 0 round($v-font-size/-4) 0 round($v-font-size/2); border-radius: round($v-border-radius/2); color: valo-font-color($v-app-background-color, 0.4); @@ -388,7 +397,7 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; /** * Outputs the styles for the framed tabsheet style. * - * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors + * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors * @param {bool} $frame-inactive-tabs (true) - Should inactive tabs be framed as well (the active tab is always framed with this style) * @param {bool} $outer-frame (true) - Should the frame contain the whole tabsheet (i.e. tabbar and tab content). If false, works like a "borderless" style. * @param {size} $tab-spacing ($v-unit-size/10) - The spacing between tabs @@ -398,9 +407,9 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; @mixin valo-tabsheet-framed-style ($primary-stylename: v-tabsheet, $frame-inactive-tabs: true, $outer-frame: true, $tab-spacing: round($v-unit-size/10)) { > .#{$primary-stylename}-tabcontainer { .v-caption { - position: relative; margin-left: $tab-spacing or first-number($v-border) * -1; padding: 0 $v-layout-spacing-horizontal; + background-color: $v-app-background-color; border: first-number($v-border) solid transparent; line-height: $v-unit-size - first-number($v-border); border-radius: $v-border-radius $v-border-radius 0 0; @@ -414,6 +423,20 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; background-color: darken($v-app-background-color, 3%); border-bottom-color: first-color(valo-border($color: $v-app-background-color, $strength: 0.5)); } + + &.v-disabled:hover { + background-color: $v-app-background-color; + } + } + + .v-caption-closable { + padding-right: $v-layout-spacing-horizontal + round($v-font-size * 1.1); + } + + .#{$primary-stylename}-caption-close { + top: round($v-font-size/4); + right: round($v-font-size/4); + margin-top: 0; } td:first-child .v-caption, @@ -433,17 +456,6 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; border-bottom: none; padding-bottom: first-number($v-border); } - - .v-caption-closable { - padding-right: $v-layout-spacing-horizontal + round($v-font-size * 1.1); - } - - .#{$primary-stylename}-caption-close { - position: absolute; - top: round($v-font-size/4); - right: round($v-font-size/4); - margin: 0; - } } > .#{$primary-stylename}-content { @@ -471,8 +483,10 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; } } - &.icons-on-top .v-caption-closable { - padding-right: $v-layout-spacing-horizontal; + &.icons-on-top { + > .#{$primary-stylename}-tabcontainer .#{$primary-stylename}-tabitem-selected .v-caption { + padding-bottom: round($v-unit-size/6) + first-number($v-border); + } } } @@ -480,8 +494,8 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; /** * Outputs the styles for a tabsheet where the tabs are aligned to the position specified by the parameter in the tabbar. * - * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors - * @param {string} $align (center) - The alignment of the tabs inside the tabbar. Possible values: left, right, center. + * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors + * @param {string} $align (center) - The alignment of the tabs inside the tabbar. Possible values: left, right, center. * * @group tabsheet */ @@ -495,7 +509,7 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; /** * Outputs the styles for a tabsheet where all tabs in the tabbar have equal width and span the entire width of the tabbar. * - * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors + * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors * @param {bool} $flex (false) - Should the size of the tabs be proportional to their content, i.e. should the available space in the tabbar be distributed to the tabs in relation to their content sizes. * * @group tabsheet @@ -530,22 +544,18 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; /** * Outputs the styles for a tabsheet where the icons of individual tabs are on top of the tab captions. * - * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors + * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors * * @group tabsheet */ @mixin valo-tabsheet-icons-on-top-style ($primary-stylename: v-tabsheet) { - > div > .#{$primary-stylename}-tabs { + > .#{$primary-stylename}-tabcontainer { .v-caption { padding-top: round($v-unit-size/6); padding-bottom: round($v-unit-size/6); line-height: 1.2; } - .#{$primary-stylename}-tabitem-selected .v-caption { - padding-bottom: round($v-unit-size/6) + first-number($v-border); - } - .v-icon { display: block; @@ -553,6 +563,15 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; margin-left: 0; } } + + .v-caption-closable { + padding-right: $v-layout-spacing-horizontal; + } + + .#{$primary-stylename}-caption-close { + top: round($v-font-size/4); + margin-top: 0; + } } } @@ -561,7 +580,7 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; * Outputs the styles for a tabsheet where only the selected tab has the close button visible. * Note that the other tabs can still be closed programmatically. * - * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors + * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors * * @group tabsheet */ @@ -580,7 +599,7 @@ $v-tabsheet-content-animation-enabled: $v-animations-enabled !default; * Outputs the styles for a tabsheet where the tabbar has increased padding to separate the tabs * inside it from their surrounding container. * - * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors + * @param {string} $primary-stylename (v-tabsheet) - The primary style name for the selectors * * @group tabsheet */ diff --git a/WebContent/VAADIN/themes/valo/components/_textarea.scss b/WebContent/VAADIN/themes/valo/components/_textarea.scss index ffd5ba855a..d600bc14c2 100644 --- a/WebContent/VAADIN/themes/valo/components/_textarea.scss +++ b/WebContent/VAADIN/themes/valo/components/_textarea.scss @@ -2,7 +2,7 @@ * Outputs the selectors and properties for the TextArea component. * * @param {string} $primary-stylename (v-textarea) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * * @group textarea */ @@ -62,7 +62,7 @@ /** * Outputs the styles for a text area variant. * - * @param {size} $unit-size ($v-unit-size) - The sizing of the text area, which corresponds its height + * @param {size} $unit-size ($v-unit-size) - The sizing of the text area, which corresponds its height * @param {size | list} $padding (null) - The padding of the text area. Computed from other parameters by default. * @param {color} $font-color (null) - The font color of the text area. Computed from the $background-color by default. * @param {number} $font-weight (max(400, $v-font-weight)) - The font weight of the text area diff --git a/WebContent/VAADIN/themes/valo/components/_textfield.scss b/WebContent/VAADIN/themes/valo/components/_textfield.scss index f4ca3538bd..58f69e5e4c 100644 --- a/WebContent/VAADIN/themes/valo/components/_textfield.scss +++ b/WebContent/VAADIN/themes/valo/components/_textfield.scss @@ -51,7 +51,7 @@ $v-textfield-disabled-opacity: $v-disabled-opacity !default; * Outputs the selectors and properties for the TextField component. * * @param {string} $primary-stylename (v-textfield) - the primary style name for the selectors - * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component + * @param {bool} $include-additional-styles - should the mixin output all the different style variations of the component * * @group textfield */ @@ -122,7 +122,7 @@ $v-textfield-disabled-opacity: $v-disabled-opacity !default; /** * Outputs the styles for a text field variant. * - * @param {size} $unit-size ($v-unit-size) - The sizing of the text field, which corresponds its height + * @param {size} $unit-size ($v-unit-size) - The sizing of the text field, which corresponds its height * @param {size | list} $padding (null) - The padding of the text field. Computed from other parameters by default. * @param {color} $font-color (null) - The font color of the text field. Computed from the $background-color by default. * @param {number} $font-weight (max(400, $v-font-weight)) - The font weight of the text field @@ -254,7 +254,7 @@ $v-textfield-disabled-opacity: $v-disabled-opacity !default; * @param {list} $bevel ($v-textfield-bevel) - Box-shadow value according to $v-bevel documentation * @param {list} $shadow ($v-textfield-shadow) - Box-shadow value according to $v-shadow documentation * @param {color} $background-color ($v-textfield-background-color) - The background color of the text field - * @param {list} $gradient (null) - Valo specific gradient value. See the documentation for $v-gradient. + * @param {list} $gradient (null) - Valo specific gradient value. See the documentation for $v-gradient. * * @group textfield */ @@ -341,7 +341,7 @@ $v-textfield-disabled-opacity: $v-disabled-opacity !default; * @param {string | list} $stylenames (inline-icon) - The additional style names which will define the inline-icon style * @param {string} $input-selector (null) - Additional selector for a nested input element which should be targeted * @param {size} $unit-size ($v-unit-size) - The unit size which the resulting style will support - * @param {size} $font-size ($v-font-size) - The font size which the resulting style will support (needed for font icons) + * @param {size} $font-size ($v-font-size) - The font size which the resulting style will support (needed for font icons) * @param {size} $image-icon-size (16px) - The image icon height which the resulting style will support (needed to center the icon vertically inside the text field) * * @group text field diff --git a/WebContent/VAADIN/themes/valo/components/_treetable.scss b/WebContent/VAADIN/themes/valo/components/_treetable.scss index e025df2bc9..60b696315b 100644 --- a/WebContent/VAADIN/themes/valo/components/_treetable.scss +++ b/WebContent/VAADIN/themes/valo/components/_treetable.scss @@ -14,6 +14,12 @@ padding-left: 0; padding-right: 0; } + + [class*="caption-container"], + [class*="footer-container"] { + $vertical-padding: round(($v-table-row-height - $v-table-header-font-size)/2); + min-height: $v-table-row-height - $vertical-padding - ($vertical-padding - $v-table-border-width); + } [class*="cell-wrapper"] { min-height: $v-font-size; diff --git a/WebContent/VAADIN/themes/valo/components/_upload.scss b/WebContent/VAADIN/themes/valo/components/_upload.scss index c301be060a..07a51f03ef 100644 --- a/WebContent/VAADIN/themes/valo/components/_upload.scss +++ b/WebContent/VAADIN/themes/valo/components/_upload.scss @@ -1,7 +1,7 @@ /** * * - * @param {string} $primary-stylename (v-upload) - + * @param {string} $primary-stylename (v-upload) - * * @group upload */ @@ -10,6 +10,10 @@ @include valo-widget-style; } + .#{$primary-stylename}-immediate .v-button { + width: 100%; + } + .#{$primary-stylename}-immediate input[type="file"] { @include opacity(0); z-index: 2; @@ -20,4 +24,4 @@ border: none; background: transparent; } -}
\ No newline at end of file +} diff --git a/WebContent/VAADIN/themes/valo/util/_bevel-and-shadow.scss b/WebContent/VAADIN/themes/valo/util/_bevel-and-shadow.scss index 346a50c9de..1065161bfc 100644 --- a/WebContent/VAADIN/themes/valo/util/_bevel-and-shadow.scss +++ b/WebContent/VAADIN/themes/valo/util/_bevel-and-shadow.scss @@ -3,7 +3,7 @@ * * @group style * - * @param {list} $border ($v-border) - CSS border value which can contain any of the color keywords + * @param {list} $border ($v-border) - CSS border value which can contain any of the color keywords * @param {color} $color ($v-background-color) - the base color to which the color keywords are applied to * @param {color} $context (null) - context/surrounding color where the border is expected to appear. The color of the final border is the darker of the two parameters passed to this function. * @param {number} $strength (1) - adjustment for the border contrast @@ -59,7 +59,7 @@ * * @group style * - * @param {list} $border ($v-border) - CSS border value which can contain any of the color keywords + * @param {list} $border ($v-border) - CSS border value which can contain any of the color keywords * @param {color} $color ($v-background-color) - the base color to which the color keywords are applied to * @param {color} $context (null) - context/surrounding color where the border is expected to appear. The color of the final border is the darker of the two parameters passed to this function. * @param {number} $strength (1) - adjustment for the border contrast @@ -88,8 +88,8 @@ * @param {number} $bevel-depth ($v-bevel-depth) - percentage defining the depth/amount of the bevel effect. Affects the color keywords specified in the $bevel parameter. * @param {list} $shadow (null) - box-shadow value according to $v-shadow documentation * @param {number} $shadow-opacity ($v-shadow-opacity) - percentage defining the opacity/amount of the shadow effect. Affects the color keywords specified in the $shadow parameter. - * @param {color} $background-color ($v-background-color) - the base color to which the color keywords are applied to - * @param {list} $gradient (null) - Valo specific gradient value. See the documentation for $v-gradient. Affects the color keywords specified in the $bevel parameter. + * @param {color} $background-color ($v-background-color) - the base color to which the color keywords are applied to + * @param {list} $gradient (null) - Valo specific gradient value. See the documentation for $v-gradient. Affects the color keywords specified in the $bevel parameter. * @param {bool} $include-focus (false) - should the box-shadow value include $v-focus-style as well (only added if $v-focus-style is a) * * @return {list} CSS box-shadow value, combined from $bevel and $shadow with all occurences of v-tint, v-shade and v-tone color keywords replaced with the corresponding actual color @@ -160,7 +160,7 @@ * * @param {list} $list - any CSS list with possible color keywords * @param {color} $color - The color to which color keywords are applied to - * @param {list} $gradient (null) - Valo specific gradient value. See the documentation for $v-gradient. Affects the replacement colors to accommodate the gradient. + * @param {list} $gradient (null) - Valo specific gradient value. See the documentation for $v-gradient. Affects the replacement colors to accommodate the gradient. * * @return {list} The input $list parameter with all occurences of v-tint, v-shade and v-tone color keywords replaced with the corresponding actual color */ diff --git a/WebContent/VAADIN/themes/valo/util/_gradient.scss b/WebContent/VAADIN/themes/valo/util/_gradient.scss index 99490046ba..a38dca704c 100644 --- a/WebContent/VAADIN/themes/valo/util/_gradient.scss +++ b/WebContent/VAADIN/themes/valo/util/_gradient.scss @@ -5,7 +5,7 @@ * * @param {color} $color ($v-background-color) - The base color for the gradient color stops * @param {list} $gradient ($v-gradient) - Valo-specific gradient value. See the documentation for $v-gradient. - * @param {color} $fallback (null) - A fallback color for browser which do not support linear gradients (IE8 and IE9 in particular). If null, the base $color is used instead. + * @param {color} $fallback (null) - A fallback color for browser which do not support linear gradients (IE8 and IE9 in particular). If null, the base $color is used instead. * @param {string} $direction (to bottom) - the direction of the linear gradient. The color stops are by default so that a lighter shade is at the start and a darker shade is at the end. */ @mixin valo-gradient($color: $v-background-color, $gradient: $v-gradient, $fallback: null, $direction: to bottom) { diff --git a/WebContent/VAADIN/themes/valo/util/_lists.scss b/WebContent/VAADIN/themes/valo/util/_lists.scss index f82c4f0fe3..e21c69fd01 100644 --- a/WebContent/VAADIN/themes/valo/util/_lists.scss +++ b/WebContent/VAADIN/themes/valo/util/_lists.scss @@ -5,7 +5,7 @@ * @param {value} $var - the value to search for * @param {bool} $recursive (false) - should any contained lists be checked for the value * - * @return {bool} true if the value is found from the list, false otherwise + * @return {bool} true if the value is found from the list, false otherwise * * @group lists */ @@ -34,7 +34,7 @@ * * @param {list} $list - the list to check * - * @return {bool} true of the list contains other nested lists, false otherwise + * @return {bool} true of the list contains other nested lists, false otherwise * * @group lists */ @@ -132,7 +132,7 @@ /** * Flatten nested lists to one list, while maintaining the original list separators. * - * @param {list} $list - the list to flatten + * @param {list} $list - the list to flatten * * @return {list} the same list with all nested lists flattened * diff --git a/WebContent/VAADIN/themes/valo/util/_util.scss b/WebContent/VAADIN/themes/valo/util/_util.scss index 585504600d..510506805f 100644 --- a/WebContent/VAADIN/themes/valo/util/_util.scss +++ b/WebContent/VAADIN/themes/valo/util/_util.scss @@ -3,7 +3,7 @@ * * @param {string} $to-align (()) - The selector to match the elements which you wish to align vertically. The targeted elements should be inline or inline-block elements. * @param {string} $align (middle) - The vertical-align value, e.g. top, middle, bottom - * @param {string} $pseudo-element (after) - Which pseudo element to use for the vertical align guide + * @param {string} $pseudo-element (after) - Which pseudo element to use for the vertical align guide * * @group util */ |