Updated Branches: refs/heads/ui-restyle 01dffc5d2 -> 5c827f762
Style createForm Project: http://git-wip-us.apache.org/repos/asf/cloudstack/repo Commit: http://git-wip-us.apache.org/repos/asf/cloudstack/commit/02984bc9 Tree: http://git-wip-us.apache.org/repos/asf/cloudstack/tree/02984bc9 Diff: http://git-wip-us.apache.org/repos/asf/cloudstack/diff/02984bc9 Branch: refs/heads/ui-restyle Commit: 02984bc9cb78fedcb723ab42a62e8d0dc803b81b Parents: 01dffc5 Author: Brian Federle <[email protected]> Authored: Tue Oct 1 12:05:39 2013 -0700 Committer: Brian Federle <[email protected]> Committed: Tue Oct 1 12:06:09 2013 -0700 ---------------------------------------------------------------------- ui/scripts/ui/dialog.js | 2 +- ui/stylesheets/cloudstack.scss | 12 ++------ ui/stylesheets/csui/_dialog.scss | 15 ++++++++- ui/stylesheets/csui/_form.scss | 57 ++++++++++++++++++++++++++++++++--- 4 files changed, 69 insertions(+), 17 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/cloudstack/blob/02984bc9/ui/scripts/ui/dialog.js ---------------------------------------------------------------------- diff --git a/ui/scripts/ui/dialog.js b/ui/scripts/ui/dialog.js index 7bd2034..bfd0d93 100644 --- a/ui/scripts/ui/dialog.js +++ b/ui/scripts/ui/dialog.js @@ -76,7 +76,7 @@ dialogClass: 'create-form', closeOnEscape: false, draggable: false, - width: 400, + width: 800, title: _l(args.form.title), open: function() { if (args.form.preFilter) { http://git-wip-us.apache.org/repos/asf/cloudstack/blob/02984bc9/ui/stylesheets/cloudstack.scss ---------------------------------------------------------------------- diff --git a/ui/stylesheets/cloudstack.scss b/ui/stylesheets/cloudstack.scss index ef197b7..c87a57e 100644 --- a/ui/stylesheets/cloudstack.scss +++ b/ui/stylesheets/cloudstack.scss @@ -251,16 +251,8 @@ body { } .section-select, .filters { - @include span-columns(3); + @include span-columns(4); margin: 8px; - - label { - top: 0px; - margin-right: 8px; - } - - select { - } } -} \ No newline at end of file +} http://git-wip-us.apache.org/repos/asf/cloudstack/blob/02984bc9/ui/stylesheets/csui/_dialog.scss ---------------------------------------------------------------------- diff --git a/ui/stylesheets/csui/_dialog.scss b/ui/stylesheets/csui/_dialog.scss index f6c37dc..d376ba4 100644 --- a/ui/stylesheets/csui/_dialog.scss +++ b/ui/stylesheets/csui/_dialog.scss @@ -27,7 +27,8 @@ width: 100%; background-color: white; - padding: 10px; + padding-top: 10px; + padding-bottom: 20px; } .ui-dialog-content { @@ -42,6 +43,18 @@ .ui-dialog-titlebar-close { float: right; } + + &.create-form { + max-height: 900px; + overflow: hidden; + + @include csui-form; + + form { + max-height: 700px; + overflow: auto; + } + } } // Defaults http://git-wip-us.apache.org/repos/asf/cloudstack/blob/02984bc9/ui/stylesheets/csui/_form.scss ---------------------------------------------------------------------- diff --git a/ui/stylesheets/csui/_form.scss b/ui/stylesheets/csui/_form.scss index 67891d6..94d0881 100644 --- a/ui/stylesheets/csui/_form.scss +++ b/ui/stylesheets/csui/_form.scss @@ -30,8 +30,10 @@ font-size: 14px; padding-right: 25px; padding-left: 10px; - padding-top: 5px; - padding-bottom: 5px; + padding-top: 10px; + padding-bottom: 10px; + margin-top: 10px; + margin-bottom: 10px; } @mixin csui-dropdown-dark { @@ -51,8 +53,6 @@ @mixin csui-label { font-size: 14px; - position: relative; - top: 7px; } @mixin csui-textfield { @@ -73,8 +73,55 @@ } } +@mixin csui-checkbox { + margin-top: 25px; + margin-bottom: 10px; +} + +@mixin csui-form { + .message { + @include row; + } + + form { + margin-top: 20px; + margin-bottom: 20px; + border-bottom: 1px solid #ccc; + border-top: 1px solid #ccc; + } + + .form-item { + @include row; + @include span-columns(12); + + display: inline-block; // Needed for legacy code in JS + margin-top: 5px; + margin-bottom: 5px; + + label { + @include span-columns(3); + @include shift(0.5); + + text-align: right; + position: relative; + top: 20px; + } + + input, select, .dynamic-input { + @include span-columns(7); + @include shift(0.2); + } + } + + .dynamic-input { + display: inline-block; + border: 1px solid gray; + background: #ccc; + } +} // Defaults label { @include csui-label; } select { @include csui-dropdown; } -input[type=text], input[type=password] { @include csui-textfield; } \ No newline at end of file +input[type=text], input[type=password] { @include csui-textfield; } +input[type=checkbox], input[type=radio] { @include csui-checkbox; } \ No newline at end of file
