diff options
Diffstat (limited to 'WebContent/VAADIN/themes/valo/shared')
7 files changed, 98 insertions, 98 deletions
diff --git a/WebContent/VAADIN/themes/valo/shared/_contextmenu.scss b/WebContent/VAADIN/themes/valo/shared/_contextmenu.scss index 7ace0ddb6c..046b5923ad 100644 --- a/WebContent/VAADIN/themes/valo/shared/_contextmenu.scss +++ b/WebContent/VAADIN/themes/valo/shared/_contextmenu.scss @@ -1,15 +1,15 @@ -@mixin v-valo-contextmenu { +@mixin valo-contextmenu { .v-contextmenu { - @include v-valo-selection-overlay-style; + @include valo-selection-overlay-style; } .v-contextmenu .gwt-MenuItem { - @include v-valo-selection-item-style; + @include valo-selection-item-style; } .v-contextmenu .gwt-MenuItem-selected { - @include v-valo-selection-item-selected-style; + @include valo-selection-item-selected-style; } }
\ No newline at end of file diff --git a/WebContent/VAADIN/themes/valo/shared/_global.scss b/WebContent/VAADIN/themes/valo/shared/_global.scss index f3de32acdd..ed2e45e244 100644 --- a/WebContent/VAADIN/themes/valo/shared/_global.scss +++ b/WebContent/VAADIN/themes/valo/shared/_global.scss @@ -6,13 +6,13 @@ // Include global styles only once -$v-valo-global-included: false !default; -@mixin v-valo-global { - @if $v-valo-global-included == false { +$valo-global-included: false !default; +@mixin valo-global { + @if $valo-global-included == false { // Core widget styles come before any other component (and are always included), // so that it has the least specificity - @include v-valo-widget; + @include valo-widget; .v-generated-body { overflow: hidden; @@ -99,27 +99,27 @@ $v-valo-global-included: false !default; } // Component global styles should also be included here - @include v-valo-orderedlayout-global; - @include v-valo-gridlayout-global; - @include v-valo-calendar-global; - @include v-valo-colorpicker-global; - @include v-valo-table-global; - @include v-valo-tabsheet-global; - - $v-valo-global-included: true; + @include valo-orderedlayout-global; + @include valo-gridlayout-global; + @include valo-calendar-global; + @include valo-colorpicker-global; + @include valo-table-global; + @include valo-tabsheet-global; + + $valo-global-included: true; } } -$v-valo-shared-pathPrefix: null; +$valo-shared-pathPrefix: null; @if $v-relative-paths == false { - $v-valo-shared-pathPrefix: "../valo/shared/"; + $valo-shared-pathPrefix: "../valo/shared/"; } -@mixin v-valo-app-style { +@mixin valo-app-style { font: $v-font-weight #{$v-font-size}/#{$v-line-height} $v-font-family; color: $v-font-color; background-color: $v-app-background-color; @@ -134,17 +134,17 @@ $v-valo-shared-pathPrefix: null; } -@mixin v-valo-common { +@mixin valo-common { //@if & != null { // &, // &.v-app-loading { - // @include v-valo-app-style; + // @include valo-app-style; // } //} @else { &.v-app, &.v-app-loading { - @include v-valo-app-style; + @include valo-app-style; } //} @@ -171,7 +171,7 @@ $v-valo-shared-pathPrefix: null; padding: round($v-unit-size/4); margin-top: round($_size/-2); margin-left: round($_size/-2); - background: #fff url($v-valo-shared-pathPrefix + "img/spinner.gif") no-repeat 50%; + background: #fff url($valo-shared-pathPrefix + "img/spinner.gif") no-repeat 50%; border-radius: $v-border-radius; } @@ -189,7 +189,7 @@ $v-valo-shared-pathPrefix: null; } } - @include v-valo-loading-bar; + @include valo-loading-bar; // Fallback spinner for browsers without CSS animations @@ -201,7 +201,7 @@ $v-valo-shared-pathPrefix: null; width: 28px !important; height: 28px; padding: round($v-unit-size/4); - background: #fff url($v-valo-shared-pathPrefix + "img/spinner.gif") no-repeat 50%; + background: #fff url($valo-shared-pathPrefix + "img/spinner.gif") no-repeat 50%; border-radius: $v-border-radius; top: round($v-unit-size/4); right: round($v-unit-size/4); @@ -230,7 +230,7 @@ $v-valo-shared-pathPrefix: null; } .v-caption { - @include v-valo-caption-style; + @include valo-caption-style; } .v-caption-on-left .v-caption, @@ -249,7 +249,7 @@ $v-valo-shared-pathPrefix: null; } .v-errorindicator { - @include v-valo-error-indicator-style; + @include valo-error-indicator-style; } .v-required-field-indicator { @@ -266,7 +266,7 @@ $v-valo-shared-pathPrefix: null; margin: 0; border-radius: $v-border-radius; - @include v-valo-nativeselect-select-style; + @include valo-nativeselect-select-style; } button { @@ -279,18 +279,18 @@ $v-valo-shared-pathPrefix: null; cursor: default !important; } - @include v-valo-drag-element; + @include valo-drag-element; - @include v-valo-tooltip; + @include valo-tooltip; - @include v-valo-contextmenu; + @include valo-contextmenu; } -@mixin v-valo-caption-style { +@mixin valo-caption-style { font-size: $v-caption-font-size; font-weight: $v-caption-font-weight; padding-bottom: .3em; @@ -301,18 +301,18 @@ $v-valo-shared-pathPrefix: null; -@mixin v-valo-error-indicator-style { +@mixin valo-error-indicator-style { color: $v-error-indicator-color; font-weight: 600; width: ceil($v-unit-size/2); text-align: center; &:before { - @include v-valo-error-indicator-icon-style; + @include valo-error-indicator-icon-style; } } -@mixin v-valo-error-indicator-icon-style { +@mixin valo-error-indicator-icon-style { content: "!"; } @@ -320,11 +320,11 @@ $v-valo-shared-pathPrefix: null; // Make the BODY element scrollable instead of the .v-ui element. Scrolling the BODY works better on touch screens. // NOTE: breaks percentage sized overlay elements -// @mixin v-valo-natural-page-scrolling +// @mixin valo-natural-page-scrolling // @usage // // Call without any parent selector somewhere in your theme -// =v-valo-natural-page-scrolling; -@mixin v-valo-natural-page-scrolling { +// =valo-natural-page-scrolling; +@mixin valo-natural-page-scrolling { html { height: auto; diff --git a/WebContent/VAADIN/themes/valo/shared/_loading-indicator.scss b/WebContent/VAADIN/themes/valo/shared/_loading-indicator.scss index b20dc33300..0b083310fd 100644 --- a/WebContent/VAADIN/themes/valo/shared/_loading-indicator.scss +++ b/WebContent/VAADIN/themes/valo/shared/_loading-indicator.scss @@ -14,8 +14,8 @@ } -@mixin v-valo-spinner ($size: 24px, $thickness: 4px, $color: null, $speed: 500ms) { - $color: $color or v-valo-focus-color(); +@mixin valo-spinner ($size: 24px, $thickness: 4px, $color: null, $speed: 500ms) { + $color: $color or valo-focus-color(); // Make size divisible by 2, so that the rotation won't jiggle $size: $size + $size%2; height: $size !important; @@ -65,10 +65,10 @@ } -$v-loading-indicator-color: v-valo-focus-color() !default; +$v-loading-indicator-color: valo-focus-color() !default; $v-loading-indicator-bar-height: ceil($v-unit-size/7) !default; -@mixin v-valo-loading-bar { +@mixin valo-loading-bar { .v-loading-indicator { position: fixed !important; diff --git a/WebContent/VAADIN/themes/valo/shared/_notification.scss b/WebContent/VAADIN/themes/valo/shared/_notification.scss index c546a16225..c239a65c11 100644 --- a/WebContent/VAADIN/themes/valo/shared/_notification.scss +++ b/WebContent/VAADIN/themes/valo/shared/_notification.scss @@ -1,4 +1,4 @@ -@mixin v-valo-notification { +@mixin valo-notification { @@ -32,20 +32,20 @@ // Can't match to "top: 0", since that would target "margin-top: 0" also, which all GWT PopupPanels have always @if $v-animations-enabled { .v-Notification[style*=" top: 0"] { - @include v-valo-anim-slide-down(600ms); + @include valo-anim-slide-down(600ms); } .v-Notification[style*="bottom: 0"] { - @include v-valo-anim-slide-up(600ms); + @include valo-anim-slide-up(600ms); } .v-Notification[style*="right: 0"] { - @include v-valo-anim-slide-left(600ms); + @include valo-anim-slide-left(600ms); } // Can't match to "left: 0", since that would target "margin-left: 0" also, which all GWT PopupPanels have always .v-Notification[style*=" left: 0"]:not(.v-Notification-system) { - @include v-valo-anim-slide-right(600ms); + @include valo-anim-slide-right(600ms); } } @@ -91,10 +91,10 @@ margin-left: round($v-font-size); } - @include v-valo-notification-style; + @include valo-notification-style; @if $v-animations-enabled { - @include v-valo-anim-fade-in; + @include valo-anim-fade-in; } } @@ -109,7 +109,7 @@ margin: 0 !important; border-radius: 0; - @include v-valo-notification-system-style; + @include valo-notification-system-style; } // Needs a more specific selector to override positional margins @@ -132,19 +132,19 @@ display: block; margin: .5em 0 0; } - @include v-valo-notification-tray-style; + @include valo-notification-tray-style; } .v-Notification.warning { - @include v-valo-notification-warning-style; + @include valo-notification-warning-style; } .v-Notification.error { - @include v-valo-notification-error-style; + @include valo-notification-error-style; } .v-Notification.closable { - @include v-valo-notification-closable-style; + @include valo-notification-closable-style; &.error, &.system { @@ -172,7 +172,7 @@ -@mixin v-valo-notification-closable-style { +@mixin valo-notification-closable-style { padding-right: $v-unit-size + round($v-unit-size/1.7); overflow: hidden !important; // Override GWT PopupPanel cursor: pointer; @@ -225,8 +225,8 @@ -@mixin v-valo-notification-style { - background: v-valo-overlay-background-color(); +@mixin valo-notification-style { + background: valo-overlay-background-color(); box-shadow: 0px 5px 15px 0px rgba(0,0,0,0.15); padding: round($v-unit-size/2) round($v-unit-size/1.7); @@ -236,7 +236,7 @@ } h1 { - color: v-valo-focus-color(); + color: valo-focus-color(); font-size: round($v-font-size * 1.2); line-height: 1; } @@ -245,7 +245,7 @@ } } -@mixin v-valo-notification-system-style { +@mixin valo-notification-system-style { background-color: #444; font-weight: $v-font-weight + 100; line-height: round($v-font-size * 1.4); @@ -268,9 +268,9 @@ } -@mixin v-valo-notification-tray-style {} +@mixin valo-notification-tray-style {} -@mixin v-valo-notification-warning-style { +@mixin valo-notification-warning-style { background: #FFF3D2; h1 { @@ -282,16 +282,16 @@ } } -@mixin v-valo-notification-error-style { +@mixin valo-notification-error-style { background: $v-error-indicator-color; font-weight: $v-font-weight + 100; box-shadow: 0px 5px 15px 0px rgba(0,0,0,0.25); h1 { - color: v-valo-font-color($v-error-indicator-color, 1); + color: valo-font-color($v-error-indicator-color, 1); } p { - color: v-valo-font-color($v-error-indicator-color, .8); + color: valo-font-color($v-error-indicator-color, .8); } } diff --git a/WebContent/VAADIN/themes/valo/shared/_overlay.scss b/WebContent/VAADIN/themes/valo/shared/_overlay.scss index 96aa05ac49..5ac0ce5d9a 100644 --- a/WebContent/VAADIN/themes/valo/shared/_overlay.scss +++ b/WebContent/VAADIN/themes/valo/shared/_overlay.scss @@ -1,6 +1,6 @@ $v-overlay-border-radius: $v-border-radius !default; $v-overlay-border-width: $v-border-width !default; -$v-overlay-open-animation: v-valo-overlay-open 200ms !default; +$v-overlay-open-animation: valo-overlay-open 200ms !default; $v-overlay-padding: round($v-unit-size/9) !default; $v-overlay-padding-vertical: $v-overlay-padding !default; @@ -18,7 +18,7 @@ $v-selection-item-padding-horizontal: ceil($v-unit-size/4) !default; $v-selection-item-font-weight: max(400, $v-font-weight); -@function v-valo-overlay-background-color ($context: $v-app-background-color) { +@function valo-overlay-background-color ($context: $v-app-background-color) { @if is-dark-color($context) { @return darken($context, 2%); } @@ -30,7 +30,7 @@ $v-selection-item-font-weight: max(400, $v-font-weight); -@mixin v-valo-ie8-shadow($shadow, $element: top) { +@mixin valo-ie8-shadow($shadow, $element: top) { .#{$element} { $shadow-offset-x: nth($shadow, 1); $shadow-offset-y: nth($shadow, 2); @@ -69,16 +69,16 @@ $v-selection-item-font-weight: max(400, $v-font-weight); right: -$v-overlay-border-width; bottom: -$v-overlay-border-width; left: -$v-overlay-border-width; - background: darken(v-valo-overlay-background-color(), $v-bevel-depth); + background: darken(valo-overlay-background-color(), $v-bevel-depth); filter: alpha(opacity=round($v-bevel-depth/1%)); } // Up to 8 shadows are supported $elements: top, top-left, top-right, left, right, bottom, bottom-left, bottom-right; - $shadows: v-valo-shadow($shadow-style: $v-overlay-shadow-style); + $shadows: valo-shadow($shadow-style: $v-overlay-shadow-style); @if type-of(last($shadows)) == color { - @include v-valo-ie8-shadow($shadows); + @include valo-ie8-shadow($shadows); } @else { @for $i from 1 through min(length($elements), length($shadows)) { $shadow: nth($shadows, $i); @@ -86,7 +86,7 @@ $v-selection-item-font-weight: max(400, $v-font-weight); $shadow: last($shadow); // Workaround for a weird issue when sometimes a shadow is appended to a null list } @if length($shadow) > 3 { - @include v-valo-ie8-shadow($shadow: $shadow, $element: nth($elements, $i)); + @include valo-ie8-shadow($shadow: $shadow, $element: nth($elements, $i)); } } } @@ -98,22 +98,22 @@ $v-selection-item-font-weight: max(400, $v-font-weight); -@function v-valo-overlay-box-shadow ($bg: null) { - $bg: $bg or v-valo-overlay-background-color(); - @return v-valo-shadow($shadow-style: (0 0 0 $v-overlay-border-width rgba(darken($bg, $v-bevel-depth), $v-bevel-depth/100%), $v-overlay-shadow-style)); +@function valo-overlay-box-shadow ($bg: null) { + $bg: $bg or valo-overlay-background-color(); + @return valo-shadow($shadow-style: (0 0 0 $v-overlay-border-width rgba(darken($bg, $v-bevel-depth), $v-bevel-depth/100%), $v-overlay-shadow-style)); } -@mixin v-valo-overlay-style ($background-color: null, $open-animation: $v-overlay-open-animation) { +@mixin valo-overlay-style ($background-color: null, $open-animation: $v-overlay-open-animation) { padding: $v-overlay-padding-vertical $v-overlay-padding-horizontal; border-radius: $v-overlay-border-radius; - $bg: $background-color or v-valo-overlay-background-color(); + $bg: $background-color or valo-overlay-background-color(); background: $bg; - color: v-valo-font-color($bg); + color: valo-font-color($bg); - box-shadow: v-valo-overlay-box-shadow($bg); + box-shadow: valo-overlay-box-shadow($bg); @if $v-animations-enabled and $v-overlay-open-animation { @include animation($open-animation); @@ -128,7 +128,7 @@ $v-selection-item-font-weight: max(400, $v-font-weight); @if $v-animations-enabled { - @include keyframes(v-valo-overlay-open) { + @include keyframes(valo-overlay-open) { 0% { @include transform(translatey(-3px)); opacity: 0; @@ -141,15 +141,15 @@ $v-selection-item-font-weight: max(400, $v-font-weight); -@mixin v-valo-selection-overlay-style ($background-color: null, $open-animation: $v-overlay-open-animation) { - @include v-valo-overlay-style($background-color: $background-color, $open-animation: $open-animation); +@mixin valo-selection-overlay-style ($background-color: null, $open-animation: $v-overlay-open-animation) { + @include valo-overlay-style($background-color: $background-color, $open-animation: $open-animation); padding: $v-selection-overlay-padding-vertical $v-selection-overlay-padding-horizontal; } -@mixin v-valo-selection-item-style { +@mixin valo-selection-item-style { cursor: pointer; line-height: $v-selection-item-height; padding: 0 $v-selection-item-padding-horizontal*2 0 $v-selection-item-padding-horizontal; @@ -167,7 +167,7 @@ $v-selection-item-font-weight: max(400, $v-font-weight); right: 0; bottom: 0; left: 0; - background: scale-color(v-valo-selection-color(), $lightness: -30%, $saturation: 50%); + background: scale-color(valo-selection-color(), $lightness: -30%, $saturation: 50%); @include opacity(.15); pointer-events: none; border-radius: inherit; @@ -183,10 +183,10 @@ $v-selection-item-font-weight: max(400, $v-font-weight); -@mixin v-valo-selection-item-selected-style ($parent-background-color: null) { - $selection-color: v-valo-selection-color($parent-background-color); - @include v-valo-gradient($selection-color); - color: v-valo-font-color($selection-color, 0.9); +@mixin valo-selection-item-selected-style ($parent-background-color: null) { + $selection-color: valo-selection-color($parent-background-color); + @include valo-gradient($selection-color); + color: valo-font-color($selection-color, 0.9); } @@ -196,13 +196,13 @@ $v-selection-item-font-weight: max(400, $v-font-weight); -@mixin v-valo-drag-element { +@mixin valo-drag-element { .v-drag-element { - @include v-valo-drag-element-style; + @include valo-drag-element-style; } } -@mixin v-valo-drag-element-style { +@mixin valo-drag-element-style { background: #fff; box-shadow: 0 2px 10px rgba(#000, .2); border-radius: $v-border-radius; diff --git a/WebContent/VAADIN/themes/valo/shared/_tooltip.scss b/WebContent/VAADIN/themes/valo/shared/_tooltip.scss index dab8d5afeb..57d0c97ab3 100644 --- a/WebContent/VAADIN/themes/valo/shared/_tooltip.scss +++ b/WebContent/VAADIN/themes/valo/shared/_tooltip.scss @@ -1,7 +1,7 @@ // @category Tooltip $v-tooltip-background-color: rgba(if(is-dark-color($v-app-background-color), scale-color($v-app-background-color, $lightness: 80%), scale-color($v-app-background-color, $lightness: -80%)), .75) !default; -$v-tooltip-font-color: v-valo-font-color(opacify($v-tooltip-background-color, 1), 1) !default; +$v-tooltip-font-color: valo-font-color(opacify($v-tooltip-background-color, 1), 1) !default; $v-tooltip-font-size: max(12px, round($v-font-size * 0.86)) !default; $v-tooltip-box-shadow: 0 2px 12px rgba(#000, .2) !default; $v-tooltip-padding-vertical: round($v-unit-size/8) !default; @@ -11,9 +11,9 @@ $v-tooltip-error-message-font-color: $v-error-indicator-color !default; $v-tooltip-border-radius: $v-border-radius - 1px !default; -@mixin v-valo-tooltip { +@mixin valo-tooltip { .v-tooltip { - @include v-valo-tooltip-style; + @include valo-tooltip-style; div[style*="width"] { width: auto !important; @@ -55,7 +55,7 @@ $v-tooltip-border-radius: $v-border-radius - 1px !default; } -@mixin v-valo-tooltip-style { +@mixin valo-tooltip-style { background-color: opacify($v-tooltip-background-color, 1); // For IE8 background-color: $v-tooltip-background-color; box-shadow: $v-tooltip-box-shadow; @@ -67,6 +67,6 @@ $v-tooltip-border-radius: $v-border-radius - 1px !default; font-size: $v-tooltip-font-size; @if $v-animations-enabled { - //@include v-valo-anim-fade-in; + //@include valo-anim-fade-in; } } diff --git a/WebContent/VAADIN/themes/valo/shared/_variables.scss b/WebContent/VAADIN/themes/valo/shared/_variables.scss index 19f5195acb..11906fe5a5 100644 --- a/WebContent/VAADIN/themes/valo/shared/_variables.scss +++ b/WebContent/VAADIN/themes/valo/shared/_variables.scss @@ -53,7 +53,7 @@ $v-included-components: // Checks if a given component is included in the compilation. Used by the collection mixins that -// include all components, like v-valo-components and v-valo-components. +// include all components, like valo-components and valo-components. // @mixin v-is-included // @param $component-name {String} the name of the component to check // @param $is-included {list} (Optional) the list of components which is checked @@ -79,7 +79,7 @@ $v-app-background-color: hsl(210, 0%, 98%) !default; $v-font-size: 16px !default; // Should be specified in pixels $v-font-weight: 300 !default; // Must be specified as a numeric value (i.e. not 'normal' or 'bold') -$v-font-color: v-valo-font-color($v-app-background-color) !default; +$v-font-color: valo-font-color($v-app-background-color) !default; $v-font-family: "Open Sans", sans-serif !default; $v-caption-font-size: round($v-font-size * 0.9) !default; // Should be a pixel value @@ -125,7 +125,7 @@ $v-required-field-indicator-color: $v-error-indicator-color !default; -$v-valo-include-common-stylenames: true !default; +$valo-include-common-stylenames: true !default; |