Added progress indicator styles to reindeer (copied from runo). svn changeset:7997/svn branch:6.0tags/6.7.0.beta1
@@ -9,9 +9,12 @@ | |||
.v-app { | |||
height: 100%; | |||
} | |||
.v-app-loading { | |||
div.v-app-loading { | |||
/* You can use this to provide indication for the user that the application is loading. */ | |||
/* It is applied to the same element as .v-app */ | |||
background-image: url(img/loading-indicator.gif); | |||
background-repeat: no-repeat; | |||
background-position: 50%; | |||
} | |||
.v-view { | |||
height: 100%; | |||
@@ -145,11 +148,21 @@ | |||
.v-loading-indicator, | |||
.v-loading-indicator-delay, | |||
.v-loading-indicator-wait { | |||
height: 16px; | |||
position: absolute; | |||
top: 0; | |||
right: 0; | |||
z-index: 30000; | |||
width: 31px; | |||
height: 31px; | |||
background: transparent url(img/loading-indicator.gif); | |||
margin-right: 5px; | |||
margin-top: 5px; | |||
} | |||
.v-loading-indicator-delay { | |||
background-image: url(img/loading-indicator-delay.gif); | |||
} | |||
.v-loading-indicator-wait { | |||
background-image: url(img/loading-indicator-wait.gif); | |||
} | |||
/* Debug dialog */ | |||
.v-debug-console { |
@@ -16,10 +16,14 @@ | |||
overflow: hidden; /* for IE6 */ | |||
background: #ddd; | |||
} | |||
.v-progressindicator-indeterminate { | |||
height: 16px; | |||
width: 16px; | |||
div.v-progressindicator-indeterminate { | |||
height: 20px; | |||
width: 20px; | |||
overflow: hidden; /* for IE6 */ | |||
background: #fff url(../common/img/ajax-loader-medium.gif) no-repeat 50%; | |||
border-radius: 4px; | |||
-webkit-border-radius: 4px; | |||
-moz-border-radius: 4px; | |||
} | |||
/* Hide obsolete elements in indeterminate mode */ | |||
.v-progressindicator-indeterminate .v-progressindicator-wrapper, | |||
@@ -28,8 +32,9 @@ | |||
.v-progressindicator-indeterminate-disabled .v-progressindicator-indicator { | |||
display: none; | |||
} | |||
.v-progressindicator-indeterminate-disabled { | |||
height: 16px; | |||
width: 16px; | |||
div.v-progressindicator-indeterminate-disabled { | |||
height: 20px; | |||
width: 20px; | |||
overflow: hidden; /* for IE6 */ | |||
background: transparent; | |||
} |
@@ -176,9 +176,12 @@ | |||
.v-app { | |||
height: 100%; | |||
} | |||
.v-app-loading { | |||
div.v-app-loading { | |||
/* You can use this to provide indication for the user that the application is loading. */ | |||
/* It is applied to the same element as .v-app */ | |||
background-image: url(common/img/loading-indicator.gif); | |||
background-repeat: no-repeat; | |||
background-position: 50%; | |||
} | |||
.v-view { | |||
height: 100%; | |||
@@ -312,11 +315,21 @@ | |||
.v-loading-indicator, | |||
.v-loading-indicator-delay, | |||
.v-loading-indicator-wait { | |||
height: 16px; | |||
position: absolute; | |||
top: 0; | |||
right: 0; | |||
z-index: 30000; | |||
width: 31px; | |||
height: 31px; | |||
background: transparent url(common/img/loading-indicator.gif); | |||
margin-right: 5px; | |||
margin-top: 5px; | |||
} | |||
.v-loading-indicator-delay { | |||
background-image: url(common/img/loading-indicator-delay.gif); | |||
} | |||
.v-loading-indicator-wait { | |||
background-image: url(common/img/loading-indicator-wait.gif); | |||
} | |||
/* Debug dialog */ | |||
.v-debug-console { | |||
@@ -722,10 +735,14 @@ | |||
overflow: hidden; /* for IE6 */ | |||
background: #ddd; | |||
} | |||
.v-progressindicator-indeterminate { | |||
height: 16px; | |||
width: 16px; | |||
div.v-progressindicator-indeterminate { | |||
height: 20px; | |||
width: 20px; | |||
overflow: hidden; /* for IE6 */ | |||
background: #fff url(common/img/ajax-loader-medium.gif) no-repeat 50%; | |||
border-radius: 4px; | |||
-webkit-border-radius: 4px; | |||
-moz-border-radius: 4px; | |||
} | |||
/* Hide obsolete elements in indeterminate mode */ | |||
.v-progressindicator-indeterminate .v-progressindicator-wrapper, | |||
@@ -734,10 +751,11 @@ | |||
.v-progressindicator-indeterminate-disabled .v-progressindicator-indicator { | |||
display: none; | |||
} | |||
.v-progressindicator-indeterminate-disabled { | |||
height: 16px; | |||
width: 16px; | |||
div.v-progressindicator-indeterminate-disabled { | |||
height: 20px; | |||
width: 20px; | |||
overflow: hidden; /* for IE6 */ | |||
background: transparent; | |||
} | |||
/* ./WebContent/VAADIN/themes/base/select/select.css */ |
@@ -0,0 +1,13 @@ | |||
.v-progressindicator { | |||
background: #dfe2e4 url(img/base.gif) repeat-x 0 1px; | |||
} | |||
.v-progressindicator-wrapper { | |||
border: 1px solid #bfbfbf; | |||
} | |||
.v-progressindicator-disabled { | |||
background: #dfe2e4 url(img/disabled.gif); | |||
border: 1px solid #bfbfbf; | |||
} | |||
.v-progressindicator-indicator { | |||
background: #f7f9f9 url(img/progress.png); | |||
} |
@@ -176,9 +176,12 @@ | |||
.v-app { | |||
height: 100%; | |||
} | |||
.v-app-loading { | |||
div.v-app-loading { | |||
/* You can use this to provide indication for the user that the application is loading. */ | |||
/* It is applied to the same element as .v-app */ | |||
background-image: url(../base/common/img/loading-indicator.gif); | |||
background-repeat: no-repeat; | |||
background-position: 50%; | |||
} | |||
.v-view { | |||
height: 100%; | |||
@@ -312,11 +315,21 @@ | |||
.v-loading-indicator, | |||
.v-loading-indicator-delay, | |||
.v-loading-indicator-wait { | |||
height: 16px; | |||
position: absolute; | |||
top: 0; | |||
right: 0; | |||
z-index: 30000; | |||
width: 31px; | |||
height: 31px; | |||
background: transparent url(../base/common/img/loading-indicator.gif); | |||
margin-right: 5px; | |||
margin-top: 5px; | |||
} | |||
.v-loading-indicator-delay { | |||
background-image: url(../base/common/img/loading-indicator-delay.gif); | |||
} | |||
.v-loading-indicator-wait { | |||
background-image: url(../base/common/img/loading-indicator-wait.gif); | |||
} | |||
/* Debug dialog */ | |||
.v-debug-console { | |||
@@ -722,10 +735,14 @@ | |||
overflow: hidden; /* for IE6 */ | |||
background: #ddd; | |||
} | |||
.v-progressindicator-indeterminate { | |||
height: 16px; | |||
width: 16px; | |||
div.v-progressindicator-indeterminate { | |||
height: 20px; | |||
width: 20px; | |||
overflow: hidden; /* for IE6 */ | |||
background: #fff url(../base/common/img/ajax-loader-medium.gif) no-repeat 50%; | |||
border-radius: 4px; | |||
-webkit-border-radius: 4px; | |||
-moz-border-radius: 4px; | |||
} | |||
/* Hide obsolete elements in indeterminate mode */ | |||
.v-progressindicator-indeterminate .v-progressindicator-wrapper, | |||
@@ -734,10 +751,11 @@ | |||
.v-progressindicator-indeterminate-disabled .v-progressindicator-indicator { | |||
display: none; | |||
} | |||
.v-progressindicator-indeterminate-disabled { | |||
height: 16px; | |||
width: 16px; | |||
div.v-progressindicator-indeterminate-disabled { | |||
height: 20px; | |||
width: 20px; | |||
overflow: hidden; /* for IE6 */ | |||
background: transparent; | |||
} | |||
/* ./WebContent/VAADIN/themes/base/select/select.css */ | |||
@@ -2878,6 +2896,21 @@ td.v-datefield-calendarpanel-nextyear { | |||
display: -moz-inline-stack; | |||
} | |||
/* ./WebContent/VAADIN/themes/reindeer/progressindicator/progressindicator.css */ | |||
.v-progressindicator { | |||
background: #dfe2e4 url(progressindicator/img/base.gif) repeat-x 0 1px; | |||
} | |||
.v-progressindicator-wrapper { | |||
border: 1px solid #bfbfbf; | |||
} | |||
.v-progressindicator-disabled { | |||
background: #dfe2e4 url(progressindicator/img/disabled.gif); | |||
border: 1px solid #bfbfbf; | |||
} | |||
.v-progressindicator-indicator { | |||
background: #f7f9f9 url(progressindicator/img/progress.png); | |||
} | |||
/* ./WebContent/VAADIN/themes/reindeer/select/select.css */ | |||
.v-filterselect { | |||
height: 24px; |
@@ -8,11 +8,6 @@ | |||
font-size: 13px; | |||
line-height: 18px; | |||
} | |||
.v-app-loading { | |||
background-image: url(img/loading-indicator.gif); | |||
background-repeat: no-repeat; | |||
background-position: 50%; | |||
} | |||
/* Global font styles */ | |||
.v-window, | |||
.v-popupview-popup, | |||
@@ -98,19 +93,4 @@ | |||
} | |||
.v-contextmenu .gwt-MenuItem img { | |||
margin-right: 10px; | |||
} | |||
.v-loading-indicator, | |||
.v-loading-indicator-delay, | |||
.v-loading-indicator-wait { | |||
width: 31px; | |||
height: 31px; | |||
background: transparent url(img/loading-indicator.gif); | |||
margin-right: 5px; | |||
margin-top: 5px; | |||
} | |||
.v-loading-indicator-delay { | |||
background-image: url(img/loading-indicator-delay.gif); | |||
} | |||
.v-loading-indicator-wait { | |||
background-image: url(img/loading-indicator-wait.gif); | |||
} |
@@ -12,8 +12,8 @@ | |||
background: #f7f9f9 url(img/progress.png); | |||
} | |||
.v-progressindicator-indeterminate { | |||
background: #dfe2e4 url(../common/img/ajax-loader-medium.gif); | |||
background: #fff url(../../base/common/img/ajax-loader-medium.gif) no-repeat 50%; | |||
} | |||
.v-progressindicator-indeterminate-disabled { | |||
background: #dfe2e4 url(../common/img/blank.gif); | |||
background: #dfe2e4; | |||
} |
@@ -176,9 +176,12 @@ | |||
.v-app { | |||
height: 100%; | |||
} | |||
.v-app-loading { | |||
div.v-app-loading { | |||
/* You can use this to provide indication for the user that the application is loading. */ | |||
/* It is applied to the same element as .v-app */ | |||
background-image: url(../base/common/img/loading-indicator.gif); | |||
background-repeat: no-repeat; | |||
background-position: 50%; | |||
} | |||
.v-view { | |||
height: 100%; | |||
@@ -312,11 +315,21 @@ | |||
.v-loading-indicator, | |||
.v-loading-indicator-delay, | |||
.v-loading-indicator-wait { | |||
height: 16px; | |||
position: absolute; | |||
top: 0; | |||
right: 0; | |||
z-index: 30000; | |||
width: 31px; | |||
height: 31px; | |||
background: transparent url(../base/common/img/loading-indicator.gif); | |||
margin-right: 5px; | |||
margin-top: 5px; | |||
} | |||
.v-loading-indicator-delay { | |||
background-image: url(../base/common/img/loading-indicator-delay.gif); | |||
} | |||
.v-loading-indicator-wait { | |||
background-image: url(../base/common/img/loading-indicator-wait.gif); | |||
} | |||
/* Debug dialog */ | |||
.v-debug-console { | |||
@@ -722,10 +735,14 @@ | |||
overflow: hidden; /* for IE6 */ | |||
background: #ddd; | |||
} | |||
.v-progressindicator-indeterminate { | |||
height: 16px; | |||
width: 16px; | |||
div.v-progressindicator-indeterminate { | |||
height: 20px; | |||
width: 20px; | |||
overflow: hidden; /* for IE6 */ | |||
background: #fff url(../base/common/img/ajax-loader-medium.gif) no-repeat 50%; | |||
border-radius: 4px; | |||
-webkit-border-radius: 4px; | |||
-moz-border-radius: 4px; | |||
} | |||
/* Hide obsolete elements in indeterminate mode */ | |||
.v-progressindicator-indeterminate .v-progressindicator-wrapper, | |||
@@ -734,10 +751,11 @@ | |||
.v-progressindicator-indeterminate-disabled .v-progressindicator-indicator { | |||
display: none; | |||
} | |||
.v-progressindicator-indeterminate-disabled { | |||
height: 16px; | |||
width: 16px; | |||
div.v-progressindicator-indeterminate-disabled { | |||
height: 20px; | |||
width: 20px; | |||
overflow: hidden; /* for IE6 */ | |||
background: transparent; | |||
} | |||
/* ./WebContent/VAADIN/themes/base/select/select.css */ | |||
@@ -1657,11 +1675,6 @@ div.v-window-header { | |||
font-size: 13px; | |||
line-height: 18px; | |||
} | |||
.v-app-loading { | |||
background-image: url(common/img/loading-indicator.gif); | |||
background-repeat: no-repeat; | |||
background-position: 50%; | |||
} | |||
/* Global font styles */ | |||
.v-window, | |||
.v-popupview-popup, | |||
@@ -1748,21 +1761,6 @@ div.v-window-header { | |||
.v-contextmenu .gwt-MenuItem img { | |||
margin-right: 10px; | |||
} | |||
.v-loading-indicator, | |||
.v-loading-indicator-delay, | |||
.v-loading-indicator-wait { | |||
width: 31px; | |||
height: 31px; | |||
background: transparent url(common/img/loading-indicator.gif); | |||
margin-right: 5px; | |||
margin-top: 5px; | |||
} | |||
.v-loading-indicator-delay { | |||
background-image: url(common/img/loading-indicator-delay.gif); | |||
} | |||
.v-loading-indicator-wait { | |||
background-image: url(common/img/loading-indicator-wait.gif); | |||
} | |||
/* ./WebContent/VAADIN/themes/runo/datefield/datefield.css */ | |||
.v-datefield-button { | |||
@@ -2240,10 +2238,10 @@ div.v-window-header { | |||
background: #f7f9f9 url(progressindicator/img/progress.png); | |||
} | |||
.v-progressindicator-indeterminate { | |||
background: #dfe2e4 url(common/img/ajax-loader-medium.gif); | |||
background: #fff url(../base/common/img/ajax-loader-medium.gif) no-repeat 50%; | |||
} | |||
.v-progressindicator-indeterminate-disabled { | |||
background: #dfe2e4 url(common/img/blank.gif); | |||
background: #dfe2e4; | |||
} | |||
/* ./WebContent/VAADIN/themes/runo/select/select.css */ |