diff options
Diffstat (limited to 'WebContent/VAADIN')
6 files changed, 213 insertions, 10 deletions
diff --git a/WebContent/VAADIN/themes/base/boxlayout/boxlayout.css b/WebContent/VAADIN/themes/base/boxlayout/boxlayout.css new file mode 100644 index 0000000000..bbfad98582 --- /dev/null +++ b/WebContent/VAADIN/themes/base/boxlayout/boxlayout.css @@ -0,0 +1,169 @@ +/* +TODO +- separate styles to proper places +- decide a good class name structure for core layouts (e.g. 'v-layout', 'v-vertical', 'v-grid' etc.) +- use !important in carefully selected places to prevent accidental layout breakage by custom theming (e.g. alignments should be forced) + +*/ + +.v-boxlayout.v-margin-top {padding-top: 12px;} +.v-boxlayout.v-margin-right {padding-right: 12px;} +.v-boxlayout.v-margin-bottom {padding-bottom: 12px;} +.v-boxlayout.v-margin-left {padding-left: 12px;} + +.v-spacing { + width: 6px; + height: 6px; +} + +.v-boxlayout { + display: inline-block; +} + +.v-boxlayout.v-horizontal { + white-space: nowrap !important; +} + +.v-boxlayout > .v-expand { + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + height: 100%; +} + +.v-slot, +.v-spacing { + display: inline-block; + white-space: normal; + vertical-align: top; +} + +/* Clear any floats inside the slot, to prevent unwanted collapsing */ +.v-slot:after { + content: ""; + display: inline-block; + clear: both; + width: 0; + height: 0; + overflow: hidden; +} + +.v-vertical > .v-slot, +.v-vertical > .v-expand > .v-slot { + display: block; + clear: both; +} + +.v-horizontal > .v-slot, +.v-horizontal > .v-expand > .v-slot { + height: 100%; +} + +.v-vertical > .v-spacing, +.v-vertical > .v-expand > .v-spacing { + width: 0; + display: block; + clear: both; +} + +.v-horizontal > .v-spacing, +.v-horizontal > .v-expand > .v-spacing { + height: 0; +} + +.v-align-middle:before, +.v-align-bottom:before, +.v-expand > .v-align-middle:before, +.v-expand > .v-align-bottom:before { + content: ""; + display: inline-block; + height: 100%; + vertical-align: middle; + width: 0; +} + +.v-align-middle, +.v-align-bottom { + white-space: nowrap; +} + +.v-align-middle > .v-connector, +.v-align-bottom > .v-connector { + display: inline-block; + /* TODO this is a bit tricky, since it will override component defaults in some cases */ + white-space: normal; +} + +.v-align-middle > .v-connector { + vertical-align: middle; +} + +.v-align-bottom > .v-connector { + vertical-align: bottom; +} + +.v-align-center { + text-align: center; +} + +.v-align-center > .v-connector { + margin-left: auto; + margin-right: auto; +} + +.v-align-right { + text-align: right; +} + +.v-align-right > .v-connector { + margin-left: auto; +} + +.v-has-caption { + display: inline-block; +} + +.v-caption { + display: inline-block; /* Force default width to zero */ + overflow: visible; + vertical-align: middle; +} + +.v-caption-on-left, +.v-caption-on-right { + white-space: nowrap; +} + +.v-caption-on-top > .v-caption, +.v-caption-on-bottom > .v-caption { + display: block; +} + +.v-caption-on-left > .v-caption { + padding-right: .5em; +} + +.v-caption-on-right > .v-caption { + padding-left: .5em; +} + +.v-caption-on-left > .v-connector, +.v-caption-on-right > .v-connector { + display: inline-block; + vertical-align: middle; + /* TODO this is a bit tricky, since it will override component defaults in some cases */ + white-space: normal; +} + +.v-has-caption.v-has-width > .v-connector { + width: 100% !important; +} + +.v-has-caption.v-has-height > .v-connector { + height: 100% !important; +} + +.v-errorindicator { + vertical-align: middle; +}
\ No newline at end of file diff --git a/WebContent/VAADIN/themes/base/button/button.css b/WebContent/VAADIN/themes/base/button/button.css index 2e14d59a90..8424a3e59f 100644 --- a/WebContent/VAADIN/themes/base/button/button.css +++ b/WebContent/VAADIN/themes/base/button/button.css @@ -4,7 +4,7 @@ .v-button { display: inline-block; zoom: 1; - text-align: center; + text-align: center !important; text-decoration: none; border: 2px outset #ddd; background: #eee; @@ -84,7 +84,7 @@ * NativeButton styles (html button element) * -------------------------------------- */ .v-nativebutton { - text-align: center; + text-align: center !important; cursor: pointer; white-space: nowrap; margin: 0; diff --git a/WebContent/VAADIN/themes/base/paintable/paintable.css b/WebContent/VAADIN/themes/base/paintable/paintable.css index 36a3fe3455..9d700fd4ee 100644 --- a/WebContent/VAADIN/themes/base/paintable/paintable.css +++ b/WebContent/VAADIN/themes/base/paintable/paintable.css @@ -1,4 +1,7 @@ .v-connector { - box-sizing: border-box; + -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -}
\ No newline at end of file + box-sizing: border-box; + text-align: left; + display: inline-block; +} diff --git a/WebContent/VAADIN/themes/reindeer/layouts/layouts.css b/WebContent/VAADIN/themes/reindeer/layouts/layouts.css index 528d4b9174..650247bade 100644 --- a/WebContent/VAADIN/themes/reindeer/layouts/layouts.css +++ b/WebContent/VAADIN/themes/reindeer/layouts/layouts.css @@ -1,21 +1,25 @@ .v-orderedlayout-margin-top, .v-horizontallayout-margin-top, -.v-verticallayout-margin-top { +.v-verticallayout-margin-top, +.v-boxlayout.v-margin-top { padding-top: 18px; } .v-orderedlayout-margin-right, .v-horizontallayout-margin-right, -.v-verticallayout-margin-right { +.v-verticallayout-margin-right, +.v-boxlayout.v-margin-right { padding-right: 18px; } .v-orderedlayout-margin-bottom, .v-horizontallayout-margin-bottom, -.v-verticallayout-margin-bottom { +.v-verticallayout-margin-bottom, +.v-boxlayout.v-margin-bottom { padding-bottom: 18px; } .v-orderedlayout-margin-left, .v-horizontallayout-margin-left, -.v-verticallayout-margin-left { +.v-verticallayout-margin-left, +.v-boxlayout.v-margin-left { padding-left: 18px; } .v-orderedlayout-spacing-on, @@ -24,6 +28,10 @@ padding-top: 7px; padding-left: 6px; } +.v-spacing { + height: 7px; + width: 6px; +} /* Different for historical reasons: previously was inherited directly from Base theme */ /* TODO unify these values in version 7 */ .v-gridlayout-margin-top { diff --git a/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.css b/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.css index 306292d843..f70e285729 100644 --- a/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.css +++ b/WebContent/VAADIN/themes/runo/orderedlayout/orderedlayout.css @@ -1,7 +1,8 @@ .v-orderedlayout-margin-top, .v-horizontallayout-margin-top, .v-verticallayout-margin-top, -.v-csslayout-margin-top { +.v-csslayout-margin-top, +.v-boxlayout.v-margin-top { padding-top: 15px; } .v-orderedlayout-margin-right, @@ -13,7 +14,8 @@ .v-orderedlayout-margin-bottom, .v-horizontallayout-margin-bottom, .v-verticallayout-margin-bottom, -.v-csslayout-margin-bottom { +.v-csslayout-margin-bottom, +.v-boxlayout.v-margin-bottom { padding-bottom: 15px; } .v-orderedlayout-margin-left, @@ -28,6 +30,10 @@ padding-top: 8px; padding-left: 8px; } +.v-spacing { + width: 8px; + height: 8px; +} .v-verticallayout-darker, .v-horizontallayout-darker, .v-gridlayout-darker, diff --git a/WebContent/VAADIN/themes/tests-components/styles.css b/WebContent/VAADIN/themes/tests-components/styles.css index c38f32f132..45a96b6d16 100644 --- a/WebContent/VAADIN/themes/tests-components/styles.css +++ b/WebContent/VAADIN/themes/tests-components/styles.css @@ -36,4 +36,21 @@ .v-table-row-tables-test-cell-style-red-row, .v-table-cell-content-tables-test-cell-style-red-row { background: #f00; +} + +.v-boxlayout.test { + border: 1px solid #ddd; +} + +.v-boxlayout.test .target { + outline: 2px dashed blue; +} + +.fieldset { + padding: .5em 1em; + -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.2); + -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.2); + box-shadow: inset 0 1px 2px rgba(0,0,0,.2); + border-radius: .5em; + background: rgba(0,0,0,.02); }
\ No newline at end of file |