+++ /dev/null
-// properties
-@mainTop: 43px;
-@mainBottom: 41px;
-
-@minWidth: 640px;
-@minHeight: 480px;
-
-@topologyOffset: -4px; // ensure calibration
-
-// mixins
-.dash-size (@width, @height) {
- width: @width;
- height: @height;
-}
-.position (@type, @top, @right, @bottom, @left) {
- position: @type;
- top: @top;
- right: @right;
- bottom: @bottom;
- left: @left;
-}
-.dash-position (@top, @right, @bottom, @left) {
- .position(absolute, @top, @right, @bottom, @left);
-}
-.icon {
- width: 22px;
- height: 16px;
- background-position: left center;
- background-repeat: no-repeat;
-}
-.dashlet-elements {
- width: 98%;
- margin: 5px auto;
-}
-
-// header
-#menu {
- .navbar-inner {
- .brand {
- font-size: 1.4em;
- font-variant: small-caps;
- margin: 0 12px;
- padding: 10px 0 10px 45px;
- background-image: url('../img/logo.png');
- background-position: left center;
- background-repeat: no-repeat;
- }
- ul {
- margin-top: 10px;
- border-bottom: transparent;
- li {
- a {
- padding: 5px 15px;
- &:hover {
- border-color: transparent;
- }
- }
- }
- .active {
- a {
- border-radius: 1px;
- background: #f6f6f6;
- &:hover {
- border-top: 1px solid #ddd;
- border-right: 1px solid #ddd;
- border-left: 1px solid #ddd;
- }
- }
- }
- }
- #toolbar {
- position: absolute;
- right: 10px;
- .dropdown-menu {
- right: 0;
- left: auto;
- min-width: 120px;
- }
- .icon-user {
- .icon;
- background-image: url('../img/user_0020_16.png');
- }
- .icon-users {
- .icon;
- background-image: url('../img/user_group_0107_16.png');
- }
- .icon-save {
- .icon;
- background-image: url('../img/save_as_0106_16.png');
- }
- .icon-logout {
- .icon;
- background-image: url('../img/open_1054_16.png');
- }
- }
- }
-}
-
-// footer
-#footer {
- #alert {
- margin: 0;
- p {
- padding: 0;
- margin: 0;
- }
- }
-}
-
-// main
-#main {
- position: fixed;
- top: @mainTop;
- right: 0;
- bottom: @mainBottom;
- left: 0;
- min-width: @minWidth;
- min-height: @minHeight;
-
- // topology
- #topology {
- position: absolute;
- top: @topologyOffset;
- right: 0;
- bottom: @topologyOffset;
- left: 0;
- background: #ddd;
- }
-
- // left
- #left {
- .dash-size(30%, 100%);
- float: left;
-
- #left-top {
- .dash-size(100%, 60%);
-
- .dash {
- .dash-position(5px, 5px, 5px, 5px);
- }
- }
-
- #left-bottom {
- .dash-size(100%, 40%);
-
- .dash {
- .dash-position(0, 5px, 5px, 5px);
- }
- }
- }
-
- // right
- #right {
- .dash-size(70%, 100%);
- float: right;
-
- #right-top {
- .dash-size(100%, 60%);
-
- .dash {
- .dash-position(5px, 5px, 5px, 0);
- }
- }
-
- #right-bottom {
- .dash-size(100%, 40%);
-
- .dash {
- .dash-position(0, 5px, 5px, 0);
- }
- }
- }
-
- #left-top, #left-bottom,
- #right-top, #right-bottom {
- position: relative;
- }
-
- // dashentries
- .dash {
- border-radius: 1px;
- background: #fff;
- border: 1px solid #ddd;
-
- .nav {
- padding: 2px;
- padding-bottom: 0;
- margin: 0;
- }
-
- .nav-tabs {
- background: #eee;
- li {
- a {
- background: #ddd;
- padding: 4px 8px;
- margin-right: 3px;
- border-radius: 1px;
- &:hover {
- border-color: transparent;
- }
- }
- }
- .active {
- a {
- background: #fff;
- border-radius: 1px;
- &:hover {
- border-top: 1px solid #ddd;
- border-left: 1px solid #ddd;
- border-right: 1px solid #ddd;
- }
- }
- }
- }
-
- .dashlet {
- overflow: auto;
- .dash-position(45px,0,0,0);
-
- h4 {
- .dashlet-elements;
- }
-
- p {
- .dashlet-elements;
- }
-
- table {
- .dashlet-elements;
- }
-
- .btn-group {
- margin: 5px;
- }
-
- .none {
- margin: 0 auto;
- padding-top: 128px;
- background-position: center;
- background-repeat: no-repeat;
- background-image: url('../img/alert_unreachable_2008_128.png');
- text-align: center;
- p {
- cursor: default;
- }
- }
- }
- }
-
- // defaults for visual topology
- #right-top .dash {
- background: #ddd;
- overflow: hidden;
- }
-}
-
-.table-cursor tr:hover {
- cursor: pointer;
-}