diff options
Diffstat (limited to 'openstack_dashboard/static/dashboard/less/horizon.less')
| -rw-r--r-- | openstack_dashboard/static/dashboard/less/horizon.less | 2122 |
1 files changed, 0 insertions, 2122 deletions
diff --git a/openstack_dashboard/static/dashboard/less/horizon.less b/openstack_dashboard/static/dashboard/less/horizon.less deleted file mode 100644 index 3a97df0f..00000000 --- a/openstack_dashboard/static/dashboard/less/horizon.less +++ /dev/null @@ -1,2122 +0,0 @@ -@import "../../bootstrap/less/bootstrap.less"; -@import "../../bootstrap/less/datepicker.less"; - -/* new clearfix */ -.clearfix:after { - visibility: hidden; - display: block; - font-size: 0; - content: " "; - clear: both; - height: 0; - } -* html .clearfix { zoom: 1; } /* IE6 */ -*:first-child+html .clearfix { zoom: 1; } /* IE7 */ - -@font-face { - font-family: 'anivers'; - src: url('/static/dashboard/fonts/Anivers_Regular-webfont.eot'); - src: url('/static/dashboard/fonts/Anivers_Regular-webfont.eot?iefix') format('eot'), - url('/static/dashboard/fonts/Anivers_Regular-webfont.woff') format('woff'), - url('/static/dashboard/fonts/Anivers_Regular-webfont.ttf') format('truetype'), - url('/static/dashboard/fonts/Anivers_Regular-webfont.svg#webfont3JLVF59W') format('svg'); - font-weight: normal; - font-style: normal; -} - -a { - color: #43a1d6; -} - -ul { - list-style: none; - margin: 0; -} - -dt { - font-weight: bold; -} - -#main_content { - padding-left: 250px; - padding-right: 25px; -} - -.topbar { - background: #f2f2f2; - border-bottom: 1px solid #e5e5e5; - padding: 10px 25px; - margin-top: 0; - margin-left: -25px; - margin-bottom: 20px; - margin-right: -25px; - min-width: 700px; -} - -.topbar .switcher_bar { - display: inline-block; - height: auto; - width: 160px; - background-position: 140px center; - margin-bottom: 0; - font-size: 11px; - margin-left: 20px; - padding: 0; - background-image: url(/static/dashboard/img/drop_arrow.png); - border: 1px solid #c0d9e4; - background-color: #e9f5fa; - background-repeat: no-repeat; -} - -.topbar .switcher_bar a { - padding: 2px 10px 1px; - margin-left: 0; - display: block; -} - -.topbar .switcher_bar ul { - width: 130px; -} - -#user_info { - color: #888; - margin: auto 0; -} - -#user_info > a { - margin-left: 25px; - font-size: 11px !important; -} - -.page-header { - margin: 0; - padding: 0; - border: 0; - font-family: anivers; -} - -h2 { - color: #6a6a6a; - font-size: 30px; - font-weight: normal; -} - -body { - background-color: #fff; - min-width: 890px; -} - -/* Login Splash Page */ - -#splash { - background: #fafafa; -} - -#splash .login { - background: #fff url(/static/dashboard/img/logo-splash.png) no-repeat center 35px; - position: absolute; - top: 80px; - left: 50%; - margin: 0 0 0 -195px; - padding-top: 170px; - width: 390px; - border: 1px solid #e1e1e1; - max-height: none; - -webkit-border-radius: 6px; - -moz-border-radius: 6px; - border-radius: 6px; - -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - -webkit-background-clip: padding-box; - -moz-background-clip: padding-box; - background-clip: padding-box; - - form { - .error { - width: 100%; - } - input { - width: 350px; - } - select { - width: 360px; - } - } -} - -#splash .help-block { - display: none; -} - -#create_container_form .modal-footer{ - margin-top: 190px; -} - -.nav li a { - color: #8EACB7; - text-shadow: none; -} - -.container-fluid { - padding-left: 0; -} - -.sidebar { - background: #edf9ff; - border-right: 5px solid #e5e5e5; - border-bottom: 5px solid #e5e5e5; - float: left; -} - -.sidebar h4 { - margin-left: 14px; - color: #999; -} - -.sidebar .nav-tabs { - margin-top: -34px; -} - -.sidebar .nav-tabs li.active a { - background-color: #edf9ff; -} - -h1.brand { - width: 100%; - margin: 0; - background-color: #f5f5f5; - padding-bottom: 40px; -} - -h1.brand a { - background: url(/static/dashboard/img/logo.png) top left no-repeat; - display: block; - float: left; - width: 116px; - height: 123px; - text-indent: -9999px; - margin-left: 56px; - margin-top: 15px; - margin-bottom: 25px; -} - - -/* Tenant Dropdown */ - - -a.current_item { - width: 163px; - float: left; -} - -a.current_item:hover { - text-decoration: none; -} - -a.current_item:hover h3, a.current_item:hover h4 { - color: #39738c; -} - -.sidebar .switcher_bar { - width: 190px; - height: 38px; - padding: 5px 0; - margin-left: 14px; - margin-bottom: 15px; -} - -.sidebar .switcher_bar a.dropdown-toggle { - display: block; - padding: 5px 0; - background-image: url(/static/dashboard/img/drop_arrow.png); - border: 1px solid #c0d9e4; - background-color: #e9f5fa; - background-repeat: no-repeat; - background-position: 167px 23px; -} - -.sidebar .switcher_bar a.dropdown-toggle:hover { - text-decoration: none; - background-color: #cde8f4; -} - -.sidebar .switcher_bar:focus { - outline: none; -} - -.sidebar .switcher_bar h3 { - color: #4790ae; - font-size: 16px; - margin: -6px 0 0 14px; - padding: 0; - overflow: hidden; - text-overflow:ellipsis; - white-space: nowrap; - &:hover { - white-space: normal; - overflow: visible; - text-overflow: none; - padding-right: 1em; - word-wrap: break-word; - } -} - -.sidebar .switcher_bar h4 { - color: #6fabc4; - font-size: 10px; - text-transform: uppercase; - font-weight: normal; - padding: 0; -} - - -.sidebar .switcher_bar ul { - border: 1px solid #c0d9e4; - margin-left: -1px; - width: 190px; -} - -.sidebar .switcher_bar li a:hover{ - background: #92d6f1; -} - - -#usage { - margin-bottom: 25px; - height: 125px; -} - -.usage_block { - background: #e8f8ff; - color: #84b6c5; - border: 1px solid #afe3fb; - -webkit-border-radius: 5px; - -moz-border-radius: 5px; - border-radius: 5px; - float: left; - width: 29%; - margin-right: 5%; - min-height: 125px; -} - -.usage_block.last { - margin-right: 0; -} - - -.usage_block h3 { - background: #cef0ff; - color: #4fa5bf; - font-weight: normal; - padding: 0 0 0 10px; - border-bottom: 1px solid #c6e7f5; - -webkit-border-top-left-radius: 5px; - -webkit-border-top-right-radius: 5px; - -moz-border-radius-topleft: 5px; - -moz-border-radius-topright: 5px; - border-top-left-radius: 5px; - border-top-right-radius: 5px; -} -.usage_block ul { - margin: 10px; -} - -.usage_block .quantity { font-size: 25px; } - -.usage_block li { - font-size: 11px; - margin: 0 0 15px 0; -} - -.usage_block .unit{ - font-size: 11px; - text-transform: uppercase; - padding: 0 0 0 1px; -} - - -.table-bordered { - border: none; -} -.table_header { - min-height: 35px; - padding: 5px 0; -} -.table_caption th { - background-color: transparent; - border: none; -} -.table-bordered tr.table_caption + tr th { - border-top: 1px solid #ddd; -} -.table-bordered tr.table_caption + tr th:first-child, -.table-bordered tr.table_caption + tr th.hide + th { - -moz-border-radius-topleft: 4px; - -webkit-border-top-left-radius: 4px; - border-top-left-radius: 4px; - border-left: 1px solid #ddd; -} -.table-bordered tr.table_caption + tr th:last-child { - -moz-border-radius-topright: 4px; - -webkit-border-top-right-radius: 4px; - border-top-right-radius: 4px; - border-right: 1px solid #ddd; -} -.table-bordered tbody tr td:first-child, -.table-bordered tfoot tr td:first-child { - border-left: 1px solid #ddd; -} -.table-bordered tbody tr td:last-child, -.table-bordered tfoot tr td:last-child { - border-right: 1px solid #ddd; -} -.table-bordered tfoot tr td:first-child { - border-bottom: 1px solid #ddd; - -moz-border-radius-bottomleft: 4px; - -webkit-border-bottom-left-radius: 4px; - border-bottom-left-radius: 4px; -} -.table-bordered tfoot tr td:last-child { - border-bottom: 1px solid #ddd; - -moz-border-radius-bottomright: 4px; - -webkit-border-bottom-right-radius: 4px; - border-bottom-right-radius: 4px; -} -.table_title h3, .table_header h3 { - font-family: anivers; - font-weight: normal; - font-size: 24px; - margin-bottom: 5px; - float: left; -} -.table th.header { - cursor: pointer; -} -.table th.header:hover { - background-color: #e8e8e8; - text-decoration: underline; -} -.table tbody td.anchor a { - display: block; - padding: 8px; -} -.table tr.table_caption th.header:hover { - background-color: transparent; - cursor: default; -} -.table th.headerSortUp:hover, -.table th.headerSortDown:hover { - background-color: #dfdfdf; -} -.table th.headerSortUp, -.table th.headerSortDown { - background-color: #dfdfdf; - background-repeat: no-repeat; - background-position: 98% center; -} -.table th.headerSortDown { - background-image: url(/static/dashboard/img/drop_arrow.png); -} -.table th.headerSortUp { - background-image: url(/static/dashboard/img/up_arrow.png); -} -.table tr.summation td:first-child, -.table tr.summation td:last-child { - border-radius: 0; - border-bottom: 0 none; -} - -th { - background: #f1f1f1; -} -td.anchor { - padding: 0; -} - - -small { - font-size: 11px; -} - -.main_nav { - list-style: none; - width: 222px; - margin: 10px 0 20px 0; -} - -.main_nav a { - color: #999; - width: 185px; - padding: 10px; - display: block; - margin-left: 20px; -} - -.main_nav a.active { - background: #fff; - border: 2px solid #d8d8d8; - border-right: 0; - border-bottom-color: #ccc; -} - -table form { - margin-bottom: 0; - width: 1px; -} - -.messages { - position: fixed; - z-index: 9999; - top: 20px; - right: 20px; - width: 300px; - .alert-block { - -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - &.alert-error { - border: 1px solid @red; - } - &.alert-success { - border: 1px solid @green; - } - } -} - -.alert-block .alert-actions { - margin-top: -23px; - margin-right: -23px; -} - -.modal > form, -.login > form, -.alert-actions > form { - margin-bottom: 0; -} - -.alert-block p { - overflow: hidden; - word-wrap: break-word; -} - -.alert-block p:last-child { - margin-bottom: 0; -} - -#actions.single { - width: 90px; -} - -.table-striped tr td { - transition: background 0.2s; - -webkit-transition: background 0.2s; - -moz-transition: background 0.2s; - -o-transition: background 0.2s; -} - -.inspect { - float: left; - display: block; - margin-top: 5px; - margin-right: 25px; -} - -.table { - margin-bottom: 25px; -} - -.table tr td { - vertical-align: middle; -} - -.table tr.empty td { - text-align: center; -} - -.table tfoot tr td { - border-top: 1px solid #DDD; - background-color: #F1F1F1; - font-size: 11px; - line-height: 14px; -} - -.table_actions { - float: right; - min-width: 400px; -} - -.table_actions .table_search, .table_actions .table_filter { - display: inline-block; -} - -.table_search input { - background: url(/static/dashboard/img/search.png) no-repeat 195px 5px; - display: inline-block; - margin-bottom: 0; -} - -.table_actions a, .table_actions button { - float: right; - margin-left: 10px; -} - -.table_actions button.filter { - margin-left: 0; -} - -.table_actions { - .btn-icon(@x, @y, @icons: "/static/bootstrap/img/glyphicons-halflings.png") { - padding-left: 23px; - position: relative; - - &:before { - display: inline-block; - content: ""; - width: 18px; - height: 20px; - margin-top: 1px; - *margin-right: .3em; - line-height: 14px; - background-image: url(@icons); - background-position: @x @y; - background-repeat: no-repeat; - position: absolute; - top: 0px; - left: 0px; - } - } - - .btn-icon-danger(@x, @y) { - .btn-icon(@x, @y, "/static/bootstrap/img/glyphicons-halflings-white.png"); - } - - a.btn-create, a.btn-launch { - .btn-icon(-403px, -92px); - } - - a.btn-download { - .btn-icon(-91px, -19px); - } - - a.btn-upload { - .btn-icon(-283px, -92px); - } - - button.btn-delete, button.btn-terminate { - .btn-icon-danger(-451px, 5px); - } - -} - -.table_header .table_actions { - min-width: 0; -} - -.table_header .table_actions a, .table_header .table_actions > button, -.table_header .table_actions .table_search button { - display: inline-block; - float: none; -} - -.table_header .table_filter { - vertical-align: bottom; - margin-right: 20px; -} - -.table_header .table_filter i { - vertical-align: middle; -} - -.table_actions form { - float: right; - margin-left: 10px; -} - -.hidden { - display: none; -} - -/* - * Bootstrap styles table backgrounds using nth-child(2n+1), which is - * oblivious to hidden elements. The styles below allow us to override - * the bootstrap style when neccessary by setting the odd/even classes. - */ -.table-striped.datatable tbody { - tr.odd td { - background-color: #f9f9f9; - } - tr.even td { - background-color: inherit; - } - tr.odd:hover td, - tr.even:hover td, - tr:hover th { - background-color: #f5f5f5; - } -} - -.table-striped tbody tr.status_unknown:nth-child(odd) td { - background-color: #ffffb5; -} - -.table-striped tbody tr.status_unknown:nth-child(even) td { - background-color: #ffffc6; -} - -.nowrap-col { - white-space: nowrap; -} - -.overview { - font-size: 24px; -} - -#monitoring { - background: #f8f8f8; - font-size: 14px; - height: 20px; - margin: -18px 0 25px; - padding: 10px; - border: 1px solid #e1e1e1; - font-family: "anivers"; -} - -#monitoring h3 { - font-size: 14px; - font-weight: normal; - float: left; - line-height: 18px; -} - -#external_links, #external_links li { - float: left; -} -#external_links li { margin: 0 0 0 15px; } - -/* Forms */ - -form label { - text-align: left; - color: #555; - font-weight: bold; -} - -.modal { - width: 700px; - max-height: none; /* Prevents large modals from scrolling unnecessarily */ - top: 80px; - margin-top: 0; - position: absolute; -} - -.modal.loading { - width: 150px; - height: 150px; - margin: 0 auto; - overflow: hidden; -} - -.modal.loading p { - text-align: center; - position: absolute; - bottom: 0; - width: 150px; -} - -.datepicker { - margin-top: 10px; -} - -.datepicker input { - width: 65px; - margin-right: 10px; -} - -.datepicker .btn { - margin-right: 10px; -} - -form.horizontal .form-field { - float: left; - } - -form.horizontal.split_half .form-field { - width: 334px; /* Fits 2 fields to a row */ -} - -form.horizontal.split_quarter .form-field { - width: 167px; /* Fits 4 fields to a row */ -} - -form.horizontal.split_five .form-field { - width: 133px; /* Fits 5 fields to a row */ -} - -form.horizontal fieldset { - width: 100%; -} - -.modal-body { - overflow-y: visible; - max-height: none; -} - -.modal-body table { - margin-bottom: 30px; -} - -.modal-body ~ hr { - margin-bottom: 0; -} - -.static_page { - float: left; - width: 700px; - background-color: #FFF; - border: 1px solid #DDD; -} -.static_page > form { - margin-bottom: 0; -} - -.left { - float: left; - width: 347px; - margin-right: 15px; -} - -.left form { - margin: 0; -} - -.right { - float: left; - width: 308px; -} - -.workflow ul.nav-tabs { - padding: 0 10px; -} - -.workflow td.actions { - vertical-align: top; - width: 308px; - padding-right: 10px; -} - -.workflow td.help_text { - vertical-align: top; - width: 340px; - padding-left: 10px; - border-left: 1px solid #DDD; -} - -.workflow fieldset > table { - margin-bottom: 0; -} - -.clear { - clear: both; - width: 0; - height: 0; - padding: 0; - margin: 0; -} - -.modal-body fieldset { - margin: 0; - padding: 0; -} - -.modal-body fieldset ul { - width: 90%; -} - -.modal-body fieldset .form-field input, -.modal-body fieldset .form-field textarea { - width: 298px; -} -.modal-body fieldset .form-field select { - width: 308px; -} -.modal-body fieldset .form-field textarea { - height: @baseLineHeight * 2; -} - -.modal-footer input { - width: auto; -} - -.modal-body .modal-footer { - width: 670px; - margin-left: -25px; - margin-right: -15px; -} - -.modal-footer a.close { - margin-top: 0; - margin-right: 5px; - font-size: 12px; - color: #666; - font-weight: normal; - filter: alpha(opacity=100); - -khtml-opacity: 1; - -moz-opacity: 1; - opacity: 1; -} - -.modal-footer a.close:hover { - color: #333; - text-decoration: underline; -} - -.modal-body .help-block { - text-align: left; - float: left; - width: 100%; - margin-bottom: 10px; -} - -#create_keypair_modal .clearfix { - margin-bottom: 115px; -} - -#actions { - width: 90px; -} -#actions .btn { - margin-bottom: 5px; -} -#actions a.btn { - width: 70px; -} - -#actions input.btn { - text-align: left; -} - -#images #actions { - width: 100px; -} - -/*New List Patches*/ -.details-modal .modal-body { - padding-bottom: 20px; -} - -.form-inline { - display: inline; - input, button, a.btn { - margin-left: 5px; - } -} - -td.select { - width: 10px; -} - -/* Actions dropdown */ - -td.actions_column { - white-space: nowrap; - padding: 10px; - position: relative; - width: 200px; -} - -td.actions_column .btn-group { - display: inline-block; -} - -td.actions_column .row_actions a, -td.actions_column .row_actions input, -td.actions_column .row_actions button { - background: none; - float: none; - display: block; - padding: 5px 10px; - color: black; - text-align: left; - border-radius: 0; - border: 0 none; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; -} - -td.actions_column .row_actions .hide { - display: none; -} - -td.actions_column .btn-action-required { - font-weight: bold; -} - -.tab-content { - overflow: visible; -} - -/* Makes size consistent across browsers when mixing "btn-group" and "small" */ -.btn.hide, .btn-group .hide { - display: none; -} -.btn-group .dropdown-toggle:focus { - outline: none; -} -.dropdown-menu button { - line-height: 18px; /* Matches rule for ".dropdown-menu a" in bootstrap */ - width: 100%; -} -.btn-group .dropdown-menu .btn { - border-radius: 0; -} -.dropdown-menu .btn.btn-danger, -.dropdown-menu .btn.btn-danger:hover, -.dropdown-menu .btn.btn-success, -.dropdown-menu .btn.btn-success:hover, -.dropdown-menu .btn.btn-info, -.dropdown-menu .btn.btn-info:hover { - text-shadow: none; /* remove default bootstrap shadowing from button text. */ -} -.dropdown-menu li:hover { - background: none; -} -.dropdown-menu li.divider:hover { - background-color: #E5E5E5; -} - -td.actions_column .dropdown-menu a:hover, -td.actions_column .dropdown-menu button:hover { - background-color: #CDCDCD; -} -.dropdown-menu .btn.btn-danger { - color: #C43C35; -} -.dropdown-menu .btn.btn-danger:hover { - background-color: #f6e0df; -} - - -/* Overrides for single-action rows (no dropdown) */ - -tr td.actions_column ul.row_actions.single, -tr:hover td.actions_column ul.row_actions.single, -td.actions_column ul.row_actions.single, -td.actions_column ul.row_actions.single:hover { - border: none; -} - -td.actions_column ul.row_actions.single li.action { - display: block; -} - -td.actions_column ul.row_actions.single li.action:hover { - background-color: transparent; -} - -td.actions_column ul.row_actions.single a, -td.actions_column ul.row_actions.single input, -td.actions_column ul.row_actions.single button { - color: #43a1d6; -} - -td.actions_column ul.row_actions.single a:hover, -td.actions_column ul.row_actions.single input:hover, -td.actions_column ul.row_actions.single button:hover { - color: black; -} - -th.multi_select_column, td.multi_select_column { - width: 25px; -} - -th.multi_select_column, td.multi_select_column { - text-align: center; -} - -.table-fixed { - table-layout: fixed; -} - -.table input[type="checkbox"] { - display: inline; -} - -div.input input[type="checkbox"] { - float: left; - width: 25px; -} - -.table_title a { - font-size: 11px; - float: right; - margin-left: 10px; - margin-top: 10px; -} - -tr.terminated { - color: #999999; -} - -#instance_tabs { - float: left; - width: 100%; - border-bottom: 1px solid #e1e1e1; -} - -#instance_tabs li a { - background: #f2f2f2; - display: block; - font-size: 14px; - float: left; - padding: 5px 10px; - margin-right: 10px; - border: 1px solid #e1e1e1; - border-bottom: none; -} - -#instance_tabs li.active a { - background: #fff; - padding-bottom: 8px; - margin-bottom: -5px; -} - -#main_content .nav-tabs { - margin-bottom: 0; -} - -#main_content .tab-content { - border: 1px solid #ddd; - border-top: 0 none; - padding: 10px; -} - -#main_content .workflow .modal-body { - padding-left: 0; - padding-right: 0; -} - -#main_content .workflow .modal-body .tab-content { - border-left: 0 none; - border-right: 0 none; - border-bottom: 0 none; -} - -.tab_wrapper { - padding-top: 50px; -} - -/* Fix tooltip z-index to show above modals. Bootstrap bug 582*/ -.tooltip { - z-index: 12000; -} - -.volume_boot_disclosure { - font-weight: bold; - color: #555; - cursor: pointer; - background-image: url(/static/dashboard/img/right_droparrow.png); - background-repeat: no-repeat; - background-position: 130px center; -} - -.volume_boot_disclosure.on { - width: 334px; - margin-bottom: 10px; - border-bottom: solid 1px #E1E1E1; - background-image: url(/static/dashboard/img/drop_arrow.png); -} - -form div.clearfix.error { - width: 308px; -} - -.nav-tabs a { - cursor: pointer; -} - -.nav-tabs li.error a { - color: #B94A48; -} - -.nav-tabs li.error a:after { - content: "*"; -} - -/* Region selector in header */ - -#region_selector { - position: absolute; - z-index: 9999; - right: 0; - top: 24px; -} - -#region_selector a { margin-left: 0; } - -#region_selector ul{ - float: left; - margin-left: 5px; - padding-right: 21px; - width: 125px; -} -#region_selector ul:hover a { display: block; } - -#region_selector li a{ - padding: 3px 3px 3px 5px; - display: none; - background: #E1E1E1; - margin-top: -10px; -} - -#region_selector li:first-child p{ - background: #EDEDED url(/static/dashboard/img/drop_arrow.png) no-repeat 106px 9px !important; - display: block; - border: 1px solid #e1e1e1; - padding: 5px; -} - -iframe { - border: none; -} - -.item_detail ul li label { - color: #000; - font-weight: bold; - display: block; - margin-top: 5px; -} - -.progress_bar { - height: 100%; - width: 100%; - border: 1px solid #CCC; - background-color: #CCC; -} - -.progress_bar_fill, -.progress_bar_selected { - height: 100%; - float: left; -} - -.progress_bar_fill { - background-color: #666; -} - -.progress_bar_selected { - background-color: #4790AE; - width: 0; -} - -.progress_bar_over { - background-color: red; -} - -.d3_quota_bar { - width: 20%; - margin-bottom: 8px; - margin-top: 10px; - float: left; - text-align: center; -} - -.quota-dynamic { - overflow: hidden; - margin-bottom: 8px; -} - -.quota_title { - color: #999; - padding-bottom: 0; - margin-bottom: 8px; -} - -.quota_title strong { - color: #000; -} - -.quota_title strong span { - font-weight: normal; -} - -.quota_title p { - float: right; - margin-bottom: 0; -} - -.quota_bar { - height: 15px; - margin: -8px 0 8px; -} - -div .flavor_table { - border: 1px solid #AAA; - width: 100%; - margin-bottom: 14px; -} - -.flavor_table .flavor_name { - white-space: nowrap; - font-weight: bold; - text-align: left; - padding: 7px 12px 7px 7px; - width: 160px; -} - -#main_content .row-fluid { - margin: 10px 0 20px; -} - -#main_content .row-fluid:last-child { - margin-bottom: 0; -} - -.header_rule { - margin: 0 0 10px; -} - -.item_detail .detail_section { - margin-bottom: 25px; - float: left; - margin-right: 50px; -} - -.error .help-inline, .dynamic-error { - background: #efdfdf; - border: 1px solid #ead5d8; - padding: 10px; - display: block; -} -.dynamic-error { - color: #b94a48; - margin-bottom: 0.5em; -} - -label.log-length { - line-height: 28px; - margin-right: 10px; -} - - -.progress-success.bar { - background-color: #5eb95e; - background-image: -moz-linear-gradient(top, #62c462, #57a957); - background-image: -ms-linear-gradient(top, #62c462, #57a957); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62c462), to(#57a957)); - background-image: -webkit-linear-gradient(top, #62c462, #57a957); - background-image: -o-linear-gradient(top, #62c462, #57a957); - background-image: linear-gradient(top, #62c462, #57a957); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0); -} - -.progress_bar_fill.progress-warning.bar { - background-color: #898989; - background-image: -moz-linear-gradient(top, #999999, #333333); - background-image: -ms-linear-gradient(top, #999999, #333333); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#999999), to(#333333)); - background-image: -webkit-linear-gradient(top, #999999, #333333); - background-image: -o-linear-gradient(top, #999999, #333333); - background-image: linear-gradient(top, #999999, #333333); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#999999', endColorstr='#333333', GradientType=0); -} - -.progress_bar_over.bar { - background-color: #dd514c; - background-image: -moz-linear-gradient(top, #ee5f5b, #c43c35); - background-image: -ms-linear-gradient(top, #ee5f5b, #c43c35); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ee5f5b), to(#c43c35)); - background-image: -webkit-linear-gradient(top, #ee5f5b, #c43c35); - background-image: -o-linear-gradient(top, #ee5f5b, #c43c35); - background-image: linear-gradient(top, #ee5f5b, #c43c35); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee5f5b', endColorstr='#c43c35', GradientType=0); -} - -.split_five div.control-group input[type="text"], -.split_five div.control-group select { - width: 120px; -} - -.warning { - background-color: @errorBackground; - border-bottom: 1px solid @red; - padding: 5px 10px; - .warning-text { - text-align: center; - h3, a { - display: inline-block; - } - h3 { - vertical-align: bottom; - } - } -} -#admin_warning_detail { - ul { - list-style: circle; - padding-left: 20px; - margin-bottom: 10px; - } -} - -.no_split { - margin-top: -60px; -} - -/* Project Membership UI */ -.project_membership { - min-height: 200px; - - /* Buttons */ - .btn-group { - margin-left:0px; - padding: 2px 10px 0 0; - margin-bottom: 0px; - border: 1px solid #DDD; - border-bottom: none; - } - .btn-group .active { - float: right; - } - a.btn-primary:hover { - background-color: #04C; - } - - /* Header */ - .help_text { - margin-left: 15px; - margin-bottom: 15px; - } - .users_title { - color: #555; - font-weight: bold; - padding-left: 10px; - float: left; - } - input { - background: url(/static/dashboard/img/search.png) no-repeat 105px 5px whiteSmoke; - } - .fake_table_header { - background-color: #F1F1F1; - width: 306px; - height: 38px; - padding-top: 15px; - border: 1px solid #DDD; - border-bottom: none; - } - - /* 'Fake table' body */ - .fake_table { - margin-left: 5px; - width: 315px; - ul.no_results { - width: 298px; - } - ul.btn-group:hover { - background-color: #DDD; - } - } - .left { - .fake_table_header { - width: 318px; - } - } - .right { - .fake_table_header { - width: 318px; - margin-left: -15px; - } - .fake_table ul.no_results { - margin-left: -20px; - } - } - - /* User lists */ - .member { - padding: 10px; - text-align: left; - } - .project_members { - margin-left: -20px; - } - .project_members ul.btn-group, - .available_users ul.btn-group { - width: 308px; - } - .dark_stripe { - background-color: #F9F9F9; - } - .light_stripe { - background-color: white; - } - .last_stripe { - border-bottom: 1px solid #DDD; - } - - /* List filtering */ - .filter { - width: 120px; - margin: -5px 13px 15px 0px; - float: right; - } - .no_results { - border: 1px solid #DDD; - padding: 10px; - opacity: 0.5; - } - - /* Role dropdown menus */ - .role_dropdown li { - cursor: pointer; - background: none; - float: none; - display: block; - padding: 5px 10px; - color: black; - text-align: left; - border-radius: 0; - border: 0 none; - -webkit-box-shadow: none; - -moz-box-shadow: none; - box-shadow: none; - z-index: 99999; - i { - opacity: 0; - } - - &:hover { - background-color: #CDCDCD; - } - &.selected i { - opacity: 1; - } - } - .dropdown-menu.role_dropdown { - right: 0; - left: auto; - } - .nav .role_options { - float: right; - padding-right: 5px; - } -} - -/* Inline user creation */ -.add_user_btn { - display: inline; -} -#add_user { - clear: both; -} -.add_user { - float: right; - margin-top: 10px; - margin-right: 15px; -} - -/* Fixes overflow on dropdowns in modal */ -.dropdown_fix { - overflow: visible; -} - -/* Replaces CPU hungry spin.js with animated gif */ -.loading_gif { - width: 35px; - height: 13px; - padding-top: 2px; - padding-right: 5px; - float: left; -} - -.action_required_img { - width: 35px; - height: 13px; - padding-top: 2px; - padding-right: 5px; - float: left; -} - -//ResourceBrowser -@dataTableBorderWidth: 1px; -@dataTableBorderColor: #DDD; - -@actionsColumnPadding: 10px; - -@smallButtonHeight: 28px; -@tdHeight: @smallButtonHeight; - -@tableCellPadding: 8px; - -@contentTableWidth: 70%; -@navigationTableWidth: 30%; -@browserWrapperWidth: 100%; - -/* ResourceBrowser style */ -#browser_wrapper { - width: @browserWrapperWidth; - min-width: 1000px; - background-color: @grayLighter; - border: @dataTableBorderWidth solid @dataTableBorderColor; - .border-radius(4px); - .tfoot { - clear: both; - padding: 8px; - border-top: 1px solid @dataTableBorderColor; - background-color: #F1F1F1; - font-size: 11px; - line-height: 14px; - span { - display: inline-block; - &.navigation_table_count { - width: @navigationTableWidth; - } - } - } - form, table{ - margin-bottom: 0; - } - .navigation_wrapper, .content_wrapper{ - position: relative; - float: left; - } - div.navigation_wrapper { - z-index: 10; - width: @navigationTableWidth; - div.table_wrapper, - thead th.table_header { - border-right: 0 none; - border-top-right-radius: 0; - } - td { - &:first-child { - border-left: 0 none; - } - &.breadcrumb_td { - padding-right: 0px; - max-width: 200px; - } - } - tr.current_selected td { - background-color: #E9F5FA; - } - tfoot td { - border-right: 0 none; - border-bottom-right-radius: 0; - } - ul.breadcrumb { - padding-right: 0px; - border-top-right-radius: 0px; - border-bottom-right-radius: 0px; - border-right: none; - white-space: nowrap; - } - tbody td { - border-right: @dataTableBorderWidth solid @dataTableBorderColor; - background-color: @white; - } - } - div.content_wrapper { - width: @contentTableWidth; - div.table_wrapper, - thead th.table_header { - border-left: 0 none; - border-top-left-radius: 0; - } - td{ - border-bottom: @dataTableBorderWidth solid @dataTableBorderColor; - &:last-child { - border-right: 0 none; - } - &.breadcrumb_td { - padding-left: 0px; - } - } - tfoot td { - border-left: 0 none; - border-bottom-left-radius: 0; - } - /* FIXME(Ke Wu): for now there are two breadcrumb tr in both table - * and this one in the content table is hidden. This hack is made to - * fix the alignment of two table, needs a better solution in the - * future. - */ - ul.breadcrumb { - padding-left: 0px; - border-top-left-radius: 0px; - border-bottom-left-radius: 0px; - border-left: none; - li { - visibility: hidden; - } - } - } - table { - border-collapse: collapse; - thead { - tr th { - border-bottom: none; - background-color: @grayLighter; - } - } - tbody { - tr:last-child td { - border-bottom: 1px solid #ddd; - border-radius: 0; - } - tr.empty td { - height: @tdHeight; - padding: @actionsColumnPadding; - } - td.actions_column { - position: static; - } - } - } - .breadcrumb{ - padding: 6px; - margin: 0 0 1px 0; - } -} - -/* Styling for inline object creation buttons */ -.btn-inline { - margin-bottom: 9px; -} -.modal-body fieldset .form-field select[data-add-item-url] { - width: 275px; - margin-right: 2px; -} - -/* Styling for draged network object */ -#networkListSortContainer { - display: none; -} -.networklist { - padding: 6px; - background: #eee; - border: 1px solid #ccc; - min-height: 2em; - width: auto !important; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - li { - width: 226px; - list-style-type: none; - margin: 6px auto; - padding: 3px; - background: #fff; - border: 1px solid #aaa; - line-height: 18px; - border-radius: 3px; - cursor: move; - padding-left: 23px; - background: white url(/static/dashboard/img/drag.png) no-repeat 11px 50%; - em { - font-size: 0.5em; - line-height: 1em; - color:#999; - font-style: normal; - margin-left: 0.8em; - } - i { - margin-right: 5px; - vertical-align: middle; - } - a.btn { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - font-size: 11px; - line-height: 12px; - padding: 2px 5px 3px; - margin-right: 1px; - width: 18px; - text-align: center; - //position: absolute; - right:5px; - vertical-align: middle; - float: right; - &:before { - content: "+"; - } - } - } - li.ui-sortable-helper { - background-color: #def; - } - li.ui-state-highlight { - border: 1px dotted #ccc; - background: #efefef; - height: 0.5em; - } - li:after { - visibility: hidden; - display: block; - font-size: 0; - content: " "; - clear: both; - height: 0; - } -} -#selected_network { - margin-bottom: 1.5em; - counter-reset:v1 0; - background: #edf9ff; - border:1px solid #c0d9e4; - li { - position: relative; - a.btn { - &:before { - content: "-"; - } - } - } - li:before { - content:"nic:"counter(v1); - counter-increment:v1; - display: inline-block; - margin-right: 5px; - background: #666; - color:#fff; - font-size: 90%; - padding: 0px 4px; - vertical-align: middle; - border-radius: 2px; - position: absolute; - left: -2em; - } - &.dragging { - li:before { - content:"nic:"; - background-color:rgba(102,102,102,0.5); - padding-right: 10px; - } - li.ui-state-highlight:before { - content:""; - background:transparent; - } - } - -} - -/* Styling for network topology */ -.box-sizing(@box: border-box) { - -webkit-box-sizing: @box; - -moz-box-sizing: @box; - -ms-box-sizing: @box; - -o-box-sizing: @box; - box-sizing: @box; -} - -@-webkit-keyframes progress-bar-stripes { - from { - background-position: 20px 0; - } - to { - background-position: 0 0; - } -} - -@-moz-keyframes progress-bar-stripes { - from { - background-position: 20px 0; - } - to { - background-position: 0 0; - } -} - -@-ms-keyframes progress-bar-stripes { - from { - background-position: 20px 0; - } - to { - background-position: 0 0; - } -} - -@-o-keyframes progress-bar-stripes { - from { - background-position: 0 0; - } - to { - background-position: 20px 0; - } -} - -@keyframes progress-bar-stripes { - from { - background-position: 20px 0; - } - to { - background-position: 0 0; - } -} - -#topologyCanvas { - .box-sizing(); - width: 100%; - height: 500px; - padding: 25px; - padding-left: 50px; - background: #efefef; - div.nodata { - font-size: 150%; - font-weight: bold; - text-align: center; - padding-top: 200px; - display: none; - } -} -div.networks { - height: 100%; -} -div.network { - .box-sizing(); - float: left; - width: 270px; - height: 100%; - position: relative; - .nicname { - .box-sizing(); - height: 100%; - width: 17px; - border-radius: 17px; - z-index: 200; - color:#fff; - position: absolute; - left: -8px; - top: 0px; - cursor: pointer; - &:hover { - background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)); - background-image: -moz-linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)); - background-image: -ms-linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)); - background-image: -o-linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)); - background-image: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)); - background-size: 10px 10px; - } - &.nourl { - cursor: auto; - &:hover { - background-image:none; - } - } - h3 { - font-size: 12px; - line-height: 1; - position: relative; - font-weight: normal; - top:55%; - color:#fff; - left:-1px; - letter-spacing: 0.2em; - -webkit-transform: rotate(-90deg); - -moz-transform: rotate(-90deg); - -ms-transform: rotate(-90deg); - -o-transform: rotate(-90deg); - transform: rotate(-90deg); - - white-space: nowrap; - text-shadow: 0px 0px 5px #000; - } - span.ip { - position: absolute; - bottom:-10px; - left:20px; - color: #000; - display: block; - font-weight: normal; - font-size: 90%; - letter-spacing: 0.2em; - -webkit-transform: rotate(-90deg); - -moz-transform: rotate(-90deg); - -ms-transform: rotate(-90deg); - -o-transform: rotate(-90deg); - transform: rotate(-90deg); - -webkit-transform-origin: 0% 0%; - -moz-transform-origin: 0% 0%; - -ms-transform-origin: 0% 0%; - -o-transform-origin: 0% 0%; - transform-origin: 0% 0%; - white-space: nowrap; - text-shadow: 0px 0px 2px #fff,0px 0px 2px #fff; - } - } - .router, .server, .device { - .box-sizing(); - cursor: pointer; - width: 90px; - border: 3px solid #444; - position: absolute; - top:30px; - left:90px; - color:#fff; - padding: 0 3px; - background: #666; - margin-bottom: 20px; - border-radius: 8px; - &:before { - content: ""; - width: 20px; - height: 20px; - border: 2px solid #444; - line-height: 1.2; - position: absolute; - border-radius: 20px; - top:-10px; - left:-10px; - background:#fff url(/static/dashboard/img/router.png) no-repeat center center; - background-size: 16px 16px; - } - &:after { - content: ""; - width: 100%; - line-height: 1.2; - position: absolute; - text-align: center; - border-radius: 0; - background: #444; - color: #fff; - font-size: 11px; - height: 1.5em; - bottom:0px; - left: 0px; - } - span.devicename { - position: absolute; - color: #fff; - bottom: 0px; - font-size: 12px; - line-height: 14px; - width: 100%; - text-align: center; - z-index:300; - left:-2px; - } - span.name { - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - display: block; - font-size : 12px; - position: relative; - z-index:10; - text-align: center; - top:4px; - padding: 0 3px; - } - div.port { - text-align: right; - min-width: 90px; - height: 10px; - font:0px/0px sans-serif; - position: absolute; - left:-91px; - top:8px; - background-color: #37a9e3; - background-image: none; - -webkit-background-size: 20px 20px; - -moz-background-size: 20px 20px; - -o-background-size: 20px 20px; - background-size: 20px 20px; - z-index:100; - span.ip { - .box-sizing(); - color: #333; - font-size: 9px; - line-height: 1; - text-shadow: 0px -1px #fff; - position: relative; - width: 90px; - display: inline-block; - padding-right:8px; - padding-left: 8px; - word-wrap:break-word; - word-break:break-all; - } - &.right { - left:auto; - right:-92px; - width: 92px; - text-align: left; - span.ip { - } - } - } - &:hover { - div.port { - cursor:pointer; - background-color: #2688c0; - -webkit-animation: progress-bar-stripes 1s linear infinite; - -moz-animation: progress-bar-stripes 1s linear infinite; - -ms-animation: progress-bar-stripes 1s linear infinite; - -o-animation: progress-bar-stripes 1s linear infinite; - animation: progress-bar-stripes 1s linear infinite; - &:hover { - -webkit-animation: progress-bar-stripes 0.3s linear infinite; - -moz-animation: progress-bar-stripes 0.3s linear infinite; - -ms-animation: progress-bar-stripes 0.3s linear infinite; - -o-animation: progress-bar-stripes 0.3s linear infinite; - animation: progress-bar-stripes 0.3s linear infinite; - } - &.nourl { - cursor: auto; - background-image:none; - &:hover { - background-image:none; - } - } - } - border-color: #222; - &:after { - background-color: #222; - border-color: #222; - } - } - } - .device { - border:none; - background: transparent; - } - .server { - &:before { - background:#fff url(/static/dashboard/img/server.png) no-repeat center center; - background-size: 14px 14px; - } - background: #fff; - color:#333; - } -} - -.launchButtons { - text-align: right; - margin: 10px 0px 15px 10px; - a.btn { - margin-left: 10px; - } -} - -/**** Resource Topology CSS ****/ -.link {stroke: #000;stroke-width: 1.5px;} -.node {cursor:pointer;} -.node text {font: 12px sans-serif;} - -#resource_container {position:relative;} -#stack_box {position:absolute;width:300px;top:10px;left:10px;} -#stack_box h3 {font-size:11pt;line-height:20px;} -#stack_box p {margin:0;font-size:9pt;line-height:14px;} -#stack_box a {margin:0;font-size:9pt;line-height:14px;} -#stack_box img {float:left;} -#stack_box #stack_info {float:left;white-space:normal;width:200px;} - -#info_box {position:absolute;width:300px;top:100px;left:10px;} -#info_box h3 {font-size:9pt;line-height:20px;} -#info_box p {margin:0;font-size:9pt;line-height:14px;} -#info_box a {margin:0;font-size:9pt;line-height:14px;} -#info_box .error {color:darkred;}
\ No newline at end of file |