diff options
Diffstat (limited to 'install/ui/less/rcue/navbar.less')
-rw-r--r-- | install/ui/less/rcue/navbar.less | 457 |
1 files changed, 457 insertions, 0 deletions
diff --git a/install/ui/less/rcue/navbar.less b/install/ui/less/rcue/navbar.less new file mode 100644 index 000000000..380d0f90a --- /dev/null +++ b/install/ui/less/rcue/navbar.less @@ -0,0 +1,457 @@ +.header.rcue { + border-top: 3px solid #cc0000; + position: relative; + .brand { + color: #fff; + padding: 7px 0; + margin: 0 0 0 20px; + text-shadow: none; + .ie8 & { + background: url(../img/brand.png) no-repeat 0 50%; + min-width: 300px; + } + img { + display: block; + font-size: 11px; + .ie8 & { + height: 10px; + width: 0; + } + } + } + .navbar { + margin-bottom: 0; + &.primary { + font-size: 13px; + &.persistent-secondary { + .nav { + position: static; + .dropup .dropdown-menu { + bottom: 0; + top: auto; + } + > li { + &.active { + margin-bottom: 32px; + > .persistent { + display: block; + } + } + > a { + position: static; + } + > .persistent { + background: #f6f6f6; + border-bottom: 1px solid #cecdcd; + display: none; + float: left; + left: 0; + margin: 0; + position: absolute; + width: 100%; + a { + text-decoration: none !important; + } + > .dropdown-submenu { + &.active > a:after { + border-top-color: #0080AF !important; + } + &:hover > .dropdown-menu { + display: none; + } + &.open:before { + background: #aaa; + bottom: -1px; + content: ''; + display: block; + height: 2px; + left: 20px; + position: absolute; + right: 20px; + z-index: 1; + } + &.open:hover > .dropdown-menu { + display: block; + } + &.open > a { + color: #222; + &:after { + border-top-color: #222; + } + } + > a { + padding-right: 37px; + &:after { + border-left-color: transparent; + border-top-color: #4d5258; + border-width: 5px 5px 0 5px; + margin-right: -17px; + margin-top: 4px; + opacity: .8; + } + &:before { + background: transparent !important; + border-color: #f6f6f6 transparent transparent transparent; + border-style: solid; + border-width: 5px 5px 0 5px; + content: ''; + display: block; + float: right; + height: 0; + margin-right: -17px; + margin-top: 2px; + position: relative; + right: 0; + width: 0; + z-index: 2; + } + } + > .dropdown-menu { + border-top-color: transparent; + left: 21px; + top: 100%; + .ie8 & { + margin-top: 1px; + } + } + } + > li { + float: left; + list-style: none; + position: relative; + white-space: nowrap; + &.active { + &:before, &:hover:before { + background: #409cd3 !important; + bottom: -1px; + content: ''; + display: block; + height: 2px; + left: 20px; + position: absolute; + right: 20px; + z-index: 1; + } + > a, > a:hover, &:hover > a { + color: #0092c7 !important; + } + .active > a { + color: #fff; + } + } + &:hover { + &:before { + background: #aaa; + bottom: -1px; + content: ''; + display: block; + height: 2px; + left: 20px; + position: absolute; + right: 20px; + z-index: 1; + } + > a { + color: #222; + &:after { + border-top-color: #222; + } + } + } + a { + color: #4d5258; + font-size: 13px; + &:hover { + color: #fff; + } + } + > a { + background-color: transparent !important; + background-image: none !important; + display: block; + line-height: 1; + padding: 9px 20px; + filter: none !important; + &:hover { + color: #222; + } + } + li:hover > a { + color: #fff; + } + } + } + } + } + } + .nav { + > li > a { + border-bottom: 1px solid transparent; + border-top: 1px solid transparent; + position: relative; + margin: -1px 0 0; + z-index: 1; + &:hover { + background-color: #53595d; + background-image: -moz-linear-gradient(top, #5c6165, #4b5053); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#5c6165), to(#4b5053)); + background-image: -webkit-linear-gradient(top, #5c6165, #4b5053); + background-image: -o-linear-gradient(top, #5c6165, #4b5053); + background-image: linear-gradient(to bottom, #5c6165, #4b5053); + background-repeat: repeat-x; + border-top-color: #949699; + &.dropdown-toggle .caret:after { + border-top-color: #53595d; + } + } + } + > .active > a, > .active > a:hover, > .active > a:focus, > .open > a, > .open > a:hover, > .open > a:focus { + background-color: #6b6f74; + background-image: -moz-linear-gradient(top, #72757a, #64686c); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#72757a), to(#64686c)); + background-image: -webkit-linear-gradient(top, #72757a, #64686c); + background-image: -o-linear-gradient(top, #72757a, #64686c); + background-image: linear-gradient(to bottom, #72757a, #64686c); + border-top-color: #949699; + -webkit-box-shadow: none; + -moz-box-shadow: none; + box-shadow: none; + color: #fff; + &.dropdown-toggle .caret:after { + border-top-color: #6b6f74; + } + } + li.dropdown.context { + > a { + background-color: #54595d; + background-image: -moz-linear-gradient(top, #585d61, #505458); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#585d61), to(#505458)); + background-image: -webkit-linear-gradient(top, #585d61, #505458); + background-image: -o-linear-gradient(top, #585d61, #505458); + background-image: linear-gradient(to bottom, #585d61, #505458); + border-bottom-color: #65696d; + border-right: 1px solid #65696d; + border-top-color: #64696d; + font-family: OpenSansSemiBold, Arial, Helvetica, sans-serif; + z-index: 0; + &.dropdown-toggle .caret:after { + border-top-color: #54595d; + } + &:hover { + background-color: #5e6367; + background-image: -moz-linear-gradient(top, #62676b, #5a5e62); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#62676b), to(#5a5e62)); + background-image: -webkit-linear-gradient(top, #62676b, #5a5e62); + background-image: -o-linear-gradient(top, #62676b, #5a5e62); + background-image: linear-gradient(to bottom, #62676b, #5a5e62); + border-bottom-color: #6e7276; + border-right-color: #6e7276; + border-top-color: #6c7276; + &.dropdown-toggle .caret:after { + border-top-color: #5e6367; + } + } + } + &.open > a { + background-color: #686e72; + background-image: -moz-linear-gradient(top, #6b7175, #65696d); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#6b7175), to(#65696d)); + background-image: -webkit-linear-gradient(top, #6b7175, #65696d); + background-image: -o-linear-gradient(top, #6b7175, #65696d); + background-image: linear-gradient(to bottom, #6b7175, #65696d); + border-bottom-color: #6e7276; + border-right-color: #777a7e; + border-top-color: #767a7e; + &.dropdown-toggle .caret:after { + border-top-color: #686e72; + } + } + } + } + } + &.utility { + font-size: 11px; + line-height: 1; + .nav { + > .active > a, > .active > a:hover, > .active > a:focus, > .open > a, > .open > a:hover, > .open > a:focus { + background: #5b6165; + color: #fff; + &.dropdown-toggle .caret:after { + border-top-color: #5b6165; + } + } + > li > a { + border-left: 1px solid #53565b; + color: #fff; + padding: 7px 10px; + &:hover { + background: #4a5053; + border-left-color: #636466; + } + } + > li.open > a { + border-left-color: #6c6e70; + } + li.dropdown { + &.open > .dropdown-toggle .caret:after, &.open > .dropdown-toggle:hover .caret:after { + border-top-color: #5b6165; + } + > .dropdown-toggle { + &:hover .caret:after { + border-top-color: #4a5053; + } + .caret { + border-bottom-color: #fff; + border-top-color: #fff; + border-width: 4px; + &:after { + border-top-color: #393F45; + } + } + .icon-user { + background: url(../img/icon-user.svg) no-repeat; + background-size: 100%; + display: block; + float: left; + margin: 0 5px 0 0; + height: 11px; + width: 11px; + .ie8 & { + display: none; + } + } + } + } + } + } + .dropdown .dropdown-menu .nav-header { + padding-left: 10px; + padding-right: 10px; + } + .dropdown-menu { + border-color: #b6b6b6; + -webkit-border-radius: 0 !important; + -moz-border-radius: 0 !important; + border-radius: 0 !important; + border-top-width: 0; + -webkit-box-shadow: 0 3px 7px rgba(0,0,0,.15); + -moz-box-shadow: 0 3px 7px rgba(0,0,0,.15); + box-shadow: 0 3px 7px rgba(0,0,0,.15); + font-size: 11px; + left: -1px; + margin-top: 0; + .divider { + margin: 4px 1px; + } + li > a { + line-height: 22px; + padding: 0 10px; + } + } + .dropdown-menu > .active > a, + .dropdown-menu > .active > a:hover, + .dropdown-menu > .active > a:focus, + .dropdown-menu > li > a:hover, + .dropdown-menu > li > a:focus, + .dropdown-submenu:hover > a, + .dropdown-submenu:focus > a { + background-color: #2b99c0; + background-image: -moz-linear-gradient(top, #2ea1ca, #2792b6); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#2ea1ca), to(#2792b6)); + background-image: -webkit-linear-gradient(top, #2ea1ca, #2792b6); + background-image: -o-linear-gradient(top, #2ea1ca, #2792b6); + background-image: linear-gradient(to bottom, #2ea1ca, #2792b6); + background-repeat: repeat-x; + color: #fff; + filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2ea1ca', endColorstr='#2792b6', GradientType=0); + } + .dropdown-submenu { + &.pull-left > .dropdown-menu { + left: auto; + right: 100%; + } + &.active > a:after { + border-left-color: #fff; + } + > a:after { + margin-right: -5px; + } + > .dropdown-menu { + border-top-width: 1px; + left: 100%; + } + } + .nav { + > li { + > a { + color: #dbdada; + line-height: 1; + padding: 14px 20px; + text-shadow: none; + } + .dropdown-menu { + &:after, &:before { + display: none; + } + } + } + li.dropdown { + > .dropdown-toggle .caret { + border-bottom-color: #dbdada; + border-top-color: #dbdada; + border-width: 5px; + margin-left: 5px; + margin-top: 5px; + position: relative; + &:after { + border: 4px solid transparent; + border-bottom: 0; + border-top-color: #44494d; + content: ''; + display: block; + height: 0; + left: -4px; + position: absolute; + top: -6px; + width: 0; + } + } + li + .nav-header { + margin-top: 4px; + } + &.open > .dropdown-toggle .caret { + border-bottom-color: #fff; + border-top-color: #fff; + } + } + } + .pull-right > li > .dropdown-menu, .nav > li >.dropdown-menu.pull-right { + left: auto; + right: -1px; + } + } + .navbar-inner { + background: #393F45; + -moz-box-shadow: none; + -webkit-box-shadow: none; + box-shadow: none; + border: 0; + -moz-border-radius: 0; + -webkit-border-radius: 0; + border-radius: 0; + min-height: 0; + padding: 0; + filter: none; + } + .primary .navbar-inner { + background-image: -moz-linear-gradient(top, #474c50, #383f43); + background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#474c50), to(#383f43)); + background-image: -webkit-linear-gradient(top, #474c50, #383f43); + background-image: -o-linear-gradient(top, #474c50, #383f43); + background-image: linear-gradient(to bottom, #474c50, #383f43); + background-repeat: repeat-x; + } + .utility .navbar-inner { + border-bottom: 1px solid #53565b; + } +}
\ No newline at end of file |