Updated Branches: refs/heads/ui-restyle 09e432765 -> bf121011b
Move detail/list view styling to separate SCSS files Project: http://git-wip-us.apache.org/repos/asf/cloudstack/repo Commit: http://git-wip-us.apache.org/repos/asf/cloudstack/commit/c455c027 Tree: http://git-wip-us.apache.org/repos/asf/cloudstack/tree/c455c027 Diff: http://git-wip-us.apache.org/repos/asf/cloudstack/diff/c455c027 Branch: refs/heads/ui-restyle Commit: c455c027aaca86315264790861de98afc5c6cfa0 Parents: 09e4327 Author: Brian Federle <[email protected]> Authored: Thu Oct 10 14:15:29 2013 -0700 Committer: Brian Federle <[email protected]> Committed: Thu Oct 10 14:15:29 2013 -0700 ---------------------------------------------------------------------- ui/stylesheets/_detail-view.scss | 94 ++++++++++++++++++++++ ui/stylesheets/_list-view.scss | 81 +++++++++++++++++++ ui/stylesheets/cloudstack.scss | 144 +--------------------------------- 3 files changed, 177 insertions(+), 142 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/cloudstack/blob/c455c027/ui/stylesheets/_detail-view.scss ---------------------------------------------------------------------- diff --git a/ui/stylesheets/_detail-view.scss b/ui/stylesheets/_detail-view.scss new file mode 100644 index 0000000..d9afa39 --- /dev/null +++ b/ui/stylesheets/_detail-view.scss @@ -0,0 +1,94 @@ +// Licensed to the Apache Software Foundation (ASF) under one +// or more contributor license agreements. See the NOTICE file +// distributed with this work for additional information +// regarding copyright ownership. The ASF licenses this file +// to you under the Apache License, Version 2.0 (the +// "License"); you may not use this file except in compliance +// with the License. You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, +// software distributed under the License is distributed on an +// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +// KIND, either express or implied. See the License for the +// specific language governing permissions and limitations +// under the License. +.detail-view { + .toolbar { + background: none; + float: right; + padding: 0; + } + + .ui-tabs-nav { + @include csui-tabs; + + li.ui-state-active { + @include csui-tab-active; + } + } + + .detail-group { + @include csui-details; + + .main-groups { + max-height: 400px; + overflow: auto; + } + } + + .ui-tabs-hide { + display: none; + } + + table { + width: 100%; + + tr { + &:nth-child(even) { + background: lighten(#ccc, 12%); + } + } + + th, td { + padding: 10px; + } + } + + .detail-actions { + background: white; + border-radius: 6px; + display: inline-block; + height: 50px; + overflow: hidden; + @include row; + + .buttons { + .action:not(.text) { + margin: 8px 5px; + } + + .action.text { + margin-left: 25px; + margin-top: -4px; + } + } + } + + td.view-all { + display: block; + float: left; + padding: 15px 25px 0 0; + + a { + color: #5194C0; + text-decoration: none; + + &:hover { + text-decoration: underline; + color: black; + } + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/cloudstack/blob/c455c027/ui/stylesheets/_list-view.scss ---------------------------------------------------------------------- diff --git a/ui/stylesheets/_list-view.scss b/ui/stylesheets/_list-view.scss new file mode 100644 index 0000000..4ddb8c4 --- /dev/null +++ b/ui/stylesheets/_list-view.scss @@ -0,0 +1,81 @@ +// Licensed to the Apache Software Foundation (ASF) under one +// or more contributor license agreements. See the NOTICE file +// distributed with this work for additional information +// regarding copyright ownership. The ASF licenses this file +// to you under the Apache License, Version 2.0 (the +// "License"); you may not use this file except in compliance +// with the License. You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, +// software distributed under the License is distributed on an +// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +// KIND, either express or implied. See the License for the +// specific language governing permissions and limitations +// under the License. +.list-view { + @include csui-list; + + // Advanced search field + #advanced_search { + float: right; + .icon { + @include csui-sprite(61, 167); + + position: relative; + width: 15px; + height: 15px; + left: 215px; + top: 10px; + cursor: pointer; + z-index: 10; + } + + .form-container { + @include csui-dialog; + @include csui-form; + + width: 400px; + margin-top: -15px; + margin-left: -160px; + opacity: 0.9; + padding-top: 0px; + + form { + display: inline-block; + border: none; + } + + .message { display: none; } + + .form-item { + margin-top: 20px; + } + + .name { + position: relative; + top: -20px; + } + + input[type=submit], .button.cancel { + position: relative; + top: 25px; + } + + input[type=submit] { + @include csui-button-cta; + + float: right; + } + + .button.cancel { + @include csui-button; + + float: left; + } + } + } + + max-height: 85%; +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/cloudstack/blob/c455c027/ui/stylesheets/cloudstack.scss ---------------------------------------------------------------------- diff --git a/ui/stylesheets/cloudstack.scss b/ui/stylesheets/cloudstack.scss index 2fad4ad..a0fc661 100644 --- a/ui/stylesheets/cloudstack.scss +++ b/ui/stylesheets/cloudstack.scss @@ -19,6 +19,8 @@ @import "dashboard"; @import "icons"; @import "instance-wizard"; +@import "list-view"; +@import "detail-view"; html body > .login { @include csui-login; @@ -251,147 +253,5 @@ body { } // List view widget -.list-view { - @include csui-list; - // Advanced search field - #advanced_search { - float: right; - .icon { - @include csui-sprite(61, 167); - - position: relative; - width: 15px; - height: 15px; - left: 215px; - top: 10px; - cursor: pointer; - z-index: 10; - } - - .form-container { - @include csui-dialog; - @include csui-form; - - width: 400px; - margin-top: -15px; - margin-left: -160px; - opacity: 0.9; - padding-top: 0px; - - form { - display: inline-block; - border: none; - } - - .message { display: none; } - - .form-item { - margin-top: 20px; - } - - .name { - position: relative; - top: -20px; - } - - input[type=submit], .button.cancel { - position: relative; - top: 25px; - } - - input[type=submit] { - @include csui-button-cta; - - float: right; - } - - .button.cancel { - @include csui-button; - - float: left; - } - } - } - - max-height: 85%; -} - -.detail-view { - .toolbar { - background: none; - float: right; - padding: 0; - } - - .ui-tabs-nav { - @include csui-tabs; - li.ui-state-active { - @include csui-tab-active; - } - } - - .detail-group { - @include csui-details; - - .main-groups { - max-height: 400px; - overflow: auto; - } - } - - .ui-tabs-hide { - display: none; - } - - table { - width: 100%; - - tr { - &:nth-child(even) { - background: lighten(#ccc, 12%); - } - } - - th, td { - padding: 10px; - } - } - - .detail-actions { - background: white; - border-radius: 6px; - display: inline-block; - height: 50px; - overflow: hidden; - @include row; - - .buttons { - .action:not(.text) { - margin: 8px 5px; - } - - .action.text { - margin-left: 25px; - margin-top: -4px; - } - } - } - - td.view-all { - display: block; - float: left; - padding: 15px 25px 0 0; - - a { - color: #5194C0; - text-decoration: none; - - &:hover { - text-decoration: underline; - color: black; - } - } - } -}
