| /** |
| * 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. |
| */ |
| @import 'common.less'; |
| |
| #config_history_flow { |
| .version-slider { |
| .flow-element { |
| .version-box .box { |
| font-size: 13px; |
| .label-current { |
| padding-top: 2px; |
| } |
| } |
| .arrow-box { |
| margin-left: 5px; |
| } |
| } |
| } |
| .version-info-bar { |
| width: 960px; |
| .label-current.icon-ok { |
| padding: 6px 5px !important; |
| } |
| } |
| } |
| |
| .dependencies-info-bar-wrapper { |
| z-index: 2; |
| margin: 0 0 20px; |
| width: 757px; |
| .alert { |
| margin: 0; |
| } |
| } |
| @media (min-width: 1200px) { |
| .dependencies-info-bar-wrapper { |
| width: 970px; |
| } |
| } |
| |
| #config_history_flow { |
| margin-top: -5px; |
| .version-slider { |
| width: 100%; |
| height: 69px; |
| margin: 5px 0; |
| .flow-element { |
| height: 69px; |
| width: 15.2%; |
| max-width: 146px; |
| .version-box { |
| position: relative; |
| height: 90%; |
| } |
| .version-box .box { |
| cursor: pointer; |
| width: 92%; |
| height: 100%; |
| background-color: #ffffff; |
| -webkit-border-radius: 4px; |
| -moz-border-radius: 4px; |
| border-radius: 4px; |
| border: 1px solid #d2d9dd; |
| font-size: 11px; |
| .top-label { |
| min-width: 20px; |
| padding: 0 2px; |
| } |
| .author, |
| .content { |
| padding: 0 2px; |
| text-align: center; |
| color: #555555; |
| display: block; |
| overflow: hidden; |
| text-overflow: ellipsis; |
| white-space: nowrap; |
| } |
| .content { |
| max-width: 97% !important; |
| } |
| .author { |
| max-width: 75% !important; |
| } |
| .current-label { |
| text-align: center; |
| padding: 2px 5px; |
| } |
| .stack-label { |
| margin-right: 6px; |
| text-align: right; |
| line-height: 11px; |
| } |
| } |
| .version-box .version-popover { |
| display: none; |
| position: absolute; |
| bottom: 50px; |
| left: -45px; |
| z-index: 1000; |
| float: left; |
| width: 300px; |
| padding: 8px; |
| list-style: none; |
| background-color: #ffffff; |
| border: 1px solid #c3c3c3; |
| -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); |
| -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); |
| box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); |
| -webkit-background-clip: padding-box; |
| -moz-background-clip: padding; |
| background-clip: padding-box; |
| font-size: 13px; |
| .content { |
| padding: 1px 5px 15px 5px; |
| text-align: left; |
| .notes{ |
| overflow-wrap: break-word; |
| word-wrap: break-word; |
| white-space: pre-wrap; |
| } |
| .date{ |
| color: #808080; |
| font-size: 11px; |
| white-space: nowrap; |
| } |
| } |
| .version-operations-buttons .btn { |
| font-size: 13px; |
| } |
| } |
| .version-box:hover{ |
| .box { |
| background-color: #e6f1f6; |
| } |
| } |
| .version-box .box.displayed { |
| background-color: #e6f1f6; |
| .content { |
| color: #444444; |
| } |
| } |
| .version-box .box.grayedOut { |
| background-color: #f4f4f4; |
| border: 1px solid #f4f4f4; |
| .author, |
| .content, |
| .stack-label { |
| color: #a6a6a6; |
| } |
| .current-label .label, |
| .top-label .label { |
| opacity: .5; |
| } |
| |
| } |
| |
| } |
| .first { |
| width: 14%; |
| margin-left: 0; |
| .arrow-box { |
| display: none; |
| } |
| .version-box .box { |
| width: 100%; |
| } |
| } |
| |
| .icon-chevron-box { |
| margin-top: 15px; |
| width: 4%; |
| cursor: pointer; |
| .icon-chevron-right, |
| .icon-chevron-left{ |
| color: #d2d9dd; |
| } |
| .icon-chevron-left:hover, |
| .icon-chevron-right:hover{ |
| color: #808080; |
| } |
| &.disabled { |
| cursor: not-allowed; |
| } |
| } |
| } |
| .version-info-bar-wrapper { |
| margin: 0; |
| z-index: 3; |
| width: 747px; |
| } |
| @media (min-width: 1200px) { |
| .version-info-bar-wrapper { |
| width: 960px; |
| } |
| } |
| .version-info-bar { |
| background-image: -moz-linear-gradient(top, @top-nav-bg-color-from, @top-nav-bg-color-to); |
| background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@top-nav-bg-color-from), to(@top-nav-bg-color-to)); |
| background-image: -webkit-linear-gradient(top, @top-nav-bg-color-from, @top-nav-bg-color-to); |
| background-image: -o-linear-gradient(top, @top-nav-bg-color-from, @top-nav-bg-color-to); |
| background-image: linear-gradient(to bottom, @top-nav-bg-color-from, @top-nav-bg-color-to); |
| filter: progid:DXImageTransform.Microsoft.gradient(startColorstr= @top-nav-bg-color-from, endColorstr=@top-nav-bg-color-to); //for IE9- |
| -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 1px 10px rgba(0, 0, 0, 0.1); |
| -moz-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 1px 10px rgba(0, 0, 0, 0.1); |
| box-shadow: inset 0 0 0 rgba(0, 0, 0, 0.1), 0 1px 10px rgba(0, 0, 0, 0.1); |
| -webkit-border-radius: 4px; |
| -moz-border-radius: 4px; |
| border-radius: 4px; |
| margin: 5px 0; |
| padding: 5px; |
| width: 100%; |
| |
| .icon-remove-circle { |
| color: #ffffff; |
| margin-left: 10px; |
| margin-top: 0px; |
| display: inline-block; |
| cursor: pointer; |
| } |
| .label-wrapper { |
| line-height: 30px; |
| margin-left: 10px; |
| color: #d3d3d3; |
| .label { |
| font-size: 14px; |
| padding: 5px; |
| } |
| } |
| |
| ul#dropdown_menu { |
| position: absolute; |
| left: 0; |
| z-index: 1000; |
| min-width: 400px; |
| padding: 5px 0; |
| margin: 0; |
| } |
| |
| #dropdown_content { |
| overflow: hidden; |
| &::-webkit-scrollbar { |
| display: none; |
| } |
| } |
| |
| #dropdown_outer_container, #dropdown_menu_container { |
| min-width: 400px; |
| height: 300px; |
| } |
| |
| #dropdown_outer_container { |
| position: relative; |
| overflow: hidden; |
| } |
| |
| #dropdown_inner_container { |
| position: absolute; |
| left: 0; |
| overflow-x: hidden; |
| overflow-y: scroll; |
| &::-webkit-scrollbar { |
| display: none; |
| } |
| } |
| |
| .dropdown-menu { |
| min-width: 400px; |
| margin-top: 4px !important; |
| font-size: 13px; |
| li { |
| line-height: 12px; |
| .icon-caret-right { |
| font-size: 18px; |
| margin-right: 20px; |
| } |
| } |
| li:hover { |
| background-color: #666666; |
| background-image: linear-gradient(to bottom, #666666, #555555); |
| color: #ffffff; |
| } |
| li.not-allowed { |
| // the version which is displayed |
| cursor: not-allowed; |
| color: #808080; |
| .icon-caret-right, |
| .dropdown-menu { |
| display: none; |
| } |
| } |
| li.not-allowed:hover { |
| background-color: #ffffff; |
| background-image: none; |
| color: #808080; |
| } |
| |
| div.row-fluid, a { |
| padding-left: 10px; |
| } |
| } |
| .dropdown-submenu .dropdown-menu { |
| min-width: 200px; |
| max-width: 300px; |
| line-height: 20px; |
| font-size: 13px; |
| margin: 0px; |
| padding: 8px; |
| color: #333333; |
| cursor: default; |
| .content { |
| padding: 1px 5px 15px 5px; |
| .group { |
| text-align: right; |
| margin-top: -20px; |
| } |
| .date{ |
| color: #808080; |
| font-size: 11px; |
| white-space: nowrap; |
| } |
| .notes{ |
| word-wrap: break-word; |
| overflow-wrap: break-word; |
| white-space: pre-wrap; |
| } |
| } |
| .version-operations-buttons .btn { |
| font-size: 13px; |
| } |
| } |
| } |
| |
| #config_version_popup { |
| z-index: 1001; |
| line-height: 20px; |
| padding: 8px; |
| font-size: 13px; |
| .content { |
| padding: 1px 5px 15px 5px; |
| .group { |
| text-align: right; |
| margin-top: -20px; |
| } |
| .date{ |
| color: #808080; |
| font-size: 11px; |
| white-space: nowrap; |
| } |
| .notes{ |
| word-wrap: break-word; |
| overflow-wrap: break-word; |
| white-space: pre-wrap; |
| } |
| } |
| .version-operations-buttons .btn { |
| font-size: 13px; |
| } |
| } |
| .stack { |
| padding: 1px 10px; |
| font-size: 11px; |
| } |
| } |
| |
| #config_history { |
| .table { |
| thead { |
| background: none repeat scroll 0 0 #F8F8F8; |
| } |
| // service name column |
| th:first-child, |
| td:first-child { |
| width: 15%; |
| select.filter-input-width{ |
| width: 75%; |
| } |
| } |
| // config group, create time columns |
| th:first-child + th, |
| td:first-child + td, |
| th:first-child + th + th, |
| td:first-child + td + td { |
| width: 20%; |
| word-wrap: break-word; |
| select.filter-input-width{ |
| width: 75%; |
| } |
| } |
| // author column |
| th:first-child + th + th + th, |
| td:first-child + td + td + td { |
| width: 180px; |
| input.filter-input-width { |
| width: 55%; |
| } |
| } |
| // notes column |
| th:first-child + th + th + th + th, |
| td:first-child + td + td + td + td { |
| word-wrap: break-word; |
| input.filter-input-width { |
| width: 75%; |
| } |
| } |
| td.notes .show-more-button { |
| font-size: @default-font-size - 1; |
| } |
| } |
| div.page-bar div.filtered-info { |
| margin-left: 17px; |
| } |
| a { |
| cursor: pointer; |
| } |
| } |
| |
| .version-in-dropdown [class*="span"] { |
| min-height: 24px; |
| } |
| |
| // Firefox specific styles |
| @-moz-document url-prefix() { |
| #config_history_flow { |
| .version-info-bar { |
| .dropdown-menu { |
| li { |
| line-height: 30px !important; |
| } |
| } |
| } |
| } |
| .version-in-dropdown [class*="span"] { |
| min-height: 30px; |
| } |
| } |
